:root{--ink:#e8e4d5;--muted:#9e9a8f;--line:rgba(238,233,214,.18);--panel:rgba(8,10,10,.88);--accent:#c6d6b5;--red:#7d2e2e}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#030405;color:var(--ink);font-family:"Courier New",monospace;touch-action:none}button{font:inherit;color:inherit}
#game,#render{position:absolute;inset:0}#render canvas{position:absolute;inset:0;width:100%!important;height:100%!important;image-rendering:pixelated;image-rendering:crisp-edges}
#noise,#scanlines,#refresh,#vignette,#damage{position:absolute;inset:0;pointer-events:none;z-index:4}
#cinema-top,#cinema-bottom{position:absolute;left:0;right:0;height:0;background:#020303;z-index:14;pointer-events:none;transition:height .35s ease}#cinema-top{top:0}#cinema-bottom{bottom:0}.cinematic #cinema-top,.cinematic #cinema-bottom{height:9vh}.cinematic #crosshair{opacity:0}.cinematic #hud{opacity:.18}
#location-card{position:absolute;z-index:13;left:50%;top:13vh;transform:translateX(-50%);padding:10px 16px;background:rgba(5,7,7,.72);border-top:1px solid rgba(255,255,255,.16);border-bottom:1px solid rgba(255,255,255,.16);text-align:center;pointer-events:none}#location-card small{display:block;font-size:8px;letter-spacing:.24em;color:#9c9b92}#location-card b{display:block;margin-top:4px;font-size:13px;letter-spacing:.14em}
#noise{opacity:.11;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.42'/%3E%3C/svg%3E");mix-blend-mode:soft-light}
#scanlines{background:repeating-linear-gradient(to bottom,rgba(255,255,255,.025) 0 1px,rgba(0,0,0,.055) 2px 4px);opacity:.55;mix-blend-mode:overlay}
#refresh{top:-22%;height:20%;background:linear-gradient(transparent,rgba(220,255,230,.02),rgba(255,255,255,.09),rgba(220,255,230,.015),transparent);animation:sweep 5.6s linear infinite;mix-blend-mode:screen}@keyframes sweep{to{transform:translateY(720%)}}
#vignette{background:radial-gradient(circle at center,transparent 33%,rgba(0,0,0,.22) 62%,rgba(0,0,0,.83) 100%);transition:.5s}#damage{background:#7b1111;opacity:0;mix-blend-mode:screen;transition:.15s}
#crosshair{position:absolute;z-index:8;left:50%;top:50%;transform:translate(-50%,-50%);font-size:18px;color:rgba(255,255,255,.7);text-shadow:0 1px 4px #000;pointer-events:none}.hidden{display:none!important}.panel{background:var(--panel);border:1px solid var(--line);box-shadow:0 12px 30px rgba(0,0,0,.32)}
#hud{position:absolute;inset:0;z-index:10;pointer-events:none;transition:opacity .25s}#audio-toggle,#flashlight-toggle{position:absolute;right:18px;padding:7px 10px;pointer-events:auto;cursor:pointer;background:rgba(8,10,10,.78);font-size:9px;letter-spacing:.08em}#audio-toggle{top:58px}#flashlight-toggle{top:92px}#quest{position:absolute;left:18px;top:18px;width:min(430px,calc(100vw - 36px));padding:13px 15px}#quest small,.window small,.title-card small,#chapter-card small{display:block;font-size:10px;letter-spacing:.18em;color:var(--accent);font-weight:bold}#quest b{display:block;margin:4px 0 5px;font-size:17px}#quest span{display:block;font-size:11px;line-height:1.35;color:var(--muted)}#day-card{position:absolute;right:18px;top:18px;padding:10px 12px;display:flex;gap:18px;font-size:11px}#prompt{position:absolute;bottom:78px;left:50%;transform:translateX(-50%);padding:9px 13px;display:flex;gap:9px;align-items:center;white-space:nowrap;font-size:12px}#prompt b{border:1px solid rgba(255,255,255,.3);padding:2px 6px;background:#111}#held-item{position:absolute;right:18px;bottom:18px;display:flex;align-items:center;gap:8px;background:rgba(0,0,0,.58);padding:7px 9px;border:1px solid var(--line);font-size:10px}#held-item img{width:36px;height:36px;image-rendering:pixelated}
#dialogue{position:absolute;z-index:15;left:50%;bottom:20px;transform:translateX(-50%);width:min(820px,calc(100vw - 30px));min-height:145px;background:rgba(5,6,7,.96);border:1px solid rgba(238,233,214,.25);display:flex;gap:14px;padding:14px;box-shadow:0 20px 50px rgba(0,0,0,.6)}.portrait-wrap{width:112px;height:112px;flex:0 0 auto;border:1px solid var(--line);padding:6px;background:#111}.portrait-wrap img{width:100%;height:100%;image-rendering:pixelated;object-fit:cover}.dialogue-copy{position:relative;flex:1;padding:4px 4px 24px}#speaker{font-weight:bold;color:var(--accent);font-size:13px;margin-bottom:9px;text-transform:uppercase}#dialogue-text{font-size:14px;line-height:1.48;white-space:pre-wrap}#continue{position:absolute;right:3px;bottom:0;color:#777;font-size:10px}
.modal{position:absolute;z-index:22;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.52)}.window{width:min(720px,calc(100vw - 28px));padding:20px;border:1px solid var(--line);background:rgba(8,9,9,.96);box-shadow:0 30px 80px rgba(0,0,0,.62)}.window-head{display:flex;align-items:flex-start;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:12px;margin-bottom:14px}.window h2{margin:4px 0 0}.window-head button{width:38px;height:38px;background:transparent;border:1px solid var(--line);font-size:23px;cursor:pointer}.book{background:linear-gradient(90deg,rgba(55,44,32,.97),rgba(79,64,45,.97) 49.4%,rgba(46,37,28,.98) 50%,rgba(68,55,39,.97))}#inventory-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:9px;min-height:210px}.slot{border:1px solid rgba(255,255,255,.14);background:rgba(0,0,0,.22);padding:9px;min-height:128px}.slot img{display:block;width:55px;height:55px;image-rendering:pixelated;margin:0 auto 7px}.slot b{display:block;font-size:11px}.slot span{display:block;color:#c3b8a6;font-size:9px;line-height:1.3;margin-top:5px}.empty{opacity:.25;border-style:dashed}.book p{font-size:10px;color:#c4bba9;margin-bottom:0}
.qte-box{text-align:center;max-width:540px}.qte-box h2{margin:8px 0}.qte-box p{color:var(--muted);font-size:11px;min-height:30px}#qte-track{height:34px;position:relative;margin:24px 0 10px;border:1px solid var(--line);background:#040505;overflow:hidden}#qte-zone{position:absolute;top:0;bottom:0;left:41%;width:18%;background:rgba(198,214,181,.24);border-left:1px solid rgba(198,214,181,.75);border-right:1px solid rgba(198,214,181,.75)}#qte-marker{position:absolute;top:-2px;bottom:-2px;width:5px;background:#eee;box-shadow:0 0 12px #fff}#qte-count{font-size:10px;color:#888;margin-bottom:12px}#qte-button{padding:11px 26px;background:#182018;border:1px solid rgba(198,214,181,.5);cursor:pointer}
.no-input{pointer-events:none}.memory-box{max-width:590px;text-align:center;background:rgba(0,0,0,.82);padding:25px;border-top:1px solid rgba(255,255,255,.16);border-bottom:1px solid rgba(255,255,255,.16)}#memory-kicker{font-size:9px;color:#d5b8b8;letter-spacing:.2em}#memory-text{font-size:20px;line-height:1.45;margin-top:10px;text-shadow:0 2px 3px #000}
.screen{position:absolute;inset:0;z-index:30;display:grid;place-items:center;padding:20px;background:radial-gradient(circle at center,rgba(19,22,21,.68),rgba(2,3,3,.96))}.title-card{width:min(780px,100%);text-align:center}.title-card h1{font-size:clamp(35px,7vw,78px);line-height:.88;letter-spacing:-.065em;margin:18px 0;text-shadow:0 9px 34px #000}.title-card h1 em{font-style:normal;color:#aab49d}.title-card p{max-width:590px;margin:0 auto 25px;color:#aaa;line-height:1.5}.title-card button{min-width:220px;padding:14px 24px;border:0;background:#dfe2d3;color:#0c100d;font-weight:bold;cursor:pointer}.controls{font-size:9px;color:#6f756f;line-height:1.55;margin-top:18px}#chapter-card{background:#050606;z-index:27;text-align:center}#chapter-card h2{font-size:46px;letter-spacing:.22em;margin:10px 0 8px}#chapter-card p{color:#777;max-width:550px}.ending-card h1{font-size:clamp(28px,6vw,64px)}
#mobile{position:absolute;z-index:18;inset:0;pointer-events:none;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}#stick{pointer-events:auto;touch-action:none;position:absolute;left:max(18px,env(safe-area-inset-left));bottom:max(22px,env(safe-area-inset-bottom));width:124px;height:124px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.035) 0 42%,rgba(0,0,0,.28) 44% 100%);border:1px solid rgba(255,255,255,.27);box-shadow:inset 0 0 24px rgba(0,0,0,.28);transition:border-color .12s,background .12s}#stick.active{border-color:rgba(210,225,200,.58);background:radial-gradient(circle,rgba(206,222,195,.08) 0 42%,rgba(0,0,0,.32) 44% 100%)}#stick-knob{pointer-events:none;position:absolute;left:36px;top:36px;width:52px;height:52px;border-radius:50%;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.34);box-shadow:0 4px 16px rgba(0,0,0,.35);will-change:transform}#mobile button{pointer-events:auto;touch-action:none;position:absolute;border-radius:50%;background:rgba(0,0,0,.48);border:1px solid rgba(255,255,255,.30);font-weight:bold;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}#mobile button.active{background:rgba(180,195,168,.22);border-color:rgba(220,230,208,.62);transform:scale(.96)}#mobile-action{width:76px;height:76px;right:max(18px,env(safe-area-inset-right));bottom:max(23px,env(safe-area-inset-bottom))}#mobile-inventory{width:54px;height:54px;right:105px;bottom:max(29px,env(safe-area-inset-bottom))}#mobile-flashlight{width:52px;height:52px;right:108px;bottom:94px;font-size:20px}#mobile-run{width:54px;height:54px;right:42px;bottom:112px;font-size:21px}#render canvas{touch-action:none;-webkit-user-select:none;user-select:none}
@media(max-width:800px),(pointer:coarse){#dialogue{bottom:147px;min-height:132px}.portrait-wrap{width:92px;height:92px}#prompt{bottom:152px}#day-card{top:auto;right:10px;bottom:150px}#audio-toggle{top:auto;right:10px;bottom:196px}#flashlight-toggle{top:auto;right:10px;bottom:232px}#quest{left:10px;top:10px;width:calc(100vw - 20px);padding:10px 12px}#quest b{font-size:14px}.controls{display:none}#crosshair{font-size:15px}}
@media(max-height:590px){#dialogue{min-height:105px}.portrait-wrap{width:78px;height:78px}#dialogue-text{font-size:12px}.title-card h1{font-size:40px}.window{padding:14px}}

/* V7: keep guidance diegetic/minimal. */
#quest span{display:none!important}#quest{width:auto;max-width:360px;padding:9px 12px;background:rgba(5,7,7,.58)}#quest small{display:none}#day-card{gap:0}#day-label{display:none!important}#chapter-card>div{opacity:0}#chapter-card{background:#020303;transition:opacity .25s}#ending-copy:empty{display:none}


/* V8 final polish: sleep fade, cinematic menu and ending */
#sleep-fade{position:absolute;inset:0;z-index:28;background:#010202;opacity:0;pointer-events:none;transition:opacity 1.55s cubic-bezier(.45,0,.25,1)}#sleep-fade.active{opacity:1}
.menu-screen{overflow:hidden;background:#050708!important}.menu-bg{position:absolute;inset:-3%;background:url('assets/ui/menu_bg.png') center/cover no-repeat;image-rendering:pixelated;filter:saturate(.68) brightness(.72);animation:menuDrift 18s ease-in-out infinite alternate}.menu-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(2,3,4,.90) 0%,rgba(2,3,4,.66) 39%,rgba(2,3,4,.22) 70%,rgba(2,3,4,.55) 100%),linear-gradient(0deg,rgba(2,3,4,.75),transparent 45%,rgba(2,3,4,.42))}.menu-card{position:relative;z-index:4;width:min(820px,94vw);margin-left:min(7vw,90px);text-align:left;justify-self:start;padding:34px 38px 30px;border-left:1px solid rgba(217,221,203,.24);background:linear-gradient(90deg,rgba(6,8,8,.64),rgba(6,8,8,.18) 76%,transparent);backdrop-filter:blur(1.4px)}.menu-card h1{margin:17px 0 7px;font-size:clamp(34px,6.1vw,74px);text-shadow:0 7px 34px #000,0 1px 0 rgba(255,255,255,.08)}.menu-card h1 em{color:#bcc6ad}.menu-card small{color:#a7b29f;letter-spacing:.24em}.title-scratch{display:block;width:min(470px,72vw);height:34px;object-fit:cover;opacity:.46;margin:-4px 0 10px;image-rendering:pixelated}.menu-whisper{margin:4px 0 26px!important;color:#8e958c!important;font-size:11px;letter-spacing:.025em}.menu-card button{position:relative;overflow:hidden;background:rgba(207,215,196,.92);border:1px solid rgba(255,255,255,.22);box-shadow:0 8px 28px rgba(0,0,0,.45);transition:transform .16s,background .16s,box-shadow .16s}.menu-card button:before{content:'';position:absolute;left:-120%;top:0;width:70%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.22),transparent);transform:skewX(-18deg);transition:left .42s}.menu-card button:hover{transform:translateY(-2px);background:#eef0e3;box-shadow:0 12px 34px rgba(0,0,0,.58)}.menu-card button:hover:before{left:150%}.menu-card button span{position:relative}.menu-bird{position:absolute;z-index:3;right:10.5%;bottom:18%;width:86px;image-rendering:pixelated;opacity:.68;filter:drop-shadow(0 9px 10px #000);animation:birdBreath 2.9s ease-in-out infinite}.menu-mist{position:absolute;z-index:2;width:70%;height:16%;left:-10%;bottom:10%;background:linear-gradient(90deg,transparent,rgba(172,184,176,.08),transparent);filter:blur(14px);animation:mistMove 14s linear infinite}.mist-b{bottom:29%;left:38%;opacity:.55;animation-duration:20s;animation-direction:reverse}.ending-card{position:relative;z-index:2}.ending-card:before{content:'';position:absolute;inset:-60px -90px;background:radial-gradient(circle,rgba(23,27,25,.30),transparent 68%);z-index:-1}.ending-return{opacity:.40;font-size:10px;padding:9px 16px!important;min-width:130px!important;margin-top:18px}.ending-card small{letter-spacing:.28em}.ending-card h1{animation:titlePulse 3.4s ease-in-out infinite}
@keyframes menuDrift{from{transform:scale(1.02) translate3d(-.4%,0,0)}to{transform:scale(1.055) translate3d(.8%,-.7%,0)}}@keyframes birdBreath{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-3px) rotate(1deg)}}@keyframes mistMove{from{transform:translateX(-22%)}to{transform:translateX(92%)}}@keyframes titlePulse{0%,100%{opacity:.88}50%{opacity:1}}
@media(max-width:800px){.menu-card{margin-left:0;justify-self:center;text-align:center;padding:24px 18px;background:rgba(5,7,7,.54);border-left:0;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12)}.title-scratch{margin:0 auto 8px}.menu-bird{right:8%;bottom:17%;width:62px}.menu-whisper{font-size:10px}}


/* V9 — quieter, more game-like HUD and rebuilt dialogue frame */
:root{--ui-ivory:#d8d3c5;--ui-dim:#8d9188;--ui-edge:rgba(219,215,197,.24);--ui-green:#aebda3;--ui-black:rgba(5,7,7,.86)}
#quest{left:22px;top:22px;padding:10px 16px 10px 21px;min-width:190px;max-width:330px;background:linear-gradient(90deg,rgba(4,6,6,.78),rgba(4,6,6,.42));border:0;border-left:2px solid rgba(174,189,163,.58);box-shadow:none;clip-path:polygon(0 0,97% 0,100% 14%,100% 100%,3% 100%,0 84%)}
#quest:before{content:'›';position:absolute;left:7px;top:7px;color:#aebda3;font-size:17px;opacity:.76}#quest b{font-size:13px;letter-spacing:.055em;font-weight:normal;text-shadow:0 2px 6px #000}
#day-card{right:22px;top:20px;padding:5px 9px;background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.18);box-shadow:none;font-size:12px;letter-spacing:.16em;color:#bcb9ae}
#audio-toggle,#flashlight-toggle{right:22px;top:50px!important;min-width:74px;padding:7px 10px;background:rgba(4,6,6,.48);border:0;border-bottom:1px solid rgba(255,255,255,.14);box-shadow:none;color:#a7aaa1;transition:.16s}
#flashlight-toggle{top:83px!important}#audio-toggle:hover,#flashlight-toggle:hover{background:rgba(15,19,17,.78);color:#e1ded2}
#prompt{bottom:34px;padding:8px 13px 8px 8px;gap:10px;background:rgba(3,5,5,.76);border:0;border-top:1px solid rgba(255,255,255,.17);border-bottom:1px solid rgba(255,255,255,.08);box-shadow:0 8px 28px rgba(0,0,0,.4);font-size:11px;letter-spacing:.035em}
#prompt b{display:grid;place-items:center;width:26px;height:26px;padding:0;border:1px solid rgba(223,220,205,.35);background:rgba(220,218,205,.09);font-size:12px;color:#dedacc}
#held-item{right:22px;bottom:22px;padding:6px 9px;background:rgba(3,5,5,.52);border:0;border-right:2px solid rgba(174,189,163,.44);box-shadow:none;color:#aaa79d}#held-item img{width:31px;height:31px;filter:saturate(.82)}
#dialogue{bottom:24px;width:min(900px,calc(100vw - 38px));min-height:156px;padding:0;gap:0;background:transparent;border:0;box-shadow:none;align-items:stretch}
#dialogue:before{content:'';position:absolute;left:102px;right:0;top:6px;bottom:4px;background:linear-gradient(102deg,rgba(5,7,7,.97),rgba(8,10,9,.91) 72%,rgba(5,6,6,.96));border:1px solid rgba(221,216,199,.19);box-shadow:0 16px 54px rgba(0,0,0,.62);clip-path:polygon(0 0,98.8% 0,100% 8%,100% 100%,1.4% 100%,0 91%)}
.portrait-wrap{position:relative;z-index:2;width:126px;height:126px;margin-top:13px;padding:5px;background:#090b0b;border:1px solid rgba(222,217,201,.27);box-shadow:8px 12px 28px rgba(0,0,0,.55);transform:rotate(-.6deg)}
.portrait-wrap:after{content:'';position:absolute;inset:5px;border:1px solid rgba(255,255,255,.07);pointer-events:none}.portrait-wrap img{filter:saturate(.86) contrast(1.04)}
.dialogue-copy{z-index:2;padding:18px 24px 24px 24px;min-height:146px}
#speaker{display:inline-block;margin:0 0 10px -6px;padding:3px 9px 3px 7px;color:#c8d1bd;background:rgba(160,178,146,.10);border-left:2px solid rgba(174,189,163,.62);font-size:11px;letter-spacing:.15em}
#dialogue-text{font-size:14px;line-height:1.55;color:#ddd9cc;text-shadow:0 2px 5px #000;max-width:720px}
#continue{right:3px;bottom:0;color:#666b64;letter-spacing:.08em;font-size:9px}
.window{border:1px solid rgba(225,218,195,.18);background:linear-gradient(140deg,rgba(8,10,9,.98),rgba(14,15,13,.97));box-shadow:0 28px 90px rgba(0,0,0,.7)}.book{background:linear-gradient(100deg,#372d21,#51422f 49%,#2a231b 50%,#433625);box-shadow:0 32px 100px #000,inset 0 0 45px rgba(0,0,0,.34)}
.slot{background:rgba(5,5,4,.23);border:1px solid rgba(229,218,193,.12);transition:.14s}.slot:not(.empty):hover{transform:translateY(-2px);background:rgba(255,255,255,.045)}
#crosshair{font-size:13px;color:rgba(232,229,215,.62)}
@media(max-width:800px),(pointer:coarse){#dialogue{bottom:145px;width:calc(100vw - 20px)}#dialogue:before{left:77px}.portrait-wrap{width:94px;height:94px}.dialogue-copy{padding:13px 15px 20px 14px;min-height:118px}#dialogue-text{font-size:12px}#prompt{bottom:152px}#quest{left:10px;top:10px}#audio-toggle{right:10px;bottom:198px;top:auto!important}#flashlight-toggle{right:10px;bottom:232px;top:auto!important}}


/* Mobile input reliability pass */
html,body,#game{overscroll-behavior:none;-webkit-text-size-adjust:100%}
@media(max-height:520px) and (pointer:coarse){#stick{width:106px;height:106px}#stick-knob{left:30px;top:30px;width:46px;height:46px}#mobile-action{width:66px;height:66px}#mobile-run{right:34px;bottom:96px;width:48px;height:48px}#mobile-flashlight{right:94px;bottom:88px;width:46px;height:46px}#mobile-inventory{right:91px;width:48px;height:48px}}
