:root{color-scheme:dark;--bg:#08110f;--surface:#101d19;--ink:#d8d8c9;--muted:#9aa79d;--line:#53635766;--red:#bb5448;--paper:#c6c4ad;--serif:'Songti SC','STSong','SimSun',serif;--sans:'PingFang SC','Microsoft YaHei',sans-serif}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 var(--sans);overflow:hidden}button,input{font:inherit}button{cursor:pointer;background:transparent;border:1px solid var(--line);color:var(--ink);padding:10px 18px;transition:background .15s,border-color .15s}button:hover{background:#d8d8c912;border-color:var(--ink)}button:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--red);outline-offset:4px}button:disabled{opacity:.4;cursor:not-allowed}button.primary{background:var(--paper);color:#15211b;border-color:var(--paper)}button.primary:hover{background:#e0ddca}button[hidden],[hidden]{display:none!important}h1,h2,h3,p{margin-top:0}h2{font-family:var(--serif);font-weight:400}h3{font-size:17px;font-weight:400}.screen{height:100dvh;position:relative}.eyebrow{font:12px/1.8 var(--sans);letter-spacing:.18em;color:var(--muted)}.muted{font-size:14px;color:var(--muted)}.title-screen{display:flex;align-items:center;padding:7vh 9vw;background:radial-gradient(ellipse at 72% 40%,#28413680,transparent 60%),linear-gradient(120deg,#06100e,#17231d)}.title-copy{z-index:2}.title-copy h1{font:clamp(80px,10vw,160px)/1.2 var(--serif);font-weight:500;letter-spacing:.12em;margin:12px 0 0;text-shadow:3px 1px #6d302b55}.title-copy h1 span{color:#e0dfce}.english{font-size:15px;letter-spacing:.25em}.chapter-label{margin:32px 0;border-left:2px solid var(--red);padding-left:20px}.chapter-label>span{font-size:12px;color:var(--muted);letter-spacing:.2em}.chapter-label h2{font-size:26px;margin:6px 0}.start-actions{display:flex;gap:12px;margin:24px 0 20px}.start-actions .primary{width:200px;text-align:left;display:flex;justify-content:space-between}.asset-status{font-size:12px;letter-spacing:.06em;color:#a59f83}.title-negative{position:absolute;right:7vw;top:19vh;width:39vw;height:58vh;border:1px solid #9fab8650;transform:rotate(-7deg);padding:28px 32px;background:repeating-linear-gradient(0deg,transparent 0px,transparent 49px,#c6c4ad09 50px),#15251f;box-shadow:0 20px 70px #0007;color:#bcc3ae;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}.title-negative>span,.title-negative>small{letter-spacing:.22em;font-size:12px}.title-count{font:clamp(55px,8vw,130px)/1 var(--serif);white-space:nowrap;opacity:.6}.title-count span{color:var(--red);margin:0 6px}.red-line{width:50%;height:1px;background:var(--red);transform:rotate(-14deg);align-self:flex-end}.title-negative p{font:20px var(--serif);text-align:right;letter-spacing:.2em}.film-edge{position:absolute;top:18px;left:0;width:100%;overflow:hidden;white-space:nowrap;letter-spacing:.65em;font-size:13px;color:#84927d40}.title-footer{position:absolute;bottom:24px;left:4vw;right:4vw;display:flex;justify-content:space-between;font-size:12px;color:var(--muted);letter-spacing:.12em}.hud{height:72px;display:flex;gap:24px;align-items:center;padding:0 28px;border-bottom:1px solid var(--line)}.hud button{font-size:14px;border:0}.brand{font:24px var(--serif);letter-spacing:.12em}.brand small{font:10px var(--sans);letter-spacing:.18em;margin-left:12px;color:var(--muted)}.scene-caption{margin:auto;display:flex;align-items:center;gap:20px}.scene-caption span{color:var(--red);font:14px monospace}.scene-caption strong{font-weight:400;letter-spacing:.16em}#stageFrame{height:calc(100dvh - 156px);display:flex;align-items:center;justify-content:center;background:#050a08}#stage{position:relative;width:min(100%,calc((100dvh - 156px)*16/9));aspect-ratio:16/9;overflow:hidden;background:#112720}#sceneImage{position:absolute;width:100%;height:100%;object-fit:fill;transition:filter .4s,transform .35s}#stage.observing #sceneImage{filter:brightness(.6)}.vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse,transparent 35%,#02070599)}.hotspot{position:absolute;padding:0;border:1px solid transparent;border-radius:2px;background:transparent;display:flex;align-items:center;justify-content:center;transition:background .22s,border .22s;cursor:crosshair}.hotspot::before{content:'○';font:24px var(--sans);opacity:0;color:var(--ink)}.hotspot span{position:absolute;bottom:0;left:50%;transform:translate(-50%,120%);padding:3px 10px;background:#07130fee;white-space:nowrap;opacity:0;font-size:14px;pointer-events:none}.hotspot:hover,.hotspot:focus-visible{background:#d7e7d810;border-color:#d7e7d830}.hotspot:hover::before,.hotspot:focus-visible::before,.observing .hotspot::before,.blockout .hotspot::before{opacity:.8}.hotspot:hover span,.hotspot:focus-visible span,.observing .hotspot span,.blockout .hotspot span{opacity:1}.hotspot.key:hover::before{animation:hint 1.8s .8s infinite}.hotspot.visited::before{font-size:16px;color:#9baa97}.blockout .hotspot{border-color:#c8d5b52b;background:#bfd1b906}.scene-corner{position:absolute;bottom:18px;left:24px;display:flex;flex-direction:column;pointer-events:none;letter-spacing:.1em;font-size:14px}.bottom-hud{min-height:84px;display:flex;align-items:center;justify-content:space-between;padding:12px 24px;gap:12px;border-top:1px solid var(--line)}.navigation,.case-tools{display:flex;gap:8px}.bottom-hud button{font-size:14px;padding:8px 12px}kbd{font:11px monospace;color:var(--muted);margin-left:4px}.case-tools span{font:12px monospace;color:var(--red);margin-left:6px}#objective{font-size:14px;color:var(--muted);text-align:center}dialog{color:var(--ink);background:#101b17;border:1px solid #68736377;padding:0;max-width:none}dialog::backdrop{background:#020805de;backdrop-filter:blur(5px)}#panel{width:min(1180px,94vw);max-height:90dvh;overflow:auto}#panel[open]{animation:appear .28s ease-out}.panel-head{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding:22px 30px;position:sticky;top:0;background:#101b17;z-index:4}.panel-head h2{margin:0;font-size:26px}.panel-head button{font:28px var(--sans);border:0}#panelBody{padding:28px 30px}.panel-actions{display:flex;gap:12px;justify-content:flex-end;align-items:center;margin-top:20px;flex-wrap:wrap}.panel-actions .muted{margin-right:auto;margin-bottom:0}.empty{padding:40px;text-align:center;color:var(--muted)}.item-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:18px}.item-card{text-align:left;display:flex;flex-direction:column;gap:14px;padding:24px;border-color:#66725c60;min-height:150px}.item-card small{font:12px monospace;color:var(--muted)}.item-card strong{font:22px var(--serif)}.item-card span{font-size:14px}.paper{background:var(--paper);color:#293127;padding:28px;font-family:var(--serif);box-shadow:0 10px 24px #0004}.paper h3{font-size:24px}.paper .red{color:#842f2b}.paper del{color:#493f34}.roster{height:370px;overflow:auto;padding:12px;background:var(--paper);color:#27342b}.roster button{display:block;color:#27342b;width:100%;text-align:left;border:0;border-bottom:1px solid #3e483a30;padding:7px 12px;font-size:15px}.roster button:hover{background:#464e3820}.roster .checked{color:#8e322a;background:#8e322a10}.roster .selected{outline:2px solid #8e322a;outline-offset:-3px}.comparison{display:grid;grid-template-columns:1.7fr 1fr;gap:24px}.photo-board{position:relative;aspect-ratio:16/10;background:#293a30;overflow:hidden;border:10px solid #b9bca6}.photo-board>img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;opacity:.8}.person-marker{position:absolute;transform:translate(-50%,-50%);padding:0;border:1px solid #dce1ca80;border-radius:50%;width:29px;height:29px;font:12px monospace;background:#101c18aa;color:#e0e6d6;z-index:1}.person-marker.marked{background:#b7493d;border-color:#e2b3a0}.photo-counter{display:flex;justify-content:space-between;margin-top:12px;font:14px monospace}.photo-caption{margin:12px 0;font-size:14px;color:var(--muted)}.document-view{max-width:760px;margin:0 auto;overflow:auto}.evidence-image{width:100%;max-height:50vh;object-fit:contain}.zoom-viewport{height:48vh;overflow:auto;background:#08110e;padding:15px;display:flex;align-items:flex-start;justify-content:flex-start}.zoom-content{transform-origin:top left;min-width:100%;transition:transform .1s}.drag-track{position:relative;min-height:160px;border:1px solid var(--line);background:#09130f;display:flex;align-items:center;padding:20px;overflow:hidden}.drag-handle{touch-action:none;user-select:none;min-width:190px;text-align:center;padding:22px;cursor:grab;position:relative;background:#26342a;border:1px solid #9eaa8e;z-index:1}.drag-handle:active{cursor:grabbing}.track-label{position:absolute;right:30px;font-size:14px;color:var(--muted)}.power-layout{display:grid;grid-template-columns:1.5fr 1fr;gap:28px}.switch-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.switch{padding:18px 5px;background:#202b25;display:flex;align-items:center;flex-direction:column;gap:14px}.switch .lever{width:12px;height:34px;background:#879080;border:4px solid #121b16;transform:rotate(-30deg);box-shadow:0 0 0 8px #07100c}.switch.on .lever{transform:rotate(30deg);background:#cdbea0}.switch small{font:12px monospace;color:var(--muted)}.switch.on small{color:#ded6ab}.fuse-slot{margin-top:22px;border:1px dashed var(--muted);padding:20px;text-align:center;min-height:76px}.fuse-slot.installed{border-style:solid;color:#c9d5b8}.develop-layout{display:grid;grid-template-columns:1.7fr 1fr;gap:26px}.develop-photo{aspect-ratio:16/10;position:relative;background:#020302;overflow:hidden;border:12px solid #352823}.develop-photo img{width:100%;height:100%;object-fit:fill}.develop-photo .whiteout{position:absolute;inset:0;background:white;pointer-events:none}.develop-photo .photo-writing{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;font:clamp(22px,3vw,38px) var(--serif);color:#d7d5c1;padding:30px;pointer-events:none;background:#08110e90}.control-group{margin-bottom:20px}.control-group label{display:flex;justify-content:space-between;font-size:14px;margin-bottom:10px}.control-group input{width:100%;accent-color:var(--red)}.development-status{min-height:54px;font-family:var(--serif);color:#ddc2aa}progress{width:100%;height:5px;accent-color:var(--red)}.photo-strip{display:flex;gap:5px;margin-top:20px}.photo-strip span{flex:1;text-align:center;border-top:2px solid #405042;padding-top:8px;font:12px monospace;color:var(--muted)}.photo-strip .done{border-color:#c2baa0;color:#ded6ba}.negative-viewport{position:relative;overflow:hidden;width:100%;aspect-ratio:16/8;outline:1px solid #b6b7994d;cursor:grab;touch-action:none;background:#121b14}.negative-strip{width:calc(100% + 190px);height:100%;position:relative;will-change:transform;user-select:none}.negative-strip>img{width:100%;height:100%;object-fit:fill;pointer-events:none}.negative-count{font:24px monospace;letter-spacing:.15em;margin-top:18px}.negative-viewport:active{cursor:grabbing}.count-glitch{animation:count-glitch .25s 2}.pause-options{display:flex;flex-direction:column;gap:14px;max-width:420px;margin:auto}#dialogue{position:fixed;top:auto;bottom:7vh;left:0;right:0;width:min(920px,90vw);padding:24px 32px;border-top:2px solid #808a7055;background:#0d1916f5}#dialogue::backdrop{background:#0003;backdrop-filter:none}#speaker{font-size:14px;color:#b6be9e;margin-bottom:10px;letter-spacing:.18em}#dialogueText{font:22px/1.8 var(--serif);min-height:40px;margin-bottom:12px}#nextLine{display:block;margin-left:auto;font-size:14px;border:0;min-width:130px;text-align:right}#nextLine span{color:var(--red);margin-left:18px}#toast{position:fixed;top:90px;right:30px;max-width:80vw;background:#18281ff5;border-left:2px solid var(--red);padding:14px 24px;z-index:20;opacity:0;pointer-events:none;transform:translateY(-5px);transition:.28s;font-size:14px}#toast.show{opacity:1;transform:none}#transition{position:fixed;inset:0;background:black;z-index:100;pointer-events:none;opacity:0;transition:opacity 1s}#transition.active{opacity:1;pointer-events:auto}.end-screen{display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;background:#030706;gap:16px;padding:24px}.end-screen h1{font:clamp(30px,5vw,58px) var(--serif);letter-spacing:.2em;margin:0}.ending-count{font:clamp(56px,8vw,96px) var(--serif);margin:0}.ending-count i{font-style:normal;color:var(--red)}.end-screen>p{line-height:2}.end-screen button{min-width:200px}.viewfinder{position:relative;padding:12%;border:1px solid var(--line);text-align:center;font:24px var(--serif);background:#17291f}.viewfinder img{width:100%;max-height:40vh;object-fit:contain}#effect{position:absolute;inset:0;pointer-events:none;display:flex;align-items:center;justify-content:center;font:32px var(--serif);color:#e0decc;letter-spacing:.25em;opacity:0}#effect.visible{opacity:1;background:#bfd0b217}#effect img{height:90%;width:100%;object-fit:contain}#panel.wide{width:min(1320px,96vw)}@keyframes hint{50%{color:var(--red);transform:scale(1.15)}}@keyframes appear{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes count-glitch{50%{transform:translateX(3px);color:var(--red)}}@media(max-width:900px){.hud{height:60px;padding:0 12px;gap:10px}.brand small{display:none}.scene-caption{gap:8px}.bottom-hud{flex-wrap:wrap;min-height:110px;padding:8px 12px}#objective{order:3;width:100%;font-size:12px}#stageFrame{height:calc(100dvh - 170px)}#stage{width:min(100%,calc((100dvh - 170px)*16/9))}.title-screen{padding-left:7vw}.title-negative{right:3vw;opacity:.55;width:44vw}.comparison,.develop-layout,.power-layout{grid-template-columns:1fr}.roster{height:250px}.title-footer span:nth-child(2){display:none}.person-marker{width:24px;height:24px;font-size:10px}.panel-head{padding:16px}.panel-head h2{font-size:21px}#panelBody{padding:18px}.hotspot span{font-size:12px}#dialogueText{font-size:19px}}@media(max-height:650px){.title-copy h1{font-size:76px}.chapter-label{margin:15px 0}.start-actions{margin:15px 0}.title-copy .muted{margin-bottom:5px}.title-footer{bottom:10px}.title-copy>.eyebrow{display:none}.title-negative{top:16vh;height:60vh}.hud{height:52px}.bottom-hud{min-height:70px}#stageFrame{height:calc(100dvh - 122px)}#stage{width:min(100%,calc((100dvh - 122px)*16/9))}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* Supplied artwork retains its native aspect ratio, including the three panoramic crops. */
:root{--scene-ratio:1.77777778;--game-chrome:156px}
#stageFrame{position:relative;isolation:isolate;overflow:hidden}
#stageFrame::before{content:"";position:absolute;inset:-40px;background-image:var(--scene-backdrop);background-position:center;background-size:cover;filter:blur(24px) brightness(.18);z-index:-1;pointer-events:none}
#stage{aspect-ratio:var(--scene-ratio);width:min(100%,calc((100dvh - var(--game-chrome))*var(--scene-ratio)));flex-shrink:0;box-shadow:0 0 50px #0009;overflow:visible}
#sceneImage{object-fit:contain}
.vignette{background:radial-gradient(ellipse,transparent 55%,#02070566)}
.hotspot{z-index:2}.hotspot:hover,.hotspot:focus-visible{z-index:5}
.hotspot span{z-index:6}.scene-corner{bottom:auto;top:calc(100% + 16px);font-size:13px}
.source-art{display:block;width:auto;max-width:100%;max-height:58vh;margin:0 auto 20px;object-fit:contain}
.document-view img{max-width:100%;height:auto;display:block;margin:auto}
.inventory-thumb{width:100%;height:120px;object-fit:contain}
.photographic-switches{display:block;position:relative;aspect-ratio:362/418;background-size:100% 100%;width:min(100%,420px);margin:auto}
.photographic-switches .switch{position:absolute;width:26%;height:25%;padding:0;border:1px solid transparent;background:transparent;gap:0;justify-content:flex-end}
.photographic-switches .switch>span{display:none}
.photographic-switches .switch small{padding:2px 7px;background:#08100de8;color:#d5d5c6;transform:translateY(12px)}
.photographic-switches .switch.on{box-shadow:inset 0 0 0 2px #c8b38188;border-radius:50%}
.photographic-switches .switch.on small{color:#e9ca88}.photographic-switches .switch:hover{border-color:#d8dfbf77;border-radius:50%}
.title-screen{background:linear-gradient(90deg,#04100fee 0%,#06130ce0 35%,#04120b30 100%),url('assets/chapter01/street.jpg') center/cover}
.title-negative{background:linear-gradient(#0b1c1799,#0b1c17e8),url('assets/chapter01/graduation-41.jpg') center/cover}
.title-copy .asset-status{max-width:450px}.hotspot.key::before{font-size:27px}
@media(max-width:900px){:root{--game-chrome:170px}}
@media(max-height:650px){:root{--game-chrome:122px}}

#stage[data-scene="studio"] .scene-corner{top:auto;bottom:14px}
/* Document revision 2026-09: all four locations are 16:9. */
#stage{overflow:hidden}.scene-corner,#stage[data-scene="studio"] .scene-corner{top:auto;bottom:14px;text-shadow:0 2px 8px #000}
.title-screen{background:linear-gradient(90deg,#04100ff2 0%,#06130cd9 36%,#04120b25 100%),url('assets/chapter01/street.jpg') center/cover}
.title-negative{background:linear-gradient(#0b1c1733,#0b1c17d9),url('assets/chapter01/graduation-41.jpg') center/cover}
.closeup-art,#panelBody>img{display:block;max-width:100%;max-height:53vh;object-fit:contain;margin:0 auto 20px}
.zoom-content{flex-shrink:0;min-width:100%;width:100%;position:relative}.zoom-content>img{display:block;width:100%;height:auto;object-fit:contain}.zoom-content>img[alt="陈默"]{width:auto;max-height:45vh;margin:auto}.zoom-viewport{height:52vh}.handwritten-note{position:absolute;top:40%;left:45%;color:#d5c4a0;font:40px var(--serif);transform:rotate(-8deg)}
.wall-view{position:relative;max-width:850px;margin:auto}.wall-view>img{display:block;width:100%;max-height:55vh;object-fit:contain}.wall-target{position:absolute;top:34%;left:37%;width:26%;height:26%;font-size:13px;background:#08110e66}
.photo-board{border:6px solid #b9bca6}.photo-board>img{opacity:1}.person-marker{width:23px;height:23px;font-size:11px;background:#101c1840;border-color:#e8ebd9aa}.person-marker:not(.marked):hover{background:#bd554acc}.teacher-marker{border-style:dashed;color:#d6c6a1}.roster button:disabled{opacity:1}.roster{height:340px}.comparison{grid-template-columns:minmax(0,2.2fr) minmax(240px,1fr)}
.photographic-switches{aspect-ratio:458/602;width:min(100%,340px)}.photographic-switches .switch{height:22%}.develop-photo{aspect-ratio:3/2}.develop-photo img{object-fit:contain}.viewfinder{padding:0}.viewfinder img{display:block;max-height:60vh}
.negative-viewport{aspect-ratio:2400/1300;background:#100e0b}.negative-strip{display:flex;align-items:stretch;width:calc(100% + 190px)}.negative-strip>.negative-core{flex:0 0 calc(100% - 190px);width:calc(100% - 190px);height:100%;object-fit:fill}.negative-strip>.negative-wing{flex:0 0 190px;width:190px;height:100%;object-fit:cover;filter:sepia(.3) brightness(.85)}.negative-count{height:40px;margin:14px 0 0;text-align:center}
#dialogue{padding-left:145px;min-height:180px}.dialogue-portrait{position:absolute;left:20px;bottom:20px;width:100px;height:132px;object-fit:cover;filter:saturate(.45);mask-image:linear-gradient(#000 75%,transparent)}
@media(max-width:900px){.comparison{grid-template-columns:1fr}.person-marker{width:21px;height:21px}.negative-strip>.negative-wing{object-position:center}.dialogue-portrait{width:70px;height:110px}#dialogue{padding-left:105px}.roster{height:240px}}

.photographic-switches{aspect-ratio:444/535}.photographic-switches .switch{height:17%}.negative-strip>.negative-wing{object-fit:contain;background:#171710}.wall-view>img{max-height:none}.wall-view{max-width:min(850px,90vh)}