:root{--ink:#05040e;--gold:#ffd98a;--gold-soft:#ffeec4;--glow:#ffb43c8c;color-scheme:dark}*{box-sizing:border-box}html,body{background:var(--ink);height:100%;color:var(--gold-soft);overscroll-behavior:none;margin:0;font-family:Quicksand,Segoe UI,system-ui,sans-serif;overflow:hidden}#scene{touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}#intro{z-index:10;text-align:center;background:radial-gradient(circle at 50% 45%, #281804bf, var(--ink) 65%);place-content:center;justify-items:center;gap:1.5rem;padding:2rem;transition:opacity 1.1s,visibility 1.1s;display:grid;position:fixed;inset:0}#intro[hidden]{opacity:0;visibility:hidden;pointer-events:none;display:grid}#intro h1{color:var(--gold);text-shadow:0 0 28px var(--glow), 0 0 70px #ff961e59;margin:0;font-family:Great Vibes,Segoe Script,cursive;font-size:clamp(2.6rem,9vw,5.5rem);font-weight:400;line-height:1.1}#intro p{letter-spacing:.06em;color:#ffeec4b8;max-width:34ch;margin:0;font-size:clamp(.95rem,2.6vw,1.15rem)}#enter{font:inherit;letter-spacing:.18em;text-transform:uppercase;color:var(--ink);cursor:pointer;background:linear-gradient(135deg,#ffe6a8,#f5b622);border:0;border-radius:999px;margin-top:.5rem;padding:.85rem 2.6rem;font-weight:600;transition:transform .25s,box-shadow .25s;box-shadow:0 0 24px #ffb43c73}#enter:hover,#enter:focus-visible{transform:translateY(-2px)scale(1.03);box-shadow:0 0 38px #ffbe50b3}#enter[disabled]{opacity:.55;cursor:progress;transform:none}#intro .loader{font-size:1.8rem;animation:6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}#ui{z-index:5;padding:1.25rem;padding-bottom:calc(1.25rem + env(safe-area-inset-bottom));opacity:0;pointer-events:none;justify-content:center;align-items:center;gap:1rem;transition:opacity 1.4s .8s;display:flex;position:fixed;inset:auto 0 0}#ui.visible{opacity:1}#hint{letter-spacing:.14em;color:#ffeec480;font-size:.78rem}#sound{pointer-events:auto;width:2.6rem;height:2.6rem;color:var(--gold);cursor:pointer;background:#ffdc9614;border:1px solid #ffdc9640;border-radius:999px;font-size:1.05rem;transition:background .25s}#sound:hover{background:#ffdc962e}@media (width<=640px){#hint{text-align:center;max-width:22ch;font-size:.66rem;line-height:1.5}#heart-hint{padding:.45rem .9rem;font-size:.7rem;transform:translate(-50%,190px)}}@media (prefers-reduced-motion:reduce){#intro .loader{animation:none}}#heart-hint{z-index:6;font:inherit;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);backdrop-filter:blur(3px);cursor:pointer;opacity:0;background:#08051473;border:1px solid #ffd68c4d;border-radius:999px;padding:.5rem 1.1rem;font-size:.78rem;font-weight:600;transition:opacity .9s,background .3s,box-shadow .3s;animation:2.8s ease-in-out infinite hintPulse;position:fixed;top:50%;left:50%;transform:translate(-50%,170px)}#heart-hint.visible{opacity:.85}#heart-hint.lit,#heart-hint:hover{background:#321e0899;box-shadow:0 0 26px #ffb43c66}@keyframes hintPulse{50%{box-shadow:0 0 22px #ffb43c47}}#letter{z-index:20;place-items:center;padding:clamp(.75rem,3vw,2rem);display:none;position:fixed;inset:0}#letter:not([hidden]){display:grid}#letter-backdrop{backdrop-filter:blur(7px);opacity:0;background:#04030cbd;transition:opacity .45s;position:absolute;inset:0}#letter.open #letter-backdrop{opacity:1}#paper{opacity:0;background:linear-gradient(175deg,#fdf8ea 0%,#f7efdb 55%,#f1e6cd 100%);border-radius:4px;width:min(680px,100%);max-height:min(86vh,900px);transition:opacity .45s,transform .55s cubic-bezier(.22,1,.36,1);display:flex;position:relative;transform:translateY(26px)scale(.96)rotate(-.5deg);box-shadow:0 30px 80px #0000008c,0 0 0 1px #785f372e,inset 0 0 60px #bea06929}#letter.open #paper{opacity:1;transform:none}#paper-scroll{color:#2b3a55;scrollbar-width:thin;scrollbar-color:#967d5080 transparent;flex:1;min-height:0;padding:clamp(2rem,5vw,3.2rem) clamp(1.5rem,5vw,3rem);font-family:Caveat,Segoe Script,cursive;font-size:clamp(1.25rem,1rem + 1vw,1.65rem);line-height:1.7;position:relative;overflow-y:auto}#paper-scroll:focus-visible{outline-offset:-6px;outline:2px solid #5a78b480}#paper-scroll::-webkit-scrollbar{width:8px}#paper-scroll::-webkit-scrollbar-thumb{background:#967d5073;border-radius:999px}#paper-scroll h2{color:#1f2d45;margin:0 0 1.2rem;font-size:1.6em;font-weight:600;line-height:1.2}#paper-scroll p{margin:0 0 1.1rem;padding-right:clamp(0rem,6vw,4.5rem)}#paper-scroll .sign{text-align:center;color:#1f2d45;margin-top:2rem;padding-right:0;font-size:1.25em;font-weight:600}#paper-scroll .sprig{opacity:.8;pointer-events:none;width:clamp(54px,9vw,86px);position:absolute;top:2.5rem;right:-.5rem}#paper-scroll .deco{color:#f0c53a;pointer-events:none;font-size:1.5rem;position:absolute}#paper-scroll .deco.a{top:6.5rem;right:1.2rem}#paper-scroll .deco.b{top:22rem;right:1.6rem}#letter-close{z-index:2;color:#6b5c3f;cursor:pointer;background:0 0;border:0;border-radius:999px;width:2.2rem;height:2.2rem;font-size:1.5rem;line-height:1;transition:background .2s,color .2s;position:absolute;top:.35rem;right:.6rem}#letter-close:hover,#letter-close:focus-visible{color:#2b3a55;background:#785f371f}@media (width<=520px){#paper-scroll .sprig,#paper-scroll .deco{display:none}#paper-scroll p{padding-right:0}}@media (prefers-reduced-motion:reduce){#heart-hint{animation:none}#paper{transition:opacity .2s;transform:none}}