/* Visual layer: all panels remain opaque over the adjustable decorative landscape. */
body{--visual-surface:#101b25;--visual-inset:#0c151e;--visual-border:#426071;--visual-muted:#c4d1dc;--visual-warning:#f8d5a2}
.map-backdrop{opacity:var(--landscape-opacity,.5)}
.request-status{font-size:14px;color:var(--accent);min-height:24px;margin:8px 0 16px}
.request-status::before{content:"";display:inline-block;width:12px;height:12px;border:2px solid var(--visual-border);border-top-color:var(--accent);border-radius:50%;margin-right:10px;vertical-align:middle;animation:companion-loading 1s linear infinite}
@keyframes companion-loading{to{transform:rotate(360deg)}}
.visual-settings{margin:0 0 16px;border:1px solid var(--line);border-radius:10px;background:var(--visual-surface);padding:0 14px}
.visual-settings>summary{min-height:44px;line-height:1.5;display:flex;align-items:center;font-size:13px}
.visual-settings-controls{display:grid;grid-template-columns:minmax(160px,230px) minmax(180px,350px) minmax(0,1fr);align-items:center;gap:16px;padding:8px 0 16px}
.visual-settings-controls label{font-size:13px;min-width:0;display:block}
.visual-settings-controls select{display:block;margin-top:6px;width:100%;min-height:44px}
.visual-settings-controls output{float:right;color:var(--accent);font-variant-numeric:tabular-nums}
.visual-settings-controls input[type=range]{display:block;width:100%;min-height:44px;padding:0;accent-color:var(--accent);margin:6px 0 0}
.visual-settings-controls p{font-size:13px;margin:0;line-height:1.5}
#overview>#overview-priorities{padding:0 0 24px;border:0;margin:0}
#priorities-title{font-size:24px;margin:4px 0 16px}
#overview-priorities>.eyebrow{font-size:11px;margin:0;color:var(--accent)}
.priority-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.priority-card{position:relative;min-width:0;border:1px solid var(--line);border-radius:12px;padding:18px;background:var(--visual-inset);display:flex;flex-direction:column;align-items:start}
.priority-card.needs-attention{border-color:#7a613b}
.priority-card>.companion-nav-icon{color:var(--accent);width:24px;height:24px;margin-bottom:14px}
.priority-card.needs-attention>.companion-nav-icon{color:var(--visual-warning)}
.priority-card h4{font-size:16px;line-height:1.5;margin:0 0 8px;overflow-wrap:anywhere}
.priority-card p{font-size:13px;line-height:1.6;color:var(--visual-muted);margin:0 0 14px}
.priority-card button{margin-top:auto;min-height:44px;padding:6px 0;text-align:left;font-size:13px;color:var(--accent);max-width:100%}
.map-list-title{margin:0 0 16px}
.server-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.server-card{overflow:hidden;padding:0 16px 14px;background:var(--visual-inset);min-width:0}
.server-landscape{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;height:124px;background:#162b38;margin:0 -16px 14px;overflow:hidden}
.server-landscape>img{width:100%;height:100%;object-fit:cover}
.server-landscape>.companion-nav-icon{width:44px;height:44px;color:var(--accent)}
.server-landscape>.status{position:absolute;bottom:10px;left:12px;right:12px;width:fit-content;max-width:calc(100% - 24px);padding:5px 8px;border:1px solid #356d59;border-radius:6px;background:#102a24;color:#a3eed0;font-size:12px;line-height:1.5}
.server-landscape>.status::before{content:"✓ ";font-weight:700}
.server-landscape>.status.stale{background:#302719;border-color:#7a613b;color:var(--visual-warning)}
.server-landscape>.status.stale::before{content:"! ";font-weight:800}
.server-card h3{font-size:15px;line-height:1.5;margin:0 0 8px;overflow-wrap:anywhere}
.server-card p{font-size:13px;line-height:1.5;overflow-wrap:anywhere}
.server-card .map-observation{font-size:12px;color:var(--visual-muted);margin:12px 0 0}
.server-card>.text-button{min-height:44px;padding:6px 0;margin-top:8px}
.result-filter-form{display:block;width:100%;margin:0}
.essential-filters,.filter-group{min-width:0;margin:0;padding:12px;border:1px solid var(--line);border-radius:8px;display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr))}
.essential-filters{grid-template-columns:repeat(4,minmax(0,1fr));background:var(--visual-inset);margin-bottom:10px}
.essential-filters legend,.filter-group legend{font-size:12px;color:var(--visual-muted);padding:0 6px}
.essential-filters label,.filter-group label{display:block;min-width:0;font-size:13px}
.essential-filters select,.filter-group select,.filter-group input:not([type=checkbox]){display:block;margin-top:6px;width:100%;min-height:44px;font-size:14px}
.filter-group .checkbox-label{display:flex}
.advanced-filter-groups{display:grid;gap:16px;padding:14px}
.filter-group:not(:has(label:not([hidden]))){display:none}
.result-filter-form>#advanced-filters{padding:0;margin:0 0 10px;background:var(--visual-inset)}
.result-filter-form>#advanced-filters>summary{min-height:44px;padding:6px 12px;font-size:13px}
.result-filter-form>.actions{gap:8px;margin:8px 0 12px;flex-wrap:wrap}
.table-options>.result-filter-form{flex-basis:100%}
.presentation-controls{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:12px 0 16px}
.presentation-switch{display:flex;border:1px solid var(--visual-border);border-radius:8px;padding:3px;gap:3px;background:var(--visual-inset)}
.presentation-switch button{min-height:44px;padding:8px 14px;font-size:13px;border-color:transparent;background:transparent;color:var(--visual-muted)}
.presentation-switch button[aria-pressed=true]{background:var(--accent-soft);border-color:var(--accent);color:var(--accent)}
.state-legend{position:relative;min-width:0;max-width:450px;margin-left:auto}
.state-legend summary{min-height:44px;font-size:12px;line-height:1.5;padding:10px 0}
.state-legend p{font-size:13px;line-height:1.6;color:var(--visual-muted);padding:12px;background:var(--visual-inset);border:1px solid var(--line);border-radius:8px;margin:0}
.card-sort-controls{display:flex;align-items:end;gap:8px;flex-wrap:wrap}
.card-sort-controls label{font-size:12px;min-width:0}
.card-sort-controls select{display:block;margin-top:4px;min-height:44px;font-size:14px}
.card-sort-controls button{min-height:44px;font-size:12px}
.entity-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.entity-card{min-width:0;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--visual-inset);display:flex;flex-direction:column;gap:12px}
.entity-card-heading{display:flex;align-items:center;gap:12px;min-width:0}
.entity-card-heading>div:last-child{min-width:0;flex:1}
.entity-card-heading>.companion-nav-icon{color:var(--accent);width:32px;height:32px;flex:0 0 32px}
.entity-card h3{font-size:18px;line-height:1.4;margin:0}
.entity-card-link{display:block;text-align:left;color:var(--text);background:transparent;border:0;font-size:18px;line-height:1.4;min-height:44px;padding:0;max-width:100%;overflow-wrap:anywhere}
.entity-card-link:hover{color:var(--accent);text-decoration:underline}
.entity-card-heading p{font-size:12px;line-height:1.5;margin:3px 0;overflow-wrap:anywhere}
.entity-card-map{color:var(--accent)}
.card-observation{font-size:12px;line-height:1.5;color:var(--visual-muted)}
.visual-credits{font-size:12px;color:var(--visual-muted);line-height:1.6;margin:8px 0 20px}.visual-credits a{color:var(--accent)}
.creature-portrait{display:flex;flex-direction:column;align-items:center;justify-content:center;width:90px;min-height:90px;flex:0 0 90px;aspect-ratio:1;background:radial-gradient(circle at 50% 50%,var(--accent-soft),#13212c);border:1px solid var(--line);border-radius:10px;overflow:hidden}
.creature-portrait img{display:block;object-fit:contain;width:100%;height:100%;max-height:128px;padding:6px}
.creature-portrait:has(img){background:radial-gradient(ellipse at top,#edf4ef,#a8bdc5);border-color:#8cb4c0}
.creature-portrait svg{width:36px;height:36px;color:var(--accent);flex:0 0 36px}
.creature-portrait small{font-size:10px;line-height:1.4;text-align:center;margin:4px;overflow-wrap:anywhere;color:var(--visual-muted)}
.entity-card>.entity-provenance{margin:0;max-width:none}
.card-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:0}
.card-facts>div{min-width:0}
.card-facts>div:nth-child(3){grid-column:1/-1;display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.card-facts dt{font-size:12px;color:var(--visual-muted);margin-bottom:4px;overflow-wrap:anywhere}
.card-facts dd{font-size:15px;color:var(--text);font-weight:600;font-variant-numeric:tabular-nums;margin:0;overflow-wrap:anywhere}
.observed-gauge{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 10px;margin:10px 0;min-width:0}
.observed-gauge>span{font-size:13px;color:var(--visual-muted);overflow-wrap:anywhere}
.observed-gauge>strong{font-size:13px;color:var(--text);font-variant-numeric:tabular-nums;overflow-wrap:anywhere;text-align:right}
.observed-gauge>meter{grid-column:1/-1;width:100%;height:12px;accent-color:var(--accent)}
.observed-gauge>meter::-webkit-meter-bar{background:#243a48;border:0;border-radius:8px}
.observed-gauge>meter::-webkit-meter-optimum-value{background:var(--accent);border-radius:8px}
.unknown-observation{color:var(--visual-muted);font-size:13px;line-height:1.5}
.observed-gauge>.unknown-observation{grid-column:1/-1;background:#182934;border-left:2px solid var(--visual-border);padding:6px 10px}
.observed-gauge:has(.unknown-observation){grid-template-columns:minmax(0,1fr)}
.observed-gauge:has(.unknown-observation)>strong{text-align:left}
.entity-card-actions{margin-top:auto;display:flex;align-items:center;flex-wrap:wrap;justify-content:space-between;gap:8px}
.entity-card-actions button{font-size:13px;min-height:44px;max-width:100%}
.entity-card-actions .compare-select{margin:0}
.results-empty{text-align:center;padding:32px 20px;border:1px dashed var(--visual-border);border-radius:12px;background:var(--visual-inset);margin:16px 0}
.results-empty>.companion-nav-icon{width:36px;height:36px;color:var(--accent);margin-bottom:12px}
.results-empty h3{font-size:20px;line-height:1.4;margin:0 0 12px}
.results-empty p{font-size:14px;color:var(--visual-muted);max-width:65ch;margin:0 auto 16px;line-height:1.6}
.results-empty button{min-height:44px;margin:4px;font-size:13px}
.results-skeleton{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:16px 0}
.skeleton-card{padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--visual-inset);height:170px;display:grid;align-content:center;gap:14px}
.skeleton-card span{display:block;height:14px;border-radius:4px;background:#243a48;animation:companion-skeleton 1.4s ease-in-out infinite alternate}
.skeleton-card span:nth-child(2){width:70%}.skeleton-card span:nth-child(3){width:45%}
@keyframes companion-skeleton{to{opacity:.4}}
.detail-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;border-bottom:1px solid var(--line);margin-bottom:20px;padding-bottom:8px}
.detail-tab{min-width:0;min-height:44px;background:transparent;color:var(--visual-muted);font-size:13px;border:1px solid transparent;padding:8px;line-height:1.4}
.detail-tab[aria-selected=true]{color:var(--accent);background:var(--accent-soft);border-color:var(--accent)}
.detail-tab-panel{outline-offset:4px;min-width:0}
.detail-creature-hero{display:flex;align-items:center;gap:20px;margin:0 0 20px;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--visual-inset)}
.detail-creature-hero>.creature-portrait{width:128px;flex-basis:128px;height:128px}
.detail-creature-hero>div:last-child{min-width:0}
.detail-creature-hero h3{font-size:24px;line-height:1.4;overflow-wrap:anywhere;margin:6px 0}
.detail-creature-hero p{font-size:13px;line-height:1.5;margin:0;overflow-wrap:anywhere}
.detail-creature-hero .eyebrow{font-size:11px;color:var(--accent);letter-spacing:1px}
.stat-gauges>p{font-size:13px;line-height:1.6}
.stat-gauges .observed-gauge{padding:12px;border:1px solid var(--line);border-radius:8px;background:var(--visual-inset);margin-bottom:10px}
.detail-tab-panel table{font-size:13px}
.detail-tab-panel .table-wrap{max-width:100%;overflow:auto}
.detail-tab-panel ul{padding-left:20px;line-height:1.8;font-size:14px}
.detail-tab-panel .form-grid{grid-template-columns:1fr}
body[data-density=compact] #data-table th,body[data-density=compact] #data-table td{padding:4px 10px}
body[data-density=compact] #data-table .entity-provenance{margin-top:2px}
body[data-density=compact] .entity-card{padding:12px;gap:8px}
body[data-density=compact] .entity-card .creature-portrait{width:72px;min-height:72px;flex-basis:72px}
body[data-density=compact] .priority-card{padding:14px}
body[data-density=compact] .metric{min-height:98px;padding:12px 16px}
body[data-density=compact] .entity-card .observed-gauge{margin:4px 0}
@media(min-width:1600px){.entity-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1200px){.priority-grid{grid-template-columns:1fr}.priority-card{display:grid;grid-template-columns:24px minmax(0,1fr);column-gap:14px;padding:14px}.priority-card>.companion-nav-icon{grid-column:1;grid-row:1/4;margin:4px 0}.priority-card h4,.priority-card p,.priority-card button{grid-column:2}.priority-card p{margin-bottom:4px}.essential-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.visual-settings-controls{grid-template-columns:1fr 1fr}.visual-settings-controls>p{grid-column:1/-1}.entity-cards{grid-template-columns:1fr}}
@media(max-width:768px){
 .visual-settings{padding:0 12px;margin-bottom:12px}.visual-settings-controls{grid-template-columns:1fr}.visual-settings-controls label,.visual-settings-controls select{font-size:16px}
 .server-cards{grid-template-columns:1fr}.server-landscape{height:120px}.server-card h3{font-size:16px}
 .essential-filters,.filter-group{grid-template-columns:1fr;gap:14px}.essential-filters select,.filter-group select,.filter-group input:not([type=checkbox]){font-size:16px}
 .essential-filters label,.filter-group label{font-size:14px}.advanced-filter-groups{padding:12px}.result-filter-form>.actions>button{flex:1 1 120px;min-height:44px;font-size:13px}
 .presentation-controls{display:block}.state-legend{max-width:none;margin:4px 0}.card-sort-controls{display:flex;align-items:end;gap:8px}.card-sort-controls[hidden]{display:none}.card-sort-controls label{flex:1;min-width:0}.card-sort-controls select{font-size:16px;max-width:100%;width:100%}.card-sort-controls button{flex:0 1 auto}
 .entity-cards{grid-template-columns:1fr;gap:12px}.entity-card{padding:14px}.entity-card-heading{gap:10px}.entity-card-heading h3,.entity-card-link{font-size:18px}.entity-card-heading p{font-size:13px}.creature-portrait{width:76px;min-height:76px;flex-basis:76px}.card-facts dt,.observed-gauge>span{font-size:13px}.card-facts dd{font-size:16px}
 .entity-card-actions{align-items:center}.entity-card-actions button{font-size:14px}.entity-card .entity-provenance{max-width:100%}
 .results-skeleton{grid-template-columns:1fr}.skeleton-card{height:140px}.skeleton-card:not(:first-child){display:none}
 .detail-tabs{gap:4px;grid-template-columns:repeat(2,minmax(0,1fr))}.detail-tab{font-size:14px;min-height:44px}
 .detail-creature-hero{gap:12px;padding:12px}.detail-creature-hero>.creature-portrait{width:88px;height:88px;flex-basis:88px;min-height:88px}.detail-creature-hero h3{font-size:20px}.detail-creature-hero .eyebrow{font-size:11px}.detail-tab-panel h3{font-size:19px}.detail-tab-panel .form-grid input,.detail-tab-panel .form-grid textarea{font-size:16px}
 .observed-gauge{grid-template-columns:minmax(0,1fr) minmax(0,auto)}.observed-gauge>strong{max-width:100%;font-size:13px}.results-empty{padding:24px 14px}.results-empty button{max-width:100%;white-space:normal}
}
@media(prefers-reduced-motion:reduce){.request-status::before,.skeleton-card span{animation:none}}
@media print{.visual-settings,.presentation-controls,.results-skeleton,#request-status,.entity-card-actions{display:none!important}.entity-cards{grid-template-columns:1fr 1fr}}
