:root[data-event="birthday"] { --paper:#f5e6e0; --paper-deep:#eed4c9; --card:#fff5ed; --ink:#231721; --ink-soft:#634650; --pco:#ef775b; --pco-deep:#bf3929; --on-pco:#231721; --sindoor:#296760; --sindoor-text:#23564e; --on-bakelite:#eac270; --rule:#cfa79a; }
:root[data-event="mundan"] { --paper:#f2eddb; --paper-deep:#e5dec0; --card:#fcf9eb; --ink:#243629; --ink-soft:#536147; --pco:#d3a52e; --pco-deep:#b58917; --on-pco:#243629; --sindoor:#427457; --sindoor-text:#31583f; --on-bakelite:#d3a52e; --rule:#c7c4a5; }
:root[data-event="baby-shower"] { --paper:#e5efeb; --paper-deep:#cde0d8; --card:#f6faf7; --ink:#183a33; --ink-soft:#4b665f; --pco:#82b7a4; --pco-deep:#609880; --on-pco:#14382e; --sindoor:#a84d3e; --sindoor-text:#8f4035; --on-bakelite:#a3d4c0; --rule:#b3cac0; }
:root[data-event="celebration"] { --paper:#e4edf4; --paper-deep:#ccdeeb; --card:#f5f9fb; --ink:#1e3141; --ink-soft:#4b6475; --pco:#6b9ec4; --pco-deep:#447ea8; --on-pco:#112e43; --sindoor:#b24333; --sindoor-text:#95382d; --on-bakelite:#9abfd9; --rule:#b0c7d7; }
:root[data-theme="dark"][data-event]:not([data-event="wedding"]) { --paper:#151c1d; --paper-deep:#202a2b; --card:#243132; --ink:#f4f1e9; --ink-soft:#c4d2cd; --rule:#4c625c; --sindoor-text:#f2aa93; --sindoor:#a4d0c1; --shadow:#080e0d; }
@media(prefers-color-scheme:dark) { :root[data-event]:not([data-event="wedding"]):not([data-theme="light"]) { --paper:#151c1d; --paper-deep:#202a2b; --card:#243132; --ink:#f4f1e9; --ink-soft:#c4d2cd; --rule:#4c625c; --sindoor-text:#f2aa93; --sindoor:#a4d0c1; --shadow:#080e0d; } }
:root[data-event]:not([data-event="wedding"]) .r-other, :root[data-event]:not([data-event="wedding"]) .stamp[class*="r-"], :root[data-event]:not([data-event="wedding"]) .ritual-pick { color:var(--sindoor-text); }
.event-ribbon { background:var(--pco); color:var(--on-pco); white-space:nowrap; overflow:hidden; font-family:var(--font-sign); font-weight:600; line-height:38px; text-align:center; }
.invite-illustration svg { width:100%; height:auto; max-height:260px; color:var(--ink); }
.motif-float { animation: memory-float 5s ease-in-out infinite; transform-origin:center; }
.motif-sway { animation: memory-sway 6s ease-in-out infinite; transform-origin:center; }
@keyframes memory-float { 50% { transform:translateY(-9px); } }
@keyframes memory-sway { 50% { transform:rotate(3deg); } }
@keyframes memory-enter { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }
.btn, .event-option, a { transition:transform .18s ease, background-color .18s ease; }
@media(hover:hover) { .event-option:hover { transform:translateX(6px); } .btn:hover { transform:translateY(-2px); } }
.btn:active, .event-option:active { transform:translateY(2px); }
@media(prefers-reduced-motion:reduce) {
  *, *::before, *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}

/* A richer invitation-paper palette, with the original signboard accents. */
:root[data-event="wedding"] { --paper:#f4e1d9; --paper-deep:#e8cfc2; --card:#fff9ef; }
:root[data-event="birthday"] { --paper:#f7dedc; --paper-deep:#eec4bc; --card:#fff7ed; }
:root[data-event="mundan"] { --paper:#e5ecd8; --paper-deep:#cedbb9; --card:#faf9e9; }
:root[data-event="baby-shower"] { --paper:#dcece5; --paper-deep:#bfd9cc; --card:#f4faf3; }
:root[data-event="celebration"] { --paper:#dce9f3; --paper-deep:#bdd3e6; --card:#f3f8fc; }
:root { --leaf:#47754c; --leaf-vein:#b7cd8b; }
:root[data-theme="dark"][data-event] { --paper:#191e1b; --paper-deep:#28342c; --card:#253029; --leaf:#7a9d6d; --leaf-vein:#c3d19e; }
:root[data-theme="dark"][data-event="wedding"] { --paper:#261b20; --paper-deep:#38262c; --card:#32232a; }
@media(prefers-color-scheme:dark) {
  :root[data-event]:not([data-theme="light"]) { --paper:#191e1b; --paper-deep:#28342c; --card:#253029; --leaf:#7a9d6d; --leaf-vein:#c3d19e; }
  :root[data-event="wedding"]:not([data-theme="light"]) { --paper:#261b20; --paper-deep:#38262c; --card:#32232a; }
}
body { transition:background-color .6s ease; }
body::before { opacity:.2; }
.living-garland { display:flex; justify-content:space-around; height:58px; overflow:hidden; background:none; border-top:2px solid var(--leaf); pointer-events:none; }
.garland-sprig { display:flex; gap:12px; align-items:flex-start; flex:0 0 64px; padding-top:3px; color:var(--pco); }
.garland-sprig > svg:first-child { width:26px; height:26px; animation:flower-turn 10s ease-in-out infinite alternate; animation-delay:calc(var(--i) * -.7s); }
.garland-leaf { width:23px; height:47px; transform-origin:50% 0; animation:leaf-sway 4.6s ease-in-out infinite alternate; animation-delay:calc(var(--i) * -.43s); }
.flower-fall { position:fixed; inset:0; z-index:0; overflow:hidden; pointer-events:none; contain:strict; }
.falling-flower { position:absolute; top:-45px; left:var(--x); width:var(--size); height:var(--size); color:var(--pco); opacity:.58; animation:flower-fall var(--duration) linear var(--delay) infinite; }
.falling-flower:nth-child(3n) { color:var(--sindoor); opacity:.2; }
.falling-flower svg { width:100%; height:100%; }
.memory-arrived { animation:memory-enter .7s cubic-bezier(.22,1,.36,1) var(--arrival-delay,0ms) both; }
.event-option.memory-arrived { animation-name:option-arrive; }
.invitation { transition:background-color .6s ease; }
.join { background:color-mix(in srgb,var(--paper-deep) 70%,var(--pco) 30%); }
.motion-toggle { position:fixed; right:14px; bottom:12px; z-index:8; border:1px solid var(--rule); border-radius:0; background:var(--card); color:var(--ink); padding:7px 12px; min-height:38px; font-size:.85rem; cursor:pointer; }
.closing { padding-bottom:80px; }
@keyframes leaf-sway { from { transform:rotate(-12deg); } to { transform:rotate(14deg); } }
@keyframes flower-turn { from { transform:rotate(-9deg) translateY(0); } to { transform:rotate(15deg) translateY(3px); } }
@keyframes flower-fall { 0% { transform:translate3d(0,-30px,0) rotate(0deg); } 50% { transform:translate3d(var(--drift),55vh,0) rotate(160deg); } 100% { transform:translate3d(0,calc(100vh + 80px),0) rotate(340deg); } }
@keyframes option-arrive { from { opacity:.3; transform:translateX(-16px); } to { opacity:1; transform:translateX(0); } }
[data-motion="paused"] .memory-arrived { animation:none; }
:is([data-motion="paused"],[data-page-visible="false"],[data-recording="true"]) :is(.garland-leaf,.garland-sprig > svg,.falling-flower,.motif-float,.motif-sway) { animation-play-state:paused; }
[data-recording="true"] .flower-fall { visibility:hidden; }
@media(max-width:760px) {
  .falling-flower:nth-child(n+7) { display:none; }
  .falling-flower { opacity:.35; }
  .living-garland { height:48px; }
  .garland-leaf { height:39px; }
}
@media(prefers-reduced-motion:reduce) {
  .flower-fall, .motion-toggle { display:none; }
  .memory-arrived { opacity:1; transform:none; }
}
@media print { .flower-fall,.living-garland,.motion-toggle { display:none!important; } }
/* Leave room to scroll the last form control clear of the motion switch. */
body { padding-bottom:56px; }
@media print { body { padding-bottom:0; } }
.wordmark .en { letter-spacing:.025em; text-transform:none; }
@media(max-width:600px) {
  .masthead .bar { flex-wrap:wrap; }
  .wordmark { gap:6px; }
  .wordmark .en { font-size:1.25rem; }
  .wordmark .hi { display:none; }
  .wordmark .brand-box { width:29px; height:29px; }
}
/* One shared header toolbar; labels collapse on phones, accessible names stay. */
.app-nav { display:flex; align-items:center; justify-content:flex-end; gap:4px; margin-left:auto; }
.app-nav a { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-width:44px; min-height:44px; padding:8px 10px; color:var(--ink); text-decoration:none; border-radius:8px; font-size:.85rem; white-space:nowrap; }
.app-nav svg { width:20px; height:20px; flex-shrink:0; }
.app-nav a:hover,.app-nav a[aria-current="page"] { background:var(--paper-deep); }
.app-nav a:focus-visible,#themeToggle:focus-visible { outline:2px solid var(--ink); outline-offset:3px; }
#themeToggle { display:inline-flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; padding:10px; margin-left:4px; border:1px solid var(--rule); border-radius:50%; }
#themeToggle svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.masthead .bar > .role { display:none; }
.access-note {background:var(--paper-deep);padding:16px;margin:12px 0 20px;}
@media(max-width:760px) { .app-nav a span {display:none;} .app-nav a {padding:8px;} .app-nav {gap:0;} .masthead .bar {gap:6px;} }
@media(max-width:420px) { .masthead .bar {flex-wrap:nowrap;} .wordmark {gap:5px;} .wordmark .en {font-size:1.05rem;} .wordmark .brand-box {width:24px;height:24px;} }
@media print { .app-nav,.access-note {display:none!important;} }

@media(max-width:360px) { .masthead .bar {flex-wrap:wrap;} .app-nav {width:100%;} }

.account-status {display:flex;justify-content:flex-end;align-items:center;flex-wrap:wrap;gap:8px 16px;padding:8px 0;font-size:.8rem;color:var(--ink-soft);overflow-wrap:anywhere;}
@media print {.account-status {display:none!important;}}

.page-back {margin:10px 0;min-height:44px;}
@media print {.page-back{display:none!important;}}

.guest-proof{padding:12px 16px;background:var(--paper-deep);border-left:3px solid var(--sindoor);font-weight:600;margin:12px 0;}

.guest-context{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;padding:12px 0;color:var(--ink-soft);font-size:.9rem;}.guest-context span{font-weight:400;}
@media(max-width:760px){.app-nav{flex-wrap:wrap;width:100%;gap:2px;}.app-nav a span{display:inline;}.app-nav a{font-size:.8rem;padding:6px;gap:5px;}.masthead .bar{flex-wrap:wrap;}.shell .app-nav{width:auto;}.shell .masthead .bar{flex-wrap:nowrap;}}

.camera-frame {border:2px solid var(--sindoor);border-radius:22px;background:var(--card);padding:12px;box-shadow:0 6px 0 var(--paper-deep);overflow:hidden;scroll-margin-top:16px;}
.camera-caption {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:6px;padding:2px 4px 10px;font-family:var(--font-sign);font-size:1rem;}
.camera-status {font-family:var(--font-body);font-size:.75rem;color:var(--ink-soft);}
.camera-stage {position:relative;aspect-ratio:3/4;max-height:min(46svh,420px);margin:auto;overflow:hidden;border-radius:14px;background:var(--paper-deep);}
.camera-stage video {width:100%;height:100%;object-fit:cover;display:block;}
.camera-stage video[hidden]{display:none;}
.camera-stage .mirrored {transform:scaleX(-1);}
.frame-flower {position:absolute;z-index:1;color:var(--sindoor);font-size:36px;line-height:1;text-shadow:0 1px 0 var(--card);pointer-events:none;}
.flower-a {top:6px;left:6px;transform:rotate(-15deg);}.flower-b {bottom:6px;right:6px;transform:rotate(20deg);}
.frame-corner {position:absolute;pointer-events:none;width:32px;height:32px;border-color:var(--pco);border-style:solid;}.corner-a{top:12px;right:12px;border-width:3px 3px 0 0;}.corner-b{bottom:12px;left:12px;border-width:0 0 3px 3px;}
.camera-tools {display:flex;justify-content:space-between;align-items:center;padding:4px;}.camera-tools button,#mirrorPhoto{min-height:44px;}.camera-frame .recorder {display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;padding:0;}.camera-frame .dial-btn{width:auto;border-radius:8px;}.camera-frame .dial-btn .btn{display:block;padding:12px 16px;}.camera-frame .timer{font-size:1.35rem;white-space:nowrap;}.camera-frame #micHint,.camera-frame #toTextBtn,.camera-frame #fileFallback{grid-column:1/-1;}.camera-frame #micHint{font-size:.78rem;}.camera-guidance{font-size:.8rem;margin:8px 4px 2px;}.camera-frame.is-recording{border-color:var(--sindoor-text);}.camera-frame.is-recording .camera-status{color:var(--sindoor-text);font-weight:700;}#videoOptions,#photoPanel,#textPanel,#recordPanel{scroll-margin-top:16px;}

.camera-stage::before{content:'Your camera opens here';position:absolute;inset:0;display:grid;place-items:center;color:var(--ink-soft);font-family:var(--font-sign);}.camera-stage video{position:relative;z-index:1;}.camera-stage .frame-flower,.camera-stage .frame-corner{z-index:2;}