@font-face { font-family: "Miley Gothic"; src: url("assets/fonts/CenturyGothic-Regular.ttf") format("truetype"); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: "Miley Gothic"; src: url("assets/fonts/CenturyGothic-Bold.ttf") format("truetype"); font-style: normal; font-weight: 700; font-display: swap; }

:root {
  color-scheme: dark;
  --night: #050914; --night-rgb: 5, 9, 20; --surface: #0a1222; --surface-2: #101b31;
  --paper: #f4f2ed; --ink: #18212a; --text: #f4f7fb; --muted: rgba(238,244,249,.66);
  --mood: #c4e1eb; --mood-rgb: 196,225,235; --blush: #e08e99; --gold: #ffb84d;
  --line: rgba(232,242,248,.17); --line-strong: rgba(232,242,248,.38);
  --serif: "Noto Serif TC", "Songti TC", "PMingLiU", "Times New Roman", serif; --gothic: "Miley Gothic", "Microsoft JhengHei", sans-serif;
  --pad: clamp(1.2rem, 5vw, 5.5rem); --header-h: 78px;
}
html[data-mood="moon"] { --night:#050914; --night-rgb:5,9,20; --surface:#0a1222; --surface-2:#101b31; --mood:#c4e1eb; --mood-rgb:196,225,235; --text:#f4f7fb; --blush:#e08e99; }
html[data-mood="gold"] { --night:#1b0d05; --night-rgb:27,13,5; --surface:#2b1609; --surface-2:#3d210d; --mood:#ffb23f; --mood-rgb:255,178,63; --text:#fff2d2; --blush:#ff9d52; }
html[data-mood="blue"] { --night:#020917; --night-rgb:2,9,23; --surface:#061426; --surface-2:#092743; --mood:#54c8ff; --mood-rgb:84,200,255; --text:#edf8ff; --blush:#899dff; }
html[data-mood="birthday"] { --night:#e7edf0; --night-rgb:231,237,240; --surface:#f3f4f2; --surface-2:#dce7ea; --mood:#986274; --mood-rgb:152,98,116; --text:#1e2730; --muted:#5d6970; --line:rgba(30,39,48,.17); --line-strong:rgba(30,39,48,.36); --blush:#b86f86; color-scheme:light; }

* { box-sizing: border-box; }
html { background: var(--night); scroll-behavior: smooth; overflow-x: clip; }
body { margin:0; color:var(--text); background:var(--night); font-family:var(--gothic); font-size:16px; line-height:1.72; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; transition:color .55s ease, background-color .65s ease; overflow-x:clip; }
body.menu-open { overflow:hidden; }
img { display:block; max-width:100%; }
a { color:inherit; }
button, select, input, textarea { font:inherit; }
button, a, select, label { touch-action:manipulation; }
button { cursor:pointer; }
h1, h2, h3 { text-wrap:balance; }
p { text-wrap:pretty; }
:where(h1,h2,h3,[id]) { scroll-margin-top:calc(var(--header-h) + 1rem); }
section[id], h2[id] { scroll-margin-top:6rem; }
:focus-visible { outline:3px solid var(--mood); outline-offset:4px; }
[hidden] { display:none !important; }
.sr-only { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }
.skip-link { position:fixed; z-index:1000; top:.65rem; left:.65rem; padding:.8rem 1rem; color:#08101b; background:#fff; transform:translateY(-180%); }
.skip-link:focus { transform:translateY(0); }
.skip-link:not(:focus-visible) { visibility:hidden; }
.skip-link:focus-visible { visibility:visible; }

/* Shared navigation */
.site-header { position:absolute; z-index:80; inset:0 0 auto; min-height:var(--header-h); padding:.7rem max(var(--pad),env(safe-area-inset-right)) .7rem max(var(--pad),env(safe-area-inset-left)); border-bottom:1px solid rgba(247,242,234,.13); background:linear-gradient(180deg,rgba(var(--night-rgb),.82),rgba(var(--night-rgb),.08)); }
.site-header.is-light { color:#17212a; border-color:rgba(23,33,42,.16); background:linear-gradient(180deg,rgba(245,245,242,.92),rgba(245,245,242,.2)); }
.site-header.is-light .brand-mark, .site-footer.is-light .brand-mark { filter:drop-shadow(0 1px 1px rgba(23,33,42,.62)); }
.site-header.is-light .desktop-nav a { color:rgba(23,33,42,.64); }
.site-header.is-light .desktop-nav a:hover, .site-header.is-light .desktop-nav a[aria-current="page"] { color:#17212a; }
.site-header.is-light .demo-shortcut { color:#17212a; border-color:rgba(23,33,42,.35); }
.header-inner { min-width:0; min-height:calc(var(--header-h) - 1.4rem); display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:clamp(1rem,3vw,3.5rem); }
.brand { min-height:44px; display:inline-flex; align-items:center; gap:.55rem; text-decoration:none; letter-spacing:.14em; }
.brand-mark { width:2.55rem; height:2.55rem; flex:0 0 auto; display:block; object-fit:contain; object-position:center; }
.brand b { font-size:.74rem; }
.desktop-nav { min-width:0; display:flex; flex-wrap:wrap; justify-content:center; gap:.2rem clamp(.55rem,1.5vw,1.35rem); }
.desktop-nav a { min-height:44px; display:grid; place-items:center; color:color-mix(in srgb,var(--text) 64%,transparent); text-decoration:none; font-size:.73rem; white-space:normal; text-align:center; border-bottom:1px solid transparent; }
.desktop-nav a:hover, .desktop-nav a[aria-current="page"] { color:var(--text); }
.desktop-nav a[aria-current="page"] { border-color:var(--mood); }
.header-tools { display:flex; align-items:center; gap:.75rem; }
.demo-shortcut { min-height:44px; display:inline-flex; align-items:center; padding:.4rem .8rem; border:1px solid var(--line-strong); text-decoration:none; font-size:.7rem; }
.demo-shortcut::before { content:""; width:.45rem; height:.45rem; margin-right:.45rem; background:var(--blush); border-radius:50%; }
.menu-button { width:48px; height:48px; display:none; place-content:center; gap:7px; color:inherit; background:transparent; border:1px solid currentColor; }
.menu-button > span:not(.sr-only) { width:20px; height:1px; background:currentColor; transition:transform .2s ease; }
.menu-button[aria-expanded="true"] > span:first-child { transform:translateY(4px) rotate(45deg); }
.menu-button[aria-expanded="true"] > span:nth-child(2) { transform:translateY(-4px) rotate(-45deg); }
.mobile-menu { position:fixed; z-index:70; inset:0; display:grid; align-content:center; padding:calc(var(--header-h) + 2rem) max(var(--pad),env(safe-area-inset-right)) max(3rem,calc(2rem + env(safe-area-inset-bottom))) max(var(--pad),env(safe-area-inset-left)); background:rgba(var(--night-rgb),.985); visibility:hidden; opacity:0; pointer-events:none; transform:translateY(-1rem); transition:opacity .25s ease,transform .25s ease,visibility 0s linear .25s; overscroll-behavior:contain; }
.mobile-menu.is-open { visibility:visible; opacity:1; pointer-events:auto; transform:none; transition-delay:0s; }
.mobile-menu nav { display:grid; }
.mobile-menu nav a { min-height:58px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); text-decoration:none; font-family:var(--serif); font-size:1.25rem; }
.mobile-menu nav a[aria-current="page"] { color:var(--mood); }
.mobile-menu p { margin:1.5rem 0 0; color:var(--muted); font-size:.8rem; }
.mobile-bottom-dock { display:none; }

.page-curtain { position:fixed; z-index:200; inset:0; display:grid; grid-template-columns:1fr 1fr; pointer-events:none; }
.page-curtain span { background:var(--night); transform-origin:left center; }
.page-curtain span:last-child { transform-origin:right center; }
.page-curtain.light span { background:#eef0ee; }
body.is-ready .page-curtain span:first-child { animation:curtain-left .9s cubic-bezier(.72,0,.18,1) .06s both; }
body.is-ready .page-curtain span:last-child { animation:curtain-right .9s cubic-bezier(.72,0,.18,1) .06s both; }
body.is-ready .page-curtain { visibility:hidden; transition:visibility 0s linear 1s; }

/* Shared pieces */
.truth-chip { display:flex; flex-wrap:wrap; align-items:center; gap:.35rem .65rem; margin:0; font-size:.76rem; }
.truth-chip > span { width:.52rem; height:.52rem; flex:none; background:var(--blush); border-radius:50%; }
.truth-chip strong { color:var(--text); }
.truth-chip em { color:var(--muted); font-style:normal; }
.primary-action { width:fit-content; min-height:54px; display:inline-flex; align-items:center; gap:1.8rem; padding:.8rem 1.1rem .8rem 1.3rem; color:#08101b; background:#f4f7fb; border:1px solid #f4f7fb; text-decoration:none; font-size:.86rem; font-weight:700; transition:color .2s ease,background-color .2s ease,border-color .2s ease; }
.primary-action i { width:2.2rem; height:1px; position:relative; background:currentColor; }
.primary-action i::after { content:""; position:absolute; right:0; top:-3px; width:7px; height:7px; border-top:1px solid; border-right:1px solid; transform:rotate(45deg); }
.primary-action:hover { color:var(--text); background:transparent; border-color:var(--mood); }
.primary-action.is-dark { color:#f7f4ed; background:#17212a; border-color:#17212a; }
.primary-action.is-dark:hover { color:#17212a; background:transparent; }
.text-link { min-height:44px; display:inline-flex; align-items:center; color:var(--mood); text-underline-offset:.4rem; }
.progress-track { height:2px; position:relative; background:var(--line); overflow:hidden; }
.progress-track i, [data-week-progress] { display:block; height:100%; width:0; background:var(--mood); transition:width .7s cubic-bezier(.22,.7,.25,1); }
.section-intro > p:first-child, .reward-intro > p:first-child, .days-copy > p:first-child, .birthday-goal-copy > p:first-child, .board-heading > p:first-child, .archive-heading > p:first-child { margin:0 0 1rem; color:var(--blush); font-size:.76rem; }
.section-intro h2, .reward-intro h2, .days-copy h2, .birthday-goal-copy h2, .board-heading h2, .archive-heading h2 { margin:0; font-family:var(--serif); font-size:clamp(2.6rem,5vw,5.7rem); font-weight:320; line-height:1.18; letter-spacing:-.03em; }

/* Home */
.home-hero { position:relative; min-height:max(820px,100svh); isolation:isolate; overflow:hidden; background:var(--night); }
.home-backdrop, .home-backdrop::after, .home-portrait { position:absolute; inset:0; }
.home-backdrop img { width:100%; height:100%; object-fit:cover; object-position:50% 30%; filter:blur(30px) brightness(.28) saturate(.72); transform:scale(1.1); }
.home-backdrop::after { content:""; background:linear-gradient(90deg,rgba(var(--night-rgb),1) 0 27%,rgba(var(--night-rgb),.72) 49%,rgba(var(--night-rgb),.13) 76%,rgba(var(--night-rgb),.42)); }
.home-portrait { left:auto; width:min(64vw,1040px); clip-path:polygon(18% 0,100% 0,100% 100%,0 100%,8% 52%); overflow:hidden; }
.home-portrait::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(var(--night-rgb),.92),transparent 30%),linear-gradient(0deg,rgba(var(--night-rgb),.52),transparent 34%); }
.home-portrait img { width:100%; height:100%; object-fit:cover; object-position:50% 34%; filter:brightness(.86) saturate(.88); transition:filter .65s ease; }
html[data-mood="gold"] .home-portrait img { object-position:50% 27%; filter:brightness(.82) saturate(.98); }
html[data-mood="blue"] .home-portrait img { object-position:50% 28%; filter:brightness(.9) saturate(.98); }
.home-portrait figcaption { position:absolute; z-index:2; right:1.2rem; bottom:1rem; color:rgba(255,255,255,.56); font-size:.62rem; }
.home-copy { position:relative; z-index:3; width:min(49vw,720px); min-height:max(820px,100svh); display:grid; align-content:center; padding:calc(var(--header-h) + 3rem) 0 9rem var(--pad); }
.home-date { display:flex; align-items:center; gap:.8rem; margin:1.4rem 0 1.1rem; color:var(--mood); font-size:.78rem; letter-spacing:.12em; font-variant-numeric:tabular-nums; }
.home-date span { width:2.5rem; height:1px; background:currentColor; }
.home-copy h1 { max-width:8.5ch; margin:0; font-family:var(--serif); font-size:clamp(4rem,6.6vw,7rem); font-weight:330; line-height:1.09; letter-spacing:-.035em; }
.home-copy h1 span { display:block; text-wrap:wrap; }
.home-lead { max-width:35rem; margin:1.4rem 0 1.8rem; color:rgba(244,247,251,.76); font-family:var(--serif); font-size:1rem; line-height:1.9; }
.demo-disclosure { max-width:32rem; margin:1rem 0 0; color:rgba(244,247,251,.5); font-size:.7rem; }
.home-mission { position:absolute; z-index:5; right:var(--pad); bottom:2rem; width:min(42vw,540px); display:grid; grid-template-columns:.6fr 1fr 1.25fr; gap:1rem; padding:1.15rem 0 0; border-top:1px solid var(--line-strong); background:linear-gradient(90deg,transparent,rgba(var(--night-rgb),.42)); }
.home-mission > * { min-width:0; margin:0; }
.home-mission > p { display:grid; }
.home-mission span, .mission-choice > span { color:var(--muted); font-size:.65rem; }
.home-mission > p strong { font-family:var(--serif); font-size:2.2rem; font-weight:300; line-height:1.1; }
.home-mission small { color:var(--muted); font-size:.67rem; }
.mission-choice { display:grid; align-content:start; }
.mission-choice strong { margin:.1rem 0; font-family:var(--serif); font-size:1rem; }
.mission-choice a { width:fit-content; color:var(--mood); font-size:.7rem; text-underline-offset:.3rem; }
.mission-progress > div:first-child { display:flex; justify-content:space-between; gap:1rem; }
.mission-progress b { color:var(--mood); font-size:.8rem; font-variant-numeric:tabular-nums; }
.mission-progress .progress-track { margin:.65rem 0 .5rem; }
.birthday-mark { position:absolute; z-index:4; top:calc(var(--header-h) + 2rem); right:var(--pad); display:grid; justify-items:end; }
.birthday-mark small { font-size:.63rem; }
.birthday-mark strong { font-family:var(--serif); font-size:clamp(2.8rem,5vw,5.3rem); font-weight:280; line-height:1; }
.birthday-mark a { min-height:44px; display:flex; align-items:center; font-size:.7rem; text-underline-offset:.35rem; }
.month-score { padding:clamp(6rem,10vw,10rem) var(--pad); background:linear-gradient(180deg,var(--night),var(--surface)); }
.month-score .section-intro { max-width:1150px; margin:0 auto 4rem; display:grid; grid-template-columns:.4fr 1.25fr; gap:3rem; align-items:end; }
.score-ribbon { max-width:1150px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); border-block:1px solid var(--line-strong); }
.score-ribbon article { min-width:0; padding:2.2rem clamp(1rem,3vw,3rem); border-right:1px solid var(--line); }
.score-ribbon article:first-child { padding-left:0; }
.score-ribbon article:last-child { border-right:0; padding-right:0; }
.score-ribbon span { color:var(--muted); font-size:.72rem; }
.score-ribbon strong { display:block; margin:.45rem 0; color:var(--mood); font-family:var(--serif); font-size:clamp(2.7rem,5vw,5rem); font-weight:280; line-height:1; font-variant-numeric:tabular-nums; }
.score-ribbon p { margin:0; color:var(--muted); font-size:.78rem; }
.month-score > .text-link { margin:2rem max(calc((100% - 1150px)/2),0px) 0; }
.month-route { min-height:90svh; display:grid; grid-template-columns:minmax(320px,.72fr) minmax(0,1.28fr); background:#dce7ea; color:#17212a; }
.route-photo { min-height:680px; overflow:hidden; }
.route-photo img { width:100%; height:100%; object-fit:cover; object-position:53% 29%; }
.route-copy { display:grid; align-content:center; padding:clamp(3rem,8vw,8rem); }
.route-copy > p { margin:0 0 1rem; color:#8b596a; font-size:.75rem; }
.route-copy h2 { margin:0 0 2.4rem; font-family:var(--serif); font-size:clamp(2.8rem,5vw,5.8rem); font-weight:320; line-height:1.16; letter-spacing:-.03em; }
.week-route { margin:0; padding:0; list-style:none; border-top:1px solid rgba(23,33,42,.28); }
.week-route li { display:grid; grid-template-columns:4rem 1fr auto; gap:1rem; align-items:center; min-height:70px; border-bottom:1px solid rgba(23,33,42,.2); }
.week-route span { color:#8b596a; font-size:.72rem; }
.week-route b { font-family:var(--serif); font-weight:500; font-variant-numeric:tabular-nums; }
.week-route small { color:#59666e; text-align:right; }
.week-route .is-birthday { color:#7a4557; }

/* Support */
.support-stage { position:relative; min-height:max(820px,100svh); display:grid; grid-template-columns:minmax(0,56%) minmax(450px,44%); background:var(--night); }
.support-visual { position:relative; min-width:0; min-height:max(820px,100svh); overflow:hidden; background:var(--surface); }
.theme-photo { position:absolute; inset:0; opacity:0; transform:scale(1.025); transition:opacity .7s ease,transform .9s cubic-bezier(.22,.7,.25,1); }
.theme-photo.is-active { opacity:1; transform:none; }
.theme-photo img { width:100%; height:100%; object-fit:cover; object-position:50% 34%; filter:brightness(.82) saturate(.84); }
.theme-photo[data-theme-panel="gold"] img { object-position:50% 28%; filter:brightness(.82) saturate(.94); }
.theme-photo[data-theme-panel="blue"] img { object-position:50% 31%; filter:brightness(.86) saturate(.96); }
.theme-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,transparent 48%,rgba(var(--night-rgb),.8)),linear-gradient(0deg,rgba(var(--night-rgb),.6),transparent 35%); }
.stage-atmosphere { position:absolute; z-index:3; inset:0; pointer-events:none; background:radial-gradient(circle at 88% 10%,rgba(var(--mood-rgb),.3),transparent 20%),linear-gradient(118deg,transparent 25%,rgba(var(--mood-rgb),.18) 52%,transparent 69%); mix-blend-mode:screen; transition:background .65s ease; }
html[data-mood="gold"] .stage-atmosphere { background:radial-gradient(ellipse at 10% 78%,rgba(255,177,54,.42),transparent 32%),linear-gradient(116deg,transparent 22%,rgba(255,210,122,.42) 45%,transparent 61%); }
html[data-mood="blue"] .stage-atmosphere { background:radial-gradient(circle at 90% 8%,rgba(112,210,255,.28),transparent 22%),linear-gradient(108deg,rgba(2,9,23,.5),transparent 34% 70%,rgba(84,200,255,.2)); }
.stage-caption { position:absolute; z-index:5; left:var(--pad); bottom:2rem; display:grid; }
.stage-caption span { font-family:var(--serif); font-size:clamp(2rem,3.5vw,4rem); font-weight:300; }
.stage-caption small { color:rgba(255,255,255,.65); font-size:.7rem; }
.support-console { min-width:0; display:flex; flex-direction:column; justify-content:center; padding:calc(var(--header-h) + 2.5rem) clamp(2rem,4vw,5rem) 3rem; background:radial-gradient(circle at 0 38%,rgba(var(--mood-rgb),.13),transparent 32%),var(--surface); transition:background .65s ease; }
.week-switcher { display:flex; gap:.25rem; margin:1.2rem 0 .7rem; }
.week-switcher button { min-width:48px; min-height:44px; color:var(--muted); background:transparent; border:0; border-bottom:1px solid var(--line); }
.week-switcher button:hover, .week-switcher button[aria-pressed="true"] { color:var(--mood); border-color:var(--mood); }
.week-dates { display:flex; flex-wrap:wrap; gap:.35rem 1rem; margin:0 0 .65rem; color:var(--muted); font-size:.72rem; font-variant-numeric:tabular-nums; }
.week-dates strong { color:var(--mood); }
.support-console h1 { margin:0; font-family:var(--serif); font-size:clamp(3.2rem,4.4vw,4.8rem); font-weight:320; line-height:1.15; letter-spacing:-.025em; }
.support-console h1 span { display:block; text-wrap:wrap; }
.support-lead { max-width:34rem; margin:1rem 0 1.35rem; color:var(--muted); font-family:var(--serif); font-size:.95rem; line-height:1.85; }
.choice-form fieldset { margin:0; padding:0; border:0; }
.choice-form legend { margin-bottom:.5rem; color:var(--muted); font-size:.73rem; }
.program-option { position:relative; display:block; }
.program-option input { position:absolute; opacity:0; pointer-events:none; }
.program-option > span { min-height:62px; display:grid; grid-template-columns:2.2rem 1fr auto; gap:.8rem; align-items:center; border-top:1px solid var(--line); cursor:pointer; transition:color .2s ease,border-color .2s ease,padding .2s ease; }
.program-option:last-child > span { border-bottom:1px solid var(--line); }
.program-option input:focus-visible + span { outline:3px solid var(--mood); outline-offset:3px; }
.program-option input:checked + span { padding-inline:.55rem; border-color:var(--mood); }
.program-option input:disabled + span { opacity:.45; cursor:not-allowed; }
.program-letter { color:var(--mood); font-family:var(--serif); font-size:1.25rem; }
.program-copy { min-width:0; display:grid; }
.program-copy strong { font-family:var(--serif); font-size:1.08rem; font-weight:520; }
.program-copy small { color:var(--muted); font-size:.68rem; line-height:1.5; }
.program-radio { width:1.75rem; height:1.75rem; position:relative; border:1px solid var(--line-strong); border-radius:50%; }
.program-radio::after { content:""; position:absolute; inset:5px; background:var(--mood); border-radius:50%; transform:scale(0); transition:transform .2s ease; }
.program-option input:checked + span .program-radio::after { transform:scale(1); }
.choice-rule { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.35rem 1rem; margin:.8rem 0 0; padding:.7rem 0; color:var(--muted); border-bottom:1px solid var(--line); font-size:.68rem; }
.choice-rule span:first-child { color:var(--text); }
[data-home-stage-note]:empty { display:none; }
.save-context { display:flex; justify-content:space-between; gap:1rem; margin-top:.9rem; color:var(--muted); font-size:.7rem; }
.save-context strong { color:var(--mood); text-align:right; }
.choice-actions { display:flex; align-items:center; gap:1rem; margin-top:1rem; }
.save-choice, .cancel-choice { min-height:50px; padding:.7rem 1rem; border:1px solid var(--mood); }
.save-choice { color:var(--night); background:var(--mood); font-weight:700; }
.cancel-choice { color:var(--muted); background:transparent; border-color:var(--line-strong); }
.save-choice:disabled, .cancel-choice:disabled { opacity:.35; cursor:not-allowed; }
.form-message { min-height:1.5rem; margin:.65rem 0 0; color:var(--muted); font-size:.7rem; }
.form-message.is-success { color:var(--mood); }
.saved-summary { margin-top:1rem; padding-top:.9rem; display:grid; grid-template-columns:auto 1fr auto; gap:.2rem .75rem; align-items:center; border-top:1px solid var(--line); }
.saved-summary span, .saved-summary small { color:var(--muted); font-size:.68rem; }
.saved-summary strong { color:var(--mood); font-family:var(--serif); }
.saved-summary a { grid-column:1/-1; width:fit-content; min-height:44px; display:flex; align-items:center; color:var(--mood); font-size:.72rem; }
.confirmation-wave { position:absolute; z-index:12; width:6rem; aspect-ratio:1; right:21%; bottom:18%; border:1px solid var(--mood); border-radius:50%; opacity:0; pointer-events:none; }
body.is-confirming .confirmation-wave { animation:confirmation 1s ease-out both; }
.dual-progress { padding:clamp(6rem,10vw,10rem) var(--pad); display:grid; grid-template-columns:.85fr 1fr 1fr; gap:clamp(2rem,5vw,5rem); background:linear-gradient(180deg,var(--night),var(--surface)); }
.section-intro.compact h2 { font-size:clamp(2.4rem,4vw,4.5rem); }
.vote-ledger, .common-unlock { align-self:end; }
.vote-ledger header, .common-unlock header { display:grid; gap:.2rem; margin-bottom:1.2rem; }
.vote-ledger header span, .common-unlock header span { color:var(--mood); font-family:var(--serif); font-size:1.3rem; }
.vote-ledger header small { color:var(--muted); font-size:.66rem; }
.vote-ledger ol { margin:0; padding:0; list-style:none; }
.vote-ledger li { display:grid; grid-template-columns:1fr auto; gap:1rem; padding:.8rem 0; border-bottom:1px solid var(--line); }
.vote-ledger li span { font-family:var(--serif); }
.vote-ledger li b { color:var(--mood); font-variant-numeric:tabular-nums; }
.common-unlock header { grid-template-columns:1fr auto; align-items:end; }
.common-unlock header strong { color:var(--mood); font-size:1.1rem; font-variant-numeric:tabular-nums; }
.unlock-line { height:2px; position:relative; margin:3.8rem 0 2.6rem; background:var(--line-strong); }
.unlock-line > i { width:0; background:var(--mood); }
.unlock-line .mark { position:absolute; top:-2rem; color:var(--muted); font-size:.68rem; transform:translateX(-50%); }
.unlock-line .mark::after { content:""; position:absolute; left:50%; top:2rem; width:1px; height:1rem; background:var(--line-strong); }
.unlock-line .mark small { display:block; white-space:nowrap; }
.mark-20 { left:20%; }
.mark-40 { left:60%; }
.mark-60 { left:100%; transform:translateX(-100%); text-align:right; }
.mark-60::after { left:100% !important; }
.unrevealed-program { min-height:180px; position:relative; isolation:isolate; display:grid; place-content:center; gap:.55rem; padding:2rem; overflow:hidden; text-align:center; border:1px solid rgba(187,229,255,.27); background:radial-gradient(ellipse at 50% 48%,rgba(102,139,210,.28),transparent 42%),linear-gradient(145deg,#061026 0%,#111b3d 54%,#070d21 100%); box-shadow:inset 0 0 80px rgba(2,8,25,.72); }
.unrevealed-program.is-large { min-height:320px; }
.unrevealed-program::after { content:""; position:absolute; z-index:1; inset:0; pointer-events:none; background:linear-gradient(180deg,rgba(5,12,32,.42),transparent 28% 70%,rgba(5,10,27,.5)); box-shadow:inset 0 0 0 1px rgba(221,241,255,.035); }
.unrevealed-program strong { position:relative; z-index:3; font-family:var(--serif); font-size:clamp(1.8rem,4vw,3.6rem); font-weight:320; color:#f3f8ff; text-shadow:0 2px 20px rgba(5,9,27,.95),0 0 34px rgba(177,219,255,.28); }
.unrevealed-program small { position:relative; z-index:3; color:rgba(225,241,255,.72); text-shadow:0 1px 12px #050a1b; }
.star-mist { position:absolute; z-index:0; inset:-16%; overflow:hidden; pointer-events:none; opacity:1; background:radial-gradient(circle at 24% 35%,rgba(255,255,255,.9) 0 1px,transparent 1.8px),radial-gradient(circle at 73% 28%,rgba(182,219,255,.78) 0 1px,transparent 1.8px),radial-gradient(circle at 62% 72%,rgba(222,207,255,.68) 0 1px,transparent 1.8px); background-size:113px 97px,157px 131px,191px 149px; animation:star-drift 22s linear infinite; }
.star-mist::before,.star-mist::after { content:""; position:absolute; left:-22%; width:144%; border-radius:50%; pointer-events:none; mix-blend-mode:screen; filter:blur(18px); }
.star-mist::before { top:7%; height:48%; opacity:.68; background:radial-gradient(ellipse at 46% 56%,rgba(205,231,255,.58) 0,rgba(137,174,226,.3) 31%,rgba(92,118,190,.1) 52%,transparent 72%); animation:mist-sweep-one 11s ease-in-out infinite alternate; }
.star-mist::after { bottom:2%; height:50%; opacity:.58; background:radial-gradient(ellipse at 58% 48%,rgba(222,208,255,.46) 0,rgba(153,165,226,.25) 34%,rgba(84,108,181,.08) 55%,transparent 74%); animation:mist-sweep-two 15s ease-in-out -4s infinite alternate; }
.star-mist i { position:absolute; display:block; left:-28%; width:156%; height:34%; border-radius:50%; pointer-events:none; mix-blend-mode:screen; filter:blur(12px); opacity:.7; background:radial-gradient(ellipse at center,rgba(231,244,255,.58) 0,rgba(166,203,239,.34) 30%,rgba(115,142,207,.12) 52%,transparent 72%); }
.star-mist i:nth-child(1) { top:17%; animation:mist-ribbon-one 13s ease-in-out -2s infinite alternate; }
.star-mist i:nth-child(2) { top:42%; height:29%; opacity:.54; animation:mist-ribbon-two 17s ease-in-out -7s infinite alternate; }
.star-mist i:nth-child(3) { bottom:4%; height:31%; opacity:.42; background:radial-gradient(ellipse at center,rgba(221,208,255,.45),rgba(130,151,216,.2) 40%,transparent 70%); animation:mist-ribbon-three 20s ease-in-out -5s infinite alternate; }
.unrevealed-ledger { opacity:.72; }
.weekly-archive li.is-unrevealed { position:relative; overflow:hidden; }
.archive-mist { display:inline-block; width:36px; height:10px; margin-right:.45rem; border-radius:999px; vertical-align:middle; background:radial-gradient(circle at 25% 50%,#fff 0 1px,transparent 2px),radial-gradient(circle at 75% 40%,#c3dcff 0 1px,transparent 2px),linear-gradient(90deg,transparent,rgba(124,161,223,.34),transparent); animation:mist-pulse 5s ease-in-out infinite; }
@keyframes star-drift { to { transform:translate3d(28px,-18px,0); } }
@keyframes mist-sweep-one { from { transform:translate3d(-7%,-2%,0) scale(.96); } to { transform:translate3d(8%,5%,0) scale(1.08); opacity:.46; } }
@keyframes mist-sweep-two { from { transform:translate3d(8%,4%,0) scale(1.08); } to { transform:translate3d(-8%,-3%,0) scale(.96); opacity:.72; } }
@keyframes mist-ribbon-one { from { transform:translate3d(-5%,-8%,0) rotate(-5deg) scaleX(.92); } to { transform:translate3d(10%,12%,0) rotate(3deg) scaleX(1.06); } }
@keyframes mist-ribbon-two { from { transform:translate3d(9%,6%,0) rotate(4deg) scaleX(1.04); } to { transform:translate3d(-9%,-9%,0) rotate(-3deg) scaleX(.94); } }
@keyframes mist-ribbon-three { from { transform:translate3d(-4%,5%,0) rotate(2deg); } to { transform:translate3d(7%,-7%,0) rotate(-4deg) scaleX(1.08); } }
@keyframes mist-pulse { 50% { opacity:.42; transform:scaleX(.82); } }
.common-unlock > p { color:var(--muted); font-size:.72rem; }
.demo-control { padding:clamp(5rem,9vw,9rem) var(--pad); display:grid; grid-template-columns:.85fr 1.6fr; gap:clamp(2rem,6vw,7rem); background:#e6ecee; color:#17212a; }
.demo-heading > p:first-child { color:#966174; font-size:.72rem; }
.demo-heading h2 { margin:0; font-family:var(--serif); font-size:clamp(2.6rem,4.6vw,5rem); font-weight:320; line-height:1.15; }
.demo-heading > p:last-child { color:#59656d; }
.scenario-picker { align-self:start; display:grid; grid-template-columns:auto minmax(180px,1fr); gap:1rem; align-items:center; padding-bottom:1rem; border-bottom:1px solid rgba(23,33,42,.22); }
.scenario-picker label { font-weight:700; }
.scenario-picker select { min-height:48px; padding:.6rem 2rem .6rem .75rem; color:#17212a; background:#f7f8f7; border:1px solid rgba(23,33,42,.38); }
.demo-actions { grid-column:2; display:grid; grid-template-columns:1fr 1fr; border-top:1px solid rgba(23,33,42,.25); }
.demo-actions button { min-height:112px; display:grid; align-content:center; justify-items:start; padding:1rem; color:#17212a; background:transparent; border:0; border-right:1px solid rgba(23,33,42,.18); border-bottom:1px solid rgba(23,33,42,.18); text-align:left; }
.demo-actions button:nth-child(2n) { border-right:0; }
.demo-actions button:hover { background:rgba(255,255,255,.5); }
.demo-actions span { color:#68737a; font-size:.7rem; }
.demo-actions strong { font-family:var(--serif); font-size:1.2rem; }
.demo-actions small { color:#68737a; font-size:.67rem; }
.transaction-result { grid-column:2; display:grid; grid-template-columns:repeat(3,1fr); border-block:1px solid rgba(23,33,42,.3); }
.transaction-result div { padding:1.1rem; border-right:1px solid rgba(23,33,42,.18); }
.transaction-result div:last-child { border:0; }
.transaction-result span { display:block; color:#68737a; font-size:.67rem; }
.transaction-result strong { font-family:var(--serif); font-size:2rem; font-weight:350; font-variant-numeric:tabular-nums; }
.demo-footer { grid-column:2; display:flex; justify-content:space-between; gap:1rem; align-items:center; }
.demo-footer p { color:#59656d; font-size:.72rem; }
.reset-button { min-height:46px; color:#7d3547; background:transparent; border:1px solid rgba(125,53,71,.42); }
.reset-dialog { width:min(520px,calc(100vw - 2rem)); padding:2rem; color:#17212a; background:#f3f4f2; border:0; box-shadow:0 30px 90px rgba(0,0,0,.35); overscroll-behavior:contain; }
.reset-dialog::backdrop { background:rgba(2,6,14,.72); }
.reset-dialog h2 { font-family:var(--serif); font-size:2rem; }
.reset-dialog > div { display:flex; gap:.8rem; }
.reset-dialog button { min-height:48px; padding:.7rem 1rem; }

/* Personal */
.personal-hero { min-height:max(760px,92svh); display:grid; grid-template-columns:1.05fr .95fr; background:linear-gradient(145deg,#061426,#020917); }
.personal-photo { position:relative; overflow:hidden; order:2; }
.personal-photo img { width:100%; height:100%; object-fit:cover; object-position:52% 29%; filter:brightness(.84) saturate(.94); }
.personal-photo > div { position:absolute; inset:0; background:linear-gradient(90deg,rgba(2,9,23,.88),transparent 36%),linear-gradient(0deg,rgba(2,9,23,.38),transparent 35%); }
.personal-copy { display:grid; align-content:center; padding:calc(var(--header-h) + 4rem) var(--pad) 5rem; }
.personal-copy h1 { margin:1.4rem 0 2rem; font-family:var(--serif); font-size:clamp(3.5rem,6vw,6.6rem); font-weight:320; line-height:1.12; letter-spacing:-.03em; }
.personal-copy h1 span { display:block; }
.monthly-total { display:grid; grid-template-columns:auto 1fr; align-items:end; width:min(100%,34rem); padding-block:1.2rem; border-block:1px solid var(--line-strong); }
.monthly-total span { color:var(--muted); font-size:.75rem; }
.monthly-total strong { grid-row:1/3; grid-column:2; justify-self:end; color:var(--mood); font-family:var(--serif); font-size:clamp(4rem,8vw,8rem); font-weight:250; line-height:.9; font-variant-numeric:tabular-nums; }
.monthly-total small { color:var(--muted); font-size:.68rem; }
.identity-note { max-width:34rem; margin-top:2rem; }
.identity-note label { display:block; margin-bottom:.45rem; font-size:.72rem; }
.identity-note > div { display:grid; grid-template-columns:1fr auto; }
.identity-note input { min-height:48px; padding:.7rem .8rem; color:var(--text); background:transparent; border:1px solid var(--line-strong); }
.identity-note button { min-height:48px; color:var(--night); background:var(--mood); border:1px solid var(--mood); }
.identity-note p { color:var(--muted); font-size:.67rem; }
.reward-journey { padding:clamp(6rem,10vw,10rem) var(--pad); display:grid; grid-template-columns:.75fr 1.25fr; gap:clamp(3rem,8vw,9rem); background:linear-gradient(180deg,#020917,#071426); }
.reward-intro > p:last-child { max-width:31rem; color:var(--muted); }
.reward-rail { margin:0; padding:0; list-style:none; border-top:1px solid var(--line-strong); }
.reward-rail li { min-height:120px; display:grid; grid-template-columns:5rem 1fr auto; gap:1rem; align-items:center; border-bottom:1px solid var(--line); }
.reward-index { color:var(--mood); font-size:.7rem; }
.reward-rail h3 { margin:0; font-family:var(--serif); font-size:1.35rem; font-weight:450; }
.reward-rail p { margin:.2rem 0 0; color:var(--muted); font-size:.7rem; }
.reward-rail li > strong { color:var(--muted); font-size:.72rem; }
.reward-rail li.is-near > strong { color:var(--gold); }
.reward-rail li.is-unlocked > strong, .reward-rail li.is-earned > strong { color:var(--mood); }
.reward-action { grid-column:2; display:flex; justify-content:space-between; align-items:center; gap:1rem; }
.reward-action p { color:var(--muted); font-size:.75rem; }
.reward-action button { min-height:48px; padding:.7rem 1rem; color:var(--text); background:transparent; border:1px solid var(--line-strong); }
.support-days { min-height:75svh; display:grid; grid-template-columns:1fr .7fr 1fr; gap:clamp(2rem,6vw,7rem); align-items:center; padding:clamp(5rem,9vw,9rem) var(--pad); color:#17212a; background:#dfeaec; }
.days-copy > p:last-child { color:#59656d; }
.day-orbit { width:min(26vw,18rem); aspect-ratio:1; position:relative; display:grid; place-content:center; justify-items:center; border:1px solid rgba(23,33,42,.25); border-radius:50%; }
.day-orbit::before { content:""; position:absolute; inset:1rem; border:1px dashed rgba(23,33,42,.2); border-radius:50%; }
.day-orbit strong { font-family:var(--serif); font-size:clamp(4rem,8vw,7rem); font-weight:250; line-height:1; }
.day-orbit span { font-size:.7rem; }
.day-orbit i { position:absolute; inset:-1px; border:3px solid #32799d; border-radius:50%; clip-path:polygon(0 0,50% 0,50% 50%,0 50%); transform:rotate(var(--day-rotation,0deg)); transition:transform .7s ease; }
.day-milestones { margin:0; padding:0; list-style:none; border-top:1px solid rgba(23,33,42,.3); }
.day-milestones li { display:grid; grid-template-columns:3rem 1fr auto; gap:1rem; align-items:center; min-height:70px; border-bottom:1px solid rgba(23,33,42,.2); }
.day-milestones small { color:#6a747a; }
.day-milestones li.is-earned small { color:#21678a; font-weight:700; }
.support-days .primary-action { grid-column:3; }

/* Birthday */
.birthday-page, .rules-page { color:#17212a; background:#eef0ee; }
.birthday-hero { min-height:max(780px,100svh); display:grid; grid-template-columns:minmax(360px,.85fr) minmax(0,1.15fr); background:#e8edf1; }
.birthday-hero figure { margin:0; min-height:780px; overflow:hidden; clip-path:polygon(0 0,88% 0,100% 100%,0 100%); }
.birthday-hero figure img { width:100%; height:100%; object-fit:cover; object-position:50% 27%; }
.birthday-hero-copy { display:grid; align-content:center; padding:calc(var(--header-h) + 3rem) var(--pad) 5rem; }
.birthday-hero-copy > p:first-child { margin:0; color:#986274; font-size:.75rem; }
.birthday-date { color:#986274; font-family:var(--serif); font-size:clamp(3.5rem,7vw,7.5rem); font-weight:250; line-height:1; }
.birthday-hero h1 { margin:1rem 0; font-family:var(--serif); font-size:clamp(3rem,5.5vw,6.2rem); font-weight:320; line-height:1.14; letter-spacing:-.03em; }
.birthday-hero-copy > p:last-of-type { max-width:39rem; color:#566269; font-family:var(--serif); line-height:1.9; }
.birthday-goal { padding:clamp(6rem,10vw,10rem) var(--pad); display:grid; grid-template-columns:.8fr 1fr; gap:clamp(3rem,8vw,9rem); background:#f3f2ee; }
.birthday-goal-copy > p:last-child { color:#59656d; }
.birthday-meter { display:grid; grid-template-columns:auto 1fr; gap:3rem; align-items:center; }
.birthday-orbit { width:min(26vw,18rem); aspect-ratio:1; position:relative; display:grid; place-content:center; justify-items:center; color:#f7f3ee; background:#26323b; border-radius:50%; overflow:hidden; }
.birthday-orbit::before { content:""; position:absolute; inset:0; background:conic-gradient(#b86f86 var(--birthday-progress,0%),rgba(255,255,255,.08) 0); }
.birthday-orbit::after { content:""; position:absolute; inset:.7rem; background:#26323b; border-radius:50%; }
.birthday-orbit > * { position:relative; z-index:2; }
.birthday-orbit strong { font-family:var(--serif); font-size:clamp(3rem,6vw,5.8rem); font-weight:250; line-height:1; }
.birthday-orbit span { font-size:.68rem; }
.birthday-meter ol { margin:0; padding:0; list-style:none; border-top:1px solid rgba(23,33,42,.3); }
.birthday-meter li { min-height:90px; display:grid; grid-template-columns:4rem 1fr; gap:.5rem 1rem; align-content:center; border-bottom:1px solid rgba(23,33,42,.2); }
.birthday-meter b { grid-row:1/3; color:#986274; font-family:var(--serif); font-size:1.6rem; }
.birthday-meter small { color:#69737a; }
.birthday-meter li.is-unlocked span { color:#8c4f65; font-weight:700; }
.birthday-demo { grid-column:2; display:flex; align-items:center; gap:1.2rem; padding-top:1.2rem; border-top:1px solid rgba(23,33,42,.25); }
.birthday-demo button { min-height:58px; display:grid; padding:.6rem 1rem; color:#f7f3ee; background:#26323b; border:0; text-align:left; }
.birthday-demo p { color:#59656d; font-size:.72rem; }
.birthday-wish { padding:clamp(5rem,9vw,9rem) var(--pad); display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(3rem,8vw,9rem); color:#f6f3ed; background:#202b34; }
.birthday-wish > div > p:first-child { color:#e1a5b7; font-size:.72rem; }
.birthday-wish h2 { margin:0; font-family:var(--serif); font-size:clamp(2.8rem,5vw,5.5rem); font-weight:320; }
.birthday-wish > div > p:last-child { color:rgba(246,243,237,.65); }
.birthday-wish form { display:grid; align-content:center; }
.birthday-wish label { margin-bottom:.5rem; }
.birthday-wish textarea { width:100%; padding:1rem; color:#f6f3ed; background:transparent; border:1px solid rgba(246,243,237,.42); resize:vertical; }
.birthday-wish form > div { display:flex; justify-content:space-between; align-items:center; margin-top:.8rem; }
.birthday-wish form span { color:rgba(246,243,237,.6); font-size:.7rem; }
.birthday-wish button { min-height:50px; padding:.7rem 1rem; color:#202b34; background:#f6f3ed; border:0; }

/* Honors */
.honors-hero { min-height:max(760px,92svh); position:relative; display:grid; grid-template-columns:1fr 1fr; overflow:hidden; background:#140b06; }
.honors-photo { min-height:760px; overflow:hidden; }
.honors-photo img { width:100%; height:100%; object-fit:cover; object-position:50% 34%; filter:brightness(.82) saturate(.96); }
.honors-copy { display:grid; align-content:center; padding:calc(var(--header-h) + 3rem) var(--pad) 5rem; background:radial-gradient(circle at 0 50%,rgba(255,178,63,.19),transparent 42%),#1b0d05; }
.honors-copy > p:first-child { color:#ffb23f; font-size:.72rem; }
.honors-copy h1 { margin:0; font-family:var(--serif); font-size:clamp(3.2rem,5.4vw,6rem); font-weight:310; line-height:1.14; }
.honors-copy > p:nth-of-type(2) { max-width:38rem; color:rgba(255,242,210,.68); font-family:var(--serif); line-height:1.9; }
.honors-sigil { position:absolute; left:var(--pad); bottom:2.5rem; display:grid; color:#fff2d2; }
.honors-sigil span, .honors-sigil small { font-size:.65rem; }
.honors-sigil strong { font-family:var(--serif); font-size:4rem; font-weight:250; line-height:1; }
.monthly-board { padding:clamp(6rem,10vw,10rem) var(--pad); display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(3rem,8vw,9rem); background:#ede9df; color:#241a14; }
.board-heading > p:last-child { color:#685d56; }
.podium { margin:0; padding:0; list-style:none; align-self:end; border-top:1px solid rgba(36,26,20,.3); }
.podium li { min-height:100px; display:grid; grid-template-columns:4rem 1fr auto; gap:1rem; align-items:center; border-bottom:1px solid rgba(36,26,20,.22); }
.podium span { color:#9a6741; font-family:var(--serif); font-size:1.4rem; }
.podium strong { font-family:var(--serif); font-size:1.2rem; }
.podium small { color:#71665e; }
.podium .is-first { min-height:140px; }
.podium .is-first span { font-size:2.5rem; }
.podium .is-first strong { font-size:1.6rem; }
.weekly-archive { padding:clamp(5rem,9vw,9rem) var(--pad); color:#fff2d2; background:#1b0d05; }
.archive-heading { max-width:1100px; margin:0 auto 3rem; display:grid; grid-template-columns:.4fr 1.4fr; gap:3rem; align-items:end; }
.weekly-archive > ol { max-width:1100px; margin:0 auto; padding:0; list-style:none; border-top:1px solid rgba(255,242,210,.32); }
.weekly-archive li { min-height:94px; display:grid; grid-template-columns:5rem 1fr 1fr auto; gap:1rem; align-items:center; border-bottom:1px solid rgba(255,242,210,.16); }
.weekly-archive li > span { color:#ffb23f; }
.weekly-archive b { font-family:var(--serif); font-size:1.1rem; }
.weekly-archive small { color:rgba(255,242,210,.55); }
.weekly-archive em { font-style:normal; color:#ffb23f; font-size:.72rem; }
.audit-note { padding:clamp(5rem,9vw,9rem) var(--pad); display:grid; grid-template-columns:.55fr 1.45fr; gap:clamp(3rem,8vw,8rem); color:#17212a; background:#d9e6e9; }
.audit-note > span { font-family:var(--serif); font-size:clamp(5rem,12vw,12rem); font-weight:230; line-height:.8; }
.audit-note h2 { margin:0; font-family:var(--serif); font-size:clamp(2.8rem,5vw,5rem); font-weight:320; }
.audit-note p { max-width:47rem; color:#59656d; }
.audit-note a { min-height:44px; display:inline-flex; align-items:center; color:#315f78; text-underline-offset:.35rem; }

/* Rules */
.rules-layout { min-height:100svh; display:grid; grid-template-columns:minmax(220px,.34fr) minmax(0,1.66fr); padding-top:var(--header-h); color:#17212a; background:#f0eee9; }
.rules-index { position:sticky; top:0; height:100svh; align-self:start; padding:4rem 2rem 3rem var(--pad); border-right:1px solid rgba(23,33,42,.18); }
.rules-index > p { color:#986274; font-family:var(--serif); font-size:1.2rem; }
.rules-index nav { display:grid; }
.rules-index a { min-height:44px; display:flex; align-items:center; border-bottom:1px solid rgba(23,33,42,.12); text-decoration:none; font-size:.8rem; }
.rules-index a:hover { color:#986274; }
.rules-document { width:min(100%,960px); padding:5rem clamp(2rem,7vw,8rem) 8rem; }
.rules-document header { padding-bottom:4rem; border-bottom:1px solid rgba(23,33,42,.28); }
.rules-document header > p:first-child { color:#986274; font-size:.72rem; }
.rules-document h1 { margin:0; font-family:var(--serif); font-size:clamp(3rem,5.3vw,6rem); font-weight:320; line-height:1.15; letter-spacing:-.03em; }
.rules-document header > p:last-child { max-width:48rem; color:#59656d; font-family:var(--serif); font-size:1rem; line-height:1.9; }
.rules-document section { padding:4rem 0; border-bottom:1px solid rgba(23,33,42,.2); }
.rules-document h2 { margin:0 0 1.4rem; font-family:var(--serif); font-size:clamp(2rem,3.5vw,3.6rem); font-weight:400; }
.rules-document p, .rules-document li, .rules-document dd { max-width:48rem; }
.rules-document table { width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums; }
.rules-document th, .rules-document td { padding:.8rem; border-bottom:1px solid rgba(23,33,42,.16); text-align:left; }
.rules-document th { color:#986274; font-size:.72rem; }
.rules-document ol, .rules-document ul { padding-left:1.4rem; }
.rules-document ol li { margin-bottom:1.2rem; }
.rules-document ol strong, .rules-document ol span { display:block; }
.rules-document ol span { color:#59656d; }
.rules-document dl { margin:0; border-top:1px solid rgba(23,33,42,.24); }
.rules-document dl div { display:grid; grid-template-columns:11rem 1fr; gap:2rem; padding:1rem 0; border-bottom:1px solid rgba(23,33,42,.16); }
.rules-document dt { color:#986274; font-weight:700; }
.rules-document dd { margin:0; color:#59656d; }

/* Footer and feedback */
.site-footer { min-height:150px; display:flex; justify-content:space-between; align-items:center; gap:2rem; padding:2rem max(var(--pad),env(safe-area-inset-right)) max(2rem,calc(1.3rem + env(safe-area-inset-bottom))) max(var(--pad),env(safe-area-inset-left)); color:var(--muted); background:var(--night); border-top:1px solid var(--line); font-size:.68rem; }
.site-footer.is-light { color:#59656d; background:#f0eee9; border-color:rgba(23,33,42,.16); }
.site-footer p { max-width:52rem; margin:0; }
.site-footer nav { display:flex; flex-wrap:wrap; gap:1rem; }
.site-footer a { min-height:44px; display:inline-flex; align-items:center; text-underline-offset:.3rem; }
.status-toast { position:fixed; z-index:120; right:max(1rem,env(safe-area-inset-right)); bottom:max(1rem,env(safe-area-inset-bottom)); width:min(420px,calc(100vw - 2rem)); min-height:78px; display:grid; align-content:center; padding:1rem 1.2rem; color:#08101b; background:#f4f7fb; box-shadow:0 22px 65px rgba(0,0,0,.42); opacity:0; transform:translateY(1rem); }
.status-toast.is-light { color:#17212a; background:#fff; }
.status-toast.is-active { animation:toast-in .3s ease-out forwards; }

@keyframes curtain-left { to { transform:translateX(-102%); } }
@keyframes curtain-right { to { transform:translateX(102%); } }
@keyframes toast-in { to { opacity:1; transform:none; } }
@keyframes confirmation { 0% { opacity:.85; transform:scale(.2); } 100% { opacity:0; transform:scale(12); } }
@keyframes mobile-ticker-scroll { to { transform:translateX(-50%); } }

@media (max-width:1180px) {
  .desktop-nav { display:none; }
  .menu-button { display:grid; }
  .support-stage { grid-template-columns:51% 49%; }
  .support-console { padding-inline:2rem; }
  .home-copy h1 { font-size:clamp(3.8rem,6.2vw,5.7rem); }
  .dual-progress { grid-template-columns:1fr 1fr; }
  .dual-progress .section-intro { grid-column:1/-1; }
}

@media (max-width:820px) {
  :root { --header-h:68px; --pad:1.15rem; --mobile-nav-h:64px; }
  body:not(.fused-home) { padding-bottom:calc(var(--mobile-nav-h) + env(safe-area-inset-bottom)); }
  .site-header { min-height:var(--header-h); }
  .brand b, .demo-shortcut { display:none; }
  .header-inner { min-height:calc(var(--header-h) - 1.4rem); grid-template-columns:auto 1fr; }
  .header-tools { display:none; }
  .mobile-menu {
    z-index:150;
    inset:0 0 calc(var(--mobile-nav-h) + env(safe-area-inset-bottom));
    display:grid !important;
    align-content:end;
    padding:min(22svh,9rem) .65rem .55rem;
    background:rgba(1,5,13,.62);
    transform:none;
    overscroll-behavior:contain;
  }
  .mobile-menu nav,
  .mobile-menu > p {
    opacity:0;
    transform:translateY(1.25rem);
    transition:opacity .22s ease,transform .28s cubic-bezier(.2,.75,.2,1);
  }
  .mobile-menu.is-open nav,
  .mobile-menu.is-open > p { opacity:1; transform:none; }
  .mobile-menu nav {
    max-height:calc(78svh - var(--mobile-nav-h) - 3.8rem);
    overflow-y:auto;
    padding:.25rem 1rem;
    color:#f4f7fb;
    background:rgba(5,11,24,.98);
    border:1px solid rgba(255,255,255,.14);
    border-bottom:0;
    border-radius:1rem 1rem 0 0;
    box-shadow:0 -24px 65px rgba(0,0,0,.36);
  }
  .mobile-menu nav a,
  .mobile-menu nav button {
    width:100%;
    min-height:52px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0;
    color:inherit;
    background:transparent;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.12);
    text-decoration:none;
    text-align:left;
    font-family:var(--serif);
    font-size:1.05rem;
  }
  .mobile-menu nav a::after { content:"↗"; color:rgba(255,255,255,.35); font-family:var(--sans); font-size:.7rem; }
  .mobile-menu nav a[aria-current="page"] { color:var(--mood,#9adfff); }
  .mobile-menu nav button { color:#bfeaff; }
  .mobile-menu nav button::after { content:"金曲帳號"; color:rgba(255,255,255,.38); font-family:var(--sans); font-size:.62rem; }
  .mobile-menu .mobile-nav-divider {
    min-height:34px;
    display:flex;
    align-items:end;
    padding-bottom:.45rem;
    color:rgba(255,255,255,.38);
    border-bottom:1px solid rgba(255,255,255,.12);
    font-size:.6rem;
  }
  .mobile-menu > p {
    margin:0;
    padding:.75rem 1rem;
    color:rgba(255,255,255,.48);
    background:rgba(5,11,24,.98);
    border:1px solid rgba(255,255,255,.14);
    border-top:0;
    font-size:.62rem;
  }
  .mobile-bottom-dock {
    position:fixed;
    z-index:160;
    inset:auto 0 0;
    min-height:calc(var(--mobile-nav-h) + env(safe-area-inset-bottom));
    display:grid;
    grid-template-columns:minmax(0,1fr) 76px;
    padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
    color:rgba(244,247,251,.72);
    background:rgba(4,8,17,.93);
    border-top:1px solid rgba(255,255,255,.12);
    box-shadow:0 -16px 40px rgba(0,0,0,.26);
    backdrop-filter:blur(18px) saturate(1.25);
    -webkit-backdrop-filter:blur(18px) saturate(1.25);
  }
  .mobile-ticker {
    min-width:0;
    min-height:var(--mobile-nav-h);
    position:relative;
    overflow:hidden;
    display:grid;
    align-items:center;
    mask-image:linear-gradient(90deg,transparent,#000 .9rem,#000 calc(100% - .9rem),transparent);
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 .9rem,#000 calc(100% - .9rem),transparent);
    color:inherit;
    text-decoration:none;
  }
  .mobile-ticker:focus-visible { outline:2px solid var(--mood,#9adfff); outline-offset:-4px; }
  .mobile-ticker-track {
    width:max-content;
    display:flex;
    will-change:transform;
    animation:mobile-ticker-scroll 28s linear infinite;
  }
  .mobile-ticker-run { display:flex; align-items:center; white-space:nowrap; }
  .mobile-ticker-run span { display:flex; align-items:center; color:rgba(244,247,251,.66); font-size:.65rem; letter-spacing:.035em; }
  .mobile-ticker-run span::before { content:""; width:.32rem; height:.32rem; margin:0 .72rem; flex:none; background:var(--mood,#9adfff); border-radius:50%; }
  .mobile-ticker-static { display:none; padding:0 1rem; overflow:hidden; color:rgba(244,247,251,.66); font-size:.65rem; white-space:nowrap; text-overflow:ellipsis; }
  .bottom-menu-button {
    min-width:76px;
    min-height:var(--mobile-nav-h);
    display:grid;
    place-content:center;
    gap:.18rem;
    color:#f4f7fb;
    background:rgba(255,255,255,.035);
    border:0;
    border-left:1px solid rgba(255,255,255,.14);
    font-size:.62rem;
    letter-spacing:.08em;
    -webkit-tap-highlight-color:transparent;
  }
  .bottom-menu-button svg {
    width:1.25rem;
    height:1.25rem;
    margin:auto;
    fill:none;
    stroke:currentColor;
    stroke-width:1.45;
    stroke-linecap:round;
  }
  .bottom-menu-button[aria-expanded="true"] { color:var(--mood,#9adfff); background:rgba(255,255,255,.08); }
  .bottom-menu-button:focus-visible { outline:2px solid var(--mood,#9adfff); outline-offset:-4px; }
  .menu-open .mobile-ticker-track { animation-play-state:paused; }
  .status-toast { bottom:calc(var(--mobile-nav-h) + max(1rem,env(safe-area-inset-bottom))); }
  .home-hero { min-height:0; padding-bottom:2rem; }
  .home-backdrop::after { background:linear-gradient(0deg,rgba(var(--night-rgb),1) 0 38%,rgba(var(--night-rgb),.14) 74%,rgba(var(--night-rgb),.34)); }
  .home-portrait { position:relative; width:100%; height:62svh; min-height:430px; clip-path:polygon(0 0,100% 0,100% 100%,0 94%); }
  .home-portrait::after { background:linear-gradient(0deg,rgba(var(--night-rgb),.78),transparent 44%); }
  .home-portrait figcaption { display:none; }
  .home-copy { width:auto; min-height:0; padding:1.5rem var(--pad) 2rem; }
  .home-copy h1 { max-width:none; font-size:clamp(2.7rem,11vw,4.5rem); }
  .home-lead { font-size:.9rem; }
  .home-mission { position:relative; right:auto; bottom:auto; width:auto; grid-template-columns:1fr; margin:0 var(--pad); background:transparent; }
  .home-mission > p { grid-template-columns:auto 1fr; gap:.2rem 1rem; }
  .home-mission > p strong { grid-row:1/3; grid-column:2; justify-self:end; }
  .birthday-mark { top:calc(var(--header-h) + 1rem); }
  .birthday-mark strong { font-size:2.7rem; }
  .month-score .section-intro, .route-heading, .archive-heading { grid-template-columns:1fr; gap:1rem; }
  .score-ribbon { grid-template-columns:1fr; }
  .score-ribbon article { padding:1.5rem 0; border-right:0; border-bottom:1px solid var(--line); }
  .score-ribbon article:last-child { border-bottom:0; }
  .month-route { grid-template-columns:1fr; }
  .route-photo { min-height:58svh; height:58svh; }
  .route-copy { padding:4rem var(--pad); }
  .week-route li { grid-template-columns:3rem 1fr; }
  .week-route small { grid-column:2; text-align:left; }
  .support-stage { min-height:0; grid-template-columns:1fr; }
  .support-visual { min-height:56svh; height:56svh; }
  .theme-photo::after { background:linear-gradient(0deg,rgba(var(--night-rgb),.78),transparent 50%); }
  .theme-photo img, .theme-photo[data-theme-panel="gold"] img, .theme-photo[data-theme-panel="blue"] img { object-position:50% 29%; }
  .support-console { padding:2.5rem var(--pad) max(4rem,calc(3rem + env(safe-area-inset-bottom))); }
  .support-console h1 { font-size:clamp(2.6rem,10vw,4rem); }
  .dual-progress { grid-template-columns:1fr; }
  .dual-progress .section-intro { grid-column:auto; }
  .demo-control { grid-template-columns:1fr; }
  .scenario-picker, .demo-actions, .transaction-result, .demo-footer { grid-column:auto; }
  .personal-hero { grid-template-columns:1fr; }
  .personal-photo { order:0; min-height:58svh; height:58svh; }
  .personal-photo > div { background:linear-gradient(0deg,rgba(2,9,23,.78),transparent 45%); }
  .personal-copy { padding:3rem var(--pad) 4rem; }
  .personal-copy h1 { font-size:clamp(2.8rem,10vw,4.5rem); }
  .reward-journey { grid-template-columns:1fr; }
  .reward-action { grid-column:auto; }
  .support-days { grid-template-columns:1fr; justify-items:start; }
  .day-orbit { width:min(72vw,18rem); justify-self:center; }
  .support-days .primary-action { grid-column:auto; }
  .birthday-hero { grid-template-columns:1fr; }
  .birthday-hero figure { min-height:58svh; height:58svh; clip-path:polygon(0 0,100% 0,100% 94%,0 100%); }
  .birthday-hero-copy { padding:3rem var(--pad) 4rem; }
  .birthday-goal, .birthday-wish, .monthly-board, .audit-note { grid-template-columns:1fr; }
  .birthday-meter { grid-template-columns:1fr; }
  .birthday-orbit { width:min(72vw,18rem); margin:auto; }
  .birthday-demo { grid-column:auto; }
  .honors-hero { grid-template-columns:1fr; }
  .honors-photo { min-height:58svh; height:58svh; }
  .honors-copy { padding:3rem var(--pad) 4rem; }
  .honors-sigil { top:calc(var(--header-h) + 1rem); bottom:auto; }
  .weekly-archive li { grid-template-columns:3rem 1fr auto; padding:1rem 0; }
  .weekly-archive small { grid-column:2/4; }
  .rules-layout { grid-template-columns:1fr; }
  .rules-index { position:relative; height:auto; padding:2rem var(--pad); border-right:0; border-bottom:1px solid rgba(23,33,42,.18); }
  .rules-index nav { grid-template-columns:1fr 1fr; }
  .rules-document { padding:4rem var(--pad) 6rem; }
  .site-footer { display:grid; }
}

@media (max-width:480px) {
  .home-portrait { height:57svh; min-height:390px; }
  .home-copy h1 { font-size:clamp(2.35rem,10.5vw,3.2rem); line-height:1.15; }
  .truth-chip em { flex-basis:100%; padding-left:1.15rem; }
  .birthday-mark small { display:none; }
  .month-score, .dual-progress, .demo-control, .reward-journey, .support-days, .birthday-goal, .birthday-wish, .monthly-board, .weekly-archive, .audit-note { padding-block:5rem; }
  .section-intro h2, .reward-intro h2, .days-copy h2, .birthday-goal-copy h2, .board-heading h2, .archive-heading h2 { font-size:2.55rem; }
  .support-visual { min-height:52svh; height:52svh; }
  .stage-caption { bottom:1rem; }
  .stage-caption span { font-size:1.7rem; }
  .support-console { padding-top:2.2rem; }
  .support-console h1 { font-size:clamp(2.35rem,10vw,3rem); }
  .program-option > span { grid-template-columns:1.8rem 1fr 1.7rem; gap:.6rem; }
  .choice-actions { display:grid; }
  .choice-actions button { width:100%; }
  .save-context { display:grid; }
  .save-context strong { text-align:left; }
  .demo-actions { grid-template-columns:1fr; }
  .demo-actions button, .demo-actions button:nth-child(2n) { border-right:0; }
  .transaction-result { grid-template-columns:1fr; }
  .transaction-result div { border-right:0; border-bottom:1px solid rgba(23,33,42,.16); }
  .demo-footer, .birthday-demo, .birthday-wish form > div, .reward-action { align-items:stretch; flex-direction:column; }
  .reward-rail li { grid-template-columns:4rem 1fr; padding:1rem 0; }
  .reward-rail li > strong { grid-column:2; }
  .identity-note > div { grid-template-columns:1fr; gap:.5rem; }
  .birthday-hero h1, .honors-copy h1 { font-size:clamp(2.7rem,11vw,3.7rem); }
  .birthday-meter li { grid-template-columns:3rem 1fr; }
  .podium li { grid-template-columns:3rem 1fr; padding:1rem 0; }
  .podium small { grid-column:2; }
  .weekly-archive li { grid-template-columns:2.5rem 1fr; }
  .weekly-archive em, .weekly-archive small { grid-column:2; }
  .audit-note > span { font-size:5rem; }
  .rules-index nav { grid-template-columns:1fr; }
  .rules-document h1 { font-size:2.8rem; }
  .rules-document table { display:block; overflow-x:auto; }
  .rules-document dl div { grid-template-columns:1fr; gap:.25rem; }
  .site-footer nav { display:grid; grid-template-columns:1fr 1fr; }
}

@media (max-width:820px) and (max-height:640px) {
  .mobile-menu { padding-top:5svh; }
  .mobile-menu nav { max-height:calc(95svh - var(--mobile-nav-h) - 3rem); }
  .mobile-menu nav a,
  .mobile-menu nav button { min-height:44px; font-size:.94rem; }
  .mobile-menu .mobile-nav-divider { min-height:27px; padding-bottom:.35rem; }
  .mobile-menu > p { padding:.55rem 1rem; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.001ms !important; animation-delay:0ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .page-curtain { display:none; }
  .confirmation-wave { display:none; }
  .mobile-ticker-track { display:none; }
  .mobile-ticker-static { display:block; }
}

/* 2026-10-03 birthday stage */
.stage-home { background:#030816; }
.stage-entry-light { position:fixed; z-index:190; inset:0; overflow:hidden; pointer-events:none; visibility:hidden; transition:visibility 0s linear 1.45s; }
.stage-entry-light i { position:absolute; top:-32%; width:34vw; height:170%; opacity:0; background:linear-gradient(90deg,transparent,rgba(232,242,255,.72),transparent); filter:blur(24px); transform:rotate(14deg) translateX(-120vw); mix-blend-mode:screen; }
.stage-entry-light i:first-child { left:5%; animation:stage-light-in 1.15s cubic-bezier(.28,.72,.26,1) .05s both; }
.stage-entry-light i:last-child { right:4%; animation:stage-light-in 1.15s cubic-bezier(.28,.72,.26,1) .22s both; }
.birthday-stage { min-height:max(820px,100svh); position:relative; display:grid; grid-template-columns:minmax(380px,.9fr) minmax(450px,1.1fr); grid-template-rows:1fr auto; isolation:isolate; overflow:hidden; background:var(--night); transition:background-color .48s ease; }
.stage-image { position:absolute; z-index:-3; inset:-5%; overflow:hidden; }
.stage-image img { width:100%; height:100%; object-fit:cover; object-position:50% 28%; opacity:.23; filter:blur(34px) saturate(.75); transform:scale(1.12); transition:opacity .42s ease; }
.stage-image::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(var(--night-rgb),.99) 0 28%,rgba(var(--night-rgb),.72) 48%,rgba(var(--night-rgb),.22) 72%),linear-gradient(0deg,rgba(var(--night-rgb),.95),transparent 42%); }
.stage-portrait { position:absolute; z-index:-1; top:8%; right:6%; bottom:10%; width:min(45vw,660px); margin:0; overflow:hidden; clip-path:polygon(10% 0,100% 0,100% 94%,0 100%,0 12%); box-shadow:-45px 0 90px rgba(var(--mood-rgb),.1); }
.stage-portrait img { width:100%; height:100%; object-fit:cover; object-position:50% 29%; filter:brightness(.83) saturate(.88); transform:scale(1.002); transition:filter .5s ease,opacity .22s ease,transform .42s ease; }
html[data-mood="gold"] .stage-portrait img { object-position:48% 33%; filter:brightness(.89) saturate(1.04) contrast(1.03); }
html[data-mood="blue"] .stage-portrait img { object-position:50% 30%; filter:brightness(.82) saturate(.98); }
.is-theme-switching .stage-portrait img { animation:stage-photo-change .46s cubic-bezier(.2,.75,.22,1) both; }
.stage-portrait::after { content:""; position:absolute; inset:0; box-shadow:inset 0 0 0 1px rgba(255,255,255,.16); background:linear-gradient(0deg,rgba(var(--night-rgb),.52),transparent 42%),linear-gradient(90deg,rgba(var(--night-rgb),.34),transparent 28%); pointer-events:none; }
.stage-portrait figcaption { position:absolute; z-index:2; right:1.1rem; bottom:.8rem; padding:.2rem .45rem; color:rgba(255,255,255,.72); background:rgba(0,0,0,.28); font-size:.6rem; }
.stage-beams { position:absolute; z-index:-2; inset:0; overflow:hidden; pointer-events:none; }
.stage-beams i { position:absolute; top:-25%; left:58%; width:7vw; height:120%; opacity:.17; background:linear-gradient(180deg,rgba(var(--mood-rgb),.8),transparent); transform:rotate(19deg); filter:blur(8px); transition:background .5s ease,opacity .5s ease; }
.stage-beams i:nth-child(2) { left:76%; width:4vw; transform:rotate(-12deg); opacity:.1; }
.stage-beams i:nth-child(3) { top:18%; left:40%; width:55vw; height:35vw; border:1px solid rgba(var(--mood-rgb),.22); border-radius:50%; background:transparent; filter:none; transform:none; }
html[data-mood="gold"] .stage-beams i { opacity:.33; }
html[data-mood="blue"] .stage-beams i:nth-child(3) { border-radius:44% 56% 64% 36%; transform:rotate(-12deg); }
.stage-copy { z-index:4; align-self:center; max-width:720px; padding:calc(var(--header-h) + 4.5rem) 2rem 12rem var(--pad); }
.stage-status { display:flex; flex-wrap:wrap; gap:.45rem 1rem; margin:0 0 1.2rem; font-size:.7rem; }
.stage-status span { color:var(--mood); }
.stage-status b { color:var(--muted); font-weight:400; }
.stage-date { display:flex; align-items:center; gap:.85rem; margin:0; color:rgba(var(--mood-rgb),.82); font-family:var(--serif); font-size:.82rem; font-variant-numeric:tabular-nums; letter-spacing:.18em; }
.stage-date i { width:3.5rem; height:1px; background:var(--mood); }
.stage-copy h1 { max-width:11ch; margin:1rem 0 1.25rem; font-family:var(--serif); font-size:clamp(4.1rem,7vw,7.8rem); font-weight:260; line-height:1.04; letter-spacing:-.055em; }
.stage-copy h1 span { display:block; }
.stage-lead { max-width:35rem; color:var(--muted); font-family:var(--serif); font-size:1rem; line-height:1.9; }
.stage-actions { display:flex; flex-wrap:wrap; align-items:center; gap:1rem 1.4rem; margin-top:1.8rem; }
.stage-support { min-height:60px; display:grid; gap:.05rem; padding:.65rem 1.2rem; color:var(--night); background:var(--mood); border:1px solid var(--mood); text-align:left; transition:transform .18s ease,box-shadow .25s ease; }
.stage-support:hover { transform:translateY(-2px); box-shadow:0 15px 45px rgba(var(--mood-rgb),.22); }
.stage-support span { font-weight:700; }
.stage-support small { opacity:.7; font-size:.64rem; }
.stage-actions a { min-height:48px; display:flex; align-items:center; color:var(--text); font-size:.76rem; text-underline-offset:.45rem; }
.theme-console { z-index:5; grid-row:2; grid-column:2; align-self:end; width:min(92%,760px); margin:0 4vw 2.2rem auto; }
.theme-console > p { display:flex; justify-content:space-between; align-items:end; margin:0 0 .55rem; padding-bottom:.5rem; border-bottom:1px solid var(--line-strong); }
.theme-console > p span { color:var(--muted); font-size:.68rem; }
.theme-console > p strong { color:var(--mood); font-family:var(--serif); font-size:1.2rem; font-weight:450; }
.theme-console > div { display:grid; grid-template-columns:repeat(3,1fr); }
.theme-console button { min-height:76px; display:grid; grid-template-columns:auto 1fr; grid-template-rows:1fr 1fr; gap:0 .65rem; align-items:center; padding:.7rem .8rem; color:var(--muted); background:rgba(var(--night-rgb),.44); border:0; border-right:1px solid var(--line); text-align:left; }
.theme-console button:last-child { border:0; }
.theme-console button i { grid-row:1/3; width:.75rem; height:2.6rem; border-radius:1rem; background:#dcecff; box-shadow:0 0 20px rgba(220,236,255,.5); }
.theme-console button[data-stage-theme="gold"] i { background:#ffae35; box-shadow:0 0 20px rgba(255,174,53,.58); }
.theme-console button[data-stage-theme="blue"] i { background:#4acbff; box-shadow:0 0 20px rgba(74,203,255,.58); }
.theme-console button span { align-self:end; color:var(--text); font-family:var(--serif); font-size:.92rem; }
.theme-console button small { align-self:start; font-size:.62rem; }
.theme-console button[aria-pressed="true"] { color:var(--mood); background:rgba(var(--mood-rgb),.12); box-shadow:inset 0 -2px var(--mood); }
.stage-progress { z-index:5; grid-row:2; grid-column:1; width:min(88%,520px); margin:0 0 2.2rem var(--pad); padding-top:.65rem; border-top:1px solid var(--line-strong); }
.stage-progress-number { display:flex; justify-content:space-between; align-items:end; }
.stage-progress-number > span,.stage-progress > p { color:var(--muted); font-size:.66rem; }
.stage-progress-number strong { color:var(--mood); font-family:var(--serif); font-size:2rem; font-weight:350; line-height:1; }
.stage-progress-number small { color:var(--muted); font-family:var(--gothic); font-size:.65rem; }
.stage-progress-line { height:2px; position:relative; margin:.9rem 0 .65rem; background:var(--line-strong); }
.stage-progress-line i { position:absolute; inset:0 auto 0 0; width:100% !important; background:var(--mood); box-shadow:0 0 18px var(--mood); transform:scaleX(var(--progress-scale,0)); transform-origin:left center; transition:transform .7s cubic-bezier(.2,.75,.2,1); }
.stage-progress-line span { position:absolute; top:-3px; width:1px; height:8px; background:var(--text); opacity:.45; }
.stage-progress-line span:first-of-type { left:50%; }.stage-progress-line span:last-child { right:0; }
.stage-progress > p { margin:0; }
.stage-feedback { position:absolute; z-index:20; right:5%; bottom:12%; width:min(520px,43vw); min-height:300px; display:grid; grid-template-columns:auto 1fr; gap:1.3rem; align-items:center; padding:2rem; color:#102033; background:rgba(241,247,249,.96); box-shadow:0 35px 100px rgba(0,0,0,.42); backdrop-filter:blur(14px); animation:feedback-arrive .7s cubic-bezier(.2,.8,.2,1) both; }
.feedback-halo { position:absolute; inset:-2rem; z-index:-1; border:1px solid rgba(var(--mood-rgb),.5); border-radius:50%; animation:feedback-halo 1s ease-out both; }
.feedback-seal { width:6.3rem; aspect-ratio:1; display:grid; place-content:center; justify-items:center; color:#edf8ff; background:#173b57; border-radius:50%; box-shadow:inset 0 0 0 .35rem rgba(255,255,255,.15); transform:rotate(-7deg); }
.feedback-seal span { font-family:var(--serif); font-size:3rem; line-height:.8; }.feedback-seal small{font-size:.52rem;letter-spacing:.18em;}
.stage-feedback p { margin:0; color:#50728b; font-size:.68rem; }.stage-feedback h2 { margin:.4rem 0 1.2rem; font-family:var(--serif); font-size:clamp(1.6rem,2.6vw,2.6rem); font-weight:400; line-height:1.28; }
.stage-feedback a { display:inline-flex; align-items:center; gap:1rem; color:#173b57; font-size:.72rem; text-underline-offset:.35rem; }
.stage-feedback > button { grid-column:1/-1; justify-self:end; color:#53616c; background:transparent; border:0; text-decoration:underline; text-underline-offset:.3rem; font-size:.66rem; }
.stage-afterglow { padding:clamp(6rem,10vw,10rem) var(--pad); color:#15202b; background:#e8eef0; }
.stage-afterglow > p { color:#65727b; font-size:.72rem; }
.stage-afterglow h2 { max-width:12ch; margin:.8rem 0 4rem; font-family:var(--serif); font-size:clamp(3rem,6vw,6.5rem); font-weight:300; line-height:1.14; }
.afterglow-route { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(21,32,43,.3); }
.afterglow-route a { min-height:130px; display:grid; align-content:center; gap:.35rem; padding:1rem; color:#15202b; border-right:1px solid rgba(21,32,43,.2); text-decoration:none; }
.afterglow-route a:last-child { border:0; }.afterglow-route span{color:#65727b;font-size:.66rem}.afterglow-route strong{font-family:var(--serif);font-size:1.1rem;font-weight:500;}

/* 2026-10-03 scrapbook */
.scrapbook-page { --paper-blue:#dceaf0; --paper-ink:#19364b; color:#eef8ff; background:#061321; }
.scrapbook-shell { min-height:100svh; padding:calc(var(--header-h) + 4rem) var(--pad) clamp(5rem,8vw,8rem); background:radial-gradient(circle at 75% 12%,rgba(80,167,206,.18),transparent 25%),linear-gradient(145deg,#03101f,#0c2a3c 58%,#061321); }
.scrapbook-intro { display:grid; grid-template-columns:1fr auto; align-items:end; gap:2rem; max-width:1480px; margin:0 auto 3rem; }
.scrapbook-intro > p { grid-column:1/-1; display:flex; gap:1rem; margin:0; font-size:.68rem; }.scrapbook-intro > p span{color:#75d1ff}.scrapbook-intro > p b{color:rgba(238,248,255,.58);font-weight:400;}
.scrapbook-intro h1 { margin:0; font-family:var(--serif); font-size:clamp(3rem,6.5vw,7rem); font-weight:280; line-height:1.08; letter-spacing:-.04em; }
.scrapbook-total { min-width:210px; display:grid; justify-items:end; padding-left:2rem; border-left:1px solid rgba(230,246,255,.28); }.scrapbook-total span,.scrapbook-total small{color:rgba(238,248,255,.6);font-size:.66rem}.scrapbook-total strong{color:#74d1ff;font-family:var(--serif);font-size:4.8rem;font-weight:250;line-height:1;}
.scrapbook { max-width:1480px; margin:0 auto; }
.scrapbook-tabs { display:flex; justify-content:center; gap:.35rem; margin-bottom:1rem; }
.scrapbook-tabs button { min-width:92px; min-height:46px; padding:.5rem 1rem; color:rgba(238,248,255,.62); background:transparent; border:0; border-bottom:1px solid rgba(238,248,255,.22); }
.scrapbook-tabs button[aria-pressed="true"] { color:#fff; border-color:#74d1ff; }
.scrapbook-tabs button:hover,.book-arrow:hover:not(:disabled){color:#fff;background:rgba(116,209,255,.1);border-color:#74d1ff}.theme-console button:hover{background:rgba(var(--mood-rgb),.1)}
.book-stage { display:grid; grid-template-columns:56px minmax(0,1fr) 56px; align-items:center; touch-action:pan-y; }
.book-arrow { width:46px; height:46px; color:#eef8ff; background:transparent; border:1px solid rgba(238,248,255,.34); border-radius:50%; }.book-arrow:disabled{opacity:.2;cursor:not-allowed}.book-arrow.is-next{justify-self:end;}
.book-spread { position:relative; min-height:650px; color:var(--paper-ink); background:var(--paper-blue); box-shadow:0 35px 90px rgba(0,0,0,.42); overflow:hidden; perspective:1600px; }
.book-spread::before { content:""; position:absolute; inset:0; pointer-events:none; opacity:.32; background-image:linear-gradient(90deg,transparent 49.7%,rgba(17,48,69,.18) 50%,transparent 50.4%),repeating-linear-gradient(0deg,rgba(17,48,69,.025) 0 1px,transparent 1px 4px); }
.book-spine { position:absolute; z-index:4; top:0; bottom:0; left:50%; width:36px; transform:translateX(-50%); background:linear-gradient(90deg,transparent,rgba(11,36,55,.16),rgba(255,255,255,.24),transparent); pointer-events:none; }
.book-sheet { min-height:650px; position:relative; display:grid; grid-template-columns:1fr 1fr; }
.book-stage.is-turning .book-sheet.is-active { transform-origin:center; animation:book-turn .52s cubic-bezier(.2,.72,.22,1) both; }
.cover-photo,.ticket-photo,.reward-photo { min-height:650px; overflow:hidden; }
.cover-photo img,.ticket-photo img,.reward-photo img { width:100%; height:100%; object-fit:cover; }
.cover-photo img{object-position:50% 36%}.ticket-photo img{object-position:50% 28%}.reward-photo img{object-position:50% 28%}
.cover-copy { position:relative; display:grid; align-content:center; padding:clamp(2rem,5vw,5rem); background:linear-gradient(155deg,#d9e8ed,#f1eee7); }
.cover-copy::after { content:""; position:absolute; inset:1.2rem; border:1px solid rgba(25,54,75,.28); pointer-events:none; }
.cover-copy > p,.ticket-content > p,.stamp-heading > p,.reward-ledger > p { margin:0;color:#4d7189;font-size:.65rem;letter-spacing:.13em;text-transform:uppercase; }
.cover-copy h2 { margin:1.2rem 0 2.5rem; font-family:var(--serif); font-size:clamp(3.2rem,5vw,6rem); font-weight:320; line-height:.98; letter-spacing:-.035em; }
.cover-line { display:grid; grid-template-columns:1fr auto; align-items:end; padding-top:1rem; border-top:1px solid rgba(25,54,75,.3); }.cover-line span,.cover-line small{color:#5c7586;font-size:.62rem}.cover-line strong{grid-row:1/3;grid-column:2;font-family:var(--serif);font-size:3rem;font-weight:300;line-height:1;}
.ticket-photo { clip-path:polygon(0 0,94% 0,100% 50%,94% 100%,0 100%); }.ticket-content{display:grid;align-content:center;padding:clamp(2rem,4vw,4rem);background:#eef0e9;}
.ticket-content h2,.stamp-heading h2,.reward-ledger h2{margin:.7rem 0 2rem;font-family:var(--serif);font-size:clamp(2.4rem,4vw,4.4rem);font-weight:350;line-height:1.15;}
.demo-ticket{position:relative;display:grid;gap:.3rem;padding:1.4rem 1.6rem;color:#f1f8fb;background:#183d57;clip-path:polygon(0 0,100% 0,100% 42%,97% 50%,100% 58%,100% 100%,0 100%,0 58%,3% 50%,0 42%)}
.demo-ticket span,.demo-ticket small{font-size:.6rem;opacity:.72}.demo-ticket strong{font-family:var(--serif);font-size:1.6rem;letter-spacing:.08em}.demo-ticket b{font-family:var(--serif);font-weight:450}.demo-ticket i{height:22px;margin-top:.7rem;background:repeating-linear-gradient(90deg,#edf7fb 0 2px,transparent 2px 5px);opacity:.6}
.ticket-state{display:grid;grid-template-columns:1fr 1fr;margin:1.5rem 0 0}.ticket-state div{padding:.8rem;border-top:1px solid rgba(25,54,75,.28)}.ticket-state dt{color:#60798a;font-size:.62rem}.ticket-state dd{margin:0;font-family:var(--serif);font-size:1.5rem}
.stamp-sheet{grid-template-columns:1fr .75fr;grid-template-rows:1fr auto;padding:clamp(2rem,5vw,5rem);background:linear-gradient(145deg,#e5eceb,#cbdfe6)}.stamp-heading{align-self:center}.stamp-orbit{place-self:center;width:min(22vw,240px);aspect-ratio:1;display:grid;place-content:center;justify-items:center;position:relative;border:2px solid #2c7095;border-radius:50%;transform:rotate(-5deg)}.stamp-orbit::before,.stamp-orbit::after{content:"";position:absolute;inset:.65rem;border:1px dashed #2c7095;border-radius:50%}.stamp-orbit::after{inset:1.3rem;border-style:solid}.stamp-orbit strong{font-family:var(--serif);font-size:5rem;font-weight:250;line-height:1}.stamp-orbit span{font-size:.65rem}.stamp-orbit i{position:absolute;inset:-2px;border:5px solid #5dbce9;border-radius:50%;clip-path:polygon(0 0,50% 0,50% 50%,0 50%);transform:rotate(var(--day-rotation,0deg));transition:transform .5s ease}
.stamp-row{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);margin:2rem 0 0;padding:0;list-style:none;border-top:1px solid rgba(25,54,75,.3)}.stamp-row li{display:grid;gap:.1rem;padding:1rem;border-right:1px solid rgba(25,54,75,.22)}.stamp-row li:last-child{border:0}.stamp-row b{font-family:var(--serif);font-size:2rem}.stamp-row span,.stamp-row small{font-size:.64rem}.stamp-row small{color:#60798a}.stamp-row .is-earned{color:#1b648c}.stamp-sheet>a{grid-column:1/-1;justify-self:end;margin-top:1rem;color:#255e7e;font-size:.68rem;text-underline-offset:.35rem}
.reward-photo{clip-path:polygon(0 0,94% 0,100% 50%,94% 100%,0 100%)}.reward-ledger{padding:clamp(1.5rem,3vw,3.2rem);background:#e9ece7}.scrapbook-rewards{border-color:rgba(25,54,75,.3)}.scrapbook-rewards li{min-height:88px;grid-template-columns:4rem 1fr auto;border-color:rgba(25,54,75,.24)}.scrapbook-rewards h3{font-size:1rem}.scrapbook-rewards p{color:#60798a}.scrapbook-rewards li>strong{font-size:.62rem}.scrapbook-rewards li.is-unlocked>strong,.scrapbook-rewards li.is-earned>strong{color:#24698f}.reward-ledger .reward-action{grid-column:auto;display:grid;gap:.7rem;margin-top:1rem}.reward-ledger .reward-action p{margin:0;color:#60798a}.reward-ledger .reward-action button{color:#173b57;border-color:rgba(25,54,75,.4)}
.cover-summary{display:flex;flex-wrap:wrap;gap:.55rem 1.2rem;margin-top:1rem;color:#4d7189;font-size:.64rem}.cover-summary b{color:#183d57;font:500 1rem var(--serif)}
.activity-switcher{display:grid;grid-template-columns:repeat(4,1fr);margin:-.5rem 0 .9rem;border:1px solid rgba(25,54,75,.24)}.activity-switcher button{min-height:42px;color:#547084;background:transparent;border:0;border-right:1px solid rgba(25,54,75,.24);font-size:.65rem}.activity-switcher button:last-child{border:0}.activity-switcher button[aria-selected="true"]{color:#eef8ff;background:#183d57}.activity-fields{margin:1rem 0 0}.activity-fields div{display:grid;grid-template-columns:5.4rem 1fr;gap:.75rem;padding:.58rem 0;border-bottom:1px solid rgba(25,54,75,.18)}.activity-fields dt{color:#60798a;font-size:.61rem}.activity-fields dd{margin:0;font-size:.68rem;line-height:1.5}
.companion-sheet{grid-template-columns:.82fr 1.18fr;background:#e9eeec}.companion-photo{min-height:650px;overflow:hidden;clip-path:polygon(0 0,93% 0,100% 50%,93% 100%,0 100%)}.companion-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 28%}.companion-panel{display:grid;align-content:center;padding:clamp(1.5rem,3.5vw,3.8rem)}.companion-panel>p,.ranking-heading>p{margin:0;color:#4d7189;font-size:.62rem;letter-spacing:.13em;text-transform:uppercase}.companion-panel h2,.ranking-heading h2{margin:.65rem 0 1.4rem;font:350 clamp(2.1rem,3.5vw,4rem)/1.16 var(--serif)}.companion-steps{margin:0;padding:0;list-style:none;border-top:1px solid rgba(25,54,75,.28)}.companion-steps li{min-height:82px;display:grid;grid-template-columns:2.2rem 1fr auto;gap:.75rem;align-items:center;border-bottom:1px solid rgba(25,54,75,.2)}.companion-steps li>span{color:#5a7c92;font:500 1rem var(--serif)}.companion-steps li b{display:block;font:500 1rem var(--serif)}.companion-steps li small{display:block;margin-top:.2rem;color:#60798a;font-size:.59rem}.companion-steps button{min-height:42px;padding:.5rem .8rem;color:#eef8ff;background:#183d57;border:1px solid #183d57}.companion-steps button:disabled{color:#3d6b84;background:transparent;opacity:.75}.companion-steps li.is-complete>span{color:#1680aa}.companion-steps li.is-complete b::after{content:"  ✓";color:#1680aa}.companion-steps form{display:flex;gap:.35rem}.companion-steps input{width:6.2rem;min-height:42px;padding:.4rem .6rem;color:#19364b;background:rgba(255,255,255,.5);border:1px solid rgba(25,54,75,.3);font-size:.75rem}.companion-result{display:grid;grid-template-columns:1fr auto;align-items:end;margin-top:1rem;padding:1rem;color:#eaf7fd;background:#173b57}.companion-result span,.companion-result small{font-size:.58rem}.companion-result strong{font:500 1.2rem var(--serif)}.companion-result small{grid-column:1/-1;margin-top:.4rem;color:rgba(234,247,253,.65)}.companion-stamps{margin-top:1rem}.companion-stamps li{padding:.65rem}.companion-stamps b{font-size:1.4rem}
.ranking-sheet{grid-template-columns:.86fr 1.14fr;background:linear-gradient(145deg,#e5eceb,#cbdfe6)}.ranking-heading{display:grid;align-content:center;padding:clamp(2rem,4vw,4.5rem);border-right:1px solid rgba(25,54,75,.22)}.ranking-ledger{display:grid;grid-template-columns:1fr 1fr;margin-top:1rem;border-block:1px solid rgba(25,54,75,.25)}.ranking-ledger div{display:grid;padding:1rem 0}.ranking-ledger div+div{padding-left:1rem;border-left:1px solid rgba(25,54,75,.2)}.ranking-ledger span,.ranking-ledger small{color:#60798a;font-size:.58rem}.ranking-ledger strong{font:300 3rem var(--serif);line-height:1}.ranking-board{display:grid;align-content:center;padding:clamp(1.5rem,4vw,4rem);background:#eef0e9}.ranking-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid rgba(25,54,75,.25)}.ranking-tabs button{min-height:46px;color:#60798a;background:transparent;border:0;border-bottom:2px solid transparent}.ranking-tabs button[aria-selected="true"]{color:#19364b;border-color:#2a7ea5}.ranking-date{display:flex;justify-content:space-between;align-items:end;margin:1.2rem 0 .4rem;font:350 2.6rem var(--serif)}.ranking-date span{color:#60798a;font:400 .58rem var(--gothic)}.ranking-board ol{margin:0;padding:0;list-style:none;border-top:1px solid rgba(25,54,75,.25)}.ranking-board li{min-height:68px;display:grid;grid-template-columns:2.5rem 1fr auto;gap:1rem;align-items:center;border-bottom:1px solid rgba(25,54,75,.18)}.ranking-board li span{color:#2a7ea5;font:500 1.15rem var(--serif)}.ranking-board li b{font:450 1rem var(--serif)}.ranking-board li strong{font:400 1rem var(--serif)}.ranking-board footer{display:flex;justify-content:space-between;gap:1rem;margin-top:1rem;color:#60798a;font-size:.58rem}
.reward-activity-head{display:grid;gap:.25rem;padding:.8rem 1rem;color:#eef8ff;background:#183d57}.reward-activity-head span{font-size:.57rem;opacity:.66}.reward-activity-head strong{font:450 1rem var(--serif)}.activity-reward-slots{margin:0;padding:0;list-style:none;border-top:1px solid rgba(25,54,75,.22)}.activity-reward-slots li{display:grid;grid-template-columns:5.2rem 1fr;gap:.8rem;padding:.8rem 0;border-bottom:1px solid rgba(25,54,75,.2)}.activity-reward-slots span{color:#60798a;font-size:.61rem}.activity-reward-slots b{font:450 .8rem var(--serif)}
.book-help{margin:1rem 0 0;text-align:center;color:rgba(238,248,255,.56);font-size:.66rem}.scrapbook-identity{max-width:1480px;margin:5rem auto 0;padding-top:3rem;display:grid;grid-template-columns:1fr 1fr;gap:4rem;border-top:1px solid rgba(238,248,255,.25)}.scrapbook-identity>div>p{margin:0;color:#74d1ff;font-size:.68rem}.scrapbook-identity h2{margin:.5rem 0;font-family:var(--serif);font-size:clamp(2.4rem,4vw,4.6rem);font-weight:320;line-height:1.18}

@keyframes stage-light-in { 0%{opacity:0;transform:rotate(14deg) translateX(-110vw)} 34%{opacity:.7} 100%{opacity:0;transform:rotate(14deg) translateX(125vw)} }
@keyframes stage-photo-change { 0%{opacity:.25;transform:scale(1.035)} 100%{opacity:1;transform:scale(1.002)} }
@keyframes feedback-arrive { from{opacity:0;transform:translateY(1.5rem) scale(.96)} to{opacity:1;transform:none} }
@keyframes feedback-halo { from{opacity:.75;transform:scale(.35)} to{opacity:0;transform:scale(1.16)} }
@keyframes book-turn { 0%{opacity:.55;transform:rotateY(-8deg) scale(.99)} 100%{opacity:1;transform:none} }

@media (max-width:1000px){
  .birthday-stage{grid-template-columns:1fr;grid-template-rows:auto auto auto;min-height:0;padding-bottom:1.5rem}.stage-portrait{position:relative;z-index:0;top:auto;right:auto;bottom:auto;width:100%;height:58svh;min-height:440px;clip-path:polygon(0 0,100% 0,100% 94%,0 100%)}.stage-portrait::after{background:linear-gradient(0deg,rgba(var(--night-rgb),.82),transparent 55%)}.stage-portrait figcaption{display:none}.stage-copy{grid-row:2;max-width:none;padding:1rem var(--pad) 2rem}.stage-copy h1{font-size:clamp(3.2rem,10vw,6rem)}.stage-beams{height:62svh}.stage-progress{grid-row:3;grid-column:1;width:auto;margin:0 var(--pad) 1.5rem}.theme-console{grid-row:4;grid-column:1;width:auto;margin:0 var(--pad)}.stage-feedback{position:relative;right:auto;bottom:auto;width:auto;min-height:0;margin:1.5rem var(--pad);grid-column:1;grid-row:5}.stage-afterglow h2{max-width:15ch}.book-stage{grid-template-columns:48px minmax(0,1fr) 48px}.book-spread,.book-sheet{min-height:600px}.scrapbook-rewards li{grid-template-columns:3rem 1fr}.scrapbook-rewards li>strong{grid-column:2}.reward-photo{display:none}.reward-sheet{grid-template-columns:1fr}.reward-ledger{padding:2rem}
}
@media (max-width:640px){
  .stage-portrait{height:51svh;min-height:390px}.stage-copy{padding-top:.2rem}.stage-copy h1{font-size:clamp(2.85rem,12vw,4.4rem);line-height:1.08}.stage-lead{font-size:.88rem}.stage-actions{align-items:stretch}.stage-support{width:100%}.stage-actions a{justify-content:center}.theme-console>div{grid-template-columns:1fr}.theme-console button{min-height:62px;border-right:0;border-bottom:1px solid var(--line)}.theme-console button:last-child{border-bottom:0}.stage-feedback{grid-template-columns:1fr;text-align:center}.feedback-seal{justify-self:center}.stage-feedback>button{justify-self:center}.afterglow-route{grid-template-columns:1fr}.afterglow-route a{min-height:90px;border-right:0;border-bottom:1px solid rgba(21,32,43,.2)}.scrapbook-shell{padding-inline:.8rem}.scrapbook-intro{grid-template-columns:1fr;gap:1rem}.scrapbook-intro h1{font-size:clamp(2.8rem,12vw,4.3rem)}.scrapbook-total{justify-items:start;padding:1rem 0 0;border-left:0;border-top:1px solid rgba(230,246,255,.28)}.scrapbook-total strong{font-size:4rem}.scrapbook-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;justify-content:start;overflow:visible}.scrapbook-tabs button{min-width:0;padding:.45rem .12rem}.book-stage{grid-template-columns:1fr;gap:.7rem}.book-arrow{grid-row:2}.book-arrow.is-prev{justify-self:start}.book-arrow.is-next{grid-row:2;justify-self:end}.book-spread{grid-column:1;grid-row:1;min-height:0}.book-sheet{min-height:0;grid-template-columns:1fr}.book-spine{display:none}.cover-photo,.ticket-photo,.reward-photo{min-height:390px;height:50svh}.cover-copy,.ticket-content,.reward-ledger{padding:2rem 1.35rem}.cover-copy::after{inset:.7rem}.cover-copy h2{font-size:3.3rem}.ticket-photo,.reward-photo{clip-path:none}.stamp-sheet{grid-template-columns:1fr;grid-template-rows:auto auto auto;padding:2rem 1.35rem}.stamp-orbit{width:min(62vw,220px);margin-block:1rem}.stamp-row{grid-template-columns:1fr}.stamp-row li{grid-template-columns:3rem 1fr auto;align-items:center;border-right:0;border-bottom:1px solid rgba(25,54,75,.22)}.stamp-row li:last-child{border-bottom:0}.stamp-sheet>a{grid-column:1}.scrapbook-rewards li{grid-template-columns:3.5rem 1fr}.scrapbook-identity{grid-template-columns:1fr;gap:1.5rem;margin-top:3.5rem}.scrapbook-identity h2{font-size:2.7rem}.companion-photo{min-height:250px;height:30svh;max-height:290px;clip-path:none}.companion-panel{padding:1.7rem 1.25rem}.companion-panel h2,.ranking-heading h2{font-size:2.25rem}.companion-steps li{grid-template-columns:2rem 1fr}.companion-steps li>button,.companion-steps li>form{grid-column:2;width:100%;margin-bottom:.65rem}.companion-steps form input{width:100%;min-width:0}.companion-result{grid-template-columns:1fr}.companion-result strong{margin-top:.2rem}.ranking-heading{padding:2rem 1.25rem;border-right:0;border-bottom:1px solid rgba(25,54,75,.22)}.ranking-board{padding:1.5rem 1.25rem}.ranking-date{font-size:2.1rem}.ranking-board footer{display:grid}.activity-fields div{grid-template-columns:4.7rem 1fr}
}
@media (max-width:340px){
  .stage-portrait{height:49svh;min-height:360px}.stage-copy h1{font-size:2.75rem}.theme-console button{padding-inline:.55rem}.scrapbook-shell{padding-inline:.55rem}.scrapbook-tabs button{font-size:.72rem}.cover-photo,.ticket-photo,.reward-photo{min-height:350px}.cover-copy h2{font-size:2.85rem}.ticket-content h2,.stamp-heading h2,.reward-ledger h2{font-size:2.25rem}.scrapbook-rewards li{grid-template-columns:1fr}.scrapbook-rewards li>strong{grid-column:1}.identity-note input,.identity-note button{width:100%}
}
.low-performance .stage-entry-light,.low-performance .feedback-halo{display:none}.low-performance .stage-image img{filter:none;opacity:.12}.low-performance .stage-feedback{backdrop-filter:none}.low-performance .book-stage.is-turning .book-sheet.is-active{animation:none}.low-performance .mobile-ticker-track{display:none}.low-performance .mobile-ticker-static{display:block}.low-performance .star-mist,.low-performance .star-mist::before,.low-performance .star-mist::after,.low-performance .star-mist i,.low-performance .archive-mist{animation:none}.low-performance .star-mist::before,.low-performance .star-mist::after,.low-performance .star-mist i{filter:none}.low-performance .star-mist i:nth-child(n+2){display:none}.low-performance .star-mist i:first-child{opacity:.46}
@media (prefers-reduced-motion:reduce){
  .stage-entry-light,.feedback-halo{display:none}.is-theme-switching .stage-portrait img,.book-stage.is-turning .book-sheet.is-active,.stage-feedback,.star-mist,.star-mist::before,.star-mist::after,.star-mist i,.archive-mist{animation:none}.stage-image img,.stage-portrait img,.stage-progress-line i{transition:none}
}