.host-live { min-height:100vh; overflow-wrap:anywhere; }
.host-live h1 { font-size:clamp(34px,4.3vw,58px); }
.host-live .eyebrow,.host-live .pill,.host-live .field-hint { font-size:14px; }
.live-header { max-width:1280px; margin:auto; padding:26px 40px; display:flex; align-items:center; gap:36px; border-bottom:1px solid var(--line); }
.live-logo { font-size:32px; font-weight:750; letter-spacing:-1.8px; display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
.live-logo span { color:#b95842; font-size:37px; }
.live-tagline { font-size:14px; color:var(--muted); flex:1; }
.live-nav { display:flex; gap:8px; }
.live-nav a { min-height:48px; padding:12px 17px; border-radius:12px; font-size:14px; font-weight:600; }
.live-nav a[aria-current] { background:var(--mint); }
.live-nav a:hover { background:var(--peach); }
.live-main { max-width:1200px; margin:0 auto; padding:48px 32px 72px; min-height:calc(100vh - 210px); }
.live-footer { max-width:1200px; margin:auto; padding:26px 32px; display:flex; justify-content:space-between; gap:16px; color:var(--muted); font-size:14px; border-top:1px solid var(--line); }
.live-footer span { letter-spacing:2px; }
.live-panel { padding:32px; min-width:0; }
.live-panel > p { margin:16px 0 24px; }
.live-panel > form:not(:first-child) { margin-top:24px; }
.live-form { margin-top:28px; }
.live-form > p { margin-bottom:20px; }
.auth-grid { display:grid; grid-template-columns:1.1fr 1fr; align-items:start; gap:80px; padding:32px 30px; }
.auth-story h1 { max-width:500px; }
.auth-story > p:not(.eyebrow) { margin-top:24px; max-width:430px; }
.auth-art { position:relative; height:230px; margin:28px 0 16px; background:var(--mint); border-radius:110px 110px 24px 24px; max-width:420px; overflow:hidden; }
.auth-art > div { position:absolute; inset:85px 20px auto; text-align:center; font-size:25px; line-height:1.15; font-weight:600; transform:rotate(-5deg); }
.auth-art > span { position:absolute; font-size:85px; color:#bb644d; line-height:1; }
.auth-art > span:nth-child(1) { left:25px; top:30px; }
.auth-art > span:nth-child(2) { right:20px; bottom:10px; color:#657653; }
.auth-art > span:nth-child(3) { right:60px; top:5px; color:#697754; }
.auth-art > span:nth-child(4) { left:60px; bottom:10px; font-size:50px; }
.auth-switch { padding-top:20px; border-top:1px solid var(--line); margin-top:20px; }
.auth-switch a,.live-errors a { text-decoration:underline; text-underline-offset:4px; }
.local-mail { padding:14px; background:var(--cream); font-size:14px; border-radius:10px; margin-top:24px; }
.live-notice,.live-errors { padding:20px 24px; margin-bottom:28px; border-radius:14px; border:1px solid #bdd5bd; background:#e8f2e4; }
.live-errors { background:#fff0ec; border-color:#dfaba3; color:#81313d; }
.live-errors ul { padding-left:24px; margin-top:8px; }
.field-error { color:var(--danger); font-size:14px; margin:8px 0 16px; }
.narrow { max-width:680px; margin:32px auto; }
.narrow h1 { font-size:40px; }
.live-columns { display:grid; grid-template-columns:1fr 1fr; gap:24px; align-items:start; }
.live-welcome { display:flex; align-items:center; justify-content:space-between; gap:36px; padding:44px; background:var(--brand); color:white; border-radius:24px; margin-bottom:48px; overflow:hidden; }
.live-welcome .eyebrow { color:#bfd0b7; }
.live-welcome h1 { max-width:580px; }
.live-welcome p:not(.eyebrow) { color:#d0dbcf; margin:22px 0 26px; }
.welcome-flower { min-width:230px; height:260px; color:#f2b198; font-size:230px; line-height:1; position:relative; transform:rotate(-12deg); }
.welcome-flower span { position:absolute; inset:101px 20px auto; font-size:20px; font-weight:650; text-align:center; color:var(--brand); line-height:1.1; }
.live-count { font-size:14px; background:var(--mint); border-radius:50%; padding:5px 9px; vertical-align:middle; }
.live-empty { padding:40px; text-align:center; }
.live-empty > div { color:#b46349; font-size:55px; margin-bottom:12px; }
.live-empty p { max-width:500px; margin:18px auto 24px; }
.live-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr)); gap:24px; }
.live-party { padding:26px; position:relative; }
.live-party .pill { margin-bottom:24px; }
.live-party h2 { margin:8px 0 16px; padding-right:30px; }
.party-symbol { position:absolute; right:24px; top:18px; font-size:60px; color:#b46048; }
.live-section { margin-top:36px; }
.live-kid-list { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.live-kid { padding:18px; display:flex; align-items:center; gap:16px; }
.live-kid > span:nth-child(2) { flex:1; }
.live-kid small { display:block; font-size:14px; color:var(--muted); }
.live-kid img,.kid-photo,.kid-initial { border-radius:50%; object-fit:cover; flex-shrink:0; }
.kid-initial { display:grid; place-items:center; width:64px; height:64px; background:var(--peach); color:#804737; font-size:26px; }
.live-add { border:1px dashed #9caea0; border-radius:16px; padding:28px 20px; min-height:80px; display:grid; place-items:center; }
.kid-heading { display:flex; align-items:center; gap:18px; margin-bottom:18px; }
.live-soft { padding:36px; background:var(--mint); border-radius:20px; }
.live-soft p { margin-top:18px; }
.soft-flower { font-size:72px; color:#9c5a42; line-height:1; display:block; margin-bottom:24px; }
.child-current,.child-placeholder { width:220px; height:220px; border-radius:24px; margin:24px auto; object-fit:cover; }
.child-placeholder { display:grid; place-items:center; background:var(--peach); color:#8a5340; font-size:100px; }
[data-photo-form] canvas { max-width:100%; height:auto; border-radius:20px; display:block; margin:20px auto; }
[data-photo-form] input[type=range] { padding:0; accent-color:var(--brand); }
[data-photo-form] input[type=file] { padding:12px 8px; font-size:16px; }
[data-photo-form] select { margin-bottom:20px; }
.live-actions { display:flex; flex-wrap:wrap; gap:12px; }
.danger-link { background:none; border:0; color:var(--danger); padding:8px 0; }
.planning-grid { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:32px; align-items:start; }
.live-divider { border:0; border-top:1px solid var(--line); margin:30px 0; }
.live-save { padding-top:22px; border-top:1px solid var(--line); display:flex; gap:18px; align-items:center; justify-content:space-between; }
.live-save p { font-size:14px; max-width:240px; }
@media(max-width:900px) { .live-tagline { display:none; } .live-header { justify-content:space-between; } .auth-grid { gap:36px; padding:10px 0; } .welcome-flower { min-width:190px; font-size:195px; } .welcome-flower span { top:85px; } .planning-grid { grid-template-columns:1fr; } }
@media(max-width:640px) {
 .live-header { padding:16px 20px; gap:16px; } .live-logo { font-size:29px; } .live-logo span { font-size:32px; }
 .live-main { padding:28px 20px 110px; } .live-footer { padding:22px 20px 95px; flex-direction:column; }
 .live-nav { position:fixed; z-index:20; bottom:0; left:0; right:0; justify-content:space-around; background:var(--paper); border-top:1px solid #b9cbbd; padding:10px 10px max(10px,env(safe-area-inset-bottom)); box-shadow:0 -8px 24px #163f3b08; }
 .live-nav a { flex:1; text-align:center; }
 .auth-grid,.live-columns,.live-kid-list { grid-template-columns:1fr; gap:24px; }
 .auth-art,.auth-story > .small { display:none; } .auth-story > p:not(.eyebrow) { margin-top:18px; }
 .live-panel { padding:24px 20px; } .live-welcome { padding:28px 24px; margin-bottom:32px; } .welcome-flower { display:none; }
 .page-heading { align-items:flex-start; flex-direction:column; gap:20px; margin-bottom:24px; }
 .section-heading { align-items:flex-start; gap:12px; } .section-heading h2 { font-size:21px; }
 .section-heading .text-link { font-size:14px; text-align:right; }
 .live-empty,.live-soft { padding:28px 22px; } .live-empty h2 { font-size:24px; }
 .live-save { flex-direction:column; align-items:stretch; } .live-save p { max-width:none; }
 .narrow { margin:0; } .narrow h1 { font-size:34px; }
}
