:root{color-scheme:light;--paper:#fbf7ef;--rose:#a46e72;--ink:#76635e;--gold:#b79762;--serif:"Iowan Old Style","Palatino Linotype","Yu Mincho","Hiragino Mincho ProN","Noto Serif CJK JP","Songti TC",serif}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);-webkit-font-smoothing:antialiased;overflow-x:hidden}body::before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 44%,#fffdf7 0,transparent 53%),radial-gradient(ellipse at 3% 85%,#eedbd844,transparent 45%),radial-gradient(ellipse at 100% 0%,#f1e3cf55,transparent 48%)}.paper{position:fixed;inset:0;opacity:.22;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23a18e7c' opacity='.17' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}.edge{position:fixed;left:24px;right:24px;height:14px;border-color:#d8c9b57a;border-style:solid;pointer-events:none}.edge.top{top:24px;border-width:1px 1px 0}.edge.bottom{bottom:24px;border-width:0 1px 1px}.card{position:relative;max-width:720px;min-height:100vh;min-height:100svh;margin:auto;padding:64px 24px 34px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.heading{width:100%}.eyebrow{font-family:Georgia,serif;font-size:10px;letter-spacing:.27em;color:#a28a75;margin:0 0 26px}.titles{height:92px;position:relative;display:grid;place-items:center}.intro-title,.birthday-title{grid-area:1/1;transition:opacity 1s,transform 1s}.for{margin:0;font-style:italic;font-size:28px;color:var(--rose)}.for span{font-size:44px;margin-left:7px}.intro-note{font-size:13px;letter-spacing:.12em;margin:13px 0 0;color:#9b8880}.birthday-title{opacity:0;visibility:hidden;transform:translateY(8px)}h1{font-weight:400;font-size:clamp(18px,4.6vw,27px);letter-spacing:.04em;white-space:nowrap;margin:0}.english{font-family:"Snell Roundhand","Apple Chancery","URW Chancery L",var(--serif);font-size:27px;font-style:italic;color:var(--rose);margin:13px 0 0;letter-spacing:.04em}.illustration{position:relative;width:min(100%,440px);margin:8px auto 0;isolation:isolate}.cake-button{border:0;background:none;padding:0;width:100%;display:block;cursor:pointer;position:relative;z-index:2;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.cake-button:focus-visible{outline:1px solid var(--rose);outline-offset:-25px;border-radius:40%}.cake{width:100%;height:auto;display:block;overflow:visible;transition:filter 1.4s}.cake-button:hover .cake{filter:drop-shadow(0 5px 8px #b78e7910)}.flame{opacity:0;transform-origin:239px 105px;transition:opacity .6s}.halo{position:absolute;inset:0;z-index:-1;border-radius:50%;background:radial-gradient(ellipse,#f5dba759,transparent 65%);opacity:0;transform:scale(.7);transition:opacity 1.5s,transform 2s}.deco{position:absolute;pointer-events:none;font-weight:normal}.heart{color:#d8aaa9}.one{top:30%;left:10%;font-size:23px;transform:rotate(-18deg)}.two{right:9%;top:43%;font-size:16px;transform:rotate(17deg)}.star{color:#c8ab7d}.s1{left:24%;top:12%;font-size:21px}.s2{right:15%;top:18%;font-size:29px}.message-slot{position:relative;width:100%;min-height:211px;margin-top:-3px;display:grid;align-items:start}.hint,.wish{grid-area:1/1}.hint{margin:23px 0 0;font-size:13px;letter-spacing:.09em;color:#9b8178;transition:opacity .5s}.wish{opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity 1.3s,transform 1.3s}.wish p:not(.signature){font-size:14px;line-height:2;letter-spacing:.045em;margin:0 auto 6px;max-width:25em;text-wrap:pretty}.little-line{width:30px;height:1px;background:#ccb38d;margin:0 auto 21px}.wish-heart{color:#c6989b;font-size:20px;display:block;margin:12px 0 8px}.signature{font-size:13px;letter-spacing:.23em;color:#a18478;margin:0}.replay{display:block;margin:19px auto 0;padding:8px 14px;background:none;border:0;border-bottom:1px solid #ccbfb066;color:#9d8d80;font-family:inherit;font-size:11px;letter-spacing:.13em;cursor:pointer;min-height:36px}.replay:focus-visible{outline:1px solid var(--rose)}footer{display:flex;align-items:center;gap:14px;font-family:Georgia,serif;font-size:9px;letter-spacing:.2em;color:#b19d88;margin-top:25px}.footer-line{height:1px;width:25px;background:#d4c5b3}.card[data-state="lighting"] .flame,.card[data-state="celebrating"] .flame,.card[data-state="complete"] .flame{opacity:1;animation:flicker 2.3s ease-in-out infinite}.card:not([data-state="idle"]) .halo{opacity:1;transform:scale(1.12)}.card:not([data-state="idle"]) .hint{opacity:0;visibility:hidden}.card[data-state="celebrating"] .intro-title,.card[data-state="complete"] .intro-title{opacity:0;visibility:hidden;transform:translateY(-8px)}.card[data-state="celebrating"] .birthday-title,.card[data-state="complete"] .birthday-title{visibility:visible;opacity:1;transform:none}.card[data-state="complete"] .wish{visibility:visible;opacity:1;transform:none}.particles{position:absolute;inset:-10% -3%;pointer-events:none;z-index:3;overflow:visible}.particle{position:absolute;left:var(--x);top:var(--y);opacity:0;animation:float 2.8s var(--delay) ease-out forwards;color:var(--color);font-size:var(--size)}.particle.confetti{width:5px;height:10px;border-radius:1px;background:var(--color);animation-name:fall}.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}@keyframes flicker{0%,100%{transform:rotate(-3deg) scale(.97,1)}50%{transform:rotate(3deg) scale(1.03,.96)}}@keyframes float{0%{opacity:0;transform:translateY(20px) rotate(-10deg)}20%{opacity:.7}100%{opacity:0;transform:translate(var(--drift),-110px) rotate(15deg)}}@keyframes fall{0%{opacity:0;transform:translateY(-35px) rotate(0)}15%{opacity:.65}100%{opacity:0;transform:translate(var(--drift),160px) rotate(190deg)}}@media(max-width:480px){.card{padding:52px 22px 30px}.eyebrow{font-size:9px;letter-spacing:.22em;margin-bottom:23px}.illustration{margin-top:10px;width:min(100%,380px)}.message-slot{min-height:228px;margin-top:5px}.wish p:not(.signature){font-size:13px;max-width:23em;line-height:2.1}footer{margin-top:17px}.edge{left:14px;right:14px}.edge.top{top:14px}.edge.bottom{bottom:14px}}@media(max-height:740px){.card{padding-top:38px;padding-bottom:25px}.eyebrow{margin-bottom:15px}.titles{height:82px}.illustration{max-width:330px;margin-top:0}.message-slot{min-height:222px}footer{margin-top:12px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.particles{display:none}}

/* V1.3 — 保留原插畫與版面，改善手機閱讀與動畫層次。 */
:root{--ink:#66534f;--rose:#945c65}
.card{padding-top:42px;padding-bottom:30px}
.heading,.illustration{transition:transform 1.8s cubic-bezier(.22,.61,.36,1)}
.eyebrow{color:#8a715d;font-size:11px;margin-bottom:22px}
.for{font-size:30px}.for span{font-size:47px}
.intro-note{font-size:15px;color:#79635b;letter-spacing:.08em}
.titles{height:96px}
h1{font-size:clamp(18px,4.6vw,27px);color:#68514e}
.english{font-size:25px;color:#966570}
.illustration{margin-top:0}
.cake{transform:scale(1.1);transform-origin:50% 57%;filter:drop-shadow(0 6px 8px #ab847514)}
.cake-button:hover .cake{filter:drop-shadow(0 6px 8px #ab847514)}
.cake-button{transition:transform .35s}
.card[data-state="idle"] .cake-button{animation:cake-breathe 6.8s ease-in-out infinite}
.card[data-state="lighting"] .cake-button{animation:tap-feedback .46s ease-out both}
.card[data-state="idle"] .heading,.card[data-state="idle"] .illustration{transform:translateY(62px)}
.message-slot{min-height:335px;margin-top:4px}
.hint{font-size:15px;color:#795f58;letter-spacing:.065em;margin-top:18px;transform:translateY(62px);transition:opacity .6s,transform 1.8s}
.card:not([data-state="idle"]) .hint{transform:none}
.wish p:not(.signature){font-size:16px;line-height:1.95;letter-spacing:.025em;max-width:27em;margin-bottom:16px}
.wish .wish-line{display:block}
.wish p[data-copy="wish2"] .wish-line:last-child{margin-top:5px}
.little-line{margin-bottom:19px;background:#b99b71}
.signature{font-size:15px;color:#7e6259;letter-spacing:.18em}
.wish-heart{margin:12px 0;color:#b77f89}
.replay{min-height:44px;min-width:112px;font-size:13px;color:#7e5d59;border:1px solid #bd9a8c80;border-radius:24px;padding:10px 18px;margin-top:22px;background:#fffaf14d;transition:background .2s,border-color .2s}
.replay:hover{background:#f6e9dc;border-color:#b78b7c}
footer{color:#917a64;font-size:10px;margin-top:18px}
.deco{animation:decoration-drift 7.3s ease-in-out infinite}.two{animation-delay:-3s;animation-duration:8.7s}.s1{animation-delay:-1.8s}.s2{animation-delay:-4.5s;animation-duration:9s}
.halo{background:radial-gradient(ellipse at 50% 36%,#f6d28f70,transparent 66%);transition:opacity 2s .55s,transform 2.5s .55s}
.flame{transition:opacity 1.15s .15s;animation:none!important}
.card:not([data-state="idle"]) .flame{animation:living-flame 3.71s .15s ease-in-out infinite alternate!important}
.flame-aura,.cake-reflection{opacity:0;transition:opacity 1.8s .65s;pointer-events:none}
.card:not([data-state="idle"]) .flame-aura{opacity:1;animation:warmth 4.37s ease-in-out infinite alternate}
.card:not([data-state="idle"]) .cake-reflection{opacity:.58;animation:reflected-light 4.37s ease-in-out infinite alternate}
.birthday-title h1,.birthday-title .english{opacity:0;transform:translateY(7px);transition:opacity 1.2s,transform 1.2s}
.card[data-state="celebrating"] .birthday-title h1,.card[data-state="complete"] .birthday-title h1{opacity:1;transform:none}
.card[data-state="celebrating"] .birthday-title .english,.card[data-state="complete"] .birthday-title .english{opacity:1;transform:none;transition-delay:.55s}
.card[data-state="celebrating"] .birthday-title,.card[data-state="complete"] .birthday-title{transition-delay:0s}
.wish{transition:opacity 1s,transform 1s}
.wish p[data-copy],.wish-heart,.wish .replay{opacity:0;transform:translateY(7px);transition:opacity 1s,transform 1s}
.card[data-state="complete"] .wish p[data-copy],.card[data-state="complete"] .wish-heart,.card[data-state="complete"] .wish .replay{opacity:1;transform:none}
.card[data-state="complete"] .wish p[data-copy="wish2"]{transition-delay:1s}
.card[data-state="complete"] .wish-heart{transition-delay:1.7s}
.card[data-state="complete"] .wish .signature{transition-delay:2s}
.card[data-state="complete"] .wish .replay{transition-delay:2.25s}
.particle{animation-duration:var(--duration,4.5s)}
@keyframes cake-breathe{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-2px) scale(1.006)}}
@keyframes tap-feedback{0%{transform:scale(1)}35%{transform:scale(.974)}100%{transform:scale(1)}}
@keyframes decoration-drift{0%,100%{translate:0 0}45%{translate:2px -5px}70%{translate:-1px -3px}}
@keyframes living-flame{0%{transform:rotate(-5deg) scale(.96,1.04);filter:brightness(1)}17%{transform:rotate(2deg) scale(1.04,.97);filter:brightness(1.06)}36%{transform:rotate(-2deg) scale(.97,1.08);filter:brightness(1.02)}58%{transform:rotate(5deg) scale(1.05,.94);filter:brightness(.98)}73%{transform:rotate(-3deg) scale(.95,1.03);filter:brightness(1.07)}89%{transform:rotate(1deg) scale(1.02,.98);filter:brightness(1.01)}100%{transform:rotate(-4deg) scale(.98,1.06);filter:brightness(1.04)}}
@keyframes warmth{0%,100%{opacity:.78}29%{opacity:.94}53%{opacity:.74}81%{opacity:1}}
@keyframes reflected-light{0%,100%{opacity:.45}29%{opacity:.58}53%{opacity:.42}81%{opacity:.62}}
@keyframes float{0%{opacity:0;transform:translate(0,15px) rotate(-9deg)}18%{opacity:.72}55%{opacity:.62;transform:translate(calc(var(--drift)*.45),-48px) rotate(3deg)}100%{opacity:0;transform:translate(var(--drift),-135px) rotate(14deg)}}
@keyframes fall{0%{opacity:0;transform:translateY(-25px) rotate(0)}18%{opacity:.68}65%{opacity:.52}100%{opacity:0;transform:translate(var(--drift),175px) rotate(200deg)}}
@media(max-width:480px){.card{padding:34px 22px 26px}.eyebrow{font-size:10px;margin-bottom:18px}.titles{height:94px}.intro-note{font-size:14px}.illustration{width:min(100%,380px);margin-top:2px}.message-slot{min-height:340px;margin-top:5px}.hint{font-size:14px}.wish p:not(.signature){font-size:15px;max-width:23em;line-height:1.95;margin-bottom:17px}.english{font-size:24px}.signature{font-size:15px}footer{margin-top:13px;font-size:9px}.card[data-state="idle"] .heading,.card[data-state="idle"] .illustration{transform:translateY(72px)}.hint{transform:translateY(72px)}}
@media(max-height:740px){.card{padding-top:28px}.eyebrow{margin-bottom:13px}.titles{height:88px}.illustration{max-width:330px;margin-top:0}.message-slot{min-height:333px}.card[data-state="idle"] .heading,.card[data-state="idle"] .illustration{transform:translateY(56px)}.hint{transform:translateY(56px)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after,.card:not([data-state="idle"]) .flame{animation:none!important;transition:none!important}.card[data-state="idle"] .heading,.card[data-state="idle"] .illustration,.hint{transform:none}.particles{display:none}}

/* V1.4：僅修補「惦」(U+60E6)，不改動原字型堆疊或排版數值。 */
@font-face{font-family:"Lisa Dian Serif Patch";src:url("fonts/dian-serif-tc.woff") format("woff");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+60E6}
.glyph-dian{font-family:"Lisa Dian Serif Patch",var(--serif);font-size:inherit;font-weight:inherit;line-height:inherit;letter-spacing:inherit}

/* V1.4 第二輪：僅補「值」(U+503C)，沿用「惦」已採用的宋體、原始 em 與基線；無位移補償。 */
@font-face{font-family:"Lisa Zhi Serif Patch";src:url("fonts/zhi-serif-tc.woff") format("woff");font-weight:400;font-style:normal;font-display:swap;unicode-range:U+503C}
.glyph-zhi{font-family:"Lisa Zhi Serif Patch",var(--serif);font-size:inherit;font-weight:inherit;line-height:inherit;letter-spacing:inherit}

/* V1.5：明確限制祝福區塊的 Grid 軌道與水平寬度，保留原垂直間距與 transform。 */
.message-slot{grid-template-columns:minmax(0,1fr);min-width:0}
.wish{width:100%;min-width:0;justify-self:center;text-align:center}
.wish>.little-line,.wish>.replay{margin-inline:auto}

/* 每行以漢字主體置中，句尾全形標點懸掛；不使用固定像素推移或更動原字距。 */
.wish-core{position:relative;display:inline-block;white-space:nowrap}
.wish-punctuation{position:absolute;inset-inline-start:100%;top:0;white-space:nowrap}

/* V1.6 首頁個別光學校正，不移動首頁父容器或蛋糕。 */
.eyebrow{text-indent:.27em}
@media(max-width:480px){.eyebrow{text-indent:.22em}}
.home-optical-core{position:relative;display:inline-block;white-space:nowrap}
.home-optical-tail{position:absolute;inset-inline-start:100%;top:0;white-space:pre}
/* 正文0.8秒淡入；保留原上移1秒。父層不再延長正文透明度，橫線原淡入獨立保留。 */
.wish{transition:transform 1s}
.wish>.little-line{opacity:0;transition:opacity 1s}
.card[data-state="complete"] .wish>.little-line{opacity:1}
.wish p[data-copy="wish1"],.wish p[data-copy="wish2"]{transition-duration:.8s,1s}

/* V1.7：只讓首頁三組文字同步退場；不更動 heading 的原位移與光學置中。 */
.card:not([data-state="idle"]) .eyebrow,
.card:not([data-state="idle"]) .intro-title{
  opacity:0;visibility:hidden;transform:translateY(-10px);pointer-events:none;
  transition:opacity .8s ease .3s,transform .8s ease .3s,visibility 0s linear 1.1s;
}