/* Deep-dive tours: same visual language as the campus tour (dark glass, thin borders, green accent). */
:root{--bg:#05070a;--ink:#f4f6f8;--sub:rgba(244,246,248,.74);--dim:rgba(244,246,248,.52);--line:rgba(255,255,255,.12);--glass:rgba(9,13,19,.64);--glass2:rgba(9,13,19,.8);--green:#8bc651;--cyan:#38bdf8;--amber:#f5a524;--violet:#a78bfa;--blue:#3b82f6;--red:#ef4444;--heat:#ff6b4a;--r:18px;--font:"Segoe UI Variable Display","Segoe UI",Inter,system-ui,-apple-system,sans-serif;--mono:"Cascadia Mono",Consolas,ui-monospace,monospace}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;height:100%;background:var(--bg);color:var(--ink);font:15px/1.45 var(--font);overflow:hidden;-webkit-font-smoothing:antialiased}
button,input{font:inherit;color:inherit}
a{color:var(--green)}
#gl{position:fixed;inset:0;width:100vw;height:100vh;display:block;touch-action:none;cursor:grab;outline:none}
#gl:active{cursor:grabbing}
.eyebrow{font-size:11.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--green);margin:0 0 8px}
.tiny{font-size:12px;color:var(--dim);margin:10px 0 0}
.top .brand,.top .ttl,.tools>*,.pop,.card,.dock,.caption,.console,.legend,.tip{background:var(--glass);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);border:1px solid var(--line)}
.lite .card,.lite .console,.lite .legend,.lite .dock,.lite .caption{backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);background:rgba(9,13,19,.8)}
.noblur .top .brand,.noblur .top .ttl,.noblur .tools>*,.noblur .pop,.noblur .card,.noblur .dock,.noblur .caption,.noblur .console,.noblur .legend,.noblur .tip{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(9,13,19,.88)}

