:root{
  --bg:#030304;--ink:#e8e4dc;--muted:#8d8a84;--line:#ffffff1c;--glass:#0b0b0dd9;--accent:#e8e4dc;
  --serif:'Cormorant Garamond',Georgia,serif;--mono:'IBM Plex Mono',ui-monospace,monospace;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);font:12px/1.45 var(--mono);font-weight:300}
canvas#stage{position:fixed;inset:0;width:100vw;height:100vh;display:block;touch-action:none}
button,select,input{font:inherit;color:inherit}
button{background:transparent;border:1px solid var(--line);border-radius:2px;padding:6px 10px;cursor:pointer;letter-spacing:.04em}
button:hover{border-color:#ffffff55}
button.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.muted{color:var(--muted)}
.kicker{font-size:10px;letter-spacing:.22em;color:var(--muted);margin-bottom:10px}

#top{position:fixed;top:0;left:0;right:0;display:flex;align-items:flex-start;gap:28px;padding:18px 22px;pointer-events:none;z-index:5}
#top>*{pointer-events:auto}
#brand{display:flex;flex-direction:column;min-width:190px}
#brand b{font:500 22px/1 var(--serif);letter-spacing:.18em}
#brand small{color:var(--muted);letter-spacing:.14em;margin-top:5px;font-size:10px}
#tabs{display:flex;gap:4px;flex-wrap:wrap}
#tabs button{border:none;border-bottom:1px solid transparent;border-radius:0;padding:5px 7px;color:var(--muted)}
#tabs button b{font:400 17px/1 var(--serif);letter-spacing:.06em;color:var(--ink);opacity:.55;display:block}
#tabs button small{font-size:8px;letter-spacing:.16em}
#tabs{max-width:calc(100vw - 560px)}
#tabs button.on{background:none;color:var(--ink);border-bottom-color:var(--ink)}
#tabs button.on b{opacity:1}
#conceptNote{margin-left:auto;max-width:290px;text-align:right;color:var(--muted);font-size:11px;padding-top:4px}

#nav{position:fixed;top:122px;left:22px;bottom:64px;width:248px;display:flex;flex-direction:column;gap:8px;padding:16px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(10px);z-index:4}
.field{display:block;font-size:10px;letter-spacing:.14em;color:var(--muted);text-transform:uppercase}
select{width:100%;margin-top:6px;background:#111114;border:1px solid var(--line);padding:7px;border-radius:2px;letter-spacing:.02em;text-transform:none}
#floorBtns{display:grid;grid-template-columns:repeat(6,1fr);gap:3px}
#floorBtns button{padding:5px 0;font-size:11px}
#floorBtns button:disabled{opacity:.25;cursor:default}
#floorBtns button.wide{grid-column:span 2}
#search{width:100%;background:#111114;border:1px solid var(--line);padding:8px;border-radius:2px;margin-top:6px}
#cats{display:flex;gap:3px}
#cats button{flex:1;padding:5px 0;font-size:11px}
#results{flex:1;overflow:auto;margin:0 -6px;padding:0 6px;scrollbar-width:thin;scrollbar-color:#333 transparent}
#results button{display:flex;gap:9px;width:100%;text-align:left;border:none;border-bottom:1px solid #ffffff0d;padding:7px 2px;border-radius:0}
#results button:hover,#results button.sel{background:#ffffff0d}
#results i{font-style:normal;width:12px;flex:none;opacity:.7}
#results span{display:flex;flex-direction:column;min-width:0}
#results b{font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#results small{color:var(--muted);font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#count{font-size:10px;letter-spacing:.08em}

#info{position:fixed;top:122px;right:22px;width:310px;max-height:calc(100vh - 170px);overflow:auto;padding:18px;background:var(--glass);border:1px solid var(--line);backdrop-filter:blur(10px);z-index:4}
#info h3{font:500 26px/1.05 var(--serif);margin:0 0 4px;letter-spacing:.03em}
#info .role{color:var(--muted);margin-bottom:14px}
#info dl{display:grid;grid-template-columns:96px 1fr;gap:5px 10px;margin:0 0 12px}
#info dt{color:var(--muted);font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding-top:1px}
#info dd{margin:0;word-break:break-word}
#info .links button{display:block;width:100%;text-align:left;border:none;border-top:1px solid #ffffff0d;padding:6px 0;border-radius:0}
#info .links small{color:var(--muted)}
#infoClose{position:absolute;top:8px;right:8px;border:none;font-size:18px;padding:2px 8px}
.note{color:var(--muted);font-size:10px;margin-top:10px}

#focusBar{position:fixed;top:122px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:14px;padding:8px 10px 8px 16px;background:var(--glass);border:1px solid var(--line);z-index:4}
#focusTitle{font:500 18px/1 var(--serif);letter-spacing:.06em}

#bottom{position:fixed;left:22px;right:22px;bottom:16px;display:flex;align-items:center;gap:12px;z-index:5;pointer-events:none}
#bottom>*{pointer-events:auto}
#stats{font-size:10px;letter-spacing:.08em}
#tools{margin-left:auto;display:flex;gap:4px}
#tools button{background:#0b0b0dcc;min-width:34px}
#tools button.on{background:var(--ink);color:var(--bg)}
#settings{position:fixed;right:22px;bottom:58px;width:250px;padding:14px 16px;background:var(--glass);border:1px solid var(--line);z-index:6;display:flex;flex-direction:column;gap:10px}
#settings label{display:flex;flex-direction:column;gap:5px;font-size:10px;letter-spacing:.12em;color:var(--muted);text-transform:uppercase}
#settings label.check{flex-direction:row;align-items:center;gap:8px}
#settings input[type=range]{accent-color:var(--ink)}
#settings input[type=checkbox]{accent-color:var(--ink)}

#labels{position:fixed;inset:0;pointer-events:none;z-index:2;overflow:hidden}
.lbl{position:absolute;left:0;top:0;white-space:nowrap;font-size:9px;letter-spacing:.14em;color:#e8e4dcbb;will-change:transform}
.lbl b{font:500 15px/1 var(--serif);letter-spacing:.08em;color:var(--ink);margin-right:6px}
.lbl.red b{color:#ff4a3d}
.lbl.sel{color:var(--ink)}
.lbl.sel::before{content:'';position:absolute;left:-14px;top:50%;width:9px;height:1px;background:currentColor}
#hint{position:fixed;padding:6px 9px;background:#0b0b0de6;border:1px solid var(--line);font-size:11px;pointer-events:none;z-index:7;white-space:nowrap}
#toast{position:fixed;left:50%;bottom:64px;transform:translateX(-50%);padding:8px 14px;background:#0b0b0de6;border:1px solid var(--line);display:none;z-index:8}
#loader{position:fixed;inset:0;display:grid;place-items:center;background:var(--bg);z-index:20;transition:opacity .6s}
#loader div{display:flex;flex-direction:column;align-items:center;gap:12px}
#loader b{font:500 30px/1 var(--serif);letter-spacing:.3em}
#loader span{color:var(--muted);letter-spacing:.1em}
#loader i{display:block;width:220px;height:1px;background:#ffffff22}
#loader em{display:block;height:1px;width:0;background:var(--ink);transition:width .3s}
#loader.soft{background:#030304aa;pointer-events:none}
body.clean #top,body.clean #nav,body.clean #info,body.clean #bottom,body.clean #focusBar,body.clean #settings{display:none}
body.clean #labels{opacity:.7}
.fallback{padding:40px;text-align:center}

@media (max-width:900px){
  #conceptNote{display:none}
  #nav{top:auto;bottom:58px;left:12px;right:12px;width:auto;height:40vh}
  #info{top:auto;bottom:58px;right:12px;left:12px;width:auto;max-height:40vh}
  #top{padding:12px 16px;gap:12px;flex-wrap:wrap}
  #brand{min-width:0}
  #bottom{left:12px;right:12px}
  #stats{display:none}
}

body.lightbg .lbl{color:#2a2a2ccc}
body.lightbg .lbl b{color:#111}
body.lightbg .lbl.red b{color:#c8281e}
body.lightbg #brand,body.lightbg #tabs button b,body.lightbg #conceptNote{color:#111}
body.lightbg #tabs button{color:#555}
body.lightbg #tabs button.on{border-bottom-color:#111}
.hud{position:fixed;pointer-events:none;z-index:3;font-size:9px;letter-spacing:.12em;color:#9fe7f0}
.hud .amber{display:inline-block;background:#e0a32a;color:#120d02;padding:3px 7px;font-size:15px;letter-spacing:.06em;margin:6px 0}
.hud .bar{height:1px;background:#6fd6e6;margin:4px 0 2px}
.hud .col{columns:2;column-gap:18px;color:#d9d4c8aa;font-size:8px;line-height:1.55;margin-top:8px}
.legend{position:fixed;right:22px;bottom:64px;z-index:3;background:#ffffffd9;color:#1a1a1a;border:1px solid #0002;padding:10px 12px;font-size:10px;max-width:300px;pointer-events:none;line-height:1.6}
.legend b{display:inline-block;width:22px;height:16px;border-radius:50%;border:1px solid #111;text-align:center;font-weight:400;font-size:9px;line-height:15px;margin-right:6px}