:root{--ink:#0b0a08;--marble:#f4f0e6;--brass:#b99552;--brass-hi:#e8c987;--text:#e2ddd0;--serif:"Palatino Linotype","Book Antiqua",Palatino,Georgia,serif;--sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
*{box-sizing:border-box;margin:0}
html,body{height:100%;background:var(--ink);color:var(--text);font-family:var(--serif);overflow:hidden}
.bar{position:fixed;inset:0 0 auto 0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:16px 26px;background:linear-gradient(rgba(0,0,0,.55),transparent);pointer-events:none}
.bar>*{pointer-events:auto}
.brand{color:#fff;text-decoration:none;font-size:13px;letter-spacing:.2em;text-transform:uppercase;line-height:1.5}
.brand span{display:block;color:var(--brass-hi);font-size:11px}
.rooms{position:relative}
.rooms-btn{font:12px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#fff;background:rgba(14,11,8,.55);border:1px solid rgba(232,201,135,.7);padding:9px 16px;cursor:pointer;backdrop-filter:blur(6px)}
.rooms-btn:hover,.rooms-btn:focus-visible{background:rgba(14,11,8,.8)}
#roomlist{position:absolute;right:0;top:46px;list-style:none;min-width:260px;background:rgba(14,11,8,.94);border:1px solid rgba(185,149,82,.5);padding:8px 0}
#roomlist li>*{display:block;padding:10px 18px;color:var(--text);text-decoration:none;font-size:15px}
#roomlist em{display:block;font:11px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:#8d877b;font-style:normal;margin-top:2px}
#roomlist a:hover{background:rgba(255,214,150,.09)}
#roomlist [aria-current]{color:var(--brass-hi)}
#roomlist [aria-disabled]{opacity:.5}

.viewport{position:fixed;inset:0;overflow:hidden}
.plate{position:absolute;left:50%;top:50%;width:max(100vw,calc(100vh * 1.7917));aspect-ratio:1376/768;transform:translate(-50%,-50%) translate(var(--px,0px),var(--py,0px)) scale(1.06);transition:transform .25s ease-out}
.plate img{display:block;width:100%;height:100%;user-select:none;-webkit-user-drag:none}
.glow{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle 340px at var(--mx,50%) var(--my,50%),rgba(255,236,200,.22),transparent 70%);mix-blend-mode:soft-light}
.vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 50%,transparent 55%,rgba(0,0,0,.45))}
.hint{position:absolute;left:0;right:0;bottom:20px;text-align:center;font:11px var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#fff;text-shadow:0 1px 8px #000;pointer-events:none}

.spot{position:absolute;width:44px;height:44px;margin:-22px 0 0 -22px;background:none;border:0;cursor:pointer;padding:0}
.spot i{position:absolute;inset:12px;border-radius:50%;background:#fff;box-shadow:0 0 0 2px rgba(185,149,82,.9),0 0 18px 4px rgba(255,220,150,.8)}
.spot i::after{content:"";position:absolute;inset:-12px;border-radius:50%;border:1.5px solid rgba(255,240,205,.9);animation:ring 2.4s ease-out infinite}
.spot span{position:absolute;left:50%;top:-8px;transform:translate(-50%,-100%);white-space:nowrap;font:12px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:#fff;background:rgba(14,11,8,.82);border:1px solid var(--brass);padding:7px 12px;opacity:0;pointer-events:none;transition:opacity .2s}
.spot:hover span,.spot:focus-visible span{opacity:1}
.spot:focus-visible{outline:2px solid var(--brass-hi);border-radius:50%}
@keyframes ring{0%{transform:scale(.5);opacity:1}100%{transform:scale(1.5);opacity:0}}

/* welcome + theater */
.welcome{position:fixed;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;
  background:radial-gradient(ellipse at 50% 40%,rgba(30,24,16,.72),rgba(6,5,4,.96)),url("../assets/foyer-plate.png") center/cover;transition:opacity .9s ease,visibility .9s}
.welcome.gone{opacity:0;visibility:hidden}
.welcome h1{font-weight:400;font-size:clamp(28px,5vw,64px);line-height:1.15;color:var(--marble);text-shadow:0 2px 30px #000}
.welcome h1 span{display:block;margin-top:10px;font-size:.42em;letter-spacing:.28em;text-transform:uppercase;color:var(--brass-hi)}
.choices{margin-top:44px;display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
.btn{font:13px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#fff;background:rgba(14,11,8,.55);border:1px solid var(--brass-hi);padding:16px 28px;cursor:pointer;backdrop-filter:blur(6px)}
.btn:hover,.btn:focus-visible{background:rgba(232,201,135,.2)}
.btn.primary{background:var(--brass);color:#16110a;border-color:var(--brass-hi)}
.btn.primary:hover{background:var(--brass-hi)}
.btn small{display:block;margin-top:5px;font-size:10px;letter-spacing:.14em;opacity:.8}
.theater{position:fixed;inset:0;z-index:60;background:#000;display:flex;align-items:center;justify-content:center}
.theater[hidden]{display:none}
.theater #film{width:min(100vw,calc(100vh * 16 / 9));aspect-ratio:16/9;background:#000}
.theater iframe{display:block;width:100%;height:100%;border:0}
.theater .skip{position:absolute;right:20px;top:20px;padding:11px 18px}

/* library */
.plate{container-type:inline-size}
.nameplate{position:absolute;left:29.1%;top:55.4%;width:11.2%;height:5.9%;display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:1.15cqw;letter-spacing:.14em;text-transform:uppercase;color:#4a3513;background:linear-gradient(180deg,#f2dfa5,#d8b868 55%,#b99552);border:1px solid #8c6b2a;border-radius:2px;box-shadow:0 1px 2px rgba(0,0,0,.5);pointer-events:none}
.back{position:fixed;left:26px;bottom:20px;z-index:10;font:12px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#fff;text-decoration:none;border-bottom:1px solid var(--brass-hi);padding-bottom:3px;text-shadow:0 1px 8px #000}
.back:hover{color:var(--brass-hi)}
dialog.papers{max-width:min(760px,94vw);width:94vw}
.tools{margin:16px 0 8px}
#q{width:100%;font:16px var(--sans);padding:12px 14px;color:var(--text);background:#120f0b;border:1px solid rgba(185,149,82,.6)}
#q:focus{outline:2px solid var(--brass-hi)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.chip{font:12px var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--text);background:none;border:1px solid rgba(185,149,82,.6);padding:7px 12px;cursor:pointer}
.chip[aria-pressed="true"]{background:var(--brass);color:#16110a;border-color:var(--brass-hi)}
.count{font:12px var(--sans);letter-spacing:.1em;color:#a59f91;margin:10px 0}
.plist{list-style:none}
.plist li{border-top:1px solid rgba(185,149,82,.3)}
.plist summary{cursor:pointer;padding:14px 0;list-style:none}
.plist summary::-webkit-details-marker{display:none}
.plist .t{display:block;font-size:20px;color:var(--marble);line-height:1.3}
.plist .m{display:block;font:12px var(--sans);letter-spacing:.08em;color:var(--brass-hi);margin-top:5px}
.plist .a{padding:0 0 16px;font-size:16px;color:#c9c3b5}
.plist .a a,.mail{color:var(--brass-hi)}
.plist .a .nopdf{font:12px var(--sans);letter-spacing:.1em;color:#8d877b;text-transform:uppercase}

/* lab */
.tour{position:fixed;left:50%;bottom:52px;transform:translateX(-50%);z-index:10;font:12px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:#16110a;background:var(--brass);border:1px solid var(--brass-hi);padding:13px 22px;cursor:pointer;box-shadow:0 6px 24px rgba(0,0,0,.5)}
.tour:hover{background:var(--brass-hi)}
.stepper{display:flex;gap:10px;margin:22px 0 6px}
.dot{width:14px;height:14px;border-radius:50%;border:1px solid var(--brass-hi);background:none;cursor:pointer;padding:0}
.dot[aria-current="true"]{background:var(--brass-hi);box-shadow:0 0 10px rgba(232,201,135,.8)}
.nav{display:flex;justify-content:space-between;margin-top:20px}
.nav .btn{padding:12px 20px}

/* press */
.signpatch{position:absolute;left:81.6%;top:41.5%;width:14%;height:12.5%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-family:var(--serif);font-size:1.25cqw;letter-spacing:.1em;text-transform:uppercase;line-height:1.5;color:#7a5d22;background:linear-gradient(135deg,#f1eee7,#e2ded4);pointer-events:none}
.signpatch small{font-size:.8em;letter-spacing:.22em}

/* auditorium */
dialog.player{max-width:min(620px,94vw)}
dialog.player #vid{display:block;width:100%;aspect-ratio:16/9;max-height:52vh;margin:14px auto 8px;background:#000;border:1px solid rgba(185,149,82,.5)}
dialog.player iframe{display:block;width:100%;height:100%;border:0}
.talk{width:100%;text-align:left;background:none;border:0;color:inherit;font:inherit;padding:12px 0;cursor:pointer}
.talk:disabled{cursor:default;opacity:.55}
.talk[aria-current="true"] .t{color:var(--brass-hi)}
.talk:not(:disabled):hover .t{color:var(--brass-hi)}
a.spot{display:block}

/* board room */
.boardsign{position:absolute;left:70.3%;top:31.9%;width:17%;transform:translate(-50%,-50%) rotate(-9deg);padding:.5cqw 0;text-align:center;white-space:nowrap;font-family:var(--serif);font-size:.95cqw;letter-spacing:.14em;text-transform:uppercase;color:#d7bd82;background:#383b40;pointer-events:none}
.facts{list-style:none;margin-top:6px}
.facts li{padding:11px 0;border-top:1px solid rgba(185,149,82,.3);font-size:17px}
.facts b{display:block;color:var(--brass-hi);font-weight:400;font-size:22px}

/* discovery */
.deptplate{position:absolute;left:50.7%;top:54.6%;width:15.6%;height:4.5%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:1.1cqw;letter-spacing:.2em;text-transform:uppercase;color:#4a3513;background:linear-gradient(180deg,#f0dca0,#d4b266 55%,#b99552);border:1px solid #8c6b2a;box-shadow:0 1px 3px rgba(0,0,0,.5);pointer-events:none}
.think{margin-top:16px;padding:12px 16px;border-left:3px solid var(--brass-hi);background:rgba(232,201,135,.08);font-size:17px}
.think b{color:var(--brass-hi);font-weight:400}

dialog.card{margin:auto;max-width:min(560px,92vw);max-height:86vh;overflow:auto;padding:38px 40px;color:var(--text);background:linear-gradient(160deg,#35302a,#171410);border:2px solid var(--brass);outline:1px solid rgba(232,201,135,.4);outline-offset:6px;box-shadow:0 40px 120px #000;font-size:18px;line-height:1.6}
dialog.wide{max-width:min(680px,92vw)}
dialog::backdrop{background:rgba(5,4,3,.75);backdrop-filter:blur(4px)}
dialog h2{font-weight:400;font-size:40px;color:var(--marble);margin-bottom:6px}
.kicker{font:12px var(--sans);letter-spacing:.3em;text-transform:uppercase;color:var(--brass-hi);margin-bottom:12px}
.lede{font-size:22px;color:var(--brass-hi);margin-bottom:14px}
.x{position:absolute;right:14px;top:8px;background:none;border:0;color:var(--marble);font-size:30px;cursor:pointer}
.express-list{list-style:none;margin-top:18px}
.express-list li{padding:14px 0;border-top:1px solid rgba(185,149,82,.3)}
.express-list b{color:var(--brass-hi);font-weight:400;font-size:22px;margin-right:12px}
.express-list p{font-size:16px;margin-top:4px;color:#b9b3a5}
@media (prefers-reduced-motion:reduce){.plate{transition:none}.spot i::after{animation:none}}
