/* 生日页的暖色烛光与樱花粉星尘，统一到深空主题。 */
.hero, .wish-sec { isolation: isolate; overflow: hidden; }
.celebration-canvas { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: -1; }
.wish-sec { min-height: 100svh; background: radial-gradient(ellipse at 50% 45%, #63384a44, transparent 70%); }
.wish-sec .wish-card { max-width: 610px; background: linear-gradient(145deg,#191a32ed,#151326ed); box-shadow: 0 0 80px #f2bf8c0c, 0 30px 100px #0004; }
.wish-card .caption { font-size: 10px; letter-spacing: .24em; color: #d5b78c; }
.wish-sparkle { display: block; color: #f3d097; font-size: 38px; margin: 16px 0; text-shadow: 0 0 26px #ffc77788; }
.wish-card h2 { font-size: clamp(25px, 6vw, 32px); }
.celebration-action { display: block; margin: 28px auto 0; }
#party { --ink-light: rgba(234,234,242,.72); }
#party .hero { max-width: 1320px; margin: auto; justify-content: space-between; min-height: 100svh; }
#party .hero .sec-title { font-size: clamp(64px, 9vw, 124px); }
.cake-sec { isolation: isolate; background: radial-gradient(ellipse at 50% 56%, #42233955, transparent 62%); }
.cake-sec > :not(canvas):not(.balloon) { position: relative; z-index: 1; }
.cake-sec .sec-hand { color: #f3c998; text-shadow: 0 0 24px #edb36c44; }
.cake-wrap { width: min(88vw, 510px); margin-top: 48px; }
.cake-wrap svg { width: 100%; filter: drop-shadow(0 24px 40px #03051488); overflow: visible; }
.cake-wrap::before { content: ''; position: absolute; inset: 15% 0 0; background: radial-gradient(ellipse, #eebc7a18, transparent 65%); transition: opacity 1s; }
.cake-hand { top: -14px; color: #ffe4bd; font-size: 30px; animation: none; opacity: 1; text-shadow: 0 0 30px #f4b77655; }
.cake-svg .flame { fill: url(#flame); opacity: 1; animation: flicker 1.6s ease-in-out infinite alternate; }
.cake-svg .flame:nth-child(2) { animation-delay: -.6s; }
.candle-fire { opacity: 1; transition: opacity .7s, filter .7s; }
.candles-out .candle-fire { opacity: 0; filter: blur(6px); }
.candles-out::before { opacity: 0; }
.cake-sec .wish-tip { margin-top: -4px; font-family: var(--font-ui); font-size: 14px; line-height: 1.9; max-width: 360px; min-height: 54px; }
.birthday-action, .heart-action { font-family: var(--font-ui); font-size: 14px; cursor: pointer; border-radius: 999px; padding: 14px 26px; transition: background .2s, transform .2s; }
.birthday-action { margin-top: 15px; color: #201727; background: #f4d4b0; border: 1px solid #ffe6ca; box-shadow: 0 0 32px #e4b17e22; }
.birthday-action:hover { background: #ffe6cc; transform: translateY(-2px); }
.heart-sec { overflow: hidden; background: radial-gradient(ellipse at center, #4b233e35, transparent 65%); }
#heartCanvas { width: min(94vw, 680px); height: min(100vw, 670px); max-width: none; margin: 16px -24px -4px; }
.heart-action { background: transparent; border: 1px solid #ef9fbd55; color: #f4b4cf; margin: 0 0 24px; }
.heart-action:hover { background: #ef9fbd14; }
.heart-note { font-size: clamp(18px, 3.7vw, 23px); }
.balloon { opacity: .2; width: 30px; height: 40px; background: radial-gradient(circle at 30% 25%, #ffffff55, transparent 60%), var(--balloon-color, #e9b4bf) !important; }
.wish-card { border-color: #efc6b82b; background: linear-gradient(145deg,#ffffff0b,#f0a89b06); border-radius: 26px; box-shadow: 0 30px 100px #0003; }
button:focus-visible, a:focus-visible { outline: 2px solid #f49ab6; outline-offset: 6px; }
@media (max-width: 600px) {
  #party .hero { gap: 28px; padding-bottom: 84px; }
  .cake-sec, .heart-sec { min-height: 92svh; padding: 72px 20px; }
  .cake-sec .sec-title, .heart-sec .sec-title { font-size: clamp(34px, 8vw, 54px); }
  .caption { letter-spacing: .22em; }
  .cake-wrap { margin-top: 38px; }
  .cake-sec .wish-tip { margin-top: 12px; }
  .wish-card { padding: 36px 22px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .reveal { opacity: 1; transform: none; }
  .balloon { display: none; }
}

/* 视频参考：金色手绘描线，装饰与蛋糕轮廓连成整体。 */
.cake-wrap svg { width: 100%; }
.cake-svg .gold-outline { filter: drop-shadow(0 0 4px #e9bb6640); }
.cake-line { stroke-dasharray: 100; stroke-dashoffset: 100; }
.scene-entered .cake-line { animation: gold-reveal 1.8s ease both; animation-delay: var(--delay, 0s); }
@keyframes gold-reveal { to { stroke-dashoffset: 0; } }
.cake-sec .balloon { display: none; }
.cake-hand { color: #fce8bf; }
@media (prefers-reduced-motion: reduce) { .cake-line { stroke-dashoffset: 0; } }
/* 每幕占满可视区，长内容只在当前幕内滚动。 */
body.birthday-paged { height: 100dvh; overflow: hidden; }
.birthday-paged #party { position: fixed; inset: 0; }
#party .birthday-page { position: absolute; inset: 0; width: 100%; max-width: none; height: 100dvh; min-height: 0; margin: 0; padding: 88px 24px 100px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #ecacca44 transparent; }
#party .birthday-page[hidden] { display: none !important; }
.birthday-page.page-active { animation: birthday-page-in .55s ease both; }
@keyframes birthday-page-in { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
#party .birthday-page.hero { padding-left: max(24px, calc((100vw - 1160px)/2)); padding-right: max(24px, calc((100vw - 1160px)/2)); }
#party .birthday-page.cake-sec, #party .birthday-page.heart-sec { justify-content: flex-start; }
.birthday-paged .cake-wrap { width: min(72vw, 38dvh, 420px); margin-top: 28px; flex-shrink: 0; }
.birthday-paged #heartCanvas { height: min(49dvh, 580px); width: min(90vw, 580px); flex-shrink: 0; margin-top: 8px; }
.birthday-paged .cake-sec .sec-title, .birthday-paged .heart-sec .sec-title { font-size: clamp(32px, 5.5dvh, 60px); }
.birthday-paged .wish-sec { align-items: flex-start; }
.birthday-paged .wish-card { margin: auto; flex-shrink: 0; }
.birthday-pager { position: fixed; z-index: 9; left: 50%; bottom: max(18px, env(safe-area-inset-bottom)); transform: translateX(-50%); display: flex; align-items: center; gap: 12px; padding: 8px 10px; border: 1px solid #f5c4dc30; border-radius: 999px; background: #101329ed; backdrop-filter: blur(16px); white-space: nowrap; }
.birthday-pager button { border: 0; border-radius: 999px; padding: 10px 15px; background: #f4b3cb; color: #231a2d; cursor: pointer; font: inherit; font-size: 12px; }
.birthday-pager button:disabled { opacity: .3; cursor: default; }
.page-status { color: #e8dce6; font-size: 11px; letter-spacing: .04em; }
@media (max-width: 600px) {
  #party .birthday-page { padding: 76px 20px 100px; }
  #party .birthday-page.hero { gap: 20px; justify-content: flex-start; }
  .birthday-paged .hero .gift { width: min(55vw, 26dvh); }
  .birthday-paged #party .hero .sec-title { font-size: clamp(52px, 10dvh, 82px); }
  .birthday-paged .wish-card { padding: 24px 18px; }
  .birthday-paged .wish-card .verse { font-size: 17px; line-height: 2; }
  .birthday-paged .wish-card .caption { font-size: 9px; }
  .birthday-pager { gap: 7px; }
  .birthday-pager button { padding: 10px 12px; }
}
@media (prefers-reduced-motion: reduce) { .birthday-page.page-active { animation: none; } }
/* 最后一幕让祝福融入星空，礼花不再被整块卡片遮住。 */
.birthday-paged .wish-sec .wish-card { background: transparent; border-color: transparent; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.birthday-paged .wish-card h2, .birthday-paged .wish-card .verse, .birthday-paged .wish-card .sign { text-shadow: 0 2px 12px #080b20, 0 0 22px #080b20; }
.birthday-paged .wish-sec .celebration-canvas { z-index: 0; }
.birthday-paged .wish-card { position: relative; z-index: 1; }
/* 翻页入口保持可点击，不被悬浮宠物菜单遮挡。 */
.birthday-pager { z-index: 90; }
.page-tap-hint { position: absolute; left: 50%; top: -26px; transform: translateX(-50%); color: #e5c5d3a8; font-size: 11px; letter-spacing: .12em; pointer-events: none; }
@media (max-width: 600px) {
  .birthday-paged .pet-restore { bottom: max(94px, calc(env(safe-area-inset-bottom) + 80px)); right: 12px; padding: 9px 13px; font-size: 12px; }
}
/* 珍藏入口与分段祝福 */
.keepsake-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin: 20px auto 0; max-width: 480px; }
.keepsake-actions button, .quiet-action { border: 1px solid #f5c6d72b; background: #ffffff06; color: #e9cddd; padding: 9px 13px; border-radius: 999px; font: 12px var(--font-ui,sans-serif); cursor: pointer; }
.keepsake-actions button:hover, .quiet-action:hover { background: #f5b9d116; border-color: #efb6cf77; }
.keepsake-status { min-height: 18px; font-size: 11px; color: #d7b88e; margin-top: 10px; }
.quiet-action { padding: 5px 12px; font-size: 10px; margin-top: 12px; }
.quiet-action[hidden] { display:none; }
.wish-line { display: block; }
.page-active .wish-line { animation: wish-line-in .9s both; animation-delay: calc(.9s + var(--line)*1.1s); }
.page-active .wish-card .sign { animation: wish-line-in 1s 5.4s both; }
.wish-all .wish-line, .page-active.wish-all .wish-card .sign { animation: none; opacity: 1; }
@keyframes wish-line-in { from { opacity:0; transform:translateY(9px); filter:blur(3px); } to { opacity:1; transform:none; filter:none; } }
.birthday-paged .wish-card .back-link { margin-top: 10px; }
.birthday-paged .wish-card { padding-top: 20px; padding-bottom: 20px; }
.birthday-paged .wish-sparkle { margin:8px 0; font-size:28px; }
.birthday-paged .wish-card h2 { margin-bottom:16px; }
.birthday-paged .wish-card .sign { margin-top:16px; }
.birthday-paged .celebration-action { margin-top:16px; }
/* 转场的星光只在边缘流动，正文保持可读。 */
.birthday-bridge { position:fixed; inset:0; z-index:11; display:grid; place-items:start center; padding-top:74px; pointer-events:none; opacity:0; color:#e7cda1; font:11px var(--font-ui,sans-serif); letter-spacing:.2em; background:radial-gradient(ellipse at 50% 110%,#eab99135,transparent 60%); }
.birthday-bridge::before { content:''; position:absolute; width:55vw; height:55vw; border:1px solid #f9dba96b; border-radius:50%; right:-35vw; top:10%; box-shadow:0 0 35px #edb47a33; }
.bridge-play { animation: bridge-pass 1.8s ease both; }
@keyframes bridge-pass { 0% { opacity:0; transform:translateY(24px); } 25%,65% { opacity:1; } 100% { opacity:0; transform:translateY(-16px); } }
.cake-wrap::after { content:''; position:absolute; left:49%; top:13%; width:9px; height:35px; border-radius:50%; background:linear-gradient(transparent,#e4d9d699,transparent); filter:blur(4px); opacity:0; pointer-events:none; }
.wish-smoke::after { animation:candle-smoke 1.8s ease-out; }
@keyframes candle-smoke { 10% { opacity:.65; } 100% { opacity:0; transform:translate(14px,-65px) scaleX(3); } }
.birthday-dialog { width:min(90vw,580px); max-height: min(84dvh,850px); overflow:auto; margin:auto; padding:42px 30px 32px; color:#f3e6eb; background:linear-gradient(145deg,#1c2039,#211a2e); border:1px solid #edc7b344; border-radius:26px; box-shadow:0 30px 100px #0009; text-align:center; }
.birthday-dialog::backdrop { background:#050818bb; backdrop-filter:blur(9px); }
.birthday-dialog[open] { animation:wish-line-in .4s ease both; }
.dialog-close { position:sticky; float:right; top:0; margin:-28px -16px 0 0; width:36px; height:36px; background:#ffffff10; border:1px solid #ffffff22; border-radius:50%; color:#eddce7; font-size:24px; cursor:pointer; }
.birthday-dialog h2 { font-size:clamp(22px,5vw,30px); color:#f3c8aa; margin:18px 0 24px; font-family:var(--font-story); }
.birthday-dialog .caption { font-size:9px; letter-spacing:.18em; }
.personal-letter { text-align:left; font:20px/2 var(--font-story); }
.personal-letter p { margin:18px 0; }
.letter-sign { text-align:right; color:#efb4cd; }
.letter-seal { font-size:54px; color:#d9b17e; animation:letter-unfold .8s ease; }
@keyframes letter-unfold { from { transform:rotateX(70deg) scale(.8); opacity:0; } to { transform:none; opacity:1; } }
.birthday-polaroid { background:#f4e9dd; color:#514349; padding:12px 12px 18px; border-radius:3px; transform:rotate(-2deg); margin:20px auto; max-width:310px; box-shadow:0 16px 40px #0004; }
.birthday-polaroid img { display:block; width:100%; max-height:45dvh; object-fit:cover; object-position:center 40%; }
.birthday-polaroid figcaption { padding-top:16px; font:19px var(--font-story); }
.saved-wish-star { display:block; margin:8px auto; border:0; background:none; color:#f4d593; text-shadow:0 0 28px #efbb7d99; font-size:90px; cursor:pointer; }
.star-born { animation:star-born .8s ease; }
@keyframes star-born { 50% { transform:scale(1.4) rotate(45deg); } }
.saved-wish { white-space:pre-wrap; overflow-wrap:anywhere; padding:16px; color:#f8d6ac; line-height:1.8; border:1px solid #e9b77833; border-radius:16px; }
#wishStarForm label { display:block; margin:18px 0 12px; font-size:14px; }
#wishStarText { box-sizing:border-box; width:100%; resize:vertical; min-height:100px; max-height:220px; border:1px solid #e9bad044; border-radius:14px; padding:14px; color:#f5e9ee; background:#090e2299; font:15px/1.8 var(--font-ui,sans-serif); }
.local-note { font-size:11px; color:#b7a8b8; line-height:1.8; margin-top:16px; }
.voice-orbit { font-size:70px; color:#efbdd4; padding:20px; }
.voice-file { display:block; margin:24px auto; padding:14px; border:1px dashed #e6bac94d; border-radius:14px; color:#edd6df; font-size:13px; }
.voice-file input { display:block; width:100%; margin-top:12px; font-size:12px; }
#voiceControls { width:100%; margin-top:20px; }
@media (max-width:600px) { .birthday-dialog { padding:40px 22px 26px; } .keepsake-actions { gap:7px; } .keepsake-actions button { font-size:11px; padding:9px 11px; } .birthday-bridge { padding-top:60px; font-size:9px; } }
@media (prefers-reduced-motion:reduce) { .page-active .wish-line, .page-active .wish-card .sign { animation:none; opacity:1; } .birthday-bridge { display:none; } }
.birthday-music { position:fixed; top:24px; right:24px; z-index:20; border:1px solid #e5bbce33; border-radius:999px; background:#12162ada; color:#dcc2d2; padding:9px 13px; font:11px var(--font-ui,sans-serif); cursor:pointer; }
.birthday-music[aria-pressed="true"] { color:#f4d6a6; border-color:#dfb67966; }
@media(max-width:600px) { .birthday-music { top:20px; right:16px; font-size:10px; padding:8px 10px; } }
/* 公历与农历成组显示，保持生日主标题的层级。 */
#party .hero .left > .caption{margin-bottom:0}
#party .hero .birthday-date-note{margin:8px 0 24px;color:#dcb8cc;font-size:12px;letter-spacing:.14em;line-height:1.6}
@media(max-width:600px){#party .hero .birthday-date-note{font-size:11px;margin:7px 0 20px;letter-spacing:.12em}}
/* 日期精简为两行，和主标题留出呼吸空间。 */
#party .hero .birthday-solar-date{font-size:12px;letter-spacing:.22em;color:#d6c3ca;line-height:1.6;margin:0}
#party .hero .birthday-date-note{font-size:12px;letter-spacing:.1em;line-height:1.7;color:#d8aec3;margin:8px 0 30px}
@media(max-width:600px){#party .hero .birthday-solar-date{font-size:11px;letter-spacing:.18em}#party .hero .birthday-date-note{font-size:11px;margin:7px 0 24px}}
.voice-wish-stars { display:flex; gap:8px; justify-content:center; flex-wrap:wrap; max-width:320px; margin:22px auto; }
.voice-wish-stars span { color:#746679; font-size:24px; transition:color .5s,text-shadow .5s,transform .5s; }
.voice-wish-stars .is-lit { color:#f4d399; text-shadow:0 0 16px #eec17caa; transform:scale(1.15); }
.voice-language { min-height:26px; font-size:15px; color:#f4cba2; }
.voice-preview-options { margin-top:24px; font-size:11px; color:#aa99ad; }
.voice-preview-options summary { cursor:pointer; }
