@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@400;600;700&family=IBM+Plex+Mono:wght@400;500&display=swap');
:root{color-scheme:dark;--text:#e2e5d9;--muted:#a3b1a2;--green:#c2d4a0;--line:#a7b39c35;--mono:'IBM Plex Mono',monospace}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:#131b17;color:var(--text);font:14px/1.6 system-ui,sans-serif;overflow:hidden}button,select{font:inherit;color:inherit}button{cursor:pointer;border:1px solid var(--line);background:#17211be8;min-height:44px;padding:10px 16px;border-radius:3px;transition:background .18s}button:hover{background:#3a4931}button:focus-visible,select:focus-visible{outline:2px solid var(--green);outline-offset:3px}button:disabled{opacity:.45;cursor:default}#world{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;outline:none;cursor:grab}#world:active{cursor:grabbing}.vignette{position:fixed;inset:0;box-shadow:inset 0 0 140px 25px #0004;pointer-events:none;background:linear-gradient(#06110c70,transparent 25%,transparent 60%,#06110caa)}header{position:fixed;top:0;left:0;right:0;padding:26px 34px;display:flex;justify-content:space-between;align-items:center;pointer-events:none;z-index:2}.brand{display:flex;gap:13px;align-items:center;text-shadow:0 2px 15px #000}.brand-mark{font:32px 'Noto Serif TC',serif;border:1px solid #c5ceaf77;padding:4px 10px}.brand b{font:600 19px 'Noto Serif TC',serif;letter-spacing:4px}.brand small{display:block;font:8px var(--mono);letter-spacing:1.5px;margin-top:7px;color:#b9c5ac}.header-right{display:flex;gap:14px;align-items:center;pointer-events:auto}.live-label{font:9px var(--mono);letter-spacing:2px;color:#c5d6a7}select{border:0;background:#122019b0;padding:8px;min-height:44px;max-width:112px}.icon-btn{background:#101a1599;font-size:12px}.location{position:fixed;left:36px;top:121px;display:flex;align-items:center;gap:12px;font:9px var(--mono);color:#bdc6b2;pointer-events:none;letter-spacing:1px}.eyebrow{font:10px/1.6 var(--mono);letter-spacing:2px;color:var(--muted)}#crosshair{position:fixed;left:50%;top:50%;pointer-events:none;width:18px;height:18px;line-height:12px;text-align:center;transform:translate(-50%,-50%);border:1px solid #d5e1c447;border-radius:50%;color:#d5e1c4}#interaction-hint{position:fixed;left:50%;top:calc(50% + 30px);transform:translateX(-50%);white-space:nowrap;background:#101810eb;border:1px solid #a6b48a66;padding:8px 15px;border-radius:3px;pointer-events:none;font-size:12px}kbd{display:inline-block;border:1px solid #a6b48a66;padding:0 6px;margin-right:10px;font:11px/22px var(--mono);color:var(--green)}.objective{position:fixed;left:36px;bottom:92px;width:min(350px,calc(100vw - 290px));padding:18px 20px;background:linear-gradient(100deg,#101a15e8,#101a15b8);border-left:2px solid #b6c79688;backdrop-filter:blur(8px)}.objective h1{font:500 20px 'Noto Serif TC',serif;letter-spacing:1px;margin:9px 0}.objective p{font-size:11px;color:#b8c5ad;margin:8px 0 12px;min-height:18px}.objective button{font-size:11px;min-height:34px;background:transparent;padding:6px 10px;border-color:#a8b59944}.deadline{position:absolute;bottom:0;left:0;right:0;height:2px;background:#364b3033}#deadline-bar{height:100%;background:#c5cda5;transition:width .2s linear}.shift-panel{position:fixed;right:36px;bottom:94px;width:174px;text-shadow:0 2px 10px #000}.time{font:400 49px/1.3 var(--mono);letter-spacing:-2px}.time-caption{display:flex;justify-content:space-between;font:10px var(--mono);color:#bac6ac}.shift-progress{height:2px;background:#b2bfa033;margin:12px 0}.shift-progress>div{height:100%;background:#c4d5a6}#sanity-bars{display:flex;gap:5px}#sanity-bars i{height:4px;background:#b5c797;flex:1}#sanity-bars i.empty{background:#46533c}.movement-help{position:fixed;left:36px;right:36px;bottom:27px;display:flex;justify-content:space-between;align-items:center;font:10px var(--mono);color:#bbc7af}.movement-help button{font-size:11px;min-height:38px;background:#111d1699}.touch-controls,#touch-interact{display:none}#interaction-panel{position:fixed;right:24px;top:108px;bottom:24px;width:min(510px,calc(100vw - 48px));overflow:auto;padding:22px;background:#111b16f5;border:1px solid #7d90715c;box-shadow:0 15px 90px #0008;backdrop-filter:blur(18px);z-index:4;scrollbar-color:#57654c #172019}.panel-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:19px}.panel-top button{font-size:11px;min-height:36px;background:transparent;padding:6px 10px}.event-heading{display:flex;justify-content:space-between;gap:8px;font:9px var(--mono);color:#a6b991}.event-card h2{font:600 24px/1.5 'Noto Serif TC',serif;margin:18px 0 10px}.event-card p{font-size:13px;line-height:1.9;color:#afbaa7;white-space:pre-line;margin:0 0 20px}#actions{display:flex;flex-direction:column;gap:9px}#actions button{font-size:12px;text-align:left;background:#31412a;border-color:#82956877}#actions button+button{background:#17221a}.desk-controls{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;border-top:1px solid var(--line);margin-top:22px;padding-top:20px}.desk-controls button{display:flex;flex-direction:column;text-align:left;gap:6px;font-size:10px;padding:11px 9px}.desk-controls b{font:10px var(--mono);color:var(--green)}.desk-controls .unsafe b{color:#ec9a7d}.log-panel{margin-top:24px}#log{font:10px/1.8 var(--mono);color:#93a486}#log p{border-left:1px solid #586b46;padding-left:9px;margin:9px 0}#log p.bad{color:#e09a80}.monitor-top{display:flex;justify-content:space-between;font:9px var(--mono);padding:10px;border:1px solid var(--line);background:#2b3628}.screen{position:relative;aspect-ratio:16/10;overflow:hidden;border:4px solid #384331;background:#040704}.screen canvas{width:100%;height:100%;display:block}.scanlines{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,#0003 0px,#0003 1px,transparent 1px,transparent 3px)}.camera-overlay,.screen-bottom{position:absolute;left:12px;right:12px;display:flex;justify-content:space-between;font:9px var(--mono);color:#c7d8b7}.camera-overlay{top:12px}.screen-bottom{bottom:12px;font-size:7px}#scene-message{position:absolute;inset:0;display:grid;place-items:center;font:16px var(--mono);letter-spacing:3px}#subtitle{position:absolute;left:8%;right:8%;bottom:34px;text-align:center;font-size:10px;background:#000a}#subtitle:empty{display:none}.camera-tabs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px;margin:9px 0 20px}.camera-tab{padding:8px 5px;font-size:9px}.camera-tab small{display:block;font:8px var(--mono);margin-bottom:3px}.camera-tab.active{border-color:#b1c88e;background:#35462a}.rule-panel{background:#c9c4a9;color:#32382c;padding:24px}.paper-top{display:flex;justify-content:space-between;font-size:9px;border-bottom:1px solid #5a604a66;padding-bottom:10px}.rule-panel h2{font:600 22px 'Noto Serif TC',serif;margin-top:22px}.rule-panel>p{font-size:11px}.rule-panel ol{padding-left:22px}.rule-panel li{font-size:13px;line-height:1.9;padding-left:5px;margin-bottom:16px}.rule-panel li.active{color:#842e20;font-weight:600}.paper-warning{border-top:1px solid #7b8067;padding-top:12px;color:#7d4232}.parcel{background:#b7a484!important;color:#332719!important;border:1px dashed #716045!important}.badge{display:block;margin-top:12px;padding:12px;background:#c3ceb2;color:#263222;font-family:var(--mono);letter-spacing:2px}dialog{width:min(500px,calc(100% - 32px));padding:35px 38px;border:1px solid #7b8c695e;background:linear-gradient(150deg,#223023f7,#101a14fa);color:var(--text);text-align:center;box-shadow:0 30px 100px #0009;max-height:90dvh;overflow:auto}dialog::backdrop{background:#0309058c;backdrop-filter:blur(5px)}.modal-kicker{font:8px var(--mono);letter-spacing:2px;color:#adbd9a}.modal-symbol{font:42px 'Noto Serif TC',serif;width:66px;height:74px;border:1px solid #98aa7d66;display:grid;place-items:center;margin:25px auto 20px;color:#cad9ae}dialog h2{font:600 34px/1.5 'Noto Serif TC',serif;letter-spacing:3px;margin:10px 0 18px}dialog p{font-size:13px;line-height:2;color:#bac5af;white-space:pre-line}.welcome-details{display:flex;flex-direction:column;gap:8px;margin:22px 0;font-size:11px;color:#becbac}.comfort{display:flex;align-items:center;justify-content:center;gap:8px;font-size:11px;min-height:44px;margin-bottom:14px}.comfort input{width:17px;height:17px;accent-color:#bacc9a}.primary{display:block;width:100%;background:#c5d4ab;color:#202b1a;font-weight:600;border-color:#c5d4ab}.primary:hover{background:#dceac5}.text-button{border:0;background:transparent;font-size:12px;color:#b0bf9c}dialog small{display:block;color:#9ba88d;font-size:9px;margin-top:15px}#ending-score{font:12px var(--mono);color:#c6d7ac;margin:23px 0}body.panel-open #interaction-hint,body.panel-open #crosshair{display:none}body.panel-open .shift-panel{opacity:0}#death-veil{position:fixed;inset:0;background:#000;opacity:0;pointer-events:none;z-index:8}#death-caption{position:fixed;left:0;right:0;top:48%;text-align:center;z-index:9;pointer-events:none;font:500 25px 'Noto Serif TC',serif;letter-spacing:6px;opacity:0;transition:opacity 1s}body.dying header,body.dying main{visibility:hidden}body.dying #death-veil{pointer-events:auto}body.death-dark #death-veil{opacity:1;transition:opacity 2.4s ease-in}body.death-dark #death-caption{opacity:1;transition-delay:1.9s}body.death-ended #death-caption{opacity:0;transition:none}body.death-ended #ending{background:#050706;border-color:#3d4536}body.death-ended #ending::backdrop{background:transparent;backdrop-filter:none}
@media(max-width:700px){header{padding:16px}.brand{gap:8px}.brand-mark{font-size:23px;padding:2px 7px}.brand b{font-size:15px;letter-spacing:2px}.brand small{font-size:6px;letter-spacing:.5px}.header-right{gap:5px}.header-right .live-label{display:none}.header-right button{padding:7px 9px;min-width:38px}#pause{font-size:0}#pause:after{content:'Ⅱ';font-size:15px}select{font-size:11px;max-width:90px;padding:4px}.location{top:88px;left:18px;font-size:8px}.objective{left:16px;bottom:151px;width:calc(100% - 156px);padding:13px 14px}.objective h1{font-size:16px}.objective p{font-size:10px}.objective .eyebrow{font-size:8px}.shift-panel{right:17px;bottom:158px;width:109px}.shift-panel .eyebrow{font-size:8px}.time{font-size:33px}.time-caption{font-size:8px}.movement-help{left:17px;right:17px;bottom:19px;font-size:8px}.movement-help>span{max-width:160px;line-height:1.6}.movement-help button{font-size:10px}.touch-controls{position:fixed;left:18px;bottom:69px;display:grid;grid-template-columns:repeat(3,40px);grid-template-rows:repeat(2,34px);gap:3px}.touch-controls button{padding:0;min-height:34px;background:#142119b3;touch-action:none}.touch-controls button:first-child{grid-column:2}.touch-controls button:nth-child(2){grid-column:1;grid-row:2}.touch-controls button:nth-child(3){grid-column:2;grid-row:2}.touch-controls button:nth-child(4){grid-column:3;grid-row:2}#touch-interact{display:block;position:fixed;right:23px;bottom:84px;width:63px;height:48px;background:#2b3a24cb;border-color:#adc28e66;font-size:12px;touch-action:none}#interaction-panel{top:80px;right:12px;bottom:12px;width:calc(100vw - 24px);padding:18px}body.panel-open .objective,body.panel-open .touch-controls,body.panel-open #touch-interact,body.panel-open .movement-help{display:none}dialog{padding:27px 23px}dialog h2{font-size:30px}.modal-symbol{margin:18px auto 13px;width:57px;height:64px;font-size:37px}}
@media(max-height:550px){header{padding:12px 18px}.location{display:none}.objective{bottom:64px}.shift-panel{bottom:70px}.movement-help{bottom:10px}#interaction-panel{top:70px}dialog{padding:20px}dialog .modal-symbol{display:none}dialog h2{font-size:25px;margin:5px}.welcome-details{margin:10px 0}.comfort{margin-bottom:8px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}.scanlines{background:none}}
@media(max-width:700px){.touch-controls{grid-template-columns:repeat(3,44px);grid-template-rows:repeat(2,44px)}.touch-controls button{min-height:44px}.objective{bottom:177px}.shift-panel{bottom:184px}.objective button,.movement-help button,.panel-top button{min-height:44px}}
#welcome-language{display:block;margin:0 0 12px auto;max-width:140px}
/* Quiet, institutional typography and restrained hardware feedback. */
:root{--text:#e7e5dd;--muted:#adb3ad;--green:#ccd0b7;--line:#b9beb32e}
.vignette{background:linear-gradient(#080e124d,transparent 22%,transparent 62%,#090e14a6);box-shadow:inset 0 0 150px 15px #0005}
.brand-mark{color:#e4dfcd;border-color:#a9a99a}.objective{background:linear-gradient(120deg,#171c1de8,#11191bcc);border-left-color:#b6b5a0;box-shadow:0 8px 36px #0002}
.objective h1{letter-spacing:1.4px}.objective p{line-height:1.9;color:#c4c7bf}
#monitor-shortcut{margin-left:6px}#phase-label{font:9px/1.7 var(--mono);color:#b0b6b0;margin-top:13px;letter-spacing:.7px}
.location{flex-wrap:wrap;max-width:70vw}#chapter-label{border-left:1px solid #b3b7a65c;padding-left:12px;color:#dedecf}
#interaction-panel{background:#151b1dee;border-color:#89958e55;box-shadow:0 15px 90px #0009}.panel-top{position:sticky;top:-22px;background:#151b1df5;z-index:2;padding-top:10px}
.event-card h2{font-size:23px}.event-card p{color:#c1c7bf}.desk-controls button{background:#222b2a}.desk-controls b{letter-spacing:1px}.rule-panel{background:radial-gradient(ellipse at 90% 15%,#a4947433,transparent 45%),#c9c5b0}
button{transition:background 160ms ease,transform 120ms cubic-bezier(.23,1,.32,1)}button:active:not(:disabled){transform:scale(.98)}
#deadline-bar{width:100%!important;transform-origin:left;transition:transform 200ms linear;background:#c9c5ad}.urgent #phase-label{color:#e7ad91}.urgent #deadline-bar{background:#d9a487}.urgent .objective{border-left-color:#d9a487}
.blackout .objective{background:#0b1115ed}.blackout #phase-label{color:#c1ced4}body.comfort .scanlines{background:none}
dialog{background:radial-gradient(ellipse at top,#303735,#11191bf7 75%);border-color:#8e95815c}.modal-kicker{color:#c0bfae}.primary{background:#cfceba;border-color:#cfceba;color:#252924}
@media(max-width:700px){#chapter-label{display:none}.objective{width:calc(100% - 146px);padding:12px}.objective p{font-size:11px}.objective button{padding:7px 9px;font-size:11px}#monitor-shortcut{margin:6px 0 0;display:block}#phase-label{font-size:8px;margin-top:8px}.panel-top{top:-18px}}
@media(max-height:550px){.objective{bottom:65px}.objective p{display:none}#phase-label{margin-top:5px}.objective button{min-height:36px}#monitor-shortcut{display:inline-block;margin:0 0 0 4px}}
.touch-controls{grid-template-columns:none;grid-template-rows:none;gap:0}
#joystick{width:116px;height:116px;position:relative;border-radius:50%;border:1px solid #d6ddc45c;background:radial-gradient(circle,#77827420 0 44%,#101b1970 45%);box-shadow:inset 0 0 0 10px #c0ccac08,0 3px 22px #0003;touch-action:none;user-select:none;-webkit-user-select:none}
#joystick:before,#joystick:after{content:'';position:absolute;pointer-events:none;background:#c9d1b51f}#joystick:before{width:1px;top:14px;bottom:14px;left:50%}#joystick:after{height:1px;left:14px;right:14px;top:50%}
.joystick-knob{position:absolute;left:35px;top:35px;width:44px;height:44px;border-radius:50%;border:1px solid #c1cbb47d;background:radial-gradient(circle at 40% 30%,#758276e8,#303e39f0);box-shadow:0 4px 12px #0007;transition:transform 140ms cubic-bezier(.23,1,.32,1);pointer-events:none;z-index:1}
.engaged .joystick-knob{transition:none;border-color:#e0e4c7}.engaged{border-color:#d6ddc4!important}
#audit-shortcut{display:block;margin:8px 0 0;color:#ead2a5;border-color:#aa896b;background:#342c22}#audit-shortcut[hidden]{display:none!important}
#panel-tasks{display:flex;gap:6px;margin:-4px 0 20px;position:sticky;top:40px;background:#151b1df5;z-index:2;padding:6px 0}#panel-tasks button{font-size:11px;flex:1;padding:8px}#panel-audit{color:#ead2a5}
#archive-code{padding:12px;background:#0e1718;color:#e4dfd0;border:1px solid #778676;border-radius:3px;font:18px var(--mono);letter-spacing:6px;width:100%;min-height:48px}
#collect-clue{margin-top:12px;width:100%;text-align:left}.rule-panel #collect-clue{color:#eef0dc;background:#374339}
#welcome-guide{font-size:11px;text-align:left;border-left:1px solid #b0b6a36b;padding-left:12px;line-height:1.8}.movement-help{gap:8px}.movement-help>span{margin-right:auto}.overlap .objective{border-color:#d3a677}
.clue-reader{white-space:pre-line}.panel-open .objective{pointer-events:none}
@media(pointer:coarse){.touch-controls{display:block;position:fixed;left:max(20px,env(safe-area-inset-left));bottom:70px}#touch-interact{display:block;position:fixed;right:max(24px,env(safe-area-inset-right));bottom:90px;width:66px;height:66px;border-radius:50%;background:#2b3a24cb;border-color:#adc28e66;font-size:13px;touch-action:none}}
@media(max-width:700px){.touch-controls{display:block;left:20px;bottom:70px}.objective{bottom:202px;width:calc(100% - 32px);padding:12px 14px}.objective h1{font-size:17px;display:inline;margin-right:12px}.objective>.eyebrow{margin-bottom:6px}.objective p{max-width:none;margin:6px 0 10px;font-size:11px;min-height:0}.objective button{display:inline-block!important;margin:0 5px 0 0!important;min-height:44px}.objective button[hidden]{display:none!important}.objective #phase-label{margin-top:8px}.shift-panel{right:19px;bottom:auto;top:116px;width:108px;pointer-events:none}.shift-panel .time{font-size:29px}.shift-panel .time-caption{font-size:8px}.shift-panel #sanity-bars{display:none}.movement-help>span{font-size:8px;max-width:155px}.movement-help button{padding:8px;font-size:10px}#interaction-panel{top:76px}#panel-tasks{top:37px}#event-source{font-size:8px;max-width:62%;text-align:right}}
@media(max-height:550px){.objective{left:18px;bottom:24px;width:min(380px,calc(100% - 310px))}.objective p{display:none}.objective #phase-label{font-size:8px}.shift-panel{top:82px;right:20px;bottom:auto}.movement-help>span{display:none}.movement-help{bottom:auto;top:18px;left:40%;right:auto}.touch-controls{bottom:28px;left:20px}body:has(.touch-controls:not([hidden])) .objective{left:158px;bottom:28px;width:calc(100% - 270px)}#touch-interact{bottom:45px}.location{display:none}.objective h1{font-size:15px}.objective button{font-size:10px;padding:7px;min-height:38px}}
@media(prefers-reduced-motion:reduce){.joystick-knob{transition:none}}
