:root{font-family:Inter,system-ui,-apple-system,sans-serif;color:#263c34;background:#f8f4eb;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,textarea,select{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #dfab64;outline-offset:2px}button:disabled{opacity:.45;cursor:not-allowed}#app{max-width:540px;margin:auto;min-height:100dvh;padding:calc(20px + env(safe-area-inset-top)) 20px calc(92px + env(safe-area-inset-bottom))}.top{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}.brand{font-weight:850;letter-spacing:-.05em;font-size:19px}.brand span{color:#c66b4e}.iconbtn{border:0;background:#ede6d8;border-radius:50%;width:42px;height:42px;color:#314b3e;font-size:19px}.eyebrow{font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:#9c7054}.hero{background:#dce8db;border-radius:26px;padding:26px;position:relative;overflow:hidden;margin-bottom:28px;min-height:205px}.hero h1{font-family:Georgia,serif;font-size:34px;line-height:1.03;letter-spacing:-.035em;margin:12px 0;max-width:250px}.hero p{max-width:245px;color:#567061;font-size:14px;line-height:1.5}.mascot{position:absolute;right:23px;bottom:24px;width:84px;height:100px;background:#805238;border:7px solid #62422f;border-radius:22px 22px 16px 16px;transform:rotate(9deg);box-shadow:inset 0 -15px #a96d42}.mascot:before{content:'• ᴗ •';position:absolute;top:28px;left:12px;color:#fff3dd;font-size:19px;white-space:nowrap}.mascot:after{content:'✦';position:absolute;right:-18px;top:-18px;color:#c36e4f;font-size:25px}.section-head{display:flex;align-items:center;justify-content:space-between;margin:25px 0 14px}.section-head h2,h2{font-family:Georgia,serif;font-size:24px;letter-spacing:-.025em;margin:0}.muted{color:#77877c;font-size:14px;line-height:1.5}.button{border:0;border-radius:14px;padding:15px 18px;background:#285d4a;color:white;font-weight:750;min-height:48px}.button.secondary{background:#e9e7da;color:#304c3e}.button.danger{background:#f4e1d9;color:#a04432}.button.full{width:100%}.button.small{padding:9px 12px;min-height:40px;font-size:13px}.row{display:flex;gap:10px;align-items:center}.row>*{min-width:0}.stack{display:grid;gap:12px}.room,.wish,.panel,.empty{background:#fffdf8;border:1px solid #ece6da;border-radius:18px;padding:17px}.room{display:flex;align-items:center;gap:14px;width:100%;text-align:left;color:inherit}.room-icon,.avatar{background:#e7ede0;border-radius:13px;display:grid;place-items:center;flex:none;width:49px;height:49px;font-size:22px}.room strong,.wish strong{display:block}.room .arrow{margin-left:auto;color:#91a095;font-size:22px}.badge{font-size:11px;font-weight:800;color:#56816a;background:#e5efe4;padding:5px 8px;border-radius:20px}.badge.done{background:#f4e5d4;color:#a26842}.empty{text-align:center;padding:30px 20px}.empty .spark{font-size:30px}.empty p{margin:8px auto 16px;max-width:260px}.nav{position:fixed;z-index:3;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,540px);background:#fffdf8ed;backdrop-filter:blur(12px);border-top:1px solid #eee7d9;padding:10px 20px calc(10px + env(safe-area-inset-bottom));display:flex;justify-content:space-around}.nav button{border:0;background:none;color:#849087;min-width:80px;padding:5px;font-size:12px;font-weight:700}.nav button.active{color:#285d4a}.nav span{display:block;font-size:21px;margin-bottom:3px}label{display:grid;gap:7px;font-size:13px;font-weight:700;color:#526458}input,textarea,select{width:100%;border:1px solid #ddd9cb;border-radius:12px;padding:13px;background:#fffefa;color:#263c34;min-height:48px}textarea{min-height:95px;resize:vertical}.form{display:grid;gap:15px}.form h1,.page-title{font-family:Georgia,serif;font-size:30px;margin:0 0 8px;letter-spacing:-.03em}.back{border:0;background:none;color:#597665;padding:0;margin-bottom:22px;font-weight:700}.member{display:flex;align-items:center;gap:11px;padding:11px 0;border-bottom:1px solid #eee9df}.member:last-child{border:0}.avatar{width:38px;height:38px;font-size:14px;font-weight:800}.member .grow{flex:1}.link{color:#326d53;overflow-wrap:anywhere}.wish img{width:100%;max-height:200px;object-fit:cover;border-radius:12px;margin-bottom:12px}.wish p{white-space:pre-wrap}.toast{position:fixed;z-index:9;top:20px;left:50%;transform:translateX(-50%);background:#263c34;color:white;border-radius:12px;padding:12px 18px;max-width:90%;box-shadow:0 6px 25px #0002}.result{background:#f4e5d4;text-align:center;padding:28px;border-radius:24px}.result .gift{font-size:48px;animation:reveal .7s both}.result h2{margin:10px}.divider{height:1px;background:#ebe6db;margin:22px 0}.loading{text-align:center;padding:30vh 0;color:#728274}@keyframes reveal{from{opacity:0;transform:translateY(15px) rotate(-8deg)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
/* Themes, mascot and snow */
.mascot{position:absolute;right:-8px;bottom:-8px;width:155px;height:155px;object-fit:contain;object-position:bottom;background:none;border:0;border-radius:0;transform:none;box-shadow:none;mix-blend-mode:multiply}
.hero h1,.hero p,.hero .eyebrow{position:relative;z-index:1;max-width:60%}.hero{min-height:250px}
.profile-photo{object-fit:cover}.profile-details{display:grid;gap:10px;margin-top:20px}.profile-details div{display:flex;justify-content:space-between;gap:12px;font-size:14px}.profile-details span{color:#77877c}
.snow{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:4}.snow span{position:absolute;top:-20px;left:var(--x);width:var(--size);height:var(--size);border-radius:50%;background:#fff;box-shadow:0 0 2px 1px #648b9b88,0 1px 4px #385a6c88;opacity:.8;animation:snowfall var(--duration) linear var(--delay) infinite}@keyframes snowfall{0%{transform:translate3d(0,-20px,0)}50%{transform:translate3d(22px,50vh,0)}100%{transform:translate3d(-12px,105vh,0)}}
:root[data-theme=dark]{color-scheme:dark;color:#eef1e9;background:#17221e}:root[data-theme=dark] .hero{background:#30483a}:root[data-theme=dark] .hero p{color:#c6d6c7}:root[data-theme=dark] .mascot{mix-blend-mode:normal;border-radius:18px}:root[data-theme=dark] .room,:root[data-theme=dark] .wish,:root[data-theme=dark] .panel,:root[data-theme=dark] .empty{background:#25352d;border-color:#405346}:root[data-theme=dark] .nav{background:#25352deb;border-color:#405346}:root[data-theme=dark] .nav button.active{color:#b9e3ba}:root[data-theme=dark] .muted{color:#b4c5b6}:root[data-theme=dark] .eyebrow{color:#e5b698}:root[data-theme=dark] .iconbtn,:root[data-theme=dark] .button.secondary{background:#405448;color:#f0f4e9}:root[data-theme=dark] .button{background:#a6d8b5;color:#183b2b}:root[data-theme=dark] .button.danger{background:#633b35;color:#ffd9cf}:root[data-theme=dark] input,:root[data-theme=dark] textarea,:root[data-theme=dark] select{background:#1d2d25;color:#f4f3eb;border-color:#52665a}:root[data-theme=dark] label,:root[data-theme=dark] .back{color:#c3d4c5}:root[data-theme=dark] .result{background:#51453a}:root[data-theme=dark] .room-icon,:root[data-theme=dark] .avatar{background:#415649}:root[data-theme=dark] .member{border-color:#43544a}:root[data-theme=dark] .link{color:#9ddbb7}:root[data-theme=dark] .snow span{box-shadow:0 0 5px #fff;opacity:.9}
@media(max-width:380px){.hero{padding:20px}.hero h1{font-size:29px}.mascot{width:130px;height:130px}}
@media(prefers-reduced-motion:reduce){.snow{display:none}}
/* The character stays inside its own column so the whole figure is visible. */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(120px,43%);gap:4px;align-items:center;min-height:0;padding:24px 12px 24px 24px}
.hero-copy{min-width:0}.hero h1,.hero p,.hero .eyebrow{max-width:none}.hero h1{font-size:clamp(27px,7vw,36px);overflow-wrap:normal}.hero p{margin-bottom:0}
.mascot,:root[data-theme=dark] .mascot{position:static;display:block;width:100%;height:auto;max-height:260px;object-fit:contain;object-position:center;mix-blend-mode:normal;border-radius:0;transform:none}
.festive-card{display:flex;gap:14px;align-items:center;margin-top:24px;padding:10px;background:#f1e8d8;border:1px solid #e6dccb;border-radius:18px}.festive-card img{width:76px;height:76px;object-fit:cover;border-radius:12px;flex:none}.festive-card div{display:grid;gap:6px}.festive-card strong{font-family:Georgia,serif;font-size:15px;line-height:1.25}.festive-kicker{font-size:9px;letter-spacing:.09em;color:#a06e57;font-weight:800}
:root[data-theme=dark]{background:#181c1b;color:#f5eee2}
:root[data-theme=dark] .hero{background:#2b3831}
:root[data-theme=dark] .room,:root[data-theme=dark] .wish,:root[data-theme=dark] .panel,:root[data-theme=dark] .empty{background:#252c29;border-color:#3a453e}
:root[data-theme=dark] .nav{background:#222b27ed;border-color:#3a453e}
:root[data-theme=dark] .muted{color:#bfc9bc}
:root[data-theme=dark] .eyebrow,:root[data-theme=dark] .festive-kicker{color:#e1b49b}
:root[data-theme=dark] .iconbtn,:root[data-theme=dark] .button.secondary{background:#3b4b40;color:#f6f1e7}
:root[data-theme=dark] .button{background:#a9cfaa;color:#1b3022}
:root[data-theme=dark] .result{background:#493d36}
:root[data-theme=dark] .festive-card{background:#302e29;border-color:#4a4238}
@media(max-width:380px){.hero{grid-template-columns:minmax(0,1fr) minmax(105px,43%);padding:20px 10px 20px 18px}.hero h1{font-size:27px}.mascot,:root[data-theme=dark] .mascot{width:100%;height:auto}}

/* Fit the complete image without stretching or oversized cards. */
.wish img{display:block;width:auto;height:auto;max-width:100%;max-height:320px;object-fit:contain;margin:0 auto 14px}.delete-room{margin-top:14px}.festive-card strong{overflow-wrap:anywhere}

.file-input{padding:7px;color:#526458;font-size:13px;cursor:pointer}.file-input::file-selector-button{border:0;border-radius:9px;background:#e9e7da;color:#304c3e;font:inherit;font-weight:750;padding:10px 14px;margin-right:12px;cursor:pointer}.file-input::file-selector-button:hover{background:#dce4d5}:root[data-theme=dark] .file-input{color:#d5dfd3}:root[data-theme=dark] .file-input::file-selector-button{background:#405448;color:#f6f1e7}:root[data-theme=dark] .file-input::file-selector-button:hover{background:#536b59}

.dialog-overlay{position:fixed;inset:0;z-index:20;background:#111b16b8;display:flex;align-items:center;justify-content:center;padding:20px;overscroll-behavior:contain}.dialog{width:min(100%,420px);max-height:85dvh;overflow:auto;padding:24px;border-radius:22px;background:#fffdf8;color:#263c34;box-shadow:0 16px 50px #0005}.dialog h2{font-size:23px}.dialog p{font-size:15px;line-height:1.55;color:#526458}.dialog-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}.dialog-actions button{flex:1;min-width:120px}:root[data-theme=dark] .dialog{background:#25352d;color:#f5eee2;border:1px solid #52665a}:root[data-theme=dark] .dialog p{color:#c6d6c7}.room strong,.page-title,.member strong{overflow-wrap:anywhere}

/* Consistent controls and legible mobile forms */
.button,.room,.iconbtn,.nav button,.back{touch-action:manipulation;transition:background-color .16s ease,box-shadow .16s ease,transform .16s ease}.button:active,.room:active,.iconbtn:active{transform:scale(.98)}.button.small{min-height:44px}.iconbtn{width:44px;height:44px}.back{min-height:44px;display:inline-flex;align-items:center;margin-bottom:12px}.nav button{min-height:44px}.button,.room{line-height:1.25}.room,.member,.wish{overflow-wrap:anywhere}.room span:nth-child(2){min-width:0}.room .muted{display:block}.section-head{gap:12px}.section-head h2,.page-title,.hero h1{text-wrap:balance}p{text-wrap:pretty}input,textarea,select{font-size:16px}.form label{line-height:1.35}.muted{color:#586d60}:root[data-theme=dark] .muted{color:#c4d0c2}.festive-card img,.wish img{outline:1px solid #0002;outline-offset:-1px}:root[data-theme=dark] .festive-card img,:root[data-theme=dark] .wish img{outline-color:#fff3}
.peter-surprise{position:fixed;inset:0;z-index:30;display:grid;place-items:center;pointer-events:none;background:#1b211caa}.peter-surprise img{max-width:min(70vw,360px);max-height:65dvh;object-fit:contain;animation:peter-in .32s ease-out both;filter:drop-shadow(0 8px 20px #0007)}@keyframes peter-in{from{opacity:0;transform:scale(.8) translateY(18px)}to{opacity:1;transform:scale(1) translateY(0)}}
@media(prefers-reduced-motion:reduce){.peter-surprise img{animation:none}.button,.room,.iconbtn,.nav button,.back{transition:none}.button:active,.room:active,.iconbtn:active{transform:none}}

.eyebrow{color:#76513c}.nav button{color:#5d6b61}.badge{color:#325940}.badge.done{color:#80502f}.peter-placeholder{padding:24px 30px;background:#fffdf8;color:#263c34;border-radius:20px;font-family:Georgia,serif;font-size:clamp(24px,7vw,42px);box-shadow:0 8px 30px #0006;text-align:center}@media(max-width:360px){.form .row{flex-wrap:wrap}.form .row label{flex-basis:140px!important}}

:root[data-theme=dark] .nav button{color:#b8c9ba}:root[data-theme=dark] .nav button.active{color:#c2e9c7}

/* Secret surprise: one brief reveal, then a comic burst, without strobing. */
.peter-surprise{pointer-events:auto;overflow:hidden;background:#141a18e8}.peter-stage{position:relative;display:grid;place-items:center;width:min(80vw,460px);height:min(70dvh,460px)}.peter-stage img{width:100%;height:100%;max-width:none;max-height:none;object-fit:contain;border-radius:20px;animation:peter-entrance .5s cubic-bezier(.18,.86,.28,1.25) both;filter:drop-shadow(0 12px 24px #0008)}.peter-flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none;animation:peter-flash-once .45s ease-out both}.peter-close{position:absolute;top:calc(18px + env(safe-area-inset-top));right:18px;width:48px;height:48px;border:1px solid #ffffff80;border-radius:50%;background:#1a211ce8;color:white;font-size:24px;cursor:pointer}.peter-burst{position:absolute;font-size:clamp(100px,35vw,230px);opacity:0;transform:scale(.15);pointer-events:none}.peter-surprise.is-closing .peter-stage img{animation:peter-exit .5s ease-in forwards}.peter-surprise.is-closing .peter-burst{animation:peter-bang .5s ease-out forwards}@keyframes peter-flash-once{0%{opacity:.65}100%{opacity:0}}@keyframes peter-entrance{from{opacity:0;transform:scale(.3) rotate(-12deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes peter-exit{to{opacity:0;transform:scale(.1) rotate(18deg)}}@keyframes peter-bang{0%{opacity:0;transform:scale(.15)}30%{opacity:1;transform:scale(1.1)}100%{opacity:0;transform:scale(1.4)}}
@media(prefers-reduced-motion:reduce){.peter-flash{display:none}.peter-stage img,.peter-surprise.is-closing .peter-stage img{animation:none}.peter-burst,.peter-surprise.is-closing .peter-burst{animation:none;display:none}}

/* The picture burns away once; reduced motion keeps a quiet fade. */
.surprise-video{width:min(92vw,720px);height:min(52vw,405px);min-width:200px;min-height:200px;border:0;border-radius:14px}.peter-stage{overflow:visible}.peter-stage img{animation:peter-entrance .5s cubic-bezier(.18,.86,.28,1.25) both}.peter-flames{position:absolute;inset:auto 0 0;display:flex;justify-content:space-around;font-size:clamp(38px,12vw,75px);opacity:0;pointer-events:none}.burning img{animation:burn-away 1.3s ease-in forwards}.burning .peter-flames{animation:flames-rise 1.3s ease-out forwards}@keyframes burn-away{0%{opacity:1;filter:brightness(1);transform:scale(1)}35%{filter:sepia(.7) brightness(1.35);opacity:1}100%{filter:sepia(1) brightness(.25) blur(5px);opacity:0;transform:scale(.9) translateY(-14px)}}@keyframes flames-rise{0%{opacity:0;transform:translateY(20px) scale(.5)}35%{opacity:.9;transform:translateY(-20px) scale(1)}100%{opacity:0;transform:translateY(-100px) scale(1.3)}}@media(prefers-reduced-motion:reduce){.peter-stage img{animation:none}.burning img{animation:gentle-disappear 1.3s ease forwards}.burning .peter-flames{display:none}@keyframes gentle-disappear{to{opacity:0}}}

/* Snow stays on the page background, behind opaque cards and controls. */
.snow{z-index:0}.snow span{width:calc(var(--size) * .5);height:calc(var(--size) * .5);box-shadow:0 0 2px #55758388;opacity:.72}#app{position:relative;z-index:1}:root[data-theme=dark] .snow span{box-shadow:0 0 3px #fff9;opacity:.75}
/* Native pickers remain accessible while matching the app surface. */
select{appearance:none;-webkit-appearance:none;padding-right:38px;background-image:linear-gradient(45deg,transparent 50%,#597365 50%),linear-gradient(135deg,#597365 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%;background-size:5px 5px,5px 5px;background-repeat:no-repeat;cursor:pointer}select option{background:#fffdf8;color:#263c34}:root[data-theme=dark] select{background-color:#1d2d25;background-image:linear-gradient(45deg,transparent 50%,#c3d4c5 50%),linear-gradient(135deg,#c3d4c5 50%,transparent 50%)}:root[data-theme=dark] select option{background:#25352d;color:#f5eee2}.button,.iconbtn,.nav button,.back,.room{font-family:inherit;font-weight:750;-webkit-tap-highlight-color:transparent}.button,.room{box-shadow:0 2px 5px #1e342011}.button:focus-visible,.iconbtn:focus-visible,.nav button:focus-visible,.back:focus-visible,select:focus-visible{outline:3px solid #dfab64;outline-offset:3px}.nav button{border-radius:12px}.file-input::file-selector-button{min-height:36px}
/* Prevent touch selection, drag and callouts on the surprise image. */
.peter-surprise,.peter-stage,.peter-stage img{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.peter-stage img{-webkit-user-drag:none;pointer-events:none}