/* The category accent identifies the object; square intent controls identify the rule. */
#portrait-picker { margin: 20px 0 28px; }
.portrait-toolbar { display:flex; gap:16px; align-items:end; margin-bottom:12px; flex-wrap:wrap; }
.portrait-search { flex:1 1 220px; }
.portrait-search input { width:100%; padding:12px 14px; color:#edf1e7; background:#0c1314; border:1px solid #465b50; font:13px system-ui; }
.portrait-target { display:flex; flex-direction:column; gap:7px; color:#aebdb3; font:10px 'IBM Plex Mono',monospace; flex:1 1 210px; }
.portrait-target select { width:100%; min-height:41px; padding:9px; background:#0c1314; border-color:#465b50; font:12px system-ui; }
.portrait-trays { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; align-items:start; }
.portrait-tray { margin:0; min-width:0; border:1px solid #40554a; background:#0d1515; }
.portrait-tray[open] { grid-column:1/-1; border-color:var(--filter-color); }
.portrait-tray>summary,.portrait-subtray>summary { display:flex; align-items:center; gap:14px; padding:12px; list-style:none; cursor:pointer; position:relative; }
.portrait-tray>summary::-webkit-details-marker,.portrait-subtray>summary::-webkit-details-marker { display:none; }
.portrait-tray>summary::after,.portrait-subtray>summary::after { content:'▸'; color:#94a39e; font:20px monospace; width:20px; text-align:center; flex-shrink:0; }
.portrait-tray[open]>summary::after,.portrait-subtray[open]>summary::after { content:'▾'; }
.portrait-tray>summary:hover,.portrait-subtray>summary:hover { background:#ffffff06; }
.portrait-tray[open]>summary { background:#ffffff04; border-bottom:1px solid #40554a; }
.portrait-fan { display:flex; align-items:center; width:100px; min-width:100px; height:52px; isolation:isolate; }
.portrait-fan .reference-thumb,.portrait-fan .portrait-initial { width:38px; height:44px; float:none; margin:0 0 0 -16px; padding:3px; object-fit:contain; background:#15201c; border:1px solid #60715e; box-shadow:2px 1px 0 #060c09; transform:translateY(2px); }
.portrait-fan>*:first-child { margin-left:0; transform:translateY(-2px); }
.portrait-fan>*:nth-child(3) { transform:translateY(-1px); }
.tray-label { flex:1; min-width:0; }
.tray-label strong { display:block; font:600 23px 'Barlow Condensed',sans-serif; color:#e0e9dc; letter-spacing:.6px; }
.tray-label small { display:block; color:#8f9f94; font-size:10px; margin-top:4px; }
.tray-count { font:11px monospace; color:#94a59a; margin-left:auto; }
.tray-active { font:10px monospace; padding:4px 6px; border:1px solid #4c8c83; color:#a3dbcb; white-space:nowrap; }
.tray-body { padding:10px; max-height:380px; overflow:auto; scrollbar-color:#4a6557 #101918; }
.portrait-subtray { margin:0 0 8px; border:1px solid #2e4136; background:#111b17; }
.portrait-subtray:last-child { margin-bottom:0; }
.portrait-subtray>summary { padding:7px 10px; font:12px system-ui; }
.portrait-subtray .portrait-fan { height:40px; width:90px; min-width:90px; }
.portrait-subtray .portrait-fan .reference-thumb { height:34px; width:32px; margin-left:-12px; }
.portrait-subtray .portrait-fan>*:first-child { margin-left:0; }
.portrait-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(108px,1fr)); gap:9px; padding:10px; }
.portrait-tile { min-width:0; background:#0a1112; border:1px solid #3f5246; position:relative; padding:5px; }
.portrait-tile.portrait-included { border-color:#5dc5b5; box-shadow:inset 0 0 0 1px #5dc5b530; }
.portrait-tile.portrait-excluded { border-color:#ec8984; box-shadow:inset 0 0 0 1px #ec898430; }
.portrait-pick { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; width:100%; min-height:108px; padding:8px 3px; border:0; background:transparent; color:#dbe6d9; font:11px system-ui; line-height:1.3; }
.portrait-pick:hover { background:#ffffff08; color:#fff; }
.portrait-pick .reference-thumb { float:none; margin:0; width:50px; height:50px; object-fit:contain; }
.portrait-initial { display:grid; place-items:center; width:50px; height:50px; font:20px 'Barlow Condensed',sans-serif; color:#a8c3a1; }
.portrait-actions { display:flex; justify-content:center; gap:6px; margin-top:3px; }
#visual-filters .intent-square { display:inline-grid; place-items:center; width:29px; height:29px; min-width:29px; padding:0; border:1px solid; border-radius:0; font:700 23px/1 monospace; letter-spacing:0; box-shadow:inset 0 0 0 2px #0003,0 2px 0 #050909; }
#visual-filters .include-square { color:#9cf2df; background:#174b45; border-color:#4cac9b; }
#visual-filters .exclude-square { color:#ffd5d0; background:#632c30; border-color:#d47775; }
#visual-filters button.include-square:hover,#visual-filters button.include-square[aria-pressed=true] { color:#092a25; background:#8de1cd; border-color:#b7f4e6; }
#visual-filters button.exclude-square:hover,#visual-filters button.exclude-square[aria-pressed=true] { color:#3e1219; background:#f09991; border-color:#ffd2c9; }
.portrait-help { display:flex; align-items:center; gap:8px; flex-wrap:wrap; color:#a1b1a7; font:11px system-ui; margin:12px 0 0; }
.portrait-help>span:last-child { margin-left:8px; color:#879c90; }
#visual-filters .portrait-help .intent-square { width:20px; height:20px; min-width:20px; font-size:16px; box-shadow:none; }
.filter-workspace-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; border-top:1px solid #3d5345; padding-top:20px; margin-bottom:14px; }
.filter-workspace-heading>span:last-child { font:10px monospace; color:#8fa194; }
.unit-intent { display:flex; align-items:center; gap:7px; }
#visual-filters .unit-intent .intent-square { width:23px; height:23px; min-width:23px; font-size:19px; }
#visual-filters .filter-brick { grid-template-columns:29px minmax(0,1fr) 24px; }
.filter-advanced { border-top:1px solid #34463b; margin-top:14px; padding-top:15px; }
.filter-advanced>summary { color:#9cb4a1; font:11px 'IBM Plex Mono',monospace; }
.global-bricks { border-bottom:0; padding-bottom:8px; }
#visual-filters button:focus-visible,#visual-filters summary:focus-visible,#visual-filters input:focus-visible,#visual-filters select:focus-visible { outline:2px solid #b6f4e2; outline-offset:3px; }
@media(max-width:650px) {
 .portrait-trays { grid-template-columns:1fr; }
 .portrait-tray[open] { grid-column:auto; }
 .portrait-toolbar { gap:10px; }
 .portrait-target,.portrait-search { flex-basis:100%; }
 .portrait-tray>summary { gap:10px; }
 .portrait-fan { width:88px; min-width:88px; }
 .tray-active { font-size:9px; }
 .filter-workspace-heading { align-items:start; }
 .portrait-grid { grid-template-columns:repeat(auto-fill,minmax(92px,1fr)); gap:7px; }
}

.portrait-pick .reference-thumb.pilot-portrait{width:62px;height:62px;padding:0;border:1px solid #7394b4;background:#2b3948}
.portrait-pick .reference-thumb.pilot-scene{background:#101820}
.portrait-fan .reference-thumb.pilot-portrait{width:38px;height:38px;padding:0;border:1px solid #7394b4;background:#2b3948}
.portrait-fan .reference-thumb.pilot-scene{background:#101820}