*{box-sizing:border-box} :root{color-scheme:dark;--ivory:#e1e5d9;--muted:#a3b2ab;--line:#c5d8c329;--ink:#0b1211}body{margin:0;background:#090e0d;color:var(--ivory);font:16px/1.5 Georgia,serif}button,input{font:inherit}button{cursor:pointer;color:inherit;border:1px solid var(--line);background:#111d1bd9;padding:10px 17px;font:14px/1.3 system-ui;border-radius:3px;transition:background .2s,border-color .2s}button:hover{background:#2a3931;border-color:#a8b9a4}button:focus-visible,canvas:focus-visible{outline:2px solid #eff4db;outline-offset:4px}button:disabled{opacity:.5;cursor:wait}#game,#view,#fallback,.vignette,#hotspots,#dust,#flash,#scare{position:absolute;inset:0;width:100%;height:100%}#game{overflow:hidden;height:100dvh;min-height:380px}#view{touch-action:none;cursor:grab;display:block}#view:active{cursor:grabbing}#fallback{background-size:auto 100%;background-repeat:repeat-x;touch-action:none}#dust,.vignette,#flash,#scare,#hotspots{pointer-events:none}.vignette{background:radial-gradient(ellipse at center,transparent 35%,#030806aa 100%),linear-gradient(#030706aa,transparent 25%,transparent 67%,#030706d9)}.hud{position:absolute;z-index:3;top:0;left:0;right:0;padding:25px 32px;display:flex;justify-content:space-between;align-items:start;gap:20px}.brand{font-size:18px;letter-spacing:4px;text-shadow:0 2px 6px #000}.brand span{display:block;font:10px system-ui;letter-spacing:2px;margin-top:7px;color:#b9c5b9}.toolbar{display:flex;gap:8px}.toolbar button{background:#101918a8;backdrop-filter:blur(8px)}#found{font-size:12px;color:var(--muted);margin-left:5px}.roomstamp{position:absolute;left:34px;top:122px;text-shadow:0 2px 8px #000;pointer-events:none}.roomstamp>span{font:11px system-ui;letter-spacing:3px;color:#c3cec0}h1{font-size:40px;font-weight:normal;line-height:1.1;margin:9px 0}#roomSub{font-size:10px}.objective{position:absolute;right:32px;top:123px;width:245px;border-left:1px solid #c9d4b77a;padding:0 0 0 17px;pointer-events:none;text-shadow:0 2px 5px #000}.objective span,.inventory>span{font:10px system-ui;letter-spacing:2px;color:#b0c0b5}.objective p{font-size:17px;margin:8px 0}.bottom{position:absolute;bottom:24px;left:32px;right:32px;display:flex;align-items:center;justify-content:space-between;gap:20px}.look{display:flex;align-items:center;gap:14px}.look button{font-size:30px;line-height:1;width:42px;padding:4px}.look span{font:11px/1.7 system-ui;letter-spacing:1.5px;text-align:center}.look small{font-size:9px;color:var(--muted)}.inventory{text-align:center}.inventory p{font:14px system-ui;margin:6px 0}#toast{position:absolute;left:50%;bottom:112px;transform:translateX(-50%);max-width:min(550px,90%);padding:13px 20px;background:#0d1916eb;border:1px solid var(--line);font:15px/1.5 system-ui;text-align:center;opacity:0;transition:opacity .4s;pointer-events:none}#toast.show{opacity:1}.hotspot{position:absolute;pointer-events:auto;transform:translate(-50%,-50%);display:flex;align-items:center;gap:9px;padding:7px 11px 7px 7px;background:#101a16bf;backdrop-filter:blur(5px);border:1px solid #b7c7b369;white-space:nowrap;font-size:13px;min-height:44px;text-shadow:0 1px 3px #000;box-shadow:0 3px 15px #0005}.hotspot i{display:grid;place-items:center;width:28px;height:28px;border:1px solid #cfdbc18a;border-radius:50%;font-style:normal;font-size:17px;color:#f4f2de}.hotspot:hover{background:#45503adb}#dust{overflow:hidden}#dust i{position:absolute;width:2px;height:2px;background:#e3eadc;border-radius:50%;opacity:0;animation:drift 16s linear infinite}@keyframes drift{0%{opacity:0;transform:translate(0,30px)}30%{opacity:.25}70%{opacity:.15}100%{opacity:0;transform:translate(80px,-140px)}}.veil{position:fixed;z-index:10;inset:0;overflow:auto;background:linear-gradient(90deg,#07100ff5 0%,#0a1512d4 40%,#07100f60 100%);display:flex;align-items:center;padding:36px 8vw}.start-inner{max-width:520px}.eyebrow{font:11px system-ui;letter-spacing:4px;color:#afbca9}.chapter{color:#adbd9d;font-size:22px;margin:24px 0 0}h2{font-size:clamp(62px,7vw,104px);font-weight:normal;line-height:.93;letter-spacing:-3px;margin:12px 0 25px}h2 em{font-weight:normal;color:#c4cdb9}.story{font-size:19px;color:#c0c9bd;line-height:1.65}.rule{width:52px;height:1px;background:#a3ad97;margin:24px 0}.brief{font-size:15px;color:#b6c2b4}.start-options{display:grid;gap:7px;margin:22px 0;font:14px/1.5 system-ui;color:#c5cfc2}.start-options label{display:flex;gap:9px;align-items:center}input{accent-color:#a5b28e;width:16px;height:16px}.primary{background:#cbd3b9;color:#14211a;padding:14px 25px;font:14px system-ui;letter-spacing:1px;border-color:#cbd3b9}.primary:hover{background:#e1e9cf}.disclaimer{font:12px/1.6 system-ui;color:#9caa9f;margin-top:16px}#loadStatus{font:13px system-ui;color:#d0bfa6}dialog{background:#111b18;color:var(--ivory);border:1px solid #81917870;max-width:min(560px,calc(100vw - 28px));max-height:85dvh;width:560px;padding:36px;border-radius:3px;box-shadow:0 20px 90px #000b}dialog::backdrop{background:#020605b8;backdrop-filter:blur(5px)}dialog h2{font-size:35px;letter-spacing:0;line-height:1.15;margin:5px 0 22px}dialog h3{font-weight:normal;font-size:22px}dialog p{color:#bdc9bc;font-size:16px}dialog .close{position:absolute;right:10px;top:10px;border:0;background:transparent;font-size:24px;padding:0 8px}dialog label{display:flex;gap:10px;align-items:center;margin:14px 0;font:15px system-ui}dialog .actions{display:grid;gap:10px;margin-top:25px}dialog .actions button{text-align:left}.note{padding:18px 20px;background:#c9ccb7;color:#27312a!important;transform:rotate(-1deg);box-shadow:0 4px 15px #0005}.note small{display:block;margin-top:12px;font:12px system-ui;letter-spacing:1px}#scare{z-index:8;display:none;align-items:center;justify-content:center;background:#010403b8;overflow:hidden}#scare img{width:min(110vw,110vh);height:110%;object-fit:contain;filter:contrast(1.2) drop-shadow(0 0 40px #a7bcb66b);animation:lunge .65s cubic-bezier(.1,.7,.2,1) both}#scare.active{display:flex}#flash{z-index:7;opacity:0;background:#d7e0c5}.power #flash{animation:lighton .8s ease-out}@keyframes lighton{0%{opacity:.2}100%{opacity:0}}@keyframes lunge{from{transform:scale(.3);opacity:.2}to{transform:scale(1.15);opacity:1}}.visited{color:#cbd3b9}a{color:#d0dec5}[hidden]{display:none!important}@media(max-width:700px){.hud{padding:15px;gap:8px}.brand{font-size:13px;letter-spacing:2px}.brand span{display:none}.toolbar{gap:5px}.toolbar button{padding:9px 10px;font-size:12px}.roomstamp{top:83px;left:18px}h1{font-size:29px}.objective{top:169px;left:18px;right:auto;width:230px;padding-left:10px}.objective p{font-size:15px;margin:5px 0}.objective span{font-size:9px}.bottom{left:15px;right:15px;bottom:max(16px,env(safe-area-inset-bottom));gap:8px}.look{gap:7px}.look span{font-size:9px}.look small{display:none}.inventory{display:none}#objects{font-size:12px;padding:12px}.hotspot{font-size:12px;padding:5px;gap:6px;max-width:190px;white-space:normal}#toast{bottom:85px;font-size:14px;width:85%}.veil{padding:30px 26px;align-items:start}.start-inner{margin:auto 0}h2{font-size:68px}.chapter{margin-top:20px}.story{font-size:17px}.rule{margin:20px 0}.brief{font-size:14px}.start-options{font-size:13px}.disclaimer{font-size:11px}dialog{padding:32px 22px}}@media(prefers-reduced-motion:reduce){#dust{display:none}*{animation-duration:0s!important;transition:none!important}}

/* Blackthorn House: tarnished brass, oxblood, and rain-blue shadows. */
:root{--ivory:#e6dbc6;--muted:#baa991;--line:#d6b77738;--ink:#18110f}.veil{background:linear-gradient(90deg,#120e0df2 0%,#180e0ac4 43%,#10121a24 100%)}h2 em{color:#c4a36b}.chapter,.eyebrow{color:#c8ad7e}.primary{background:#c5a575;border-color:#c5a575;color:#21180f}.primary:hover{background:#e0c08b}.hotspot{background:#201b16b8;border-color:#c6ab7866}.hotspot:hover{background:#5a4430dd}.hotspot i{border-color:#d5b57999}button{background:#201b18d9}button:hover{background:#4c3829}.toolbar button{background:#201815ad}.note{background:#d4c29a;color:#362a1c!important}dialog{background:#1d1815;border-color:#b39b6b70}.roomstamp>span{color:#d6c7b1}.objective span,.inventory>span{color:#c8b79c}.vignette{background:radial-gradient(ellipse at center,transparent 40%,#10080899 100%),linear-gradient(#09090b99,transparent 25%,transparent 68%,#08090bcc)}#toast{background:#211911ef}#scare img{filter:contrast(1.15) drop-shadow(0 0 35px #b7afb059)}

/* Object inspections remain inside the scene: the scare is clipped to the mirror. */
dialog.inspection{width:min(760px,calc(100vw - 24px));padding:22px 26px;max-height:94dvh}dialog.inspection h2{font-size:26px;margin:0 0 12px}dialog.inspection p{font-size:14px;margin:10px 0}dialog.inspection .actions{margin-top:10px}.cabinet-scene,.fridge-scene{position:relative;width:min(100%,490px);margin:auto;overflow:hidden}.cabinet-scene>img,.fridge-scene>img{display:block;width:100%;max-height:59dvh;object-fit:contain}.cabinet-scene{aspect-ratio:1/1;max-height:59dvh;width:auto;max-width:100%}.cabinet-scene>img{height:100%;width:100%;object-fit:fill}#mirrorReflection{position:absolute;left:28%;top:16%;width:45%;height:47%;overflow:hidden;pointer-events:none;opacity:0;background:linear-gradient(90deg,#1b28283b,transparent,#1b28283b)}#mirrorReflection.visible{opacity:.85}#mirrorReflection img{width:100%;height:100%;object-fit:contain;filter:grayscale(.6) contrast(1.3) brightness(.72);transform:scale(1.13)}.note-spot{position:absolute;left:38%;top:55%;font-size:13px;border-color:#e2d5af;background:#251c0ce8}.cabinet-message{display:block;border-left:2px solid #ab9569;padding-left:12px;font-family:Georgia,serif}#flies{position:absolute;inset:0;pointer-events:none}#flies i{position:absolute;left:var(--x);top:var(--y);width:3px;height:2px;background:#141710;box-shadow:1px -1px 1px #7b7a5a;border-radius:50%;animation:fly var(--d) linear infinite}@keyframes fly{0%{transform:translate(-20px,0)}25%{transform:translate(12px,-17px)}50%{transform:translate(25px,9px)}75%{transform:translate(-8px,19px)}100%{transform:translate(-20px,0)}}@media(max-width:600px){dialog.inspection{padding:22px 16px}.cabinet-scene{max-height:52dvh}.note-spot{left:26%;font-size:12px}}@media(prefers-reduced-motion:reduce){#flies i{animation:none}}

.author{font:14px Georgia,serif;letter-spacing:2px;color:#c4aa7b;margin:-10px 0 22px}.brand-author{font:11px Georgia,serif;letter-spacing:1px;display:block;color:#bea57d;margin-top:4px}#cinematic{position:fixed;inset:0;z-index:11;pointer-events:auto;background:#0003;animation:cinema-reveal 2s ease-out both}.cinema-bars{position:absolute;inset:0;border-top:8vh solid #050506;border-bottom:8vh solid #050506;pointer-events:none}.cinema-copy{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:end;padding:0 22px 14vh;text-align:center;text-shadow:0 3px 25px #000,0 0 55px #000}.cinema-copy h2{font-size:clamp(40px,7vw,95px);line-height:1.1;letter-spacing:1px;margin:10px 0;opacity:0;animation:title-rise 2.3s 2.3s ease both}.cinema-date{font:10px system-ui;letter-spacing:3px;opacity:0;animation:title-rise 1.8s .5s both}.cinema-author{font:17px Georgia,serif;letter-spacing:3px;opacity:0;animation:title-rise 1.7s 3.2s both}.cinema-line{font:italic 18px Georgia,serif;opacity:0;animation:title-rise 1.5s 5.5s both}#skipIntro{position:absolute;right:24px;bottom:24px;font-size:13px}.in-cinematic .hud,.in-cinematic .roomstamp,.in-cinematic .objective,.in-cinematic .bottom,.in-cinematic #toast{visibility:hidden}@keyframes cinema-reveal{from{background:#000}to{background:#0002}}@keyframes title-rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@media(max-width:600px){.brand-author{font-size:10px}.cinema-copy{padding-bottom:19vh}.cinema-copy h2{font-size:43px}.cinema-date{font-size:9px;max-width:240px;line-height:1.8}.cinema-author{font-size:14px}}

#weather{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}#groundMist{position:absolute;inset:55% -30% -15%;pointer-events:none;opacity:.36;background:radial-gradient(ellipse at 28% 70%,#a5bbc43b,transparent 43%),radial-gradient(ellipse at 75% 65%,#97a9ad44,transparent 40%);filter:blur(18px);animation:mist-drift 17s ease-in-out infinite alternate}#porchGlow{position:absolute;width:80px;height:80px;transform:translate(-50%,-50%);background:radial-gradient(#f1bc6666,transparent 65%);mix-blend-mode:screen;pointer-events:none;animation:porch-pulse 4.8s linear infinite}.in-cinematic #groundMist{opacity:.58}@keyframes mist-drift{from{transform:translateX(-5%) scale(1)}to{transform:translateX(9%) scale(1.12)}}@keyframes porch-pulse{0%,38%,46%,81%,100%{opacity:.9}40%,43%{opacity:.15}84%{opacity:.5}}#mirrorReflection{left:27.4%;top:8.4%;width:45.3%;height:53.1%}.note-spot{left:41%;top:33.6%}.fridge-scene{aspect-ratio:2/3;max-height:59dvh;width:auto;max-width:100%}.fridge-scene>img{width:100%;height:100%;object-fit:fill}@media(prefers-reduced-motion:reduce){#groundMist,#porchGlow{animation:none}}

#weather{z-index:12}

#driveScene{position:absolute;inset:0;overflow:hidden;transition:opacity .6s}#driveRoad{position:absolute;inset:-5%;background:url('assets/road.png') center 54%/cover no-repeat;animation:road-approach 6.5s linear both}#driveCockpit{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;transform-origin:bottom right;animation:car-idle .20s ease-in-out infinite alternate;transition:transform 1.5s ease,opacity 1.3s ease}#cinematic[data-phase="1"] #driveCockpit{animation:none;transform:translate(85%,15%) rotate(9deg);opacity:0}#cinematic[data-phase="1"] #driveRoad{opacity:0;transition:opacity 1.4s}#cinematic[data-phase="2"] #driveScene,#cinematic[data-phase="3"] #driveScene,#cinematic[data-phase="4"] #driveScene,#cinematic[data-phase="5"] #driveScene{opacity:0;pointer-events:none}#arrivalGate{position:absolute;left:50%;bottom:0;transform:translateX(-50%);height:72vh;width:min(110vw,1100px);perspective:900px;opacity:0;transition:opacity .8s,transform 3s;pointer-events:none}.gate-half{position:absolute;top:0;width:50%;height:100%;overflow:hidden;transition:transform 2.5s ease-in-out}.gate-half img{position:absolute;top:0;width:200%;height:100%;object-fit:fill}.gate-left{left:0;transform-origin:5% 50%}.gate-left img{left:0}.gate-right{right:0;transform-origin:95% 50%}.gate-right img{right:0}#cinematic[data-phase="2"] #arrivalGate,#cinematic[data-phase="3"] #arrivalGate{opacity:1}#cinematic[data-phase="3"] .gate-left,#cinematic[data-phase="4"] .gate-left{transform:rotateY(-100deg)}#cinematic[data-phase="3"] .gate-right,#cinematic[data-phase="4"] .gate-right{transform:rotateY(100deg)}#cinematic[data-phase="4"] #arrivalGate{opacity:0;transform:translateX(-50%) scale(1.45)}#introCaption{position:absolute;left:20%;right:20%;bottom:10vh;text-align:center;font:14px/1.5 Georgia,serif;text-shadow:0 2px 7px #000;color:#d9d3c4}.cinema-copy h2{animation-delay:16s}.cinema-date{animation-delay:14s}.cinema-author{animation-delay:17s}.cinema-line{animation-delay:18s}.cinema-copy{padding-bottom:23vh}#cinematic{animation:none;background:transparent}.cinema-bars{z-index:3}.cinema-copy,#skipIntro,#introCaption{z-index:4}@keyframes road-approach{from{transform:scale(1)}to{transform:scale(1.22) translateY(1.5%)}}@keyframes car-idle{from{transform:translateY(0)}to{transform:translateY(1px)}}@media(max-width:600px){#driveCockpit{object-fit:cover}#arrivalGate{width:145vw;height:57vh}#introCaption{left:12%;right:12%;font-size:13px}.cinema-copy{padding-bottom:24vh}}

.cracked-inspection{height:min(48dvh,440px);aspect-ratio:240/440;margin:auto;position:relative;background:url("assets/bedroom-ensuite.png") 88% 51.5%/739% auto no-repeat;border:1px solid #8e7445;overflow:hidden}#mirrorWriting{position:absolute;inset:25% 12% auto;text-align:center;color:#e7e2d5;text-shadow:0 0 7px #fff9;font:14px/2 Georgia,serif;letter-spacing:2px;transform:rotate(-4deg);background:#9aa7a02e;padding:20px 0;animation:title-rise 1.8s both}

.hotspot.hidden-object{padding:0;border:0;background:transparent;box-shadow:none;backdrop-filter:none;width:48px;height:64px;min-height:44px;cursor:pointer}.hotspot.hidden-object:hover{background:transparent;filter:drop-shadow(0 0 5px #e6c68f55)}.glass-bottle{display:block;width:24px;height:54px;margin:auto;border-radius:5px 5px 8px 8px;background:linear-gradient(90deg,#0b120ce0,#465748b0 25%,#18241ad9 42%,#72837285 50%,#101e14ee 85%);border:1px solid #6b796454;box-shadow:inset 2px 0 3px #9eac7c55,4px 6px 5px #0009;transform-origin:50% 100%;transition:transform .6s cubic-bezier(.45,0,.9,.6)}.glass-bottle:before{content:"";position:absolute;left:19px;top:0;width:9px;height:15px;background:linear-gradient(90deg,#1b271c,#737b4b,#101d12);border-radius:2px}.fallen .glass-bottle{transform:translate(22px,8px) rotate(86deg)}.cracked-inspection{isolation:isolate}.mirror-mist{position:absolute;inset:12% 22% 12% 25%;opacity:0;background:radial-gradient(ellipse,#c1c6b57a,#a6b6ac1a 66%,transparent);filter:blur(10px)}.revealing .mirror-mist{animation:mirror-fog 5s forwards}.mirror-shadow{position:absolute;inset:25% 25%;background:url("assets/widow.png") center/contain no-repeat;opacity:0;filter:blur(2px) brightness(.4);pointer-events:none}.revealing .mirror-shadow{animation:mirror-passing 2.2s both}.revealing #mirrorWriting{animation:title-rise 2.6s 1.1s both;background:transparent;font-size:12px;letter-spacing:1px;inset:29% 22% auto 24%;padding:15px 0}@keyframes mirror-fog{0%{opacity:0;transform:scale(.6)}60%,100%{opacity:1;transform:scale(1)}}@keyframes mirror-passing{0%{opacity:0;transform:translateX(-12px)}35%{opacity:.2}100%{opacity:0;transform:translateX(20px)}}

/* Objects have invisible hit areas, with pointer and keyboard-focus feedback only. */
.hotspot.hidden-object{width:72px;height:76px;cursor:pointer}.hotspot.hidden-object:hover{filter:none}.hotspot.hidden-object:focus-visible{outline:1px solid #cfbd93;outline-offset:3px}.hotspot.hidden-object.front,.hotspot.hidden-object.parlor,.hotspot.hidden-object.bedroom,.hotspot.hidden-object.bathroom,.hotspot.hidden-object.car,.hotspot.hidden-object.fridge,.hotspot.hidden-object.mirror{width:112px;height:132px}#objects{display:none}

/* A dismissible landscape suggestion; device names and user-agent sniffing are unnecessary. */
#rotateNotice{position:fixed;z-index:50;top:max(14px,env(safe-area-inset-top));left:14px;right:14px;margin:auto;max-width:500px;display:flex;gap:14px;align-items:flex-start;padding:18px;background:#151715f5;color:#e6dbc6;border:1px solid #c5a57588;border-radius:8px;box-shadow:0 8px 36px #000b;font:16px/1.45 system-ui}
#rotateNotice strong{display:block;font-size:18px}#rotateNotice p{margin:7px 0 12px;color:#c9c5bb}#rotateNotice button{min-height:44px;font-size:14px;padding:8px 14px}#rotateNotice .rotate-symbol{font-size:38px;line-height:1;color:#c5a575}

#cinematic{background:#000;opacity:1;transition:opacity .65s ease;animation:none}#cinematic.intro-finished{opacity:0;pointer-events:none}#introVideo{width:100%;height:100%;display:block;object-fit:contain}#introStatus{position:absolute;bottom:70px;left:10%;right:10%;text-align:center;color:#eee}#introResume{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}

.in-cinematic #weather,.in-cinematic #groundMist,.in-cinematic #porchGlow,.in-cinematic #flash,.in-cinematic #dust{display:none!important}

.hotspot.hidden-object.visor{width:140px;height:72px}.car-detail{position:relative;aspect-ratio:16/10;overflow:hidden;background:#080808}.car-detail>img:first-child{position:absolute;width:400%;max-width:none;height:auto;pointer-events:none}.glove-detail>img:first-child{left:-203.6%;top:-134%}.visor-detail>img:first-child{left:-99.6%;top:-10%}.object-hit{position:absolute;border:0;background:transparent!important;box-shadow:none;cursor:pointer;padding:0;min-width:44px;min-height:44px}.object-hit:focus-visible{outline:1px solid #e6dbc6}#gloveLatch{left:28%;top:26%;width:47%;height:42%}#gloveKey{left:40%;top:48%;width:25%;height:27%}#visorToggle{left:9%;top:16%;width:78%;height:72%}#gloveFace{position:absolute;left:18%;top:5%;width:64%;height:95%;object-fit:contain;pointer-events:none;animation:glove-lunge .5s ease-out both}@keyframes glove-lunge{from{transform:translateY(30%) scale(.12);opacity:.2}to{transform:translateY(0) scale(1.3);opacity:1}}@media(prefers-reduced-motion:reduce){#gloveFace{animation:none}}

/* Fullscreen object films keep the 16:9 picture and clickable ending aligned. */
#modal.car-cinema{width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;background:#000;overflow:hidden;border-radius:0}
.car-cinema #modalBody{height:100%;display:grid;place-items:center;padding:0}
.car-cinema #modalBody>h2,.car-cinema .actions{display:none}
.car-film-frame{position:relative;width:min(100vw,177.7778dvh);aspect-ratio:16/9;overflow:hidden}
.car-film-frame video,.car-film-frame>img{width:100%;height:100%;object-fit:contain;display:block}
.car-film-frame [hidden],.car-cinema [hidden]{display:none!important}
.car-cinema #closeModal{position:absolute;z-index:5;top:12px;right:16px;background:#111c}
.film-object{position:absolute;background:transparent;border:0;cursor:pointer;min-width:44px;min-height:44px;padding:0}
.film-object:hover{background:transparent}
.film-key{left:53%;top:62%;width:7%;height:15%}
.film-note{left:27%;top:44%;width:35%;height:50%}
.film-skip,.film-play{position:absolute;z-index:4;bottom:22px;right:24px;background:#151a1deb;color:#eee}
.film-play{left:50%;right:auto;top:50%;bottom:auto;transform:translate(-50%,-50%)}
#carCaption{position:absolute;bottom:12px;left:15%;right:15%;text-align:center;color:#eee;text-shadow:0 2px 4px #000;pointer-events:none}
.note-close{transform:scale(1.5);transform-origin:45% 68%}

/* End frames are playable object views, outside the dismissed video dialog. */
.object-exploration{position:fixed;inset:0;z-index:80;background:#000;display:grid;place-items:center;touch-action:none;outline:none}
.object-back{position:absolute;left:20px;bottom:20px;min-height:44px;background:#111b;color:#eee;z-index:2}
.object-caption{position:absolute;bottom:65px;left:15%;right:15%;text-align:center;color:#eee;text-shadow:0 2px 4px #000;pointer-events:none}
.object-exploration .film-object:focus-visible{outline:2px solid #e6dbc6}

.note-reading{background:radial-gradient(ellipse,#272521e8,#050606fa);overflow:auto;display:block;padding:22px 16px 85px;box-sizing:border-box;touch-action:pan-y}
.found-note{box-sizing:border-box;width:min(580px,100%);margin:0 auto;padding:clamp(18px,4vw,42px);color:#302820;background:linear-gradient(105deg,transparent 48%,#69573530 49%,#fff4ce38 50%,transparent 52%),linear-gradient(4deg,#a78e65,#d9c69d 35%,#c7b38b 80%,#9f8961);box-shadow:0 12px 65px #000,inset 0 0 48px #4e371b55;border-radius:2px 9px 3px 6px;font-family:'Segoe Print','Bradley Hand',cursive;font-size:clamp(18px,2.3vw,26px);line-height:1.5;animation:note-lift .35s ease-out}
.found-note p{margin:.65em 0;overflow-wrap:anywhere}.found-note p:nth-child(2n){transform:rotate(-2deg)}.found-note .crossed-words{text-decoration:line-through;text-decoration-thickness:2px;opacity:.7}.found-note .note-last{font-size:1.15em;letter-spacing:.06em;text-align:right}
.note-reading .object-back{position:sticky;display:block;margin:18px auto 0;bottom:0;left:auto}
@keyframes note-lift{from{opacity:0;transform:translateY(35px) rotate(3deg)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.found-note{animation:none}}

.found-note-photo{display:block;width:min(720px,100%);height:auto;margin:0 auto;box-shadow:0 12px 65px #000;animation:note-lift .35s ease-out}@media(prefers-reduced-motion:reduce){.found-note-photo{animation:none}}

.note-reading{padding:0 0 72px;background:#080909}.found-note-photo{width:min(100%,calc((100dvh - 72px)*1.77778));max-height:calc(100dvh - 72px);object-fit:contain;margin:auto}.note-reading .object-back{margin:12px auto}

.found-note-photo{width:auto;max-width:100%;height:auto;max-height:calc(100dvh - 72px)}

#fridgeSwarm{position:fixed;inset:0;pointer-events:none;z-index:5}#fridgeSwarm[hidden],#fridgeSwarm i[hidden]{display:none}#fridgeSwarm i{position:absolute;left:0;top:0;width:3px;height:2px;border-radius:50%;background:#111;box-shadow:-2px -1px 0 #a5a6a47a,2px -1px 0 #a5a6a47a;will-change:transform}

#fridgeSwarm i.yard-fly{width:10px;height:12px;background:none;box-shadow:none;border-radius:0;transform-origin:center;filter:drop-shadow(0 1px 1px #0005)}
.yard-fly svg{display:block;width:100%;height:100%;overflow:visible}.fly-wing{transform-box:fill-box;transform-origin:top center;animation:fly-wingbeat .065s steps(2,end) infinite}.wing-right{animation-direction:reverse}.landed .fly-wing{animation:none;transform:scaleX(.55)}
@keyframes fly-wingbeat{from{transform:rotate(-24deg) scaleX(.65);opacity:.35}to{transform:rotate(24deg) scaleX(1.25);opacity:.75}}
@media(prefers-reduced-motion:reduce){.fly-wing{animation:none}}

.hotspot.front,.hotspot.outside{width:44px;height:44px;min-width:44px;min-height:44px}
.hotspot.porchWindow{width:110px;height:120px;min-width:72px;min-height:80px}@media(max-width:600px){.hotspot.porchWindow{width:90px;height:100px}}

.hotspot.yardSteps,.hotspot.yardStepsRight{width:190px;height:180px;min-width:140px;min-height:140px}

#backToYard{min-height:44px;background:#191a17df;color:#e9ddc4;border:1px solid #a9997555;border-radius:4px;padding:9px 14px}#backToYard[hidden]{display:none}

.hotspot.yardSteps,.hotspot.yardStepsRight{width:clamp(220px,35vw,420px);height:clamp(180px,35vh,300px)}

/* Fit Safari's actual landscape viewport; never force a 380px-tall game. */
html,body{height:100%;overflow:hidden}
#game{position:fixed;height:100dvh;min-height:0}
.hud{padding-top:max(15px,env(safe-area-inset-top));padding-left:max(15px,env(safe-area-inset-left));padding-right:max(15px,env(safe-area-inset-right))}
.bottom{left:max(15px,env(safe-area-inset-left));right:max(15px,env(safe-area-inset-right));bottom:max(12px,env(safe-area-inset-bottom))}
@media (orientation:landscape) and (max-height:500px){
 .hud{padding-top:max(7px,env(safe-area-inset-top));gap:8px;align-items:center}
 .brand{font-size:12px;letter-spacing:2px}.brand span,.brand-author{display:none!important}
 .toolbar button{font-size:11px;padding:7px 10px}
 .roomstamp{top:52px;left:max(16px,env(safe-area-inset-left))}.roomstamp h1{font-size:23px;margin:4px 0}
 #roomSub,.roomstamp>span{display:none}
 .objective{top:53px;left:auto;right:max(16px,env(safe-area-inset-right));width:190px}.objective span{display:none}.objective p{font-size:12px;margin:2px 0}
 .bottom{gap:8px}.inventory,.look span{display:none}.look button{font-size:23px;width:35px}#toast{bottom:57px;padding:8px 12px;font-size:13px}
 .veil{padding:max(18px,env(safe-area-inset-top)) max(26px,env(safe-area-inset-left));align-items:flex-start}
 dialog{max-height:calc(100dvh - 16px);overflow:auto}
}

#resumeMusic{position:absolute;z-index:8;top:max(62px,calc(env(safe-area-inset-top) + 50px));left:50%;transform:translateX(-50%);background:#211911ef;font:13px system-ui;padding:10px 14px}

/* A clear exploration screen on phones; controls remain in a compact menu. */
#mobileMenu{display:none}
@media (max-width:700px), (pointer:coarse) and (max-width:1000px) and (max-height:600px){
 body.show-mobile-details .roomstamp{display:block!important;top:74px;left:16px;right:16px;max-height:110px;overflow:auto}
 body.show-mobile-details .roomstamp h1{font-size:26px;margin:6px 0}
 body.show-mobile-details .objective{display:block!important;top:195px;left:16px;right:16px;width:auto;max-height:85px;overflow:auto}
 body.show-mobile-details .hud .brand{display:block!important;position:absolute;left:16px;top:max(12px,env(safe-area-inset-top));max-width:calc(100% - 84px);font-size:13px;letter-spacing:1px;pointer-events:none}
 body.show-mobile-details .hud .brand span{display:none}
 body.show-mobile-details .bottom{display:flex!important}
}
@media (max-width:700px), (pointer:coarse) and (max-width:1000px) and (max-height:600px){
 .hud .brand,.roomstamp,.objective,.bottom{display:none!important}
 .hud{justify-content:flex-end;align-items:flex-end;flex-direction:column;gap:8px;pointer-events:none;padding: max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) 0 12px}
 #mobileMenu{display:block;pointer-events:auto;width:44px;height:44px;padding:0;font:22px system-ui;background:#161310b8;backdrop-filter:blur(6px)}
 .hud .toolbar{display:none;pointer-events:auto;flex-direction:column;padding:6px;background:#171310ed;border:1px solid var(--line);border-radius:4px}
 .hud.mobile-menu-open .toolbar{display:flex}
 .hud .toolbar button{min-height:44px;min-width:110px;font-size:13px}
 #toast{bottom:max(22px,env(safe-area-inset-bottom));font-size:13px}
}

/* Unlabeled, image-led porch discoveries. */
dialog.porch-discovery{padding:0;border:1px solid #60533d;width:auto;max-width:94vw;max-height:94dvh;background:#0b0907;overflow:hidden}
dialog.porch-discovery h2,dialog.porch-discovery .actions{display:none}
dialog.porch-discovery .close{z-index:4;background:#090b0bc9;right:8px;top:8px;width:44px;height:44px}
.porch-clue-frame{position:relative;width:min(60dvh,92vw);margin:0;animation:porch-inspect .65s ease-out}
.porch-clue-frame>img{display:block;width:100%;height:auto}
.key-pickup{position:absolute;left:37%;top:36%;width:24%;height:16%;padding:0;border:0;background:transparent!important;cursor:pointer}
.key-pickup:focus-visible{outline:2px solid #e0c68c;outline-offset:2px}
.photo-watcher{position:absolute;left:50.5%;top:28.5%;width:3.7%;height:4%;background:url('assets/old-man.png') center 20%/cover no-repeat;filter:sepia(1) grayscale(.5) brightness(.5);opacity:0;animation:photo-watch 4s 1.6s forwards;pointer-events:none;transform:rotate(5deg)}
@keyframes porch-inspect{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:scale(1)}}
@keyframes photo-watch{to{opacity:.6}}
@media(prefers-reduced-motion:reduce){.porch-clue-frame{animation:none}.photo-watcher{animation:none;opacity:.6}}

dialog.porch-discovery{width:fit-content;min-width:0} dialog.porch-discovery #modalBody{width:fit-content}

.porch-pickup-ending .porch-photo-hit{left:31%;top:10%;width:33%;height:78%;cursor:zoom-in}.porch-pickup-ending .porch-key-hit{left:22%;top:23%;width:28%;height:56%;cursor:zoom-in}

.hotspot.hidden-object.backPath,.hotspot.hidden-object.frontPath{width:140px;height:170px}
/* Clock controls stay inside the inspection panel on narrow phones. */
.clock-clue-photo{display:block;max-width:100%;max-height:72dvh;margin:0 auto;object-fit:contain}
.clock-puzzle{width:min(100%,370px);margin:auto;text-align:center}
#clockDial{display:block;width:min(100%,300px);max-height:42dvh;margin:auto;touch-action:none;cursor:pointer;filter:drop-shadow(0 3px 12px #000)}
#clockDial text{font-family:Georgia,serif;font-size:22px;fill:#372b1a}
.dial-rim{fill:#4d3a20;stroke:#a28650;stroke-width:3}.dial-paper{fill:#b9a77a;stroke:#716044;stroke-width:2}.clock-hand{fill:#28241c;stroke:#544738;stroke-width:1}
.clock-help{font-size:14px;margin:12px 0}.clock-controls{display:flex;justify-content:center;gap:20px}.clock-controls label{display:grid;gap:4px;font-size:13px}.clock-controls input{width:90px;box-sizing:border-box;background:#201b15;color:#eadbc4;border:1px solid #6c5a42;padding:10px;font-size:18px;text-align:center}#clockStatus{min-height:1.4em;font-size:14px;margin:10px 0}#clockLatch{min-height:44px}
#clockDial{width:min(100%,48dvh,440px);height:auto;max-height:none;aspect-ratio:1;filter:drop-shadow(0 6px 18px #000)}
.clock-puzzle{width:min(100%,440px)}.clock-hand{fill:#211c15;stroke:#746449;stroke-width:.65;filter:drop-shadow(1px 2px 1px #0008)}
#clockLatch{background:linear-gradient(#433426,#241d16);border:1px solid #766044;color:#d8c4a5;box-shadow:inset 0 1px 0 #a18a5e33;font-family:Georgia,serif}
.clock-controls input{background:#17130f;border-color:#594a35;color:#cbbb9c}.clock-help{color:#bbaa90}

/* Invisible, generous fallback targets for interior navigation. */
.hotspot.hidden-object.interior-entry{width:160px;height:240px;max-width:42vw;max-height:48dvh;cursor:pointer}

#scare.active{pointer-events:auto}#widowFilm{width:100%;height:100%;object-fit:cover;display:block}#scare{background:#090807}
/* Keep the complete mobile clock puzzle within Safari's visible viewport. */
@media(max-width:700px){
 #modal:has(.clock-puzzle){width:calc(100vw - 20px);max-width:560px;max-height:calc(100dvh - 20px);padding:14px 16px;margin:auto;overflow:auto}
 #modal:has(.clock-puzzle) h2{font-size:22px;line-height:1.15;margin:0 40px 10px 0;letter-spacing:0}
 #modal:has(.clock-puzzle) .close{z-index:2;top:4px;right:4px;width:44px;height:44px}
 #modal:has(.clock-puzzle) .actions:empty{display:none}
 .clock-puzzle{width:100%}
 #clockDial{width:min(100%,440px,max(100px,calc(100dvh - 285px)));height:auto;aspect-ratio:1}
 .clock-puzzle .clock-help{font-size:13px;line-height:1.3;margin:8px 0}
 .clock-controls{gap:18px}
 .clock-controls label{margin:4px 0;gap:4px;font-size:13px}
 .clock-controls input{height:44px;width:88px;padding:6px;font-size:18px}
 #clockStatus{font-size:13px;line-height:1.3;min-height:17px;margin:5px 0}
 #clockLatch{display:block;width:100%;min-height:46px;margin:0;padding:10px 16px}
}