@font-face{font-family:"GalmuriMono11";src:url("../assets/fonts/GalmuriMono11.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
/* Easy changes: colors, character width, and the mobile page width. */
:root{--paper:#fffaf5;--rose:#ab5365;--rose-dark:#874350;--rose-light:#edb7bd;--ink:#4d3837;--muted:#856764;--track:#f3e4df;--character-size:270px;--page-width:440px}
*{box-sizing:border-box}html{background:#f5eee8;color:var(--ink);font-family:"GalmuriMono11",monospace;font-synthesis:none;-webkit-text-size-adjust:100%;scrollbar-color:var(--rose-light) var(--paper)}body{margin:0;min-height:100svh;display:grid;place-items:center}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid var(--rose);outline-offset:6px}::selection{background:#f0c7ce;color:var(--ink)}[hidden]{display:none!important}.symbols{position:absolute;width:0;height:0;overflow:hidden}.icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.birthday{position:relative;isolation:isolate;overflow:hidden;width:100%;max-width:var(--page-width);min-height:100svh;background:var(--paper);padding:max(28px,env(safe-area-inset-top)) 32px max(28px,env(safe-area-inset-bottom));display:flex;flex-direction:column;align-items:center;justify-content:center}
.intro{width:100%;text-align:center;margin-top:0;z-index:2}.intro h1{font-size:36px;font-weight:500;letter-spacing:-.035em;line-height:1.42;margin:0;text-wrap:balance;transition:color .3s}.ellipsis{color:var(--rose)}
.scene{width:calc(100% + 64px);height:300px;position:relative;flex-shrink:0;margin-top:clamp(24px,3svh,32px);display:grid;place-items:center}.scene-glow{position:absolute;width:280px;height:240px;bottom:9px;border-radius:50%;background:#fff0e9;opacity:.65;transform:scale(calc(1 + var(--charge,0)*.12));transition:background .4s}.ground{position:absolute;bottom:44px;width:143px;height:13px;background:#eddfd7;border-radius:50%;opacity:.65;transition:transform .2s}.character-button{position:absolute;bottom:20px;width:var(--character-size);height:calc(var(--character-size)*1.0625);padding:0;border:0;background:none;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}.character{display:block;width:100%;height:100%;pointer-events:none;object-fit:contain;transform-origin:50% 85%;animation:breathe 3s ease-in-out infinite}.speech{position:absolute;top:0;right:24px;width:132px;height:83px;display:grid;place-items:center;padding:0 15px 20px;font-size:16px;color:#623e37;z-index:2;line-height:1.4;isolation:isolate;pointer-events:none;transform:rotate(-2deg);transition:transform .25s}.speech-outline{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:-1}.speech-contour{fill:#fffdf9;stroke:#765047;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}.speech-fluster{fill:none;stroke:#765047;stroke-width:1.8;stroke-linecap:round;opacity:0}.speech span{display:block;text-align:center;white-space:nowrap}.birthday[data-state=nervous] .speech-fluster,.birthday[data-state=teary] .speech-fluster{opacity:1}.birthday[data-state=teary] .speech-contour{stroke:#ab6570}.birthday[data-state=teary] .speech{color:#985566}
.scene-star{position:absolute;fill:none;stroke:#c99575;stroke-width:1.2;stroke-linejoin:round;width:22px;height:22px}.star-one{left:56px;top:97px;transform:rotate(12deg)}.star-two{right:60px;bottom:72px;width:14px;height:14px;stroke:#cdaa86}.scene-heart{position:absolute;left:85px;bottom:65px;width:14px;height:14px;fill:#efc7c9;stroke:#d6a4a9;stroke-width:1.1;transform:rotate(-19deg)}.shake-lines{position:absolute;width:290px;height:270px;bottom:12px;pointer-events:none;opacity:0}.scene-caption{display:flex;align-items:center;justify-content:center;gap:7px;color:var(--muted);font-size:12px;min-height:22px;margin-top:8px}.tiny-heart svg{width:11px;height:11px;fill:none;stroke:#ba7b83;stroke-width:1.6;display:block}
.controls{width:100%;margin-top:clamp(24px,4svh,36px)}.meter-meta{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#85635f;margin-bottom:13px}.meter-meta strong{font-weight:500;font-size:15px;font-variant-numeric:tabular-nums;color:var(--rose)}.percent-mark{font-size:11px;margin-left:3px;color:var(--rose)}.meter{position:relative;width:100%;height:7px;border-radius:10px;background:var(--track)}.meter-fill{height:100%;width:0;border-radius:inherit;background:var(--rose-light)}.meter-heart{position:absolute;left:0;top:-5px;width:17px;height:17px;fill:var(--rose);stroke:var(--paper);stroke-width:2;transform:translateX(-35%);opacity:0}.hold-button,.replay-button{width:100%;height:65px;border:0;border-radius:20px;display:flex;align-items:center;justify-content:center;gap:10px;font-size:15px;font-weight:600;margin-top:26px;transition:background .2s,transform .2s,box-shadow .2s}.hold-button{background:var(--rose);color:#fff9f6;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;box-shadow:0 5px 0 #9b4d5b}.hold-button .icon{width:20px;height:20px}.hold-button:hover{background:#a75162}.hold-button:active,.birthday.holding .hold-button{transform:translateY(4px);box-shadow:0 1px 0 #9b4d5b;background:#a14f60}.hold-dots{display:none;gap:3px;margin-left:2px}.hold-dots i{width:3px;height:3px;background:currentColor;border-radius:50%;animation:dots 1s ease-in-out infinite}.hold-dots i:nth-child(2){animation-delay:.15s}.hold-dots i:nth-child(3){animation-delay:.3s}.holding .hold-dots{display:flex}.replay-button{background:#f6e5e2;color:var(--rose-dark);box-shadow:none}.replay-button:hover{background:#f0d7d6}.replay-button:active{transform:scale(.98)}
.birthday[data-state=shy] .character{animation:shy 1.1s ease-in-out infinite}.birthday[data-state=nervous] .character{animation:tremble .19s linear infinite}.birthday[data-state=teary] .character{animation:tremble .14s linear infinite}.birthday[data-state=nervous] .shake-lines,.birthday[data-state=teary] .shake-lines{opacity:0}.birthday[data-state=teary] .scene-glow{background:#fbe2e4}.holding .speech{transform:rotate(0deg) translateY(-2px)}
.burst-message{position:absolute;top:2px;left:0;width:100%;text-align:center;z-index:8;color:var(--rose);pointer-events:none;visibility:hidden}.burst-message small{display:block;margin-bottom:7px;font-size:21px;line-height:1.1;letter-spacing:.02em;-webkit-text-stroke:4px var(--paper);paint-order:stroke fill}.burst-message span,.burst-message strong{display:block;font-size:64px;font-weight:700;line-height:1.08;letter-spacing:-.04em;-webkit-text-stroke:7px var(--paper);paint-order:stroke fill}.burst-message strong{font-size:70px}.burst-message svg{position:absolute;right:36px;top:9px;width:29px;height:29px;fill:#e997a5;stroke:var(--paper);stroke-width:3;transform:rotate(20deg)}.birthday[data-phase=burst] .burst-message{visibility:visible;animation:shout 1.35s cubic-bezier(.16,1,.3,1) both}.birthday[data-phase=burst] .character{animation:jump .48s cubic-bezier(.16,1,.3,1) infinite}.birthday[data-phase=burst] .speech,.birthday[data-phase=burst] .scene-star,.birthday[data-phase=burst] .scene-heart{opacity:0}.birthday[data-phase=burst] .ground{transform:scale(.7)}.birthday[data-phase=burst] .hold-button{background:#ca8b96;box-shadow:none;transform:none;cursor:default}.birthday[data-phase=burst] .intro{opacity:.25}
.party-scene{position:absolute;inset:0;display:grid;place-items:end center;z-index:3;pointer-events:none}.party-scene img{width:100%;height:auto;max-height:300px;object-fit:contain}.birthday[data-phase=party] .party-scene{animation:party-in .6s cubic-bezier(.16,1,.3,1) both}.birthday[data-phase=party] .party-scene img{animation:party-bob 2.8s ease-in-out .6s infinite}.birthday[data-phase=party] .character-button,.birthday[data-phase=party] .speech,.birthday[data-phase=party] .shake-lines,.birthday[data-phase=party] .ground{display:none}.birthday[data-phase=party] .intro h1{color:#000;font-weight:600}.birthday[data-phase=party] .scene-glow{background:#fce8e4;width:310px}.birthday[data-phase=party] .meter-fill{background:#df9ca8}.birthday[data-phase=party] .scene-star{stroke:#bf8a6b}.birthday[data-phase=party] .scene-caption{color:var(--rose-dark)}
.particles{position:absolute;inset:-230px -20px -240px;z-index:7;pointer-events:none;overflow:hidden}.particle{position:absolute;top:49%;left:50%;width:8px;height:13px;background:var(--particle-color);border-radius:2px;animation:confetti var(--duration) cubic-bezier(.16,.65,.4,1) var(--delay) both}.particle.heart{width:17px;height:17px;background:none;fill:var(--particle-color)}.particle.spark{width:21px;height:21px;background:none;fill:none;stroke:var(--particle-color);stroke-width:1.6}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@keyframes breathe{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-3px) scale(1.012,.994)}}@keyframes shy{0%,100%{transform:rotate(-1deg)}50%{transform:rotate(1deg) translateY(2px)}}@keyframes tremble{0%,100%{transform:translateX(-1.5px) rotate(-.5deg)}50%{transform:translateX(1.5px) rotate(.5deg)}}@keyframes dots{0%,100%{opacity:.35;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}@keyframes jump{0%,100%{transform:translateY(8px) scale(1.05,.94)}45%{transform:translateY(-28px) scale(.97,1.04)}}@keyframes shout{0%{transform:scale(.4) rotate(-7deg);opacity:0}20%{transform:scale(1.06) rotate(3deg);opacity:1}35%,85%{transform:scale(1) rotate(-3deg);opacity:1}100%{transform:scale(1.12);opacity:0}}@keyframes party-in{from{transform:translateY(45px) scale(.85);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}@keyframes party-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}@keyframes confetti{0%{transform:translate(0,0) rotate(0);opacity:0}8%{opacity:1}70%{opacity:1}100%{transform:translate(var(--dx),var(--dy)) rotate(var(--spin));opacity:0}}
@media(min-width:600px){body{padding:24px 0}.birthday{min-height:min(820px,calc(100svh - 48px));border-radius:32px;box-shadow:0 18px 70px #73544812}}
@media(max-height:760px){.intro h1{font-size:30px;line-height:1.35}.scene{height:250px;margin-top:24px;--character-size:230px}.controls{margin-top:24px}.hold-button,.replay-button{height:60px;margin-top:22px}.speech{top:-4px;right:22px;width:120px;height:76px;font-size:16px}.scene-glow{width:260px;height:220px}.party-scene img{max-height:250px}}
@media(max-height:700px){.scene{height:240px;--character-size:220px}.speech{top:-3px;right:22px;width:114px;height:73px;padding:0 12px 18px;font-size:15px}.scene-glow{height:210px;width:250px}.party-scene img{max-height:240px}.burst-message span{font-size:53px}.burst-message strong{font-size:60px}}
@media(max-height:620px){.birthday{padding-top:max(20px,env(safe-area-inset-top));padding-bottom:max(20px,env(safe-area-inset-bottom))}.intro h1{font-size:26px}.scene{height:200px;margin-top:18px;--character-size:180px}.scene-glow{height:165px;width:215px}.scene-caption{font-size:11px;margin-top:6px}.controls{margin-top:20px}.hold-button,.replay-button{height:54px;margin-top:18px}.meter-meta{margin-bottom:10px}.party-scene img{max-height:200px}.speech{right:18px;top:-3px;width:106px;height:68px;font-size:14px}.burst-message span{font-size:45px}.burst-message strong{font-size:52px}}
@media(max-width:350px){.birthday{padding-left:25px;padding-right:25px}.scene{width:calc(100% + 50px)}.intro h1{font-size:29px}.speech{right:14px}.hold-button{font-size:14px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.birthday[data-phase=burst] .burst-message{animation:none;opacity:1}.particle{display:none}.birthday[data-phase=party] .party-scene{opacity:1}}
/* Shared cards: text stays in the link, with no server or browser storage. */
.composer,.link-panel{width:100%;margin-top:24px}.field-heading{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:10px;color:var(--rose-dark);font-size:13px}.field-heading span{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}textarea,input{font:inherit;caret-color:var(--rose);color:var(--ink)}textarea{display:block;width:100%;min-height:106px;resize:vertical;padding:14px 15px;border:1.5px solid #d9bcb6;border-radius:14px;background:#fffdf9;font-size:16px;line-height:1.55;outline-offset:3px}textarea:focus{outline:2px solid var(--rose)}textarea[aria-invalid=true]{border-color:#a23d50}textarea::placeholder{color:#967873;opacity:1}.field-help,.link-help,.link-status{font-size:12px;line-height:1.6;color:var(--muted);margin:10px 0 0}.form-error{font-size:12px;line-height:1.5;color:#963b4f;margin:10px 0 0}.action-button,.outline-button{min-height:58px;border:0;border-radius:18px;display:flex;align-items:center;justify-content:center;gap:9px;font:inherit;font-size:15px;line-height:1.4;cursor:pointer;padding:12px 15px}.action-button{background:var(--rose);color:#fffaf5;width:100%;margin-top:20px}.action-button:hover{background:#a14f60}.action-button:active{transform:translateY(2px)}button:disabled{cursor:default;opacity:.45}.outline-button{background:#f4e4df;color:var(--rose-dark)}.outline-button:hover{background:#eed6d1}.text-button{font:inherit;font-size:12px;border:0;background:transparent;color:var(--rose-dark);padding:12px;min-height:44px;cursor:pointer;text-underline-offset:4px}.text-button:hover{text-decoration:underline}.link-help{text-align:center;margin:0 0 14px}.link-input{width:100%;padding:12px;border:1px solid #dfc7c0;border-radius:12px;font-size:16px;background:#fffdf9;text-overflow:ellipsis}.link-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}.link-actions .action-button{margin:0}.link-status{min-height:38px;text-align:center}.secondary-actions{display:flex;justify-content:center;gap:18px}.preview-back{display:block;margin:13px auto -8px}.birthday[data-mode=create] .intro h1,.birthday[data-mode=ready] .intro h1{font-size:30px}.birthday[data-mode=create] .scene,.birthday[data-mode=ready] .scene{height:176px;--character-size:164px;margin-top:20px}.birthday[data-mode=create] .scene-glow,.birthday[data-mode=ready] .scene-glow{width:210px;height:150px}.birthday[data-mode=create] .ground,.birthday[data-mode=ready] .ground{bottom:38px;width:104px}.birthday[data-mode=create] .speech,.birthday[data-mode=ready] .speech{width:106px;height:68px;right:32px;font-size:14px;top:-3px}.birthday[data-mode=create] .star-one,.birthday[data-mode=ready] .star-one{top:60px;left:75px}.birthday[data-mode=create] .star-two,.birthday[data-mode=ready] .star-two{bottom:45px;right:72px}.birthday[data-mode=create] .scene-heart,.birthday[data-mode=ready] .scene-heart{bottom:44px}.birthday[data-mode=create] .character-button,.birthday[data-mode=ready] .character-button{opacity:1;cursor:default}.birthday[data-phase=party] .intro h1{font-size:var(--final-size,32px);line-height:1.4;white-space:pre-line;overflow-wrap:anywhere;max-width:100%}.burst-message #burstText{color:#000;font-size:var(--burst-size,60px);line-height:1.22;white-space:pre-line;overflow-wrap:anywhere;max-width:calc(100% - 32px);margin:0 auto}.birthday.long-message[data-phase=party] .scene{height:200px}.birthday.long-message[data-phase=party] .party-scene img{max-height:200px}
@media(max-height:700px){.birthday[data-mode=create] .scene,.birthday[data-mode=ready] .scene{height:148px;--character-size:140px;margin-top:16px}.birthday[data-mode=create] .scene-glow,.birthday[data-mode=ready] .scene-glow{width:185px;height:130px}.birthday[data-mode=create] .intro h1,.birthday[data-mode=ready] .intro h1{font-size:28px}.composer,.link-panel{margin-top:20px}.action-button,.outline-button{min-height:54px}.birthday[data-mode=create] .speech,.birthday[data-mode=ready] .speech{right:30px}}
@media(max-height:620px){.birthday[data-mode=create] .scene,.birthday[data-mode=ready] .scene{height:120px;--character-size:116px;margin-top:12px}.birthday[data-mode=create] .scene-glow,.birthday[data-mode=ready] .scene-glow{height:105px;width:160px}.birthday[data-mode=create] .intro h1,.birthday[data-mode=ready] .intro h1{font-size:25px}.composer,.link-panel{margin-top:15px}textarea{min-height:90px}.field-help{font-size:11px}.birthday[data-mode=create] .speech,.birthday[data-mode=ready] .speech{right:23px;width:92px;height:60px;font-size:13px}.birthday.long-message[data-phase=party] .scene{height:170px}.birthday.long-message[data-phase=party] .party-scene img{max-height:170px}}

/* Alternate Usagi ending: the bump and Chiika's exit share a contact beat. */
.usagi-takeover{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:visible}
.usagi-takeover img{position:absolute;left:calc(50% - var(--character-size)/2);bottom:20px;width:var(--character-size);height:calc(var(--character-size)*1.0625);object-fit:contain}
.usagi-takeover.entering img{animation:usagi-rush 620ms cubic-bezier(.2,.7,.25,1) both}
.impact-word{position:absolute;left:24%;top:52%;font-size:24px;line-height:1;color:var(--rose);-webkit-text-stroke:5px var(--paper);paint-order:stroke fill;z-index:5;visibility:hidden;pointer-events:none;transform:rotate(-14deg)}
.birthday[data-phase=windup] .character{animation:inhale 320ms ease-out both}
.birthday[data-phase=rush] .character{animation:none}
.birthday[data-phase=bump] .character{animation:chiika-away 600ms cubic-bezier(.22,.62,.45,1) both}
.birthday[data-phase=bump] .speech{opacity:0}
.birthday[data-phase=bump] .impact-word{visibility:visible;animation:bump-word 520ms ease-out both}
.birthday[data-phase=windup] .hold-button,.birthday[data-phase=rush] .hold-button,.birthday[data-phase=bump] .hold-button{background:#ca8b96;box-shadow:none;transform:none}
.birthday[data-ending=usagi][data-phase=burst] .character-button{visibility:hidden}
.birthday[data-ending=usagi][data-phase=burst] .party-scene{animation:rose-arrival 400ms cubic-bezier(.16,1,.3,1) both}
.birthday[data-ending=usagi] .party-scene{place-items:center}
.birthday[data-ending=usagi] .party-scene img{width:88%;height:100%;object-fit:contain}
.birthday[data-ending=usagi][data-phase=party] .party-scene{animation:none}
.birthday[data-ending=usagi][data-phase=party] .party-scene img{animation:party-bob 2.8s ease-in-out .6s infinite}
.birthday[data-ending=usagi][data-mode=create] .intro h1,.birthday[data-ending=usagi][data-mode=ready] .intro h1{font-size:28px}
@keyframes inhale{to{transform:translateY(-5px) scale(1.035)}}
@keyframes usagi-rush{0%{transform:translateX(115%) rotate(12deg)}54%{transform:translateX(14%) rotate(-7deg)}78%{transform:translateX(-5%) rotate(-4deg)}100%{transform:translateX(0) rotate(0)}}
@keyframes chiika-away{0%{transform:translateX(0) rotate(0);opacity:1}28%{transform:translate(-70px,-25px) rotate(-35deg);opacity:1}100%{transform:translate(-300px,50px) rotate(-100deg);opacity:0}}
@keyframes bump-word{0%{transform:scale(.65) rotate(-14deg);opacity:0}18%,65%{transform:scale(1) rotate(-14deg);opacity:1}100%{transform:translateY(-12px) rotate(-14deg);opacity:0}}
@keyframes rose-arrival{from{transform:translateY(7px);opacity:.5}to{transform:translateY(0);opacity:1}}
@media(prefers-reduced-motion:reduce){.usagi-takeover.entering img{animation:none;transform:none}.birthday[data-phase=bump] .character{animation:none;opacity:0}.birthday[data-phase=bump] .impact-word{animation:none;opacity:1}.birthday[data-ending=usagi][data-phase=burst] .party-scene{animation:none;opacity:1;transform:none}}

.link-status:empty{display:none}