.di-hearts{z-index:4;pointer-events:none;position:absolute;inset:0;overflow:hidden}.di-hearts span{color:#e83e8c;font-size:var(--di-size);opacity:0;animation:di-heart 1.4s ease-out var(--di-delay) forwards;line-height:1;position:absolute;inset-block-start:50%;inset-inline-start:50%}@keyframes di-heart{0%{opacity:1;transform:translate(-50%, -50%) rotate(var(--di-angle)) translateY(0) scale(.4)}70%{opacity:1}to{opacity:0;transform:translate(-50%, -50%) rotate(var(--di-angle)) translateY(calc(var(--di-distance) * -1)) scale(1.1)}}.di-kiss{font-size:2.4rem;animation:.9s ease-out both di-kiss;display:inline-block}@keyframes di-kiss{0%{opacity:0;transform:scale(.3)rotate(-20deg)}60%{opacity:1;transform:scale(1.3)rotate(8deg)}to{opacity:1;transform:none}}.di-step{animation:.36s ease-out both di-step}@keyframes di-step{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}.di-options{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;width:min(100%,520px);display:grid}.di-option{border:2px solid color-mix(in srgb, currentColor 18%, transparent);min-height:56px;color:inherit;cursor:pointer;font:inherit;text-align:center;background:#ffffffb8;border-radius:16px;place-items:center;gap:2px;padding:10px 14px;font-weight:700;transition:transform .14s,border-color .14s;display:grid}.di-option:hover,.di-option:focus-visible{border-color:currentColor;transform:translateY(-2px)}.di-option span{opacity:.75;font-size:.9rem}.di-own{background:0 0;border-style:dashed}.di-pick{justify-items:center;gap:12px;width:min(100%,320px);display:grid}.di-pick label{text-align:start;gap:4px;width:100%;font-weight:700;display:grid}.di-pick input{border:2px solid color-mix(in srgb, currentColor 20%, transparent);color:#1d1b20;min-height:48px;font:inherit;background:#ffffffd9;border-radius:12px;padding:8px 12px}.di-pick .yes-no-button:disabled{opacity:.5;cursor:not-allowed}.di-note{opacity:.8}@media (prefers-reduced-motion:reduce){.di-hearts,.di-kiss,.di-step{animation:none}.di-hearts{display:none}}.di-times{gap:8px;display:grid}.di-time-row{align-items:center;gap:8px;display:flex}.di-time-row input{flex:1;min-width:0}.di-chips{flex-wrap:wrap;gap:8px;display:flex}.di-chip{border:1px solid var(--line,#d0d5dd);min-height:40px;color:inherit;cursor:pointer;font:inherit;background:0 0;border-radius:999px;padding:6px 12px;font-size:.9rem;font-weight:700}.di-chip[aria-pressed=true]{background:#e83e8c24;border-color:#e83e8c}.di-gate{z-index:6;background:color-mix(in srgb, var(--di-accent) 14%, #ffffffd1);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);text-align:center;touch-action:none;place-content:center;justify-items:center;gap:16px;padding:24px;transition:opacity .42s,transform .42s;display:grid;position:absolute;inset:0}.di-gate[data-leaving=true]{opacity:0;pointer-events:none;transform:scale(1.04)}.di-gate-title{font-family:var(--font-display), var(--font-ui), sans-serif;margin:0;font-size:clamp(1.5rem,5vw,2.2rem)}.di-gate-hint{opacity:.8;margin:0;font-weight:700}.di-gate-open{min-height:40px;color:inherit;cursor:pointer;font:inherit;opacity:.7;background:0 0;border:1px solid;border-radius:999px;padding:6px 16px;font-size:.9rem}.di-gate-open:focus-visible{outline:3px solid var(--di-accent);outline-offset:3px;opacity:1}.di-gift{aspect-ratio:1;background:var(--di-accent);width:min(70vw,260px);box-shadow:0 18px 40px color-mix(in srgb, var(--di-accent) 40%, transparent);cursor:grab;border-radius:18px;position:relative}.di-ribbon-h,.di-ribbon-v{opacity:calc(1 - var(--di-progress));background:#fff3bf;position:absolute}.di-ribbon-h{height:28px;transform:scaleX(calc(1 - var(--di-progress) * .6));inset-block-start:calc(50% - 14px);inset-inline:0}.di-ribbon-v{width:28px;inset-block:0;inset-inline-start:calc(50% - 14px)}.di-bow{transform:translateX(calc(var(--di-progress) * 120%)) rotate(calc(var(--di-progress) * 40deg));font-size:80px;line-height:1;position:absolute;inset-block-start:calc(50% - 40px);inset-inline-start:calc(50% - 40px)}[dir=rtl] .di-bow{transform:translateX(calc(var(--di-progress) * -120%)) rotate(calc(var(--di-progress) * -40deg))}.di-heart{cursor:pointer;width:min(56vw,220px);filter:drop-shadow(0 12px 24px color-mix(in srgb, var(--di-accent) 40%, transparent));transform:scale(calc(1 + var(--di-progress) * .12));-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.di-heart svg{width:100%;display:block}.di-gate[data-kind=fog]{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:0 0}.di-fog{cursor:crosshair;width:100%;height:100%;position:absolute;inset:0}.di-gate[data-kind=fog] :is(.di-gate-title,.di-gate-hint,.di-gate-open){z-index:1;pointer-events:none;position:relative}.di-gate[data-kind=fog] .di-gate-open{pointer-events:auto}.di-envelope{cursor:grab;width:min(70vw,260px);height:200px;position:relative}.di-note{transform:translateY(calc(var(--di-progress) * -70px));font-size:96px;line-height:1;position:absolute;inset-block-end:40px;inset-inline:0}.di-pocket{background:var(--di-accent);height:90px;box-shadow:0 14px 30px color-mix(in srgb, var(--di-accent) 40%, transparent);border-radius:0 0 18px 18px;position:absolute;inset-block-end:0;inset-inline:0}.di-vibe{z-index:0;pointer-events:none;position:absolute;inset:0;overflow:hidden}.di-vibe span{position:absolute;inset-block-start:var(--y);inset-inline-start:var(--x)}.di-vibe[data-vibe=petals] span,.di-vibe[data-vibe=hearts] span{color:#ff78a08c;font-size:calc(18px * var(--s));animation:di-fall var(--d) linear var(--delay) infinite;inset-block-start:-10%}.di-vibe[data-vibe=hearts] span{color:#e83e8c73;animation-name:di-rise;inset-block:auto -10%}.di-vibe[data-vibe=stars] span{width:3px;height:3px;animation:di-twinkle calc(var(--d) / 3) ease-in-out var(--delay) infinite;background:#fff;border-radius:50%;box-shadow:0 0 6px #fff}.di-vibe[data-vibe=bokeh] span{width:calc(70px * var(--s));height:calc(70px * var(--s));filter:blur(6px);animation:di-drift var(--d) ease-in-out var(--delay) infinite alternate;background:#ffffff47;border-radius:50%}.di-vibe[data-vibe=aurora] span{filter:blur(30px);width:80%;height:60%;animation:di-drift calc(var(--d) * 2) ease-in-out var(--delay) infinite alternate;background:radial-gradient(closest-side,#78dcc866,#0000);border-radius:50%;inset-block-start:calc(var(--y) - 30%);inset-inline-start:calc(var(--x) - 30%)}.di-vibe[data-vibe=aurora] span:nth-child(2){background:radial-gradient(closest-side,#aa8cff66,#0000)}.di-vibe[data-vibe=aurora] span:nth-child(3){background:radial-gradient(closest-side,#ffa0c859,#0000)}.yes-no-stage>.yes-no-card{z-index:1;position:relative}@keyframes di-fall{to{transform:translateY(120vh)rotate(360deg)}}@keyframes di-rise{to{opacity:0;transform:translateY(-120vh)scale(1.2)}}@keyframes di-twinkle{50%{opacity:.2;transform:scale(.6)}}@keyframes di-drift{to{transform:translate(40px,-30px)scale(1.15)}}@media (prefers-reduced-motion:reduce){.di-vibe span{animation:none}.di-gate{transition:none}}.yes-no-stage[data-preview=true] .di-gate{gap:10px;padding:14px}.yes-no-stage[data-preview=true] :is(.di-gift,.di-envelope){width:150px}.yes-no-stage[data-preview=true] .di-heart{width:130px}.yes-no-stage[data-preview=true] .di-envelope{height:150px}.yes-no-stage[data-preview=true] .di-note{font-size:72px}.yes-no-stage[data-preview=true] .di-bow{font-size:56px;inset-block-start:calc(50% - 28px);inset-inline-start:calc(50% - 28px)}.yes-no-stage[data-preview=true] .di-gate-title{font-size:1.3rem}@media (max-height:640px){:is(.di-gift,.di-envelope){width:min(56vw,180px)}.di-heart{width:min(44vw,160px)}}.di-album{scroll-snap-type:x mandatory;gap:12px;width:min(100%,560px);padding-block-end:6px;display:flex;overflow-x:auto}.di-album figure{color:#3b1030;scroll-snap-align:center;background:#fffdf7;border-radius:6px;flex:0 0 min(72%,280px);margin:0;padding:8px 8px 12px;box-shadow:0 10px 22px #3b103026}.di-album img{aspect-ratio:4/5;object-fit:cover;border-radius:3px;width:100%;display:block}.di-album figcaption{text-align:center;overflow-wrap:anywhere;margin-block-start:8px;font-weight:700}.di-secret{min-height:48px;color:inherit;cursor:pointer;font:inherit;background:#fff9;border:2px dashed;border-radius:999px;align-items:center;gap:10px;padding:0 20px;font-weight:800;display:inline-flex}.di-secret-note{color:#3b1030;background:#fffdf7;border-radius:6px;gap:8px;width:min(100%,420px);margin:0;padding:20px 22px;animation:.36s ease-out both di-step;display:grid;box-shadow:0 14px 30px #3b103029}.di-secret-note figcaption{font-family:var(--font-display), var(--font-ui), sans-serif;font-weight:800}.di-secret-note blockquote{white-space:pre-line;overflow-wrap:anywhere;margin:0;line-height:1.5}.di-album-row{align-items:center;gap:8px;display:flex}.di-album-row img{object-fit:cover;border-radius:8px;flex:none;width:48px;height:48px}.di-album-row input{flex:1;min-width:0}.voice-note{color:#3b1030;background:#ffffffd9;border-radius:999px;align-items:center;gap:12px;margin:0;padding:8px 16px 8px 8px;display:inline-flex;box-shadow:0 8px 22px #3b103026}.voice-note-play{color:#fff;cursor:pointer;background:#e83e8c;border:0;border-radius:50%;flex:none;place-items:center;width:44px;height:44px;display:grid}.voice-note-wave{align-items:center;gap:3px;height:32px;display:flex}.voice-note-wave i{background:#3b103047;border-radius:2px;width:3px;transition:background-color .12s;display:block}.voice-note-wave i[data-on]{background:#e83e8c}.voice-note[data-playing] .voice-note-play{animation:1.4s ease-in-out infinite voice-pulse}.voice-note-time{font-variant-numeric:tabular-nums;font-size:.85rem;font-weight:700}.di-voice{justify-items:center;gap:8px;margin-top:14px;display:grid}.di-voice p{margin:0;font-weight:700}.voice-recorder-row{align-items:center;gap:8px;display:flex}.voice-recording b{font-variant-numeric:tabular-nums}.voice-recording svg{color:#e03131;animation:1s ease-in-out infinite voice-pulse}@keyframes voice-pulse{50%{box-shadow:0 0 0 8px #e83e8c2e}}@media (prefers-reduced-motion:reduce){.voice-note[data-playing] .voice-note-play,.voice-recording svg{animation:none}}