.room{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:36px 20px 64px;position:relative}.sky{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:-2;image-rendering:pixelated}.sky-dim{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;background:#0a081c57;pointer-events:none}.scene{width:min(100%,680px)}.cover,.letter{background-color:#f4e4bc;background-image:linear-gradient(rgba(28,20,40,.05) 2px,transparent 2px),linear-gradient(90deg,rgba(28,20,40,.05) 2px,transparent 2px);background-size:8px 8px;color:#1c1428;border:4px solid #1c1428;border-radius:0;box-shadow:8px 8px #120e18}.cover{width:min(100%,360px);margin:0 auto;transition:opacity .45s ease,transform .45s ease}.is-leaving .cover{opacity:0;transform:translateY(-12px);pointer-events:none}.cover-frame{margin:12px;min-height:420px;border:4px solid #1c1428;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:32px 18px;gap:18px}.kicker{margin:0;font-family:"Press Start 2P",monospace;font-size:10px;font-weight:400;letter-spacing:0;line-height:1.7;text-transform:uppercase;color:#6a3d58}.cover-name{margin:0;font-family:Pixelify Sans,Segoe UI,sans-serif;font-weight:700;font-size:clamp(2.6rem,8vw,3.5rem);line-height:1;letter-spacing:0;max-width:12ch}.seal{width:108px;height:108px;margin-top:8px;border:4px solid #1c1428;border-radius:0;cursor:pointer;color:#fff1d4;background:#c44848;box-shadow:inset 0 0 0 4px #e07068,inset 0 0 0 8px #8d2428,6px 6px #1c1428;font-family:"Press Start 2P",monospace;font-size:9px;letter-spacing:0;text-transform:uppercase;line-height:1.4}.seal:hover{transform:translate(3px,3px);box-shadow:inset 0 0 0 4px #e07068,inset 0 0 0 8px #8d2428,3px 3px #1c1428}.seal:focus-visible,.fold:focus-visible{outline:4px solid #f0d78c;outline-offset:4px}.hint{margin:0;color:#5c4560;font-size:1.15rem;letter-spacing:0}.column{display:flex;flex-direction:column;align-items:center;animation:letter-in .45s steps(6,end)}.letter{width:min(100%,640px);padding:28px 24px 26px}.letter-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}.photo{display:block;width:148px;height:148px;object-fit:cover;flex:0 0 auto;border:4px solid #1c1428;box-shadow:6px 6px #1c1428;background:#c17b7b}.letter h1{display:flex;flex-direction:column;margin:0 0 1rem;font-family:Pixelify Sans,Segoe UI,sans-serif;font-weight:700;font-size:clamp(1.85rem,4vw,2.5rem);line-height:1.05;letter-spacing:0}.title-line{white-space:nowrap}.letter h1 em{font-style:normal;color:#b84458}.letter p{margin:0 0 1rem;font-family:Pixelify Sans,Segoe UI,sans-serif;font-size:1.35rem;line-height:1.35;font-weight:500}.signoff{margin-top:1.4rem!important;margin-bottom:.2rem!important;color:#6a3d58}.from{margin-top:0!important;font-size:1.55rem!important;font-weight:700}.next{display:block;width:100%;margin-top:1.5rem;background:#241c3e;color:#f6edd4;border:4px solid #1c1428;box-shadow:4px 4px #1c1428;font-family:"Press Start 2P",monospace;font-size:10px;line-height:1.7;padding:14px 12px;cursor:pointer}.next:hover,.click-here:hover{transform:translate(2px,2px)}.next:hover{box-shadow:2px 2px #1c1428}.next:focus-visible,.click-here:focus-visible{outline:4px solid #f0d78c;outline-offset:4px}.next-panel{margin-top:12px;padding:14px 12px 12px;background:#f7f0dc;border:4px solid #1c1428;box-shadow:4px 4px #6d8fd4}.footnote{margin:0 0 12px!important;font-size:1.15rem!important;line-height:1.35!important;color:#1c1428}.click-here{display:inline-block;background:#c44848;color:#fff1d4;border:4px solid #1c1428;box-shadow:3px 3px #1c1428;text-decoration:none;font-family:"Press Start 2P",monospace;font-size:8px;line-height:1.6;padding:8px 10px}.click-here:hover{box-shadow:1px 1px #1c1428}.wishes{list-style:none;display:flex;flex-wrap:wrap;gap:.45rem 0;margin:1.6rem 0 0;padding:1rem 0 0;border-top:4px solid #1c1428}.wishes li{font-size:1.05rem;color:#5c4560}.wishes li:not(:last-child):after{content:"·";margin:0 .7rem;color:#c44848}.fold{margin-top:22px;background:#1c1428;border:4px solid #f0d78c;color:#f6edd4;cursor:pointer;font-family:"Press Start 2P",monospace;letter-spacing:0;text-transform:uppercase;font-size:10px;padding:12px 16px;box-shadow:4px 4px #120e18}.fold:hover{transform:translate(2px,2px);box-shadow:2px 2px #120e18}.confetti{position:fixed;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none;z-index:3}.confetti span{position:absolute;top:-16px;animation-name:fall;animation-timing-function:steps(28,end);animation-fill-mode:forwards}@keyframes fall{to{transform:translate3d(var(--drift),108vh,0);opacity:.15}}@keyframes letter-in{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}@media(min-width:700px){.letter{padding:36px 40px 32px}}@media(max-width:560px){.letter-top{align-items:flex-start}.title-line{white-space:normal}.photo{width:120px;height:120px}.kicker{font-size:8px}.wishes{flex-direction:column;align-items:flex-start;gap:.35rem}.wishes li:not(:last-child):after{content:none}}@media(prefers-reduced-motion:reduce){.cover,.column,.seal,.fold{transition:none;animation:none}.confetti{display:none}}*,*:before,*:after{box-sizing:border-box}html,body,#root{min-height:100%}html{background:#0c1020}body{margin:0;min-height:100vh;color:#f6edd4;font-family:Pixelify Sans,Segoe UI,sans-serif}button{font:inherit}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}