@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;1,400&family=Manrope:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--ink:#dbe9de;--muted:#8caaa0;--mint:#b8e6ce}*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#060d0d;color:var(--ink);font-family:Manrope,Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--mint);outline-offset:7px}button{border:0;background:none}button:hover{color:#fff}button[hidden],[hidden]{display:none!important}#world{position:fixed;inset:0;width:100%;height:100%;touch-action:none}.vignette,.grain{position:fixed;inset:0;pointer-events:none}.vignette{background:linear-gradient(90deg,rgba(3,10,10,.55),transparent 68%),linear-gradient(0deg,#060d0dc9,transparent 23%,transparent 78%,#060d0d66),radial-gradient(ellipse,transparent 20%,#03080775)}.grain{opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}header{position:fixed;top:0;left:0;width:100%;display:flex;justify-content:space-between;align-items:center;padding:36px 4.3%;z-index:5}.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--ink);font-size:15px;letter-spacing:.29em;font-weight:600}.brand img{width:33px;height:35px}.top-right{display:flex;gap:32px;align-items:center;font-size:9px;letter-spacing:.16em}.signal{color:var(--muted);display:flex;align-items:center;gap:9px}.signal i,#danger i{height:4px;width:4px;border-radius:50%;background:#b8e6ce;box-shadow:0 0 9px #b8e6ce;display:inline-block}#sound{font-size:9px;letter-spacing:.14em;padding:10px 0}#sound span{color:var(--muted);margin-left:7px}#pause{font-size:19px;padding:5px 12px;border:1px solid #a5c4b433}#intro{position:absolute;left:8%;top:50%;transform:translateY(-44%);z-index:2}.eyebrow{font-size:9px;letter-spacing:.24em;color:#a8c6b9;display:flex;align-items:center;gap:14px}.eyebrow>span{display:inline-block;width:25px;height:1px;background:var(--mint)}h1{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:clamp(42px,5.2vw,82px);line-height:1.04;letter-spacing:-.035em;margin:27px 0}h1 em{font-weight:400;color:#acc7b9}#intro p{font-size:12px;line-height:1.9;color:#a4b5ae;letter-spacing:.035em;margin:0 0 35px}.primary{border:1px solid #bfdccc70;background:#b9e0cb0a;padding:18px 22px;font-size:9px;letter-spacing:.18em;min-width:240px;display:flex;justify-content:space-between;gap:38px;align-items:center;transition:background .4s,box-shadow .4s}.primary:hover{background:#b9e0cb18;box-shadow:0 0 35px #b9e0cb12}.primary span{font-size:19px;line-height:10px}.entry-note{margin-top:19px;font-size:7px;letter-spacing:.15em;color:#78948a}#intro-bottom{position:absolute;bottom:34px;left:4.3%;right:4.3%;display:flex;justify-content:space-between;align-items:center;font-size:8px;letter-spacing:.14em;color:#7c9c90}#skip{font-size:8px;letter-spacing:.14em;color:#c4d4ca}.chapter{position:absolute;left:4.3%;top:145px}.chapter>span{font-size:8px;letter-spacing:.2em;color:#94b2a5}.chapter h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:31px;margin:12px 0 6px}.chapter p{font-size:10px;color:#9cb0a6;margin:0}#reticle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font:16px monospace;color:#d5eee078;pointer-events:none}#status{position:absolute;bottom:25%;width:100%;text-align:center;font-size:11px;letter-spacing:.07em;color:#c9dfd3;pointer-events:none}#controls{position:absolute;bottom:34px;left:4.3%;font-size:10px;letter-spacing:.12em;color:#b9cdc2}#controls span{font-size:8px;color:#809c8f;margin-left:6px}#controls small{display:block;font-size:8px;color:#6e8a7d;letter-spacing:.05em;margin-top:12px}#danger{position:absolute;right:4.3%;bottom:45px;display:flex;align-items:center;gap:12px;font-size:8px;letter-spacing:.14em;color:#87a194}#danger.close{color:#e3b6a4}#danger.close i{background:#e3b6a4;box-shadow:0 0 15px #ffb78f}.interact{position:absolute;left:50%;bottom:16%;transform:translateX(-50%);border:1px solid #c8ead55c;background:#091713d9;padding:14px 20px;display:flex;gap:14px;align-items:center;white-space:nowrap}.interact span{border:1px solid #b9d3c44d;padding:4px 7px;font-size:12px}.interact b{font-size:9px;font-weight:400;letter-spacing:.15em}.overlay{position:fixed;inset:0;z-index:10;background:#040c0dd9;backdrop-filter:blur(10px);display:grid;place-items:center;text-align:center}.modal-inner{padding:30px;max-width:450px}.modal-inner .eyebrow{justify-content:center}.modal-inner h2{font:400 46px/1.08 'Cormorant Garamond',Georgia,serif}.modal-inner p{font-size:12px;line-height:1.8;color:var(--muted)}.modal-inner .primary{margin:30px auto 20px}.text-button{font-size:8px;letter-spacing:.17em;padding:12px;color:#a1b7aa}#ending{position:fixed;inset:0;background:#030807;display:flex;align-items:center;justify-content:center;flex-direction:column;z-index:12;opacity:0;transition:opacity 3.8s}#ending.visible{opacity:1}#final-mark{width:clamp(110px,15vw,210px);margin-bottom:35px}#ending h2{font-weight:500;font-size:clamp(20px,3vw,35px);letter-spacing:.4em;margin:0 0 28px;padding-left:.4em}#ending p{font-size:9px;letter-spacing:.5em;margin:0;padding-left:.5em;opacity:0;transition:opacity 2s 2.8s}#ending.visible p{opacity:1}.end-line{height:35px;width:1px;background:linear-gradient(#b3dfc867,transparent);margin:30px 0 20px}#ending>span{font:italic 20px 'Cormorant Garamond',Georgia,serif;color:#8fa698}#replay{position:absolute;bottom:max(56px,calc(env(safe-area-inset-bottom) + 32px))}#touch-controls{display:none}.no-js{position:fixed;inset:0;background:#060d0d;display:grid;place-content:center;text-align:center;z-index:30}.no-js img{width:120px;margin:auto}.no-js small{color:#9bbaaa}.playing .vignette{background:radial-gradient(ellipse,transparent 25%,#03080770)}.playing .signal{display:none}
@media(any-pointer:coarse),(max-width:1024px){#touch-controls{display:block}#controls{display:none}#joystick{position:absolute;bottom:max(32px,env(safe-area-inset-bottom));left:30px;width:104px;height:104px;border:1px solid #bfe2cd35;border-radius:50%;touch-action:none;background:#0b201422}#joystick span{position:absolute;left:34px;top:34px;width:34px;height:34px;border:1px solid #bddcc969;border-radius:50%;background:#c3e2cd12}.look-tip{position:absolute;bottom:65px;right:35px;font-size:8px;color:#8da697;letter-spacing:.15em}#danger{bottom:160px}.interact{bottom:30%;}.interact span{display:none}}
@media(max-width:700px){header{padding:25px 6%}.brand{font-size:11px;gap:10px}.brand img{width:25px}.top-right{gap:16px}.signal{display:none}#intro{left:8%;right:8%;top:52%}h1{font-size:clamp(42px,9vw,62px)}.eyebrow{font-size:7px;letter-spacing:.18em}#intro p{font-size:11px}#intro-bottom{left:8%;right:8%;bottom:25px;gap:25px;font-size:6px}#intro-bottom .coordinates{display:none}#skip{font-size:7px}.entry-note{font-size:6px}.chapter{left:6%;top:105px;max-width:85%}.chapter h2{font-size:28px}.chapter p{font-size:9px}#danger{right:6%;font-size:6px}.primary{padding:18px 20px;min-width:225px}#controls{font-size:8px;left:6%;bottom:30px}#controls span{font-size:6px}.modal-inner h2{font-size:39px}}
@media(max-height:500px){#intro{top:51%}h1{font-size:39px;margin:15px 0}#intro p{margin-bottom:15px}.entry-note{display:none}header{padding-top:18px}.chapter{top:75px}.chapter h2{font-size:23px}.chapter p{display:none}#intro-bottom{bottom:16px}#final-mark{width:90px;margin-bottom:20px}.end-line,#ending>span{display:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition-duration:.1s!important;animation:none!important}.grain{display:none}}

@media(hover:hover) and (pointer:fine){
.interact::after,.primary:focus-visible::after{content:"(Enter)";position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%);font-size:10px;font-weight:400;letter-spacing:.06em;color:#a8c9b7;white-space:nowrap;pointer-events:none}
.primary{position:relative}
.interact>span{display:none}
}

.mouse-look{display:none}
@media(hover:hover) and (pointer:fine){.touch-look{display:none}.mouse-look{display:inline}}

.walk-tip{display:inline-block;margin-top:8px;font-size:inherit;letter-spacing:inherit}

#controls small .walk-tip{margin-left:0;text-align:left}

/* Draw action arrows as geometry so mobile cannot substitute emoji. */
.arrow-icon{display:inline-block;position:relative;width:1em;height:1em;flex:none;vertical-align:-.1em;letter-spacing:0;margin-left:.35em}
.arrow-icon::before{content:"";position:absolute;right:0;top:0;width:.68em;height:.68em;border-top:1px solid currentColor;border-right:1px solid currentColor}
.arrow-icon::after{content:"";position:absolute;left:0;bottom:0;width:1.3em;height:1px;background:currentColor;transform-origin:left center;transform:rotate(-45deg)}
.primary .arrow-icon{font-size:14px}

/* Glow lives on the full viewport, outside the image and its wrapper. */
.final-mark-halo{position:relative;margin-bottom:35px}
#final-mark{display:block;filter:none;margin-bottom:0}
#ending::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle clamp(105px,24vw,235px) at 50% var(--glow-y,38%),rgba(162,237,191,.14) 0%,rgba(162,237,191,.055) 35%,rgba(162,237,191,0) 100%)}
#ending>*{z-index:1}
@media(max-height:500px){.final-mark-halo{margin-bottom:20px}}

@media(any-pointer:coarse),(max-width:1024px){#danger{bottom:max(125px,calc(env(safe-area-inset-bottom) + 110px))}}

#sound span{display:inline-block;width:3ch;text-align:right}
