
:root{color-scheme:dark;--paper:#e9e2d3;--muted:#bdc0b7;--gold:#d3b88a;--dark:#121c1b;--darktrans:rgba(14,23,22,.79);--hairline:rgba(241,231,207,.18)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#14201f;color:var(--paper);font-family:'DM Sans',Arial,sans-serif}button,input{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #ecd2a7;outline-offset:4px}button:active{transform:translateY(1px)}.app{position:relative;width:100%;height:100vh;height:100dvh;overflow:hidden;isolation:isolate}#viewport{width:100%;height:100%;display:block;touch-action:none;outline:none}.vignette,.grain{position:absolute;inset:0;pointer-events:none}.vignette{background:linear-gradient(90deg,rgba(9,18,18,.70) 0%,rgba(9,18,18,.42) 22%,transparent 52%,rgba(9,18,18,.14) 100%),linear-gradient(0deg,rgba(7,17,17,.77),transparent 31%,transparent 78%,rgba(6,14,13,.35));z-index:1}.grain{opacity:.11;z-index:2;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E")}
.topbar{height:92px;position:absolute;left:0;right:0;top:0;z-index:7;display:flex;align-items:center;justify-content:space-between;padding:0 57px;border-bottom:1px solid var(--hairline);background:linear-gradient(180deg,rgba(7,16,16,.43),transparent)}.identity{display:flex;align-items:center;gap:14px}.crest{width:51px;height:51px;color:var(--gold);display:grid;place-items:center;border:1px solid rgba(211,184,138,.28)}.crest svg{width:36px}.identity-kicker{font-size:8px;letter-spacing:2.2px;color:var(--gold);margin-bottom:5px}.identity-name{font-size:20px;letter-spacing:3px;font-weight:600}.identity-name span{font-size:9px;color:#bdbaad;letter-spacing:1px;vertical-align:top;margin-left:4px}.top-center{color:#dadbd0;font-size:9px;letter-spacing:2.2px;display:flex;align-items:center;gap:18px}.live-dot{display:block;width:5px;height:5px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px #f0d8a1}.separator{color:var(--gold);opacity:.6}.top-actions{display:flex;align-items:center;gap:10px}.pill,.icon-button{display:grid;place-items:center;background:rgba(15,29,27,.45);color:var(--paper);border:1px solid rgba(255,255,255,.16);height:36px;transition:.2s ease}.pill{border-radius:25px;padding:0 15px;font-size:9px;letter-spacing:1.5px}.icon-button{width:36px;border-radius:50%}.icon-button:hover,.pill:hover{background:rgba(188,154,96,.22);border-color:var(--gold)}.icon-button svg{width:17px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.intro{position:absolute;top:19.8%;left:clamp(27px,4.4vw,79px);z-index:4;width:min(365px,32vw);pointer-events:auto}.chapter-number{font-size:10px;letter-spacing:1.7px;color:var(--gold);font-weight:500}.chapter-number>span:first-child{padding:0 6px;opacity:.55}.chapter-title{font-size:9px;letter-spacing:1.7px;color:var(--paper);opacity:.68;margin-left:5px}.intro h1{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(55px,6.7vw,104px);font-weight:400;line-height:.87;letter-spacing:-1.1px;margin:28px 0 31px;text-shadow:0 4px 28px rgba(0,0,0,.2)}.intro h1 em{font-weight:400;color:#dec79f}.intro-line{width:74px;height:1px;background:var(--gold);margin-bottom:25px}.intro p{line-height:1.95;font-size:12px;max-width:318px;color:#e1dfd2;letter-spacing:.1px}.explore-button{background:transparent;border:1px solid rgba(230,207,162,.66);color:var(--paper);padding:17px 18px 17px 23px;font-size:10px;letter-spacing:1.55px;display:flex;gap:29px;justify-content:space-between;align-items:center;margin-top:28px;min-width:263px;transition:.25s}.explore-button:hover{background:rgba(213,188,138,.13);border-color:#e5cb9b}.explore-button span:last-child{font-size:18px;color:var(--gold)}.annotation{display:flex;align-items:center;gap:13px;margin-top:45px;font-size:9px;line-height:2.05;letter-spacing:1.0px;color:var(--gold)}.annotation-rule{height:35px;width:1px;background:var(--gold);opacity:.5}.annotation strong{font-size:10px;letter-spacing:.3px;color:var(--paper);font-weight:500}
.right-rail{position:absolute;z-index:4;right:48px;top:30%;display:flex;flex-direction:column;align-items:center;gap:20px}.compass{display:flex;flex-direction:column;align-items:center;gap:9px;color:var(--gold);font-size:10px}.compass-outline{height:63px;width:63px;border:1px solid rgba(234,221,197,.29);border-radius:50%;display:grid;place-items:center;position:relative}.compass-outline:before,.compass-outline:after{content:'';position:absolute;left:50%;top:0;bottom:0;border-left:1px solid rgba(234,221,197,.25)}.compass-outline:after{transform:rotate(90deg)}.compass-arrow{width:0;height:0;border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:24px solid var(--gold);transform-origin:50% 100%;position:absolute;top:10px;filter:drop-shadow(0 1px 3px #000)}.vertical-rule{height:91px;width:1px;background:var(--hairline)}.rail-label{font-size:8px;letter-spacing:2px;writing-mode:vertical-rl;color:var(--muted)}.rail-count{font-size:9px;letter-spacing:2px;writing-mode:vertical-rl;color:var(--gold)}.side-label{position:absolute;left:15px;bottom:30%;font-size:9px;letter-spacing:2px;writing-mode:vertical-rl;transform:rotate(180deg);color:#d1cabc;opacity:.75;z-index:4}
.bottom-area{position:absolute;bottom:39px;z-index:6;left:clamp(30px,4.4vw,80px);right:clamp(30px,4.4vw,80px);display:grid;grid-template-columns:minmax(420px,1fr) minmax(330px,400px);gap:25px;align-items:end}.view-panel,.environment-panel{border-top:1px solid rgba(233,221,197,.40);padding-top:13px;min-width:0}.control-label{font-size:9px;font-weight:600;letter-spacing:2px;color:#ded8ca;display:flex;align-items:center;gap:11px}.indicator-square{width:7px;height:7px;background:var(--gold);display:inline-block;transform:rotate(45deg)}.view-buttons{display:flex;gap:8px;margin-top:13px}.view{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:12px;min-height:68px;min-width:0;flex:1;text-align:left;background:rgba(12,21,21,.52);border:1px solid rgba(236,226,201,.25);color:#d4d2c7;padding:10px 11px;font-size:11px;white-space:nowrap;transition:.2s}.view-num{font-size:9px;letter-spacing:1px;color:#aaa99e}.view.active,.view:hover{background:rgba(203,175,124,.19);border-color:var(--gold);color:#fff}.view.active .view-num{color:var(--gold)}.atmosphere-inner{display:flex;align-items:center;gap:12px;margin-top:11px;height:28px}.sun-icon,.moon-icon{height:18px;width:18px;fill:none;stroke:var(--gold);stroke-width:1.4;flex-shrink:0}.clock{font-size:11px;letter-spacing:1px;width:47px;white-space:nowrap}input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:2px;border-radius:0;background:linear-gradient(90deg,#d7bc89 0%,#d7bc89 70%,rgba(255,255,255,.3) 70%);cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;height:12px;width:12px;border-radius:100%;border:2px solid #e5d3b0;background:#263631;box-shadow:0 0 0 3px rgba(9,26,24,.5)}input[type=range]::-moz-range-thumb{height:10px;width:10px;border-radius:100%;border:2px solid #e5d3b0;background:#263631}.environment-actions{display:flex;gap:8px;margin-top:14px}.tool-button{display:flex;justify-content:center;align-items:center;gap:9px;flex:1;min-width:0;padding:12px 9px;background:rgba(12,21,21,.6);border:1px solid rgba(233,225,207,.25);color:var(--paper);font-size:9px;letter-spacing:1.2px;transition:.2s;white-space:nowrap}.tool-button.primary{border-color:var(--gold);background:rgba(169,131,76,.23)}.tool-button:hover,.tool-button.on{border-color:var(--gold)}.mini-bell{font-size:20px;line-height:10px}.tool-dot{width:6px;height:6px;background:var(--gold);border-radius:50%}.statusbar{position:absolute;z-index:7;bottom:0;left:0;right:0;height:39px;background:#121e1cdd;border-top:1px solid rgba(231,218,191,.15);padding:0 57px;display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:1.4px;color:#aaae9e}.status-circle{display:inline-block;width:5px;height:5px;background:#78ad85;border-radius:50%;margin-right:6px}.status-sep{padding:0 8px;color:var(--gold)}.status-center{opacity:.75}.status-click{cursor:pointer}.status-click:hover{color:var(--gold)}
.hotspot-layer{position:absolute;inset:0;z-index:5;pointer-events:none}.hotspot{position:absolute;display:flex;align-items:center;gap:9px;pointer-events:auto;background:none;border:0;color:#f7eedc;transform:translate(-50%,-50%);white-space:nowrap;transition:opacity .18s}.hotspot-disc{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:rgba(15,32,29,.75);border:1px solid #e8cd99;box-shadow:0 0 0 5px rgba(202,176,130,.14),0 0 17px rgba(218,182,100,.22);font-size:10px;color:var(--gold);transition:.2s}.hotspot-text{font-size:10px;letter-spacing:1px;padding:7px 9px;background:rgba(13,24,23,.66);border:1px solid rgba(221,200,169,.24)}.hotspot:hover .hotspot-disc{background:var(--gold);color:#10221f;box-shadow:0 0 0 8px rgba(202,176,130,.18)}.hotspot:hover .hotspot-text{border-color:var(--gold)}.hotspot.inside{display:none}.app.cutaway .hotspot.inside{display:flex}
.inspector{position:absolute;z-index:10;top:115px;right:clamp(38px,5vw,92px);width:clamp(300px,25vw,389px);padding:30px 29px 28px;background:rgba(15,25,23,.93);border:1px solid rgba(217,194,147,.34);box-shadow:0 22px 90px rgba(1,7,6,.45);backdrop-filter:blur(17px)}.inspector[hidden],.help-modal[hidden],.fatal[hidden]{display:none!important}.close-inspector{position:absolute;right:16px;top:9px;color:var(--gold);background:none;border:none;font:32px/1 'Cormorant Garamond',serif;padding:6px 10px}.inspector-code{font-size:9px;color:var(--gold);letter-spacing:2.2px}.inspector-ornament{height:1px;width:46px;background:var(--gold);margin:20px 0}.inspector h2{font-family:'Cormorant Garamond',Georgia,serif;font-size:39px;line-height:1.07;font-weight:500;margin:0 0 8px}.inspector-subtitle{color:var(--gold);font-size:10px;letter-spacing:1px}.inspector-body{font-size:12px;color:#e4e0d4;line-height:1.95;margin:20px 0}.inspector-source{border-top:1px solid var(--hairline);padding-top:15px}.inspector-source span{font-size:9px;letter-spacing:1.6px;color:var(--gold)}.inspector-source p{font-size:11px;line-height:1.8;color:#aeb6ad}.inspect-focus{padding:14px 0 2px;width:100%;display:flex;justify-content:space-between;color:var(--gold);background:transparent;border:0;border-top:1px solid var(--hairline);margin-top:17px;font-size:10px;letter-spacing:1.5px}.inspect-focus span:last-child{font-size:18px}
.toast{position:absolute;z-index:14;top:101px;left:50%;transform:translateX(-50%);background:rgba(16,30,27,.91);border:1px solid var(--gold);padding:12px 18px;font-size:11px;letter-spacing:.4px;opacity:0;transition:opacity .24s;pointer-events:none;text-align:center}.toast.show{opacity:1}.help-modal{position:absolute;z-index:20;inset:0;background:rgba(5,13,12,.75);display:grid;place-items:center;padding:18px;backdrop-filter:blur(10px)}.help-card{position:relative;background:#192521;border:1px solid rgba(210,184,137,.45);width:min(520px,90vw);padding:37px 40px;box-shadow:0 12px 60px #0005}.help-card .eyebrow{color:var(--gold);font-size:10px;letter-spacing:2px}.help-card h2{font:500 45px/1.1 'Cormorant Garamond',serif;margin:15px 0}.help-card p{font-size:12px;line-height:2;color:#ddd8ca}.help-keys{display:grid;grid-template-columns:75px 1fr;gap:13px;border-top:1px solid var(--hairline);border-bottom:1px solid var(--hairline);padding:20px 0;margin:22px 0;font-size:11px}.help-keys span:nth-child(odd){color:var(--gold);letter-spacing:2px}.help-disclaimer{color:#b1b7ab!important;font-size:11px!important}.help-card a{display:inline-block;color:var(--gold);text-decoration:none;margin-top:10px;font-size:10px;letter-spacing:2px}.loading-screen{position:absolute;inset:0;z-index:30;background:#14211e;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:opacity 1s,visibility 1s}.loading-screen.done{opacity:0;visibility:hidden;pointer-events:none}.loading-crest{font:50px 'Cormorant Garamond',serif;color:var(--gold);margin-bottom:12px}.loading-brand{font:500 60px/.8 'Cormorant Garamond',serif;letter-spacing:12px;color:#e5d7b9}.loading-sub{color:#bea982;font-size:9px;letter-spacing:3px;margin-top:25px}.loading-sub span{padding:0 7px}.loading-track{margin-top:37px;background:rgba(255,255,255,.11);width:200px;height:2px}.loading-bar{background:var(--gold);width:100%;height:2px;animation:load 1.4s ease-in-out both}.loading-screen p{font-size:11px;color:#c1bbaa;margin-top:19px}@keyframes load{from{width:0}to{width:100%}}.fatal{position:absolute;z-index:40;inset:0;background:#15201e;display:grid;place-content:center;text-align:center;padding:35px}.fatal h2{font:50px 'Cormorant Garamond',serif}.fatal p{font-size:13px;max-width:470px;line-height:2}
@media (max-width:1250px){.topbar{padding:0 30px}.bottom-area{left:30px;right:30px;grid-template-columns:1fr 335px;gap:17px}.right-rail{right:25px;top:33%}.intro{left:40px;top:19.5%}.intro h1{font-size:clamp(54px,6.6vw,90px)}.statusbar{padding:0 30px}}
@media (max-width:940px){.top-center,.right-rail,.side-label,.status-center{display:none}.intro{left:25px;top:17%;width:380px;max-width:65vw}.intro h1{font-size:65px;margin:18px 0}.annotation{margin-top:18px}.bottom-area{grid-template-columns:1fr;bottom:34px;gap:10px;left:20px;right:20px}.view-panel{padding-top:8px}.view{min-height:51px;gap:3px}.environment-panel{display:grid;grid-template-columns:160px 1fr 260px;gap:10px;align-items:center;padding-top:8px}.environment-panel .control-label{display:none}.atmosphere-inner{margin-top:0}.environment-actions{margin-top:0}.inspector{right:20px;top:93px}}
@media (max-width:590px){.topbar{height:69px;padding:0 17px}.identity{gap:9px}.crest{width:39px;height:39px}.crest svg{width:27px}.identity-kicker{font-size:6.5px;letter-spacing:1.2px}.identity-name{font-size:16px;letter-spacing:2px}.top-actions{gap:5px}.pill,.icon-button{width:29px;height:29px;font-size:8px;padding:0}.top-actions #fullscreen{display:none}.intro{left:19px;top:13.7%;width:69vw;max-width:none}.chapter-number{font-size:8px}.chapter-title{font-size:7px;display:block;margin:7px 0 0}.intro h1{font-size:clamp(47px,11vw,70px);margin:17px 0 17px}.intro-line{margin-bottom:13px}.intro p{font-size:10px;line-height:1.67;max-width:250px}.explore-button{font-size:8px;min-width:200px;padding:10px 14px;margin-top:17px}.annotation{display:none}.bottom-area{left:10px;right:10px;bottom:31px;gap:7px}.view-buttons{gap:4px;margin-top:8px}.view{padding:7px 6px;font-size:9px;min-height:44px}.view-num{font-size:7px}.control-label{font-size:8px}.environment-panel{display:grid;grid-template-columns:1fr;gap:7px}.environment-panel .control-label{display:none}.atmosphere-inner{gap:8px;height:21px}.sun-icon,.moon-icon{width:13px;height:13px}.clock{font-size:9px}.tool-button{padding:9px 5px;font-size:8px;gap:6px}.statusbar{height:31px;padding:0 11px;font-size:7px;letter-spacing:.6px}.statusbar>div:last-child{font-size:7px}.inspector{top:auto;bottom:32px;left:8px;right:8px;width:auto;max-height:66dvh;overflow:auto;padding:18px 20px}.inspector h2{font-size:31px}.inspector-ornament{margin:9px 0}.inspector-body{margin:12px 0;line-height:1.6}.hotspot-text{display:none}.hotspot-disc{width:25px;height:25px}.help-card{padding:23px}.help-card h2{font-size:34px}.loading-brand{font-size:43px}}
@media (max-height:700px) and (min-width:940px){.intro{top:17%}.intro h1{font-size:70px;margin:17px 0}.intro p{line-height:1.6}.annotation{margin-top:17px}.explore-button{margin-top:18px;padding:12px 18px}.bottom-area{bottom:33px}.view{min-height:51px;gap:5px}.inspector{top:90px;max-height:60vh;overflow:auto}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
