:root{--nacht:#0b1a3a;--nacht-licht:#1d3a6b;--sneeuw:#f7f9fc;--rood:#c8102e;--rood-donker:#9a0b22;--groen:#2f6b4f;--goud:#ffcf3f;--inkt:#1b2230;--inkt-zacht:#5b6578;--kaart:#fff;--rand:#e3e8f0;color:var(--inkt);font-family:"Baloo 2",system-ui,sans-serif}*{box-sizing:border-box}html,body{min-height:100%;margin:0;overflow-x:clip}body{background:radial-gradient(ellipse at top, var(--nacht-licht), var(--nacht) 60%);color:var(--sneeuw);background-attachment:fixed}#root{max-width:440px;min-height:100dvh;margin:0 auto}.scherm{padding:16px 16px max(24px, env(safe-area-inset-bottom));flex-direction:column;gap:14px;min-height:100dvh;display:flex}.kop-groot{color:var(--sneeuw);margin:0;font-family:Mountains of Christmas,"Baloo 2",cursive;font-size:2rem;line-height:1.05}.kaart .kop-groot,.lijstje .kop-groot,.vragen .kop-groot{color:inherit}h2{margin:0;font-size:1.1rem}p{margin:0;line-height:1.45}.zacht{opacity:.8}.klein{font-size:.9rem}.let-op{color:#6b4e00;background:#fff3cd;border-radius:10px;padding:8px 10px}.knop{font:inherit;border:2px solid var(--rand);color:var(--inkt);cursor:pointer;background:#fff;border-radius:999px;min-height:48px;padding:12px 18px;font-size:1.05rem;font-weight:700}.knop.primair{background:var(--rood);border-color:var(--rood);color:#fff}.knop.primair:active{background:var(--rood-donker)}.knop.groot{width:100%;padding:16px 24px;font-size:1.2rem}.terug{font:inherit;color:var(--sneeuw);background:#ffffff1f;border:0;border-radius:999px;align-self:flex-start;min-height:40px;padding:8px 14px;font-weight:700}.vragen .terug,.lijstje .terug{color:inherit}.rond{cursor:pointer;background:0 0;border:0;padding:0}.rij{flex-wrap:wrap;align-items:stretch;gap:10px;display:flex}.rij>.knop{flex:1}.rij.midden{align-items:center}.rij.tussen{justify-content:space-between;align-items:center}.pil{font:inherit;color:inherit;cursor:pointer;background:0 0;border:2px solid #fff6;border-radius:999px;min-width:36px;min-height:36px;padding:4px 12px;font-weight:700}.pil.actief{background:var(--goud);color:var(--inkt);border-color:var(--goud)}.kaart{background:var(--kaart);color:var(--inkt);border-radius:18px;flex-direction:column;gap:10px;padding:16px;display:flex;box-shadow:0 8px 30px #00000040}.kaart.hond,.kaart.melding{flex-direction:row;align-items:center;gap:12px}.kaart.melding{color:var(--sneeuw);box-shadow:none;background:#ffffff1f}.kaart.melding span{font-size:1.5rem}.kies{text-align:center;justify-content:center}.avatar-rooster{grid-template-columns:1fr 1fr;gap:14px;display:grid}.avatar-knop{font:inherit;color:var(--inkt);cursor:pointer;background:#fff;border:0;border-radius:22px;flex-direction:column;align-items:center;gap:6px;padding:16px 8px;font-size:1.15rem;font-weight:700;display:flex;box-shadow:0 8px 24px #00000040}.avatar-knop:active{transform:scale(.97)}.avatar-knop:disabled{opacity:.75}.avatar-knop small{color:var(--inkt-zacht);font-size:.8rem;font-weight:500}.dorp-kop{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.scene{border-radius:20px;position:relative;overflow:hidden;box-shadow:0 10px 30px #00000059}.scene-svg{width:100%;height:auto;display:block}.bewoners{justify-content:space-evenly;align-items:flex-end;display:flex;position:absolute;bottom:4px;left:0;right:0}.bewoner{flex-direction:column;align-items:center;display:flex;position:relative}.bewoner .avatar{filter:drop-shadow(0 4px 6px #0000004d);animation:3s ease-in-out infinite wiebel}.bewoner:nth-child(2) .avatar{animation-delay:.6s}.bewoner:nth-child(3) .avatar{animation-delay:1.2s}.bewoner:nth-child(4) .avatar{animation-delay:1.8s}.wolkje{z-index:1;background:var(--goud);width:22px;height:22px;color:var(--inkt);text-align:center;border-radius:50%;font-size:.9rem;font-weight:800;line-height:22px;position:absolute;top:-6px;right:-6px;box-shadow:0 2px 6px #0000004d}@keyframes wiebel{0%,to{transform:translateY(0)rotate(-2deg)}50%{transform:translateY(-3px)rotate(2deg)}}.lampje{animation:1.6s ease-in-out infinite twinkel}@keyframes twinkel{0%,to{opacity:1}50%{opacity:.35}}.sneeuw{pointer-events:none;position:absolute;inset:0;overflow:hidden}.sneeuw i,.vlokken i{opacity:.9;background:#fff;border-radius:50%;width:5px;height:5px;animation:linear infinite val;position:absolute;top:-8px}@keyframes val{to{opacity:.4;transform:translateY(200px)translate(12px)}}.actie{text-align:center;align-items:stretch}.proto{flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin-top:auto;padding-top:8px;display:flex}.vragen,.lijstje{background:var(--sneeuw);color:var(--inkt)}.vragen .zacht,.lijstje .zacht{color:var(--inkt-zacht);opacity:1}.voortgang{background:var(--rand);border-radius:999px;height:8px;overflow:hidden}.voortgang i{background:var(--groen);height:100%;transition:width .3s;display:block}.opties{grid-template-columns:1fr 1fr;gap:12px;display:grid}.optie{font:inherit;color:var(--inkt);border:3px solid var(--rand);cursor:pointer;background:#fff;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:110px;padding:18px 10px;font-size:1.1rem;font-weight:700;display:flex}.optie .emoji{font-size:2.2rem}.optie.gekozen{border-color:var(--groen);background:#eaf5ee}.optie:active{transform:scale(.97)}.wensen{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.wensen li{border:2px solid var(--rand);background:#fff;border-radius:14px;padding:12px 14px}.wensen li.uit{opacity:.5;text-decoration:line-through}.wensen label{cursor:pointer;align-items:flex-start;gap:12px;display:flex}.wensen input[type=checkbox]{width:24px;height:24px;accent-color:var(--groen);flex:none;margin-top:2px}.wensen span{flex-direction:column;display:flex}.wensen em{color:var(--inkt-zacht);font-size:.9rem;font-style:normal}.wensen.compact li{flex-direction:column;display:flex}.veld{font:inherit;border:2px solid var(--rand);border-radius:999px;flex:1;min-height:48px;padding:12px 14px;font-size:1.05rem}.vlokken i{opacity:.95;width:6px;height:6px;animation:none;top:auto;bottom:12%}@keyframes schud{0%,to{transform:rotate(0)}25%{transform:rotate(-7deg)translate(-6px)}75%{transform:rotate(7deg)translate(6px)}}@keyframes wervel{0%{bottom:12%;transform:translateY(0)translate(-10px)}to{bottom:var(--diep);transform:translateY(-120px)translate(14px)}}@keyframes daal{0%{bottom:var(--diep);opacity:.95}to{opacity:.6;bottom:10%}}.betalingen .bedrag{font-weight:800}.betalingen input{width:26px;height:26px;accent-color:var(--groen)}.geld .pil{color:var(--inkt);border-color:var(--rand)}.tekstvak{resize:vertical;border-radius:18px}.wensen li.groot{border-color:var(--goud);background:#fff9e3}.wensen .ok,.ok{color:var(--groen)}.wensen .nee{color:var(--rood-donker)}.link{font:inherit;color:var(--inkt-zacht);cursor:pointer;background:0 0;border:0;padding:0;font-weight:700;text-decoration:underline}.knopchip{font:inherit;cursor:pointer;border:0}.wens-foto.groot{width:120px;height:120px}.weg{font:inherit;color:var(--inkt-zacht);cursor:pointer;background:0 0;border:0;padding:0 4px;font-size:1.4rem;line-height:1}.wensen li.bezet{opacity:.55}.schakel button{font:inherit;color:var(--inkt);cursor:pointer;background:#fff;border:0;padding:10px 14px;font-weight:700}.schakel button.actief{background:var(--inkt);color:#fff}.bestand{cursor:pointer;justify-content:center;align-items:center;display:inline-flex}.toevoegen{gap:10px}.intro{text-align:center;justify-content:space-between;position:relative;overflow:hidden}.intro .sneeuw{position:fixed;inset:0}.intro .sneeuw i{animation-name:val-lang}@keyframes val-lang{to{opacity:.3;transform:translateY(110vh)translate(20px)}}.overslaan{z-index:1;align-self:flex-end;position:relative}.dia{z-index:1;flex-direction:column;align-items:center;gap:16px;margin:auto 0;padding:8px 8px 24px;animation:.6s ease-out both dia-in;display:flex;position:relative}.dia-beeld{filter:drop-shadow(0 12px 24px #0006);font-size:7rem;line-height:1;animation:3s ease-in-out infinite zweef}.dia .kop-groot{font-size:2.4rem}.dia-zin{max-width:30ch;font-size:1.3rem;line-height:1.4}@keyframes dia-in{0%{opacity:0;transform:translateY(24px)scale(.96)}to{opacity:1;transform:none}}@keyframes zweef{0%,to{transform:translateY(0)rotate(-3deg)}50%{transform:translateY(-10px)rotate(3deg)}}.stippen{z-index:1;justify-content:center;gap:8px;display:flex;position:relative}.stippen i{background:#ffffff4d;border-radius:50%;width:10px;height:10px;transition:all .3s}.stippen i.gehad{background:#ffffffb3}.stippen i.actief{background:var(--goud);border-radius:999px;width:26px}.intro .rij{z-index:1;position:relative}@media (prefers-reduced-motion:reduce){.dia-beeld,.dia,.bewoner .avatar{animation:none}}.veld.pincode{letter-spacing:.6em;text-align:center;max-width:12rem;margin:0 auto;font-size:2rem}.kies .link{color:var(--sneeuw)}a.avatar-knop{text-decoration:none}.scherm{width:100%;max-width:440px;margin:0 auto}.kies{align-items:center}.kies .kaart{width:100%}.veldgroep{flex-direction:column;gap:4px;display:flex}.veldlabel{font-size:.95rem;font-weight:700}.veld{width:100%}.vinkregel{align-items:center;gap:10px;min-height:48px;font-weight:700;display:flex}.vinkregel input{width:24px;height:24px;accent-color:var(--groen)}.waarschuwingen{flex-direction:column;gap:6px;margin:0;padding:0;list-style:none;display:flex}.waarschuwingen li{color:#6b4e00;background:#fff3cd;border-radius:10px;padding:8px 10px;font-size:.95rem}.tabel{border-collapse:collapse;width:100%}.tabel th,.tabel td{text-align:left;border-bottom:1px solid var(--rand);vertical-align:top;padding:8px 6px}.kop-rij{justify-content:space-between;align-items:center;gap:12px;display:flex}.app .kop-groot,.app h2{color:var(--sneeuw)}.app .kaart h2,.app .kaart .kop-groot{color:var(--inkt)}.formulier{flex-direction:column;gap:10px;display:flex}.formulier .rij>.veldgroep{flex:1}a.knop,a.pil{justify-content:center;align-items:center;text-decoration:none;display:inline-flex}select.veld{appearance:auto}.lijstje .terug{color:var(--inkt)}.chips{flex-wrap:wrap;gap:6px;display:flex}.chip{background:var(--rand);color:var(--inkt);white-space:nowrap;border-radius:999px;padding:4px 10px;font-size:.8rem;font-weight:700}.chip.ok{color:var(--groen);background:#dff3e6}.vulmeter .voortgang{height:12px}.groot-kaart{border:2px solid var(--goud);background:#fff9e3}.groot-kaart summary{cursor:pointer;flex-direction:column;gap:4px;list-style:none;display:flex}.groot-kaart summary::-webkit-details-marker{display:none}.wens{align-items:flex-start;gap:10px;display:flex}.wens-tekst{flex-direction:column;flex:1;min-width:0;display:flex}.wens-tekst a{color:var(--groen);font-weight:700}.wens-foto{object-fit:cover;border-radius:10px;flex:none;width:56px;height:56px}.weg{font:inherit;color:var(--inkt-zacht);cursor:pointer;background:0 0;border:0;min-width:44px;min-height:44px;padding:0 4px;font-size:1.4rem;line-height:1}.wensen li.grappig{background:#fff5f9;border-color:#f6c6d8}.wensen li.leeg{color:var(--inkt-zacht);text-align:center}.toevoegen summary{text-align:center;cursor:pointer;list-style:none}.toevoegen summary::-webkit-details-marker{display:none}.toevoegen[open] summary{margin-bottom:10px}.schakel{border:2px solid var(--rand);border-radius:999px;display:flex;overflow:hidden}.schakel label{cursor:pointer;align-items:center;gap:6px;padding:10px 14px;font-weight:700;display:flex}.schakel label:has(input:checked){background:var(--inkt);color:#fff}.schakel input{opacity:0;width:0;height:0;position:absolute}.veld.smal{text-align:center;flex:none;width:90px}.prijsregel{font-weight:700}.knop:disabled{opacity:.5;cursor:default}.app .lijstje .kop-groot,.app .vragen .kop-groot,.app .lijstje h2,.app .vragen h2{color:var(--inkt)}.fotoveld{margin-top:4px}.fotoveld .link{cursor:pointer}.vragen .terug{color:var(--inkt);align-self:flex-start}a.optie{text-decoration:none}.tekstvak{resize:vertical;font:inherit;border:2px solid var(--rand);border-radius:18px;padding:12px 14px}.voorstel .wens input[type=checkbox]{width:24px;height:24px;accent-color:var(--groen);flex:none;margin-top:2px}.voorstel label.wens{cursor:pointer}.knop.breed{width:100%}.dorp .kop-groot{color:var(--sneeuw)}.overslaan-vorm{z-index:1;align-self:flex-end;position:relative}.groei{flex:1}.groei .knop{width:100%}.intro .rij>a.knop{flex:1}.trekken{text-align:center;align-items:center}.trekken .terug{align-self:flex-start}.bol{width:min(78vw,300px);margin:6px 0;position:relative}.glas{aspect-ratio:1;background:var(--nacht-licht);border:6px solid #ffffffb3;border-radius:50%;width:100%;position:relative;overflow:hidden;box-shadow:inset 0 -20px 40px #ffffff40,inset 0 20px 40px #ffffff26,0 20px 40px #0006}.bol-dorp{width:100%;height:100%;display:block}.voet{background:linear-gradient(#7a2e1a,#4a1a0e);border-radius:12px 12px 22px 22px;width:70%;height:40px;margin:-10px auto 0}.bol-figuur{opacity:0;transition:opacity .8s,transform .8s;position:absolute;bottom:20%;left:50%;transform:translate(-50%)scale(.6)}.bol-hond{position:absolute;bottom:-4px;left:70px}.bol.klaar .bol-figuur{opacity:1;transform:translate(-50%)scale(1)}.vlokken{pointer-events:none;position:absolute;inset:0}.vlokken i{opacity:.95;background:#fff;border-radius:50%;width:6px;height:6px;position:absolute;top:auto;bottom:12%}.bol.schudt{animation:.35s ease-in-out 5 schud}.bol.schudt .vlokken i{animation:.5s ease-in-out infinite alternate wervel}.bol.daalt .vlokken i,.bol.klaar .vlokken i{animation:2.2s ease-in forwards daal}@media (prefers-reduced-motion:reduce){.bol.schudt,.bol .vlokken i{animation:none!important}.bol-figuur{transition:none}}.onthulling .terug{align-self:flex-start}.onthulling .kaart .kop-groot{color:var(--inkt)}.wensen li.uit,.wensen li.bezet{opacity:.55}.wensen li.mijn{border-color:var(--groen);background:#eaf5ee}.knopchip{font:inherit;cursor:pointer;border:0;min-height:36px}.knopchip:disabled{opacity:.4;cursor:default}.spaarpot{border:2px solid var(--goud);background:#fff9e3;border-radius:14px;flex-direction:column;gap:8px;padding:12px;display:flex}.voortgang.goud i{background:var(--goud)}.betalingen{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.betalingen li{border-bottom:1px solid var(--rand);align-items:center;gap:10px;padding:6px 0;display:flex}.betalingen .naam{flex-direction:column;flex:1;font-weight:700;display:flex}.betalingen small{color:var(--inkt-zacht);font-weight:500}.betalingen .bedrag{white-space:nowrap;font-weight:800}.vink{border:2px solid var(--rand);color:#fff;cursor:pointer;background:#fff;border-radius:10px;width:36px;height:36px;font-weight:800}.vink.aan{background:var(--groen);border-color:var(--groen)}.balk{background:var(--rand);border-radius:999px;flex:1;height:10px;overflow:hidden}.balk i{background:var(--groen);height:100%;display:block}.kaart.dicht{opacity:.6}.kaart.hond{flex-direction:row;align-items:center;gap:12px}
