@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600&family=Cormorant+Garamond:wght@400;500;600&display=swap');
:root{color-scheme:dark;--bg:#111820;--panel:#1a232b;--line:#354048;--text:#e9e8e3;--muted:#aeb7bd;--gold:#d7b783}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:'Noto Sans JP',sans-serif;font-size:16px}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;background:none;border:1px solid var(--line);border-radius:5px;padding:11px 17px}button:hover{border-color:var(--gold);background:#d7b78312}button:focus-visible,a:focus-visible{outline:2px solid var(--gold);outline-offset:4px}button:disabled{opacity:.5;cursor:default}.app{max-width:1440px;margin:auto;padding:0 46px}header{height:110px;display:flex;align-items:center;gap:22px}.brand{width:49px;height:58px;border:1px solid var(--gold);color:var(--gold);text-decoration:none;font-family:Georgia,serif;text-align:center;font-size:29px;line-height:34px}.brand span{display:block;font:11px sans-serif;letter-spacing:3px;padding-left:3px}.heading p{margin:0 0 5px;color:var(--gold);font-size:12px;letter-spacing:3px}.heading h1{font-size:17px;font-weight:500;margin:0;letter-spacing:2px}.header-actions{margin-left:auto;display:flex;gap:10px}.header-actions button{font-size:14px}.gold{color:var(--gold);border-color:#8c7656}main{display:grid;grid-template-columns:minmax(0,1fr) 265px;gap:34px}.play{min-width:0}.scene-top{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;background:#202a32;border:1px solid var(--line);font-size:12px;letter-spacing:2px}.scene-top #status{color:var(--muted);font-size:13px;letter-spacing:1px}.room{aspect-ratio:3/2;position:relative;overflow:hidden;background:#202a32}.room>img{width:100%;height:100%;object-fit:cover;display:block}.vignette{pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 80px #0004}.spot{position:absolute;transform:translate(-50%,-50%);width:44px;height:44px;padding:0;border-radius:50%;border:1px solid #f7e2bac0;background:#10182088;box-shadow:0 0 0 5px #10182022;color:#ffedc8;font-size:24px;display:grid;place-items:center}.spot:hover,.spot:focus-visible{background:#d7b783;color:#121820}.spot-label{position:absolute;white-space:nowrap;left:50%;top:48px;transform:translateX(-50%);font-size:12px;padding:4px 8px;border-radius:3px;background:#111820e8;opacity:0;pointer-events:none}.spot:hover .spot-label,.spot:focus-visible .spot-label{opacity:1}.intro{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(#07121c50,#061019d9);text-align:center;padding:20px}.eyebrow{font-size:12px;letter-spacing:2px;color:var(--gold)}.intro h2{font-family:'Cormorant Garamond',Georgia,serif;font-size:clamp(45px,6vw,83px);font-weight:400;letter-spacing:5px;margin:0}.intro h2 em{font-style:normal;color:#e9c794}.intro p:not(.eyebrow){line-height:2.1;font-size:14px;color:#efebe5}.primary{background:var(--gold);color:#172029;border:none;font-weight:600;min-height:48px}.primary:hover{background:#efd09c;color:#172029}.intro .primary{min-width:230px;margin:14px 0 20px}.primary span{margin-left:30px}.intro small{font-size:12px;color:#d1ccc4}.message{min-height:66px;display:flex;align-items:center;padding:15px 18px;border:1px solid var(--line);background:#1c252d;font-size:14px;line-height:1.8}.inventory-head{display:flex;align-items:center;justify-content:space-between;margin-top:22px;gap:10px}.inventory-head h2{font-weight:500;font-size:15px}.inventory-head span{font-size:12px;color:var(--muted)}.inventory{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;min-height:86px}.item{min-height:86px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;padding:8px 4px;background:#1a232b}.item.selected{border-color:var(--gold);background:#d7b7831a}.item .symbol{font-size:25px;color:var(--gold)}.item small{font-size:12px}.empty-slot{border:1px solid #28343e;border-radius:5px;display:grid;place-items:center;color:#35434e;font-family:Georgia;font-size:14px}aside{padding:22px 0}aside h2{font:500 20px 'Noto Sans JP',sans-serif;letter-spacing:1px;line-height:1.7;margin-top:19px}.aside-copy{font-size:14px;color:var(--muted);line-height:2}.divider{height:1px;background:var(--line);margin:29px 0}.progress-heading{display:flex;justify-content:space-between;align-items:center}.progress-heading h3{font-size:14px;font-weight:500}.progress-heading span{font-size:12px;color:var(--gold)}ol{padding:0;list-style:none;margin:10px 0 27px}li{display:flex;align-items:flex-start;gap:12px;color:#85939e;font-size:14px;padding:12px 0}li .step{width:23px;min-width:23px;height:23px;display:grid;place-items:center;border:1px solid #4b5760;border-radius:50%;font-size:12px}li.done{color:var(--text)}li.done .step{color:var(--gold);border-color:#a38b63}.note{border-left:2px solid #8c7656;padding:2px 0 2px 16px}.note span{font-size:12px;color:var(--gold)}.note p{font-size:13px;line-height:1.9;color:var(--muted);margin-bottom:0}.text-button{border:0;padding:10px 0;color:var(--muted);font-size:13px;margin-top:25px}.prototype{font-size:12px;color:#83929e}footer{display:flex;justify-content:space-between;border-top:1px solid #28343e;margin-top:34px;padding:20px 0 26px;color:#84919b;font-size:12px;letter-spacing:1px}dialog{width:min(510px,calc(100% - 28px));max-height:90dvh;overflow:auto;border:1px solid #65706e;border-radius:10px;background:#1b252e;color:var(--text);padding:24px;box-shadow:0 30px 100px #0009}dialog::backdrop{background:#050b13c9;backdrop-filter:blur(5px)}.modal-top{display:flex;align-items:center;justify-content:space-between}.modal-top button{font:28px sans-serif;border:0;padding:0 7px}.modal-top .eyebrow{font-size:11px}dialog h2{font-size:23px;font-weight:500;margin:20px 0 16px}dialog p{font-size:15px;line-height:1.95;color:#c9d0d5}dialog .primary{width:100%;margin-top:14px}.clue{background:#ede4d2;color:#302b25;padding:24px;margin:20px 0;border-radius:2px;font:18px/2 Georgia,'Noto Sans JP',serif;text-align:center;box-shadow:0 8px 25px #0003}.clue small{font-size:13px}.clue strong{font-size:26px;letter-spacing:7px}.code-row{display:flex;gap:10px;margin-top:20px}.code-row input{width:100%;min-width:0;border:1px solid #77817b;border-radius:5px;background:#0f1921;color:var(--gold);font:28px monospace;text-align:center;padding:12px;letter-spacing:10px}.code-row button{white-space:nowrap}.error{color:#f1b0a2!important;min-height:28px}.ad-panel{text-align:center;background:#101a23;border:1px solid #46525b;padding:24px;margin-top:20px}.ad-panel strong{font:40px Georgia;color:var(--gold)}.ad-panel p{font-size:14px}.ad-panel progress{width:100%;accent-color:var(--gold)}.hint-text{border-left:2px solid var(--gold);padding-left:18px}.victory-number{font:70px Georgia;color:var(--gold);text-align:center;margin:20px 0}.button-row{display:flex;gap:10px;flex-wrap:wrap}.button-row button{flex:1}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}@media(max-width:1050px){.app{padding:0 24px}main{grid-template-columns:minmax(0,1fr) 225px;gap:22px}aside h2{font-size:18px}}@media(max-width:800px){.app{padding:0 16px}header{height:89px;gap:13px}.heading p{font-size:10px;letter-spacing:1px}.heading h1{font-size:14px;letter-spacing:0}.brand{width:40px;height:49px;font-size:25px;line-height:28px}.header-actions{gap:7px}.header-actions button{padding:9px 11px}main{display:block}aside{padding:24px 3px;display:grid;grid-template-columns:1fr 1fr;gap:0 24px}aside>.eyebrow,aside h2,aside .aside-copy,aside .divider{display:none}.progress-heading,ol{grid-column:1}.note{grid-column:2;grid-row:1 / 3;align-self:center}.prototype{grid-column:2}.text-button{margin-top:0;text-align:left}footer{margin-top:0}.room{aspect-ratio:3/2}.intro h2{font-size:60px}.intro p:not(.eyebrow){font-size:13px}.intro .primary{margin:5px 0 14px}.inventory{gap:6px}.item small{font-size:11px}.message{min-height:66px}.scene-top{padding:12px;font-size:11px}}@media(max-width:430px){.app{padding:0 10px}.heading p{font-size:9px}.header-actions button{font-size:12px;padding:9px}.heading h1{font-size:12px}.intro .eyebrow{font-size:9px;margin:0}.intro h2{font-size:47px}.intro p:not(.eyebrow){font-size:12px;margin:6px 0}.intro .primary{min-height:42px;margin:5px 0 8px}.intro small{font-size:10px}.inventory-head span{font-size:10px}.spot{width:36px;height:36px;font-size:20px}.scene-top #status{font-size:11px}.item{min-height:75px}.inventory{min-height:75px}aside{gap:0 15px}.note p{font-size:12px}}

/* Chapter II: object exploration, four-room navigation and diegetic puzzle surfaces. */
.spot{background:transparent;border:0;box-shadow:none;border-radius:5px;color:transparent;min-width:36px;min-height:36px}
.spot:hover{background:#ffffff05;border:0;color:transparent;box-shadow:inset 0 0 0 1px #e9d6b225}
.spot:focus-visible{background:#e6c79415;outline:2px solid var(--gold);color:transparent}
.spot.mark-spot{color:#e3c28a99;font-size:22px;text-shadow:0 1px 3px #000}
.room-nav{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line);background:#1c252d}
.room-nav button{border:0;border-right:1px solid var(--line);border-radius:0;color:var(--muted);font-size:14px;padding:14px 7px}
.room-nav button:last-child{border-right:0}.room-nav button.active{box-shadow:inset 0 -2px var(--gold);color:var(--gold);background:#d7b7830c}
.room-nav button:disabled{opacity:.35}.message{min-height:35px;border:0;background:none;padding:8px 0;font-size:13px;color:var(--gold)}
.inventory-head{margin-top:0}.inventory-head .text-button{margin:0;padding:5px 0}
.inventory{grid-template-columns:repeat(8,minmax(0,1fr));gap:7px}.item{min-height:82px}
.item small{font-size:11px;text-align:center;overflow-wrap:anywhere}.empty-slot{min-height:82px}
.evidence-list{display:flex;flex-wrap:wrap;gap:7px;max-height:260px;overflow:auto;margin:10px 0 28px}
.evidence{font-size:12px;padding:7px 10px;color:var(--muted);border-color:#354048}
.note{padding-left:13px}.note textarea{display:block;width:100%;background:transparent;color:#dfdfd9;border:0;resize:vertical;line-height:1.85;font:14px/1.85 'Noto Sans JP',sans-serif;padding:10px 0;min-height:120px}.note textarea:focus{outline:0}
.object-crop{height:230px;background-size:260%;background-repeat:no-repeat;border-radius:3px;box-shadow:inset 0 0 70px #0006}
.symbol-clue{font-family:Georgia,'Noto Sans JP',serif;font-size:31px;line-height:1.8;padding:32px 12px}
.tile-clue{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.tile-clue div{display:grid;gap:12px;border:1px solid #817462;padding:14px 3px;font-size:30px}
.pickup{display:flex;justify-content:center;gap:32px;padding:40px 12px}.pickup div{display:flex;flex-direction:column;align-items:center;gap:20px}.pickup span{font:64px Georgia;color:var(--gold)}.pickup small{font-size:14px}
.book-clue{display:flex;align-items:flex-end;justify-content:center;gap:9px;padding:30px 5px}.book-clue span{height:200px;width:65px;display:grid;place-items:center;color:#101820;font:32px Georgia;border:1px solid #ffffff44;box-shadow:inset 6px 0 #0002}
.book-clue span:nth-child(2){height:220px}.book-clue span:nth-child(3){height:185px}
.equations{font-size:26px;line-height:2.5;white-space:nowrap}
.puzzle-grid{display:grid;grid-template-columns:repeat(4,1fr);width:min(300px,100%);margin:0 auto;border:1px solid #87739d}
.puzzle-grid span{display:grid;place-items:center;aspect-ratio:1;border:1px solid #87739d;font:32px monospace;color:#e8d5ff}
.grid-orientation{text-align:center;color:#d6b7ef;font-size:24px;padding:7px}
.film-clue{padding:10px;background:#121a22}.film-clue .covered{background:#687483}.film-clue .hole{background:#121a22;color:#becbd9}
.uv-clue{padding:10px;background:#171426;box-shadow:inset 0 0 60px #803fbb22}
.lock-icon{text-align:center;font-size:45px;color:var(--gold);margin-top:15px}
.color-lock{display:flex;gap:12px;margin:30px 0}.color-key{flex:1;min-height:85px;color:#0e1720;font-weight:600;border:2px solid #ffffff55;text-shadow:0 1px #ffffff55;padding:8px}.color-key:hover{filter:brightness(1.15)}
.clock-diagram{display:block;width:min(270px,90%);margin:25px auto}.mirrored{transform:scaleX(-1)}
.clock-input{display:flex;align-items:center;justify-content:center;gap:20px;margin:30px 0}.clock-input>span{font-size:34px}.clock-input label{display:flex;flex-direction:column;gap:10px;font-size:14px;color:var(--muted)}
select{color:var(--text);background:#152029;border:1px solid #5c6c76;padding:12px;font:inherit;border-radius:4px}.clock-input select{font:32px monospace}.symbol-order{text-align:center;font-size:29px;margin:25px 0}
.screw-diagram{display:grid;grid-template-columns:1fr 1fr;justify-items:center;gap:50px 100px;padding:20px;color:var(--gold);font-size:30px}
.fuse-slot{text-align:center;padding:25px;font-size:65px;color:#697987}.fuse-slot.on{color:var(--gold)}.power-indicator{text-align:right;color:#657582}.power-indicator.on{color:#d4c598;text-shadow:0 0 15px #d4c598}
.gear-slots{display:flex;gap:18px;justify-content:center;margin:20px 0}.gear-slots span{width:66px;height:66px;border:2px dashed #536370;border-radius:50%;display:grid;place-items:center;font:24px Georgia;color:#677986}.gear-slots .filled{color:var(--gold);border-style:solid;border-color:#a28b68;font-size:41px}
.arrow-sequence{text-align:center;font-size:32px;min-height:60px;letter-spacing:8px}.direction-pad{display:flex;gap:10px;justify-content:center;margin-bottom:20px}.direction-pad button{font-size:28px;min-width:60px;padding:8px}
.hint-select{display:flex;flex-direction:column;gap:10px;font-size:14px}.ad-panel progress{display:block;margin-top:25px}
@media(max-width:800px){aside{grid-template-columns:1fr 1fr}.evidence-list{grid-column:1}.note{grid-column:2;grid-row:1/4}.prototype{grid-column:1/3}.inventory{grid-template-columns:repeat(6,minmax(0,1fr))}.item,.empty-slot{min-height:76px}.room-nav button{font-size:13px}}
@media(max-width:430px){.inventory{grid-template-columns:repeat(5,minmax(0,1fr))}.item small{font-size:10px}.room-nav button{font-size:12px;padding:12px 3px}.symbol-clue{font-size:25px}.equations{font-size:22px}.direction-pad{gap:7px}.direction-pad button{min-width:48px}.tile-clue{gap:5px;padding:17px 12px}.tile-clue div{font-size:25px}.object-crop{height:180px}.spot.mark-spot{font-size:17px}}
.chapter-link{display:block;color:var(--gold);font-size:13px;text-decoration:none;margin:15px 0;padding:12px 0;border-top:1px solid var(--line)}.chapter-link:hover{color:white}@media(max-width:800px){.chapter-link{grid-column:1/3}}

.chapter-links{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}.chapter-links a{font-size:12px;color:var(--gold);padding:8px;border:1px solid var(--line);text-decoration:none;border-radius:4px}@media(max-width:800px){.chapter-links{grid-column:1/3}}

/* Shared mobile navigation and touch controls. */
.home-link{display:inline-flex;align-items:center;justify-content:center;color:var(--gold);font-size:14px;padding:10px 12px;border:1px solid var(--line);border-radius:5px;text-decoration:none;min-height:44px}button,a{touch-action:manipulation}dialog{max-height:calc(100dvh - 24px);overflow-y:auto}.header-actions button,.room-nav button,.chapter-links a{min-height:44px}.chapter-links a{display:inline-flex;align-items:center;font-size:14px}.spot{min-width:44px;min-height:44px}textarea,select{font-size:16px}@media(max-width:650px){header{height:auto;min-height:118px;flex-wrap:wrap;gap:10px;padding:14px 0}.header-actions{width:100%;margin:0;justify-content:flex-end}.header-actions .home-link{margin-right:auto}.header-actions button{font-size:14px}.item small{font-size:12px}.note textarea{width:100%;min-width:0}.note{min-width:0}.inventory{grid-template-columns:repeat(4,minmax(0,1fr))}.scene-top{letter-spacing:1px}.room-nav button{font-size:13px}}