/* loader */
.loader{position:fixed;inset:0;z-index:50;display:grid;place-content:center;justify-items:center;text-align:center;padding:24px;background:radial-gradient(1200px 700px at 50% 40%,#0c1520,#05070a);transition:opacity .8s ease,visibility .8s}
.loader.done{opacity:0;visibility:hidden}
.loader h1{font-size:clamp(26px,4vw,42px);letter-spacing:-.03em;margin:4px 0 22px;font-weight:650}
.loader .bar{width:min(320px,70vw);height:3px;border-radius:3px;background:rgba(255,255,255,.1);overflow:hidden}
.loader .bar span{display:block;height:100%;width:6%;background:linear-gradient(90deg,var(--cyan),var(--green));transition:width .4s ease}
.lstep{color:var(--dim);font-size:13px;margin-top:14px;min-height:20px}
.mark{display:grid;grid-template-columns:5px repeat(3,12px);grid-template-rows:repeat(2,12px);gap:3px;margin-bottom:22px}
.mark i{background:var(--ink);border-radius:2px}.mark i.g{background:var(--green);width:5px}

/* top bar */
.top{position:fixed;top:14px;left:14px;right:14px;z-index:20;display:flex;justify-content:space-between;align-items:flex-start;gap:10px;pointer-events:none}
.top>*{pointer-events:auto}
.lt{display:flex;gap:8px;align-items:stretch;min-width:0}
.brand{display:flex;align-items:center;gap:8px;padding:0 14px 0 10px;height:48px;border-radius:14px;text-decoration:none;color:var(--ink);font-weight:650;font-size:13.5px;white-space:nowrap;transition:border-color .2s}
.brand:hover{border-color:rgba(255,255,255,.35)}
.brand svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ttl{border-radius:14px;padding:7px 14px 8px;min-width:0}
.ttl .eyebrow{margin:0;font-size:10.5px}
.ttl h1{margin:1px 0 0;font-size:16px;font-weight:650;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tools{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.tools>*{border-radius:12px}
.ico{display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 13px;cursor:pointer;font-size:13.5px;font-weight:600;transition:border-color .2s,background .2s,opacity .2s}
.ico.only{width:40px;padding:0;justify-content:center}
.ico svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ico:hover,.ico[aria-expanded="true"]{border-color:rgba(255,255,255,.32);background:var(--glass2)}
#bVO.off{color:var(--dim)}#bVO.off .w{display:none}
#bMotion .pl{display:none}#bMotion.paused .pl{display:block}#bMotion.paused .pa{display:none}#bMotion.paused{border-color:var(--amber);color:var(--amber)}
#bLabels[aria-pressed="false"]{color:var(--dim)}
.km{display:none}
.legend-closed .km{display:inline-flex}
.legend.closed{display:none}
.seg{display:inline-flex;padding:3px;height:40px;align-items:center}
.seg button{border:0;background:none;padding:6px 12px;border-radius:9px;font-size:13px;font-weight:600;color:var(--sub);cursor:pointer}
.seg button[aria-pressed="true"]{background:rgba(255,255,255,.13);color:var(--ink)}
body.expert .seg button[data-mode="expert"]{background:rgba(139,198,81,.22);color:#dff3c8}
.vonote{position:absolute;right:2px;top:44px;margin:0;font-size:10.5px;color:var(--dim);letter-spacing:.02em;pointer-events:none;text-shadow:0 1px 3px rgba(0,0,0,.8)}

/* popovers */
.pop{position:fixed;top:74px;right:14px;z-index:30;width:min(320px,calc(100vw - 28px));padding:16px;border-radius:var(--r);box-shadow:0 20px 60px rgba(0,0,0,.45)}
.help ul{margin:0;padding:0;list-style:none}.help li{padding:5px 0;color:var(--sub);font-size:14px}.help b{color:var(--ink);display:inline-block;min-width:72px}
.more nav{display:grid;gap:6px}
.more nav a{display:block;padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.04);text-decoration:none;color:var(--ink)}
.more nav a:hover{border-color:rgba(255,255,255,.35)}
.more nav a b{display:block;font-size:14px}.more nav a span{font-size:12px;color:var(--dim)}
.more nav a[aria-current="page"]{border-color:var(--green)}
.more .campus{display:flex;align-items:center;gap:6px;margin-top:12px;font-size:13.5px;font-weight:600;text-decoration:none}
.more .campus svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}

/* info card */
.card{position:fixed;top:84px;right:14px;z-index:15;width:min(370px,calc(100vw - 28px));max-height:calc(100vh - 230px);overflow:auto;padding:20px 20px 18px;border-radius:var(--r);box-shadow:0 30px 80px rgba(0,0,0,.45);animation:in .45s cubic-bezier(.2,.8,.2,1);scrollbar-width:thin}
@keyframes in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.card h2{font-size:23px;line-height:1.12;letter-spacing:-.022em;margin:0 0 9px;font-weight:650;padding-right:28px}
.card .lead{color:var(--sub);margin:0;font-size:14.5px}
.card .x{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:50%;border:1px solid var(--line);background:rgba(255,255,255,.06);cursor:pointer;font-size:17px;line-height:1}
.eqs{margin-top:12px;display:grid;gap:6px}
.eq{font-family:"Cambria Math","Cambria",Georgia,serif;font-size:15.5px;padding:8px 11px;border-radius:10px;background:rgba(56,189,248,.08);border:1px solid rgba(56,189,248,.22);color:#dbeafe;letter-spacing:.01em}
.eq small{display:block;font-family:var(--font);font-size:11.5px;color:var(--dim);margin-top:2px}
.chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(96px,1fr));gap:8px;margin-top:14px}
.chips:empty{display:none}
.chip{border:1px solid var(--line);border-radius:12px;padding:9px 11px;background:rgba(255,255,255,.04)}
.chip b{display:block;font-size:20px;letter-spacing:-.02em;font-weight:650;color:var(--c,var(--ink));white-space:nowrap}
.chip span{display:block;font-size:11.5px;color:var(--dim);line-height:1.3;margin-top:2px}

/* console (tour-specific controls) */
.console{position:fixed;left:14px;top:84px;z-index:16;width:min(330px,calc(100vw - 28px));max-height:calc(100vh - 290px);border-radius:var(--r);box-shadow:0 30px 80px rgba(0,0,0,.4);display:flex;flex-direction:column;overflow:hidden}
.console>header{display:flex;align-items:center;justify-content:space-between;padding:12px 12px 0 16px}
.console>header .eyebrow{margin:0}
.console .cx{width:28px;height:28px;border-radius:8px;border:1px solid var(--line);background:rgba(255,255,255,.05);cursor:pointer;font-size:13px;line-height:1;transition:transform .2s}
.console.min .cx{transform:rotate(-90deg)}
.console.min .cb{display:none}.console.min>header{padding-bottom:12px}
.cb{padding:10px 16px 16px;overflow:auto;scrollbar-width:thin}
.wd p{margin:0 0 10px;color:var(--sub);font-size:13.5px}
.btns{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 10px}
.btn{border:1px solid var(--line);background:rgba(255,255,255,.06);border-radius:10px;padding:8px 13px;font-size:13px;font-weight:650;cursor:pointer;transition:border-color .2s,background .2s}
.btn:hover{border-color:rgba(255,255,255,.38)}
.btn.go{background:var(--green);border-color:var(--green);color:#0b1206}
.btn:disabled{opacity:.45;cursor:default}
.btn.warn{border-color:rgba(239,68,68,.6);color:#fecaca}
.segs{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:4px;padding:3px;border-radius:11px;background:rgba(255,255,255,.05);border:1px solid var(--line);margin:4px 0 12px}
.segs button{border:0;background:none;border-radius:8px;padding:7px 6px;font-size:12.5px;font-weight:650;color:var(--sub);cursor:pointer}
.segs button[aria-pressed="true"]{background:rgba(255,255,255,.14);color:var(--ink)}
.steps{list-style:none;margin:4px 0 10px;padding:0;display:grid;gap:3px}
.steps li{display:flex;gap:9px;align-items:center;font-size:13px;color:var(--dim);padding:3px 0}
.steps li i{width:10px;height:10px;border-radius:50%;border:1.5px solid var(--dim);flex:none}
.steps li.on{color:var(--ink)}.steps li.on i{border-color:var(--amber);background:var(--amber);box-shadow:0 0 10px var(--amber)}
.steps li.ok{color:var(--sub)}.steps li.ok i{border-color:var(--green);background:var(--green)}
.meter{margin:8px 0}
.meter .mt{display:flex;justify-content:space-between;font-size:12px;color:var(--dim)}
.meter .mt b{color:var(--ink);font-weight:650;font-variant-numeric:tabular-nums}
.bar2{position:relative;height:7px;border-radius:5px;background:rgba(255,255,255,.08);overflow:hidden;margin-top:4px}
.bar2 span{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:5px;background:var(--c,var(--cyan));transition:width .25s linear}
.bar2 .mk{position:absolute;top:-2px;bottom:-2px;width:2px;background:#fff;opacity:.8}
.row{display:flex;gap:12px;align-items:center}
.sync{width:76px;height:76px;flex:none}
.flags{display:grid;gap:4px;font-size:12.5px;color:var(--dim)}
.flags span.ok{color:#bbf7d0}
.flags span::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:currentColor;margin-right:7px;vertical-align:1px;opacity:.85}
.status{font-size:12.5px;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid var(--line);color:var(--sub);margin-top:8px}
.status b{color:var(--ink)}
.status.good{border-color:rgba(139,198,81,.45)}.status.alert{border-color:rgba(245,165,36,.6)}
.tiles{display:grid;gap:8px;margin:6px 0 8px}
.tiles .grp{display:grid;grid-template-columns:62px repeat(4,1fr);gap:5px;align-items:center}
.tiles .grp>span{font-size:11px;color:var(--dim);line-height:1.15}
.tile{height:32px;border-radius:8px;border:1px solid var(--line);background:rgba(255,255,255,.05);font-size:10.5px;font-weight:700;cursor:pointer;color:var(--sub);position:relative}
.tile.run{background:rgba(139,198,81,.2);border-color:rgba(139,198,81,.6);color:#e3f5cf}
.tile.sb{background:rgba(148,163,184,.12);color:var(--dim)}
.tile.start{background:rgba(245,165,36,.22);border-color:var(--amber);color:#fde7bd;animation:blink 0.7s ease-in-out infinite alternate}
.tile.out{background:rgba(239,68,68,.18);border-color:rgba(239,68,68,.7);color:#fecaca}
@keyframes blink{to{background:rgba(245,165,36,.42)}}
.legendk{display:flex;gap:10px;flex-wrap:wrap;font-size:11px;color:var(--dim);margin-bottom:6px}
.legendk i{display:inline-block;width:9px;height:9px;border-radius:3px;margin-right:4px;vertical-align:-1px}
table.kv{width:100%;border-collapse:collapse;font-size:12.5px;margin:4px 0 6px}
table.kv td{padding:5px 0;border-bottom:1px solid rgba(255,255,255,.07);vertical-align:top}
table.kv td:first-child{color:var(--dim);padding-right:10px}
table.kv td:last-child{text-align:right;color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums}
.ledger{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;margin:8px 0 4px}
.ledger div{border:1px solid var(--line);border-radius:8px;padding:6px 4px;text-align:center;font-size:10.5px;color:var(--dim)}
.ledger div b{display:block;width:10px;height:10px;border-radius:50%;margin:0 auto 4px;background:var(--c);box-shadow:0 0 8px var(--c);transition:opacity .3s}
.ledger div.off b{opacity:.15;box-shadow:none}
.dens{width:100%;accent-color:var(--cyan);margin:4px 0 2px}
.dticks{display:flex;justify-content:space-between;font-size:11.5px;color:var(--dim);margin-bottom:10px}
.dticks span.on{color:var(--ink);font-weight:650}
.chart{width:100%;height:auto;display:block;margin:2px 0 6px}
.chart text{font:10.5px var(--font);fill:rgba(244,246,248,.6)}
.stroke4 text{font:11px var(--font)}

/* legend */
.legend{position:fixed;left:14px;bottom:30px;z-index:14;border-radius:14px;padding:12px 12px 10px;max-width:230px}
.legend .eyebrow{margin-bottom:6px}
.legend ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.legend li button{display:flex;align-items:center;gap:8px;border:0;background:none;padding:4px 6px 4px 2px;border-radius:7px;font-size:12.5px;color:var(--sub);cursor:pointer;width:100%;text-align:left}
.legend li button i{width:10px;height:10px;border-radius:50%;background:var(--c);box-shadow:0 0 9px var(--c);flex:none}
.legend li button[aria-pressed="false"]{opacity:.42}.legend li button[aria-pressed="false"] i{box-shadow:none}
.legend li button:hover{background:rgba(255,255,255,.06)}
.legend .tiny{margin-top:6px;font-size:11px}

/* chapters dock and caption */
.dock{position:fixed;left:50%;bottom:30px;transform:translateX(-50%);z-index:20;display:flex;align-items:center;gap:6px;padding:6px;border-radius:16px;max-width:min(980px,calc(100vw - 520px))}
.dock .play{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 16px 0 12px;border-radius:11px;border:0;background:var(--green);color:#0b1206;font-weight:700;font-size:13.5px;cursor:pointer;flex:none}
.dock .play svg{width:16px;height:16px;fill:currentColor}.dock .play .ipa{display:none}
.dock.playing .play .ip{display:none}.dock.playing .play .ipa{display:block}
.dock .step{width:32px;height:42px;border:0;background:none;color:var(--sub);font-size:24px;cursor:pointer;flex:none;border-radius:9px}
.dock .step:hover{background:rgba(255,255,255,.08);color:var(--ink)}
#chapters{position:relative;display:flex;gap:3px;list-style:none;margin:0;padding:0 12px;overflow-x:auto;scrollbar-width:none;min-width:0;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12px,#000 calc(100% - 12px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 12px,#000 calc(100% - 12px),transparent 100%)}
#chapters::-webkit-scrollbar{display:none}
#chapters button{display:flex;flex-direction:column;align-items:flex-start;gap:1px;border:0;background:none;padding:6px 10px;border-radius:10px;cursor:pointer;color:var(--dim);white-space:nowrap;text-align:left}
#chapters button small{font-size:10.5px;font-weight:700;letter-spacing:.12em}
#chapters button span{font-size:12.5px;font-weight:600}
#chapters button:hover{background:rgba(255,255,255,.07);color:var(--sub)}
#chapters button[aria-current="step"]{background:rgba(255,255,255,.12);color:var(--ink)}
#chapters button[aria-current="step"] small{color:var(--green)}
.caption{position:fixed;left:50%;bottom:96px;transform:translateX(-50%);z-index:19;width:max-content;max-width:min(720px,calc(100vw - 560px));padding:11px 18px 9px;border-radius:14px;font-size:16px;line-height:1.45;text-align:center;opacity:0;transition:opacity .5s;pointer-events:none}
.caption.on{opacity:1}
.caption small{display:block;font-size:10.5px;color:var(--dim);margin-top:4px;letter-spacing:.03em}
.credit{position:fixed;left:14px;right:14px;bottom:6px;z-index:10;font-size:10.5px;color:rgba(244,246,248,.45);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;pointer-events:none}

/* 3D labels */
.labels{position:fixed;inset:0;pointer-events:none;z-index:12;overflow:hidden}
.lbl{position:absolute;left:0;top:0;display:flex;align-items:center;gap:7px;pointer-events:auto;border:0;background:none;padding:4px;margin:-10px 0 0 -10px;cursor:pointer;color:var(--ink);transition:opacity .25s;will-change:transform}
.lbl i{width:9px;height:9px;border-radius:50%;background:var(--c);box-shadow:0 0 0 3px rgba(0,0,0,.35),0 0 14px var(--c);flex:none}
.lbl span{font-size:12px;font-weight:650;padding:3px 9px;border-radius:999px;background:rgba(9,13,19,.74);border:1px solid var(--line);white-space:nowrap;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.lbl span em{font-style:normal;font-weight:500;color:var(--c);margin-left:7px;display:none;font-variant-numeric:tabular-nums}
body.expert .lbl span em{display:inline}
.lbl:hover span,.lbl:focus-visible span{border-color:var(--c)}
.lbl:focus-visible{outline:none}
.nolabels .lbl{display:none}
.tip{position:fixed;left:0;top:0;z-index:40;padding:5px 10px;border-radius:9px;font-size:12.5px;font-weight:600;pointer-events:none;white-space:nowrap}

@media (max-width:1180px){
  .dock{max-width:calc(100vw - 420px)}
  .caption{max-width:calc(100vw - 440px)}
  .console{width:300px}.card{width:330px}
}
@media (max-width:980px) and (min-width:821px){
  .legend{display:none}
  .dock{max-width:calc(100vw - 28px)}
  .caption{max-width:calc(100vw - 40px)}
}
@media (max-width:820px){
  .top{top:10px;left:10px;right:10px;gap:6px}
  .brand{padding:0;width:40px;height:40px;justify-content:center}.brand span{display:none}
  .ttl{display:none}
  .tools{gap:5px;flex-wrap:nowrap}
  .ico{padding:0;width:40px;justify-content:center}.ico span{display:none}
  .hm{display:none}
  .seg button{padding:6px 9px;font-size:12.5px}
  .vonote{top:43px;right:2px;font-size:10px}
  .pop{top:62px;right:10px}
  .card{top:auto;bottom:84px;right:10px;left:10px;width:auto;max-height:34vh;padding:16px 16px 14px}
  .card h2{font-size:19px}.card .lead{font-size:14px}
  .chip b{font-size:17px}
  .console{top:66px;left:10px;right:10px;width:auto;max-height:44vh}
  .console>header{cursor:pointer}
  .stroke4{max-height:120px}
  .legend{left:auto;right:10px;top:62px;bottom:auto;z-index:31;box-shadow:0 20px 60px rgba(0,0,0,.5)}
  .dock{bottom:22px;left:10px;right:10px;transform:none;max-width:none}
  .dock .play span{display:none}.dock .play{padding:0 13px}
  .caption{bottom:84px;font-size:14.5px;left:10px;right:10px;transform:none;width:auto;max-width:none}
  body.has-card .caption{opacity:0}
  .credit{font-size:9px;bottom:4px;left:10px;right:10px}
  .lbl span{font-size:11px;padding:2px 7px}
}
@media (prefers-reduced-motion:reduce){.card{animation:none}.tile.start{animation:none}.loader .bar span{transition:none}}

/* narration on: a visible state so people can find where to turn it off (29 Oct) */
#bVO:not(.off){box-shadow:inset 0 0 0 1px rgba(139,198,81,.55);animation:narrPulse 1.8s ease-out 3}
#bVO:not(.off) span{color:#8bc651}
@keyframes narrPulse{0%{box-shadow:inset 0 0 0 1px rgba(139,198,81,.55),0 0 0 0 rgba(139,198,81,.45)}100%{box-shadow:inset 0 0 0 1px rgba(139,198,81,.55),0 0 0 12px rgba(139,198,81,0)}}
@media (prefers-reduced-motion:reduce){#bVO:not(.off){animation:none}}
