:root{
  --basalt:#071018;
  --cyan:#66E8FF;
  --vellum:#F3E9D2;
  --gold:#F6C85F;
  --coral:#FF6B6B;
  --violet:#8F7CFF;
  --brass:#8A6A3A;
  --ink:rgba(7,16,24,.84);
  --chapter:0;
}

*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--basalt);color:var(--vellum);overflow:hidden}
body{font-family:"Literata",serif}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}

.atlas{position:relative;width:100vw;height:100vh;overflow:hidden;background:radial-gradient(circle at 72% 18%,rgba(102,232,255,.14),transparent 28%),radial-gradient(circle at 80% 78%,rgba(143,124,255,.13),transparent 30%),linear-gradient(180deg,#0b1720 0%,#071018 58%,#03070b 100%)}
.stone-noise{position:absolute;inset:0;opacity:.33;background-image:linear-gradient(120deg,rgba(243,233,210,.035) 1px,transparent 1px),linear-gradient(60deg,rgba(102,232,255,.03) 1px,transparent 1px);background-size:41px 41px,73px 73px;pointer-events:none}
.route-web{position:absolute;inset:0;pointer-events:none;filter:drop-shadow(0 0 10px rgba(102,232,255,.28))}
.route{position:absolute;height:2px;background:linear-gradient(90deg,transparent,var(--cyan),var(--gold),transparent);transform-origin:left center;opacity:.55;animation:inkRoute 5s linear infinite}
.route-a{left:16%;top:24%;width:52%;transform:rotate(8deg)}.route-b{left:25%;top:68%;width:43%;transform:rotate(-16deg);animation-delay:-1s}.route-c{left:57%;top:35%;width:33%;transform:rotate(72deg);animation-delay:-2s}.route-d{left:10%;top:45%;width:26%;transform:rotate(-42deg);animation-delay:-3s}.route-e{left:70%;top:62%;width:22%;transform:rotate(23deg);animation-delay:-4s}
@keyframes inkRoute{0%{clip-path:inset(0 100% 0 0)}45%,100%{clip-path:inset(0 0 0 0)}}

.building-map{position:absolute;left:22px;top:22px;bottom:22px;width:240px;z-index:10;padding:18px 14px;border:1px solid rgba(138,106,58,.72);background:linear-gradient(180deg,rgba(7,16,24,.88),rgba(7,16,24,.62));box-shadow:inset 0 0 0 1px rgba(246,200,95,.16),0 28px 70px rgba(0,0,0,.45);backdrop-filter:blur(8px)}
.map-title{font-family:"Bricolage Grotesque",sans-serif;color:var(--gold);font-weight:800;line-height:1.02;font-size:1.35rem;margin:0 0 18px;text-transform:uppercase;letter-spacing:.02em}
.map-node{width:100%;display:flex;gap:10px;align-items:center;text-align:left;padding:9px 8px;margin:5px 0;border-left:2px solid rgba(102,232,255,.25);font-family:"Recursive",monospace;font-size:.83rem;color:rgba(243,233,210,.72);transition:.35s ease}
.map-node b{color:var(--cyan);font-weight:700}.map-node span{font-family:"Recursive",monospace}.map-node.active{background:rgba(246,200,95,.13);border-left-color:var(--gold);color:var(--vellum);transform:translateX(7px);box-shadow:inset 0 0 28px rgba(246,200,95,.08)}

.cutaway{position:absolute;inset:0;transform:translateX(calc(var(--chapter) * -1.2vw));transition:transform .9s cubic-bezier(.2,.75,.16,1)}
.room{position:absolute;width:min(690px,52vw);min-height:255px;opacity:.28;transform:translateY(18px) scale(.96);transition:opacity .65s ease,transform .65s ease,filter .65s ease;filter:saturate(.65)}
.room.active{opacity:1;transform:translateY(0) scale(1);filter:saturate(1.1)}
.room-frame{position:relative;padding:26px 30px;border:1px solid rgba(102,232,255,.46);background:linear-gradient(135deg,rgba(243,233,210,.93),rgba(243,233,210,.82));color:var(--ink);box-shadow:0 0 0 9px rgba(7,16,24,.34),0 28px 80px rgba(0,0,0,.38),inset 0 0 42px rgba(138,106,58,.16)}
.room-frame:before,.room-frame:after{content:"";position:absolute;background:var(--brass)}.room-frame:before{left:-12px;right:-12px;top:13px;height:1px}.room-frame:after{top:-12px;bottom:-12px;left:17px;width:1px}.brass-frame{border-color:var(--brass);background:linear-gradient(135deg,rgba(138,106,58,.88),rgba(246,200,95,.78));color:#071018}.coral-frame{border-color:var(--coral);box-shadow:0 0 46px rgba(255,107,107,.18),0 0 0 9px rgba(7,16,24,.34)}.violet-frame{border-color:var(--violet);box-shadow:0 0 48px rgba(143,124,255,.22),0 0 0 9px rgba(7,16,24,.34)}
.room-number,.protocol-label,.callout,.engraving{font-family:"Recursive",monospace;text-transform:uppercase;letter-spacing:.12em}.room-number{margin:0 0 10px;color:var(--brass);font-size:.75rem;font-weight:700}.brass-frame .room-number{color:#071018}h1,h2{font-family:"Bricolage Grotesque",sans-serif;margin:0;line-height:.94;letter-spacing:-.04em}h1{font-size:clamp(4.5rem,10vw,10.5rem)}h2{font-size:clamp(2.2rem,4.2vw,4.9rem)}p{font-size:1.05rem;line-height:1.57;margin:18px 0 0}.lead{max-width:620px;font-size:1.22rem}.engraving{display:inline-block;margin-top:24px;padding:10px 14px;border:1px solid rgba(7,16,24,.45);box-shadow:inset 0 0 22px rgba(7,16,24,.14)}

.room-hero{left:31%;top:13%;width:min(820px,58vw)}.room-lobby{left:34%;top:9%}.room-press{left:48%;top:42%}.room-clock{left:28%;top:55%;width:min(620px,48vw)}.room-fraud{left:52%;top:12%;width:min(610px,45vw)}.room-lantern{left:33%;top:28%;width:min(650px,48vw)}.room-bridge{left:55%;top:50%;width:min(615px,44vw)}.room-data{left:27%;top:16%;width:min(630px,46vw)}.room-vault{left:48%;top:25%;width:min(650px,46vw)}

.elevator-shaft{position:absolute;left:50%;top:0;bottom:120px;width:132px;z-index:6;transform:translateX(-50%);border-left:3px solid rgba(138,106,58,.8);border-right:3px solid rgba(138,106,58,.8);background:linear-gradient(90deg,rgba(102,232,255,.04),rgba(102,232,255,.16),rgba(102,232,255,.04))}.shaft-glow{position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(102,232,255,.18),transparent);animation:shaftPulse 3.6s ease-in-out infinite}@keyframes shaftPulse{50%{opacity:.45}}
.elevator{position:absolute;left:13px;top:calc(8% + var(--chapter) * 7.2%);width:100px;height:162px;border:3px solid var(--brass);background:linear-gradient(145deg,rgba(138,106,58,.86),rgba(246,200,95,.62));box-shadow:0 0 30px rgba(246,200,95,.22),inset 0 0 26px rgba(7,16,24,.55);transition:top .85s cubic-bezier(.2,.8,.18,1)}
.elevator-readout{position:absolute;left:8px;right:8px;top:8px;text-align:center;padding:4px 0;background:#071018;color:var(--cyan);font-family:"Recursive",monospace;font-weight:700;font-size:.73rem;box-shadow:0 0 12px rgba(102,232,255,.45)}.elevator-panel{position:absolute;left:8px;right:8px;top:36px;text-align:center;font-family:"Bricolage Grotesque",sans-serif;font-weight:800;color:#071018;font-size:.86rem}.glass{position:absolute;left:12px;right:12px;bottom:12px;height:83px;border:1px solid rgba(102,232,255,.8);background:rgba(102,232,255,.13);overflow:hidden}.door{position:absolute;top:35px;bottom:8px;width:42px;background:rgba(7,16,24,.35);transition:transform .55s ease}.door-left{left:8px}.door-right{right:8px}.elevator.open .door-left{transform:translateX(-31px)}.elevator.open .door-right{transform:translateX(31px)}
.ticket{position:absolute;left:13px;right:13px;bottom:16px;min-height:46px;padding:8px 6px;text-align:center;background:var(--vellum);color:#071018;border:1px dashed var(--brass);font-family:"Recursive",monospace;transition:.55s ease;box-shadow:0 8px 20px rgba(0,0,0,.25)}.ticket strong{display:block;font-family:"Bricolage Grotesque",sans-serif;font-size:1rem}.ticket span{display:block;font-size:.56rem}.ticket em{display:block;font-style:normal;font-size:.52rem;color:var(--brass)}.ticket-notch{position:absolute;top:50%;width:10px;height:10px;border-radius:50%;background:rgba(102,232,255,.2);transform:translateY(-50%)}.ticket-notch.left{left:-5px}.ticket-notch.right{right:-5px}.ticket.state-scroll{border-radius:18px;transform:rotate(-5deg) scale(.9);background:linear-gradient(90deg,var(--vellum),var(--gold))}.ticket.state-stamped:after{content:"SEQ";position:absolute;right:5px;top:5px;color:var(--coral);font-weight:700;transform:rotate(-12deg)}.ticket.state-challenged{box-shadow:0 0 24px rgba(255,107,107,.7);border-color:var(--coral)}.ticket.state-proven{box-shadow:0 0 28px rgba(143,124,255,.9);border-color:var(--violet)}.ticket.state-bridged{transform:translateX(8px);background:linear-gradient(90deg,var(--vellum),#fff,var(--cyan))}.ticket.state-filed{transform:scale(.78);background:var(--vellum)}.ticket.state-sealed{border-style:solid;background:linear-gradient(135deg,var(--violet),var(--vellum));box-shadow:0 0 34px rgba(143,124,255,.85)}

.layer-one-slab{position:absolute;left:0;right:0;bottom:0;height:118px;z-index:5;background:linear-gradient(180deg,#0b1218,#020406);border-top:6px solid var(--brass);box-shadow:0 -20px 70px rgba(0,0,0,.7),inset 0 18px 0 rgba(243,233,210,.03);display:flex;align-items:center;justify-content:center;flex-direction:column;font-family:"Recursive",monospace;color:var(--vellum);text-transform:uppercase;letter-spacing:.18em}.layer-one-slab span{font-family:"Bricolage Grotesque",sans-serif;font-size:1.4rem;color:var(--gold)}.layer-one-slab small{margin-top:8px;color:rgba(243,233,210,.58)}.foundation-label{position:absolute;left:8%;bottom:-180px;font-family:"Recursive",monospace;color:var(--cyan);text-transform:uppercase;letter-spacing:.13em}

.tube,.press-machine,.clockwork,.shutters,.lantern,.customs-gate,.archive-stacks,.vault-door{position:absolute;pointer-events:none}.tube{right:-30px;top:52px;width:230px;height:58px;border:2px solid rgba(102,232,255,.55);border-radius:40px;box-shadow:inset 0 0 25px rgba(102,232,255,.15)}.tube span{position:absolute;top:19px;width:19px;height:19px;background:var(--vellum);border-radius:50%;animation:capsule 3s linear infinite}.tube span:nth-child(2){animation-delay:-1s}.tube span:nth-child(3){animation-delay:-2s}@keyframes capsule{from{left:8px}to{left:200px}}
.press-machine{left:-120px;top:-20px;width:210px;height:155px;border:2px solid var(--brass);background:rgba(7,16,24,.7)}.roller{position:absolute;border-radius:50%;border:10px solid var(--brass);animation:roll 2s linear infinite}.roller-a{left:22px;top:26px;width:62px;height:62px}.roller-b{right:22px;top:58px;width:72px;height:72px;animation-direction:reverse}.paper-stream{position:absolute;left:54px;top:74px;width:140px;padding:8px;background:var(--vellum);color:var(--brass);font-family:"Recursive",monospace;transform:rotate(8deg);white-space:nowrap;overflow:hidden}@keyframes roll{to{transform:rotate(360deg)}}
.clockwork{right:-80px;top:-48px;width:170px;height:170px;border:2px solid var(--gold);border-radius:50%;box-shadow:0 0 35px rgba(246,200,95,.28)}.clockwork span{position:absolute;left:50%;top:50%;width:5px;height:74px;background:var(--gold);transform-origin:50% 0;animation:hand 5s steps(12) infinite}.clockwork span:nth-child(2){height:54px;animation-duration:2s}.clockwork span:nth-child(3){height:38px;animation-duration:8s}.clockwork b{position:absolute;left:72px;top:72px;width:24px;height:24px;border-radius:50%;background:var(--gold)}@keyframes hand{to{transform:rotate(360deg)}}
.shutters{right:-34px;top:25px;width:185px;height:122px;border:3px solid var(--coral);display:grid;grid-template-columns:1fr 1fr}.shutters i{background:rgba(255,107,107,.38);border:1px solid var(--coral);transform-origin:left;animation:shutter 3.2s ease-in-out infinite}.shutters i:nth-child(even){transform-origin:right}@keyframes shutter{50%{transform:scaleX(.18)}}
.lantern{left:-90px;top:-40px;width:190px;height:190px}.lens{position:absolute;inset:44px;border:10px solid var(--violet);border-radius:50%;box-shadow:0 0 34px rgba(143,124,255,.75);animation:lens 4s linear infinite}.halo{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle,rgba(143,124,255,.36),transparent 62%)}@keyframes lens{to{transform:rotate(360deg)}}
.customs-gate{left:-80px;top:8px;width:160px;height:180px;border:2px solid var(--brass);display:flex;align-items:center;justify-content:space-around;color:var(--gold);font-family:"Recursive",monospace}.customs-gate:before{content:"";position:absolute;top:0;bottom:0;left:50%;width:2px;background:var(--cyan);animation:gate 2.4s ease-in-out infinite}@keyframes gate{50%{transform:translateX(40px)}}
.archive-stacks{right:-60px;top:10px;width:185px;display:grid;gap:8px}.archive-stacks span{display:block;padding:12px 14px;background:rgba(243,233,210,.9);color:#071018;border-left:8px solid var(--brass);font-family:"Recursive",monospace;box-shadow:8px 8px 0 rgba(102,232,255,.15)}
.vault-door{left:-65px;top:-18px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,var(--violet),#16132a 52%,#05070c 54%);border:8px solid var(--brass);display:grid;place-items:center;box-shadow:0 0 55px rgba(143,124,255,.45)}.vault-door span{position:absolute;inset:42px;border:3px solid var(--gold);border-radius:50%;animation:vault 4s ease-in-out infinite}.vault-door b{font-family:"Recursive",monospace;color:var(--vellum)}@keyframes vault{50%{transform:rotate(38deg) scale(.88)}}

.callout{display:inline-block;margin-top:18px;padding:10px 12px;border:1px solid currentColor;font-size:.78rem}.callout.cyan{color:#047080;background:rgba(102,232,255,.16)}.callout.violet{color:#4b3ec0;background:rgba(143,124,255,.14)}.protocol-label{display:inline-block;margin-top:18px;padding:9px 12px;background:#071018;color:var(--gold);box-shadow:0 0 22px rgba(246,200,95,.2)}.drawer-toggle{margin-top:18px;padding:9px 12px;background:var(--basalt);color:var(--cyan);font-family:"Recursive",monospace;text-transform:uppercase;letter-spacing:.08em}.glossary-drawer{max-height:0;overflow:hidden;margin-top:0;background:#071018;color:var(--vellum);font-family:"Literata",serif;transition:max-height .45s ease,margin-top .45s ease,padding .45s ease;border-left:4px solid var(--gold)}.glossary-drawer.open{max-height:120px;margin-top:12px;padding:13px 16px}
.museum-plaque{position:absolute;right:26px;bottom:138px;z-index:11;width:310px;padding:16px 18px;background:rgba(243,233,210,.9);color:#071018;border:1px solid var(--brass);box-shadow:0 14px 40px rgba(0,0,0,.35)}.museum-plaque b{display:block;font-family:"Bricolage Grotesque",sans-serif;color:var(--brass);font-size:1.1rem}.museum-plaque span{display:block;margin-top:6px;font-size:.92rem;line-height:1.42}

body.chapter-4 .route,body.chapter-4 .map-node.active b{color:var(--coral)}body.chapter-4 .route{background:linear-gradient(90deg,transparent,var(--coral),var(--gold),transparent)}body.chapter-5 .route,body.chapter-8 .route{background:linear-gradient(90deg,transparent,var(--violet),var(--cyan),transparent)}

@media (max-width:900px){.building-map{width:190px;left:10px;top:10px;bottom:auto;max-height:58vh;overflow:hidden}.map-title{font-size:1rem}.map-node{font-size:.68rem;padding:6px}.cutaway{transform:none}.room{width:calc(100vw - 230px);left:210px!important;top:14%!important}.elevator-shaft{left:calc(100% - 72px);width:96px}.elevator{width:74px;left:8px}.museum-plaque{right:12px;bottom:126px;width:250px}h1{font-size:4rem}h2{font-size:2.2rem}.press-machine,.clockwork,.shutters,.lantern,.customs-gate,.archive-stacks,.vault-door,.tube{display:none}}
