:root{color-scheme:light;font-family:"Yu Gothic",Meiryo,sans-serif;font-synthesis:none;background:#f3f1eb;color:#373831}*{box-sizing:border-box}body{margin:0}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,canvas:focus-visible{outline:2px solid #939c7b;outline-offset:5px}[hidden]{display:none!important}.screen{min-height:100svh;min-height:100dvh}.title-screen{display:flex;align-items:center;justify-content:center;text-align:center;padding:65px 24px 90px;position:relative;background:radial-gradient(ellipse at 50% 35%,#fcfbf6,#f0eee6)}.title-content{width:min(100%,360px)}.edition{font-size:10px;letter-spacing:2px;color:#929287;margin-bottom:35px}h1{font-family:serif;font-weight:400;font-size:48px;letter-spacing:12px;margin:0;white-space:nowrap}h1 span{font-size:13px;letter-spacing:1px;margin-left:2px}.title-rule{width:27px;height:1px;background:#b4b6a8;margin:29px auto}.howto{font-size:12px;line-height:2.1;letter-spacing:1px}.howto span{font-size:10px;letter-spacing:.4px;color:#8a8a7f}.warning{font-size:10px;color:#77796b;line-height:1.8;margin:24px 0 30px}.primary{background:#3d4538;color:#f7f7ef;border:1px solid #3d4538;min-height:48px;min-width:190px;padding:12px 28px;font-size:13px;letter-spacing:4px}.primary:disabled{opacity:.5;cursor:wait}.load-status{font-size:10px;color:#818475;min-height:18px;margin:12px 0 20px}.setting{font-size:10px;color:#6e7566;display:flex;align-items:center;justify-content:center;gap:6px}.setting input{accent-color:#59644a;width:14px;height:14px}.setting span{color:#92988a;font-size:9px}.old-demo{position:absolute;bottom:58px;color:#999d91;font-size:9px;text-underline-offset:4px;letter-spacing:.5px}.game-screen{background:#151916;color:#c9cec1;display:flex;flex-direction:column;padding:max(12px,env(safe-area-inset-top)) 18px max(48px,calc(36px + env(safe-area-inset-bottom)));height:100svh;height:100dvh;min-height:440px;overflow:hidden}.game-top{display:flex;align-items:center;justify-content:space-between;width:min(100%,500px);margin:0 auto;flex:none;height:37px}.quiet-brand{font-family:serif;letter-spacing:4px;font-size:13px;color:#a8afa0}.text-button{border:0;background:transparent;color:#8e9887;font-size:10px;padding:10px 0 10px 20px}.scene-wrap{min-height:0;flex:1;display:flex;align-items:center;justify-content:center;padding:12px 0}.surface{position:relative;aspect-ratio:5/6;width:min(100%,500px);max-height:100%;height:auto;overflow:hidden;background:#292d25;border:1px solid #ffffff0c;box-shadow:0 8px 40px #0003}.surface canvas{position:absolute;inset:0;width:100%;height:100%;display:block}#dirt{touch-action:none;cursor:none}.action-slot{height:55px;display:flex;align-items:center;justify-content:center;flex:none}.game-button{min-height:42px;min-width:160px;border:1px solid #929e7c;background:#c6cdb7;color:#293022;font-size:12px;letter-spacing:4px;padding:10px 24px;animation:appear .5s ease both}.brush-cursor{position:absolute;left:0;top:0;width:62px;height:62px;border:1px solid #efefcf70;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;opacity:0;transition:opacity .2s;background:#ffffff03}.sheen{pointer-events:none;position:absolute;inset:0;opacity:0;box-shadow:inset 0 0 70px #e3eadc4a;transition:opacity .45s}.sheen.active{opacity:1}.transition{position:fixed;inset:0;background:#060706;z-index:20;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .8s ease,visibility 0s .8s;pointer-events:none}.transition.active{opacity:1;visibility:visible;transition:opacity .8s ease;pointer-events:all}.transition p{color:#e4e5de;font-family:serif;font-size:16px;letter-spacing:3px;opacity:0;transition:opacity .55s ease;padding:24px;text-align:center}.transition p.visible{opacity:1}#copyright{position:fixed;bottom:max(12px,env(safe-area-inset-bottom));left:0;right:0;text-align:center;font-size:9px;letter-spacing:1px;color:#7f8476;z-index:30;pointer-events:none;line-height:1.5}body.dark #copyright{color:#a1a99a}body.transitioning #copyright{color:#9b9e94}.end-screen{display:grid;place-items:center;background:#f3f1eb;text-align:center;padding:40px 24px}.end-title{font-family:serif;font-size:23px;letter-spacing:3px}.end-copy{font-size:11px;color:#838779;margin:20px 0 35px}.sr-only{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}dialog{background:#f0f0e8;color:#333a2b;border:1px solid #89937d;padding:28px;width:min(320px,calc(100% - 40px))}dialog::backdrop{background:#000a}dialog h2{font-family:serif;font-weight:400;font-size:19px;margin:0 0 20px;letter-spacing:3px}dialog button{display:block;width:100%;background:transparent;border:1px solid #b1b8a5;padding:13px;margin:10px 0;font-size:12px}dialog p{font-size:9px;color:#7b8470;line-height:1.8;margin:20px 0 0}@keyframes appear{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@media(max-width:350px){h1{font-size:40px;letter-spacing:9px}.game-screen{padding-left:10px;padding-right:10px}.transition p{font-size:14px;letter-spacing:2px}}@media(prefers-reduced-motion:reduce){.transition,.transition p,.brush-cursor,.sheen{transition-duration:.15s}.game-button{animation:none}}

.surface{aspect-ratio:1/1}.scene-wrap{overflow:hidden}
.end-screen{background:#050505;color:#eee}.end-copy:empty{display:none}
.surface.late-stage{animation:room-flicker 17s linear infinite}
body.no-flicker .surface{animation:none}
@keyframes room-flicker{0%,88%,90%,92%,100%{filter:brightness(1)}89%,91%{filter:brightness(.83)}}
@media(prefers-reduced-motion:reduce){.surface.late-stage{animation:none}}

/* Progressive room decay affects imagery, leaving controls readable. */
.surface{isolation:isolate}
.surface canvas{filter:brightness(var(--scene-brightness,1))}
.surface.late-stage{animation:fluorescent-wear 13.7s linear infinite}
@keyframes fluorescent-wear{0%,68%,71%,74%,94%,100%{filter:brightness(1)}69%,72%{filter:brightness(var(--flicker-depth,.8))}70%,73%{filter:brightness(.94)}95%{filter:brightness(.88)}}
.scene-grain{position:absolute;inset:0;pointer-events:none;z-index:2;opacity:var(--grain-opacity,0);mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.88' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23aaa' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.brush-cursor{z-index:5;border-color:#ffffffba;box-shadow:0 0 0 1px #0008}
.surface::after{content:"";position:absolute;inset:0;background:#000;opacity:0;pointer-events:none;z-index:8;transition:opacity .4s ease}
.surface.cut-black::after{opacity:1}
.share-button{display:inline-block;color:#eee;border:1px solid #72776d;padding:13px 24px;text-decoration:none;font-size:12px;letter-spacing:1px}
.end-copy{margin:28px 0}.end-title{font-size:clamp(18px,5vw,23px)}
@media(prefers-reduced-motion:reduce){.surface.late-stage{animation:none}.surface::after{transition-duration:.12s}}

.title-settings{position:absolute;top:max(18px,env(safe-area-inset-top));left:16px;right:16px;display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.setting-toggle{font-size:10px;min-height:38px;padding:8px 12px;border:1px solid #a4aa99;background:transparent;color:inherit}
.setting-toggle[aria-pressed=true]{background:#dbe0d1;color:#263022}
.title-screen{padding-top:110px}
.scene-image{position:absolute;inset:0;transform-origin:50% 28%}
body.reduced-light .surface{animation:none!important}
body.reduced-light .surface canvas{filter:brightness(1)}
body.reduced-light .scene-grain{opacity:0}
body.reduced-light .sheen{display:none}
#copyright{display:flex;justify-content:center;align-items:center;gap:12px;pointer-events:none}
#stream-info{pointer-events:auto;background:transparent;border:0;color:inherit;font-size:9px;text-decoration:underline;text-underline-offset:3px;padding:5px}
#stream-dialog{max-height:80dvh;overflow:auto}#stream-dialog p{font-size:12px;line-height:1.9;color:inherit}#stream-dialog a{color:inherit;text-underline-offset:3px}
.end-screen .share-button{box-sizing:border-box;display:block;width:220px;min-height:46px;margin:12px auto;background:transparent;border:1px solid #72776d;color:#eee;font:inherit;font-size:12px;letter-spacing:1px;text-align:center;padding:13px 18px;text-decoration:none}
.end-copy{margin:26px 0 0}
#copyright{flex-direction:column;gap:2px}.footer-links{display:flex;align-items:center;justify-content:center;gap:12px}.fiction-note{font-size:8px;letter-spacing:0;line-height:1.6;padding:0 8px}.game-screen{padding-bottom:max(64px,calc(52px + env(safe-area-inset-bottom)))}

/* Strong, irregular fluorescent dropouts, increasingly dark in later stages. */
.surface.late-stage{animation:fluorescent-dropout 9.3s linear infinite}
@keyframes fluorescent-dropout{
0%,39%,44%,62%,69%,86%,93%,100%{filter:brightness(1)}
40%,43%{filter:brightness(.16)}
41%,45%{filter:brightness(.7)}
63%,68%{filter:brightness(.06)}
64%,67%{filter:brightness(.42)}
87%,92%{filter:brightness(.12)}
88%,91%{filter:brightness(.55)}
}
@media(prefers-reduced-motion:reduce){.surface.late-stage{animation:none}}

:root{color-scheme:dark;background:#000;color:#deded8}
body,.title-screen,.game-screen,.end-screen{background:#000}
.title-screen{color:#deded8}
.title-rule{background:#77796f}
.howto span,.warning,.load-status{color:#999d93}
.title-settings .setting-toggle{border-color:#686d62;color:#cbd0c2}
.title-settings .setting-toggle[aria-pressed=true]{background:#dbe0d1;color:#263022}
.primary{background:#292f25;border-color:#78816b;color:#f3f3ec}
dialog{color-scheme:dark;background:#141612;color:#deded8;border-color:#727a66}
dialog p{color:#a7ad9e}
#copyright,body.dark #copyright{color:#93998b}

/* Dissolve the photograph's perimeter into the surrounding darkness. */
.surface{border:0;box-shadow:none;background:#000}
.edge-fade{position:absolute;inset:-1px;z-index:4;pointer-events:none;background:linear-gradient(to right,#000,transparent 9%,transparent 91%,#000),linear-gradient(to bottom,#000,transparent 9%,transparent 91%,#000);box-shadow:inset 0 0 22px 5px #0009}
.surface #wipe-trail{z-index:3;pointer-events:none;filter:none;mix-blend-mode:screen}
body.reduced-light #wipe-trail{opacity:.45}

.edge-fade{background:linear-gradient(to right,#000b,transparent 3%,transparent 97%,#000b),linear-gradient(to bottom,#000b,transparent 3%,transparent 97%,#000b);box-shadow:none}

@keyframes fluorescent-dropout{
0%,39%,44%,62%,69%,86%,93%,100%{filter:brightness(1)}
40%,43%{filter:brightness(.76)}
41%,45%{filter:brightness(.92)}
63%,68%{filter:brightness(.68)}
64%,67%{filter:brightness(.86)}
87%,92%{filter:brightness(.74)}
88%,91%{filter:brightness(.9)}
}

.transition{background:#000}
.end-screen>div{width:100%;max-width:430px;transform:translateY(-4vh)}
.end-screen .end-title{font-family:serif;font-size:clamp(24px,6vw,30px);font-weight:400;letter-spacing:3px;color:#e4e4df;line-height:1.7;margin:0;opacity:0;transition:opacity 1.5s ease}
.end-screen.message-visible .end-title{opacity:1}
.end-controls{margin-top:clamp(60px,14vh,130px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity 1.2s ease}
.end-screen.controls-visible .end-controls{opacity:1;visibility:visible;pointer-events:auto}
.end-screen .end-copy{margin:0}
.end-screen .share-button{font-size:12px;width:210px;border-color:#666963;color:#c8cbc3;background:transparent}
.end-links{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:10px;color:#62665e}
.end-screen .end-link{border:0;background:transparent;color:#979d90;font:inherit;font-size:11px;min-height:44px;min-width:88px;padding:12px 8px;cursor:pointer}
body.end-blackout #copyright{visibility:hidden}
#copyright,body.dark #copyright{color:#747a6e;font-size:8px}
.fiction-note{font-size:7px}
@media(max-height:560px){.end-screen>div{transform:none}.end-controls{margin-top:35px}.end-screen{padding-top:30px;padding-bottom:75px}}

/* Quiet title layout; all changes scoped away from gameplay and ending. */
.title-screen{padding:100px 20px 92px;min-height:100svh;min-height:100dvh}
.title-content{width:min(100%,380px);transform:translateY(-2vh)}
.title-content h1{font-family:serif;font-size:48px;font-weight:400;letter-spacing:.13em;text-indent:.13em;line-height:1.35;color:#e4e4df;margin:0 0 clamp(38px,7vh,64px)}
.title-content .howto{font-size:12px;line-height:1.9;letter-spacing:.025em;margin:0;text-align:center}
.title-content .howto span{display:inline-block;font-size:10px;letter-spacing:.015em;color:#979b93;margin-top:7px}
.title-content .warning{font-size:10px;letter-spacing:.015em;color:#82877d;line-height:1.8;margin:23px 0 32px}
.title-content .primary{width:210px;min-width:0;min-height:48px;background:transparent;border:1px solid #666963;color:#deded8;font-size:12px;letter-spacing:2px;padding:13px 18px}
.title-content .jumpscare-note{font-size:9px;color:#82877d;letter-spacing:.02em;line-height:1.8;margin:14px 0 0}
.title-content .load-status{min-height:0;font-size:9px;margin:10px 0 0}
.title-content .load-status:empty{display:none}
.title-settings{top:max(18px,env(safe-area-inset-top));gap:10px;flex-wrap:nowrap}
.title-settings .setting-toggle{font-size:10px;min-height:44px;padding:8px 12px;border:1px solid #3e433b;color:#92988a;white-space:nowrap;background:transparent}
.title-settings .setting-toggle[aria-pressed=true]{background:#171a15;border-color:#777f6d;color:#d1d6c9}
@media(max-width:350px){
.title-content h1{font-size:44px;letter-spacing:.1em}
.title-content .howto{font-size:11px;letter-spacing:0}
.title-content .howto span,.title-content .warning{font-size:9px}
.title-settings{gap:8px;left:10px;right:10px}
.title-settings .setting-toggle{font-size:9px;padding:8px 10px}
}
@media(max-height:640px){
.title-screen{padding-top:82px;padding-bottom:82px}
.title-content{transform:none}
.title-content h1{margin-bottom:28px}
.title-content .warning{margin:16px 0 22px}
}
@media(max-height:480px){
.title-screen{padding-top:72px;padding-bottom:78px}
.title-content h1{font-size:36px;margin-bottom:15px}
.title-content .warning{margin:9px 0 12px}
.title-content .jumpscare-note{margin-top:12px}
}
.game-screen .action-slot{position:fixed;left:0;right:0;bottom:auto;height:55px;z-index:6;pointer-events:none}.game-screen .action-slot button{pointer-events:auto}
