:root{--ground: #070908;--sand: #ece8de;--dim: #a9a69d;--line: rgba(236, 232, 222, .28)}*{box-sizing:border-box}html,body{height:100%;margin:0;background:var(--ground);color:var(--sand);overflow:hidden;overscroll-behavior:none}body{font:300 .8rem/1.5 Hanken Grotesk,system-ui,sans-serif;letter-spacing:.02em;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}.serif{font-family:Gowun Batang,Georgia,serif;font-weight:400;letter-spacing:0}.dim{color:var(--dim)}button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}button:focus-visible{outline:1px solid var(--sand);outline-offset:4px}#stage{position:fixed;top:0;right:0;bottom:0;left:0}#view{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}#view{transition:opacity .36s}#stage.cut #view{opacity:0}#view.hot{cursor:pointer}#view:active{cursor:grabbing}.mark,.tools,.views,.plate,.hint,.back,.turn,.strip{position:absolute;margin:0;z-index:2;text-shadow:0 0 12px #000,0 0 3px #000;transition:opacity .4s}.mark{top:calc(1.1rem + env(safe-area-inset-top));left:1.4rem;display:flex;flex-direction:column;gap:.05rem}.mark .serif{font-size:1.05rem}.tools{top:calc(1.1rem + env(safe-area-inset-top));right:1.4rem;display:flex;align-items:center;gap:1rem;font-variant-numeric:tabular-nums}.tools .sound{display:flex;align-items:center;padding:.3rem 0;opacity:.55;transition:opacity .2s}.tools .sound[aria-pressed=true]{opacity:1}.tools .sound svg{display:block;overflow:visible}.views{left:1.4rem;bottom:calc(1.2rem + env(safe-area-inset-bottom));display:flex;gap:1.2rem}.views button{color:var(--dim);padding:.3rem 0;border-bottom:1px solid transparent;transition:color .2s,border-color .2s}.views button:hover{color:var(--sand)}.views button[aria-pressed=true]{color:var(--sand);border-bottom-color:var(--line)}.hint{right:1.4rem;bottom:calc(1.5rem + env(safe-area-inset-bottom));text-align:right;max-width:46vw}.plate{left:50%;bottom:calc(4.6rem + env(safe-area-inset-bottom));transform:translate(-50%);text-align:center;pointer-events:none;white-space:nowrap}.plate p{margin:0}.plate .num{font-size:2.6rem;line-height:1.1;font-variant-numeric:tabular-nums}.plate .num .dim{font-size:1rem}.plate .kind{letter-spacing:.14em;text-transform:uppercase;font-size:.7rem;margin-top:.3rem}.plate[hidden],.turn[hidden],.strip[hidden],.back[hidden],.stick[hidden]{display:none}.back{left:50%;top:calc(1.2rem + env(safe-area-inset-top));transform:translate(-50%);color:var(--dim);padding:.3rem 0;border-bottom:1px solid var(--line)}.back:hover{color:var(--sand)}.turn{top:0;right:0;bottom:0;left:0;pointer-events:none;display:flex;align-items:center;justify-content:space-between;padding:0 1.4rem}.turn button{pointer-events:auto;font-size:1.3rem;width:3rem;height:3rem;color:var(--dim)}.turn button:hover{color:var(--sand)}.strip{left:50%;bottom:calc(3.7rem + env(safe-area-inset-bottom));transform:translate(-50%);width:min(92vw,62rem);display:grid;grid-template-columns:repeat(100,1fr);gap:2px}.strip i{display:block;aspect-ratio:1;border-radius:50%;cursor:pointer;opacity:.55;transition:transform .2s,opacity .2s}.strip i:hover{opacity:1;transform:scale(1.8)}.strip i.on{opacity:1;transform:scale(2.2);box-shadow:0 0 0 1px var(--ground),0 0 0 2px var(--sand)}@media(max-width:700px){.strip{grid-template-columns:repeat(40,1fr);gap:3px;bottom:calc(3.4rem + env(safe-area-inset-bottom))}.plate.high{bottom:calc(9.6rem + env(safe-area-inset-bottom))}.hint,.tools .found{display:none}}@media(min-width:701px){.plate.high{bottom:calc(7.2rem + env(safe-area-inset-bottom))}}.stick{position:absolute;z-index:2;left:2rem;bottom:calc(4.6rem + env(safe-area-inset-bottom));width:6.4rem;height:6.4rem;border:1px dotted var(--line);border-radius:50%;touch-action:none}.stick i{position:absolute;left:50%;top:50%;width:2.2rem;height:2.2rem;margin:-1.1rem;border:1px solid var(--dim);border-radius:50%}#stage.idle .mark,#stage.idle .tools,#stage.idle .views,#stage.idle .hint,#stage.idle .back,#stage.idle .turn,#stage.idle .strip{opacity:0;transition-duration:2.5s}#stage.intro .tools .found,#stage.intro .views,#stage.intro .hint,#stage.intro .mark{opacity:0;pointer-events:none}.door{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.9rem;padding:2rem;text-align:center;background:var(--ground);transition:opacity 1.6s,visibility 1.6s}.door.gone{opacity:0;visibility:hidden;pointer-events:none}.door video{width:min(46vw,15rem);aspect-ratio:1;object-fit:cover;mix-blend-mode:screen}.door h1{margin:0;font-size:clamp(1.6rem,5vw,2.4rem);line-height:1.15}.door p{margin:0;max-width:30rem}.door .small{font-size:.72rem}.door button{margin-top:.6rem;padding:.55rem 1.5rem;border:1px solid var(--line);border-radius:2rem;transition:border-color .2s,opacity .3s}.door button:disabled{opacity:.5;cursor:default;border-style:dotted}.door button:not(:disabled):hover{border-color:var(--sand)}@media(prefers-reduced-motion:reduce){*{transition-duration:.01s!important}}
