:root{color-scheme:light dark;--bg: #f2f4f2;--kaart: #ffffff;--kop: #ffffff;--tekst: #1b241e;--dempt: #55625a;--lijn: #dde3df;--veldrand: #838d86;--accent: #2e7d4f;--op-accent: #ffffff;--accent-tekst: #1f6b40;--accent-licht: #e3f0e8;--gevaar: #b3261e;--gevaar-licht: #fdecea;--waarsch-bg: #fff3d1;--waarsch-tekst: #6b4500;--vink: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");--pijl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2355625a' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");--zoek: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2355625a' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E");--r-kaart: 14px;--r-veld: 12px;--nav-hoogte: 58px;--breedte: 720px}@media (prefers-color-scheme: dark){:root{--bg: #0f1411;--kaart: #1a211d;--kop: #151b17;--tekst: #e8efe9;--dempt: #a3b3a8;--lijn: #2c3830;--veldrand: #7a897f;--accent: #5fb883;--op-accent: #0b130e;--accent-tekst: #7fcf9f;--accent-licht: #1f3427;--gevaar: #ff8a80;--gevaar-licht: #3b2020;--waarsch-bg: #3a331a;--waarsch-tekst: #f2c46d;--vink: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b130e' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E");--pijl: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3b3a8' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");--zoek: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a3b3a8' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E")}}*{box-sizing:border-box}html{font:17px/1.4 system-ui,-apple-system,Segoe UI,sans-serif;-webkit-text-size-adjust:100%}@supports (font: -apple-system-body){html{font:-apple-system-body;line-height:1.4}}body{margin:0;background:var(--bg);color:var(--tekst)}h1,h2,h3,p,ul,ol{margin:0;padding:0}ul,ol{list-style:none}a{color:var(--accent-tekst)}:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:6px}@media (prefers-reduced-motion: reduce){*,*:before,*:after{transition:none!important;animation:none!important;scroll-behavior:auto!important}}button,select,input,textarea{font:inherit;color:inherit}button{min-height:44px;padding:10px 18px;border:0;border-radius:var(--r-veld);background:var(--accent);color:var(--op-accent);font-weight:600;cursor:pointer;transition:opacity .12s}button:active:not(:disabled){opacity:.8}button:disabled{opacity:.45;cursor:default}button.secundair{background:var(--accent-licht);color:var(--accent-tekst)}button.gevaar{background:var(--gevaar-licht);color:var(--gevaar)}button.link{background:none;color:var(--accent-tekst);padding:10px 4px;text-align:left;font-weight:500}button.icoon{width:44px;min-width:44px;padding:0;background:none;color:var(--dempt);display:inline-grid;place-items:center;font-size:1.5rem;font-weight:400}input,select,textarea{width:100%;min-height:44px;padding:10px 12px;border:1px solid var(--veldrand);border-radius:var(--r-veld);background:var(--kaart);color:var(--tekst);font-weight:400}textarea{resize:vertical;line-height:1.4}select{-moz-appearance:none;appearance:none;-webkit-appearance:none;padding-right:38px;background:var(--kaart) var(--pijl) no-repeat right 12px center / 16px;text-overflow:ellipsis}input::placeholder,textarea::placeholder{color:var(--dempt);opacity:1}input:disabled,select:disabled,textarea:disabled{opacity:.55}.zoekveld{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-left:40px;background:var(--kaart) var(--zoek) no-repeat left 12px center / 18px}.zoekveld::-webkit-search-cancel-button{-webkit-appearance:none}input[type=checkbox]{-webkit-appearance:none;-moz-appearance:none;appearance:none;flex:none;width:28px;min-height:28px;height:28px;padding:0;border:2px solid var(--veldrand);border-radius:50%;background:transparent;cursor:pointer}input[type=checkbox]:checked{background:var(--accent) var(--vink) center / 20px no-repeat;border-color:var(--accent)}input.schakelaar{position:relative;width:51px;min-height:31px;height:31px;border:0;border-radius:16px;background:var(--veldrand);transition:background-color .15s}input.schakelaar:after{content:"";position:absolute;top:2px;left:2px;width:27px;height:27px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0000004d;transition:transform .15s}input.schakelaar:checked{background:var(--accent)}input.schakelaar:checked:after{transform:translate(20px)}label.vinkje{display:flex;align-items:center;gap:12px;min-height:44px;margin:4px 0}.app{min-height:100dvh;display:flex;flex-direction:column}.laden{padding:2rem 16px}header{position:sticky;top:0;z-index:10;background:var(--kop);border-bottom:1px solid var(--lijn);padding-top:env(safe-area-inset-top)}.kop{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:4px;min-height:52px;padding:4px 8px 4px 16px}.kopLinks:not(:empty){margin-left:-12px}.koptitel{min-width:0;display:flex;flex-direction:column}.koptitel h1{font-size:1.15rem;line-height:1.2;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.periode{font-size:.82rem;color:var(--dempt);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.kopLinks:not(:empty)+.koptitel{padding-left:4px}.kopterug{display:inline-flex;align-items:center;gap:2px;min-height:44px;padding:0 10px 0 6px;background:none;color:var(--accent-tekst);font-weight:500}.kopacties{display:flex;align-items:center;gap:4px}.kopknop{background:none;color:var(--accent-tekst)}.kopknop.rond{width:44px;min-width:44px;padding:0;display:inline-grid;place-items:center;border-radius:50%}.kopknop.rond[aria-pressed=true]{background:var(--accent-licht)}.kopknop.tekstknop{display:inline-flex;align-items:center;gap:4px;padding:0 12px;background:var(--accent-licht)}.status{padding:8px 16px;font-size:.88rem;border-top:1px solid var(--lijn);background:var(--waarsch-bg);color:var(--waarsch-tekst)}.status:empty{display:none}.status.fout{background:var(--gevaar-licht);color:var(--gevaar)}main{flex:1;padding:4px 0 calc(var(--nav-hoogte) + env(safe-area-inset-bottom) + 20px)}.scherm{padding:12px 16px;max-width:var(--breedte);margin:0 auto}nav{position:fixed;left:0;right:0;bottom:0;z-index:10;display:grid;grid-template-columns:repeat(3,1fr);background:var(--kop);border-top:1px solid var(--lijn);padding-bottom:env(safe-area-inset-bottom)}nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;min-height:var(--nav-hoogte);padding:4px 0;border-radius:0;background:none;color:var(--dempt);font-weight:500}.tabicoon{display:grid;place-items:center;width:58px;height:30px;border-radius:15px;transition:background-color .15s}.tablabel{font-size:clamp(11px,.75rem,14px);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}nav button[aria-current=page]{color:var(--accent-tekst);font-weight:700}nav button[aria-current=page] .tabicoon{background:var(--accent-licht)}h2{font-size:1.1rem;font-weight:700;display:flex;justify-content:space-between;align-items:baseline}h3{font-size:.8rem;font-weight:600;margin:22px 4px 8px;color:var(--dempt);text-transform:uppercase;letter-spacing:.04em}.teller{font-size:.88rem;color:var(--dempt);font-weight:400}.leeg{color:var(--dempt);margin:8px 4px;font-size:.92rem}.fout{color:var(--gevaar);margin:8px 4px}.waarschuwing{background:var(--waarsch-bg);color:var(--waarsch-tekst);border-radius:var(--r-veld);padding:10px 14px;margin:8px 0;font-size:.92rem}.waarschuwing summary{cursor:pointer;font-weight:600;min-height:24px}.waarschuwing ul{margin-top:6px;padding-left:18px;list-style:disc}.waarschuwingtekst{color:var(--waarsch-tekst)}.badge{background:var(--waarsch-bg);color:var(--waarsch-tekst);border-radius:8px;padding:1px 8px;font-size:.78rem;font-weight:600}.chips{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0}.chips li{display:inline-flex;align-items:center;background:var(--accent-licht);color:var(--accent-tekst);border-radius:22px;padding:0 2px 0 14px;min-height:44px}.chips li button.icoon{color:var(--accent-tekst)}.velden{display:grid;gap:12px;margin:12px 0}.velden label,.veld{display:grid;gap:6px;font-size:.92rem;color:var(--dempt);font-weight:500}.veldnaam{font-size:.92rem;color:var(--dempt);font-weight:500}.rij{display:grid;grid-template-columns:84px 1fr auto;gap:8px}.rij.rij-2{grid-template-columns:1fr auto}.knoppen{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}.segmenten{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;padding:3px;border-radius:var(--r-veld);background:var(--lijn)}.segmenten button{min-height:40px;padding:6px 4px;background:none;color:var(--tekst);font-weight:500;font-size:.92rem;border-radius:10px}.segmenten button[aria-selected=true]{background:var(--kaart);font-weight:700;box-shadow:0 1px 3px #0000002e}.rijlijst{background:var(--kaart);border:1px solid var(--lijn);border-radius:var(--r-kaart);overflow:hidden}.rijlijst>li+li{border-top:1px solid var(--lijn)}.rijlijst>li>button{display:flex;align-items:center;gap:10px;width:100%;min-height:52px;padding:10px 10px 10px 16px;border-radius:0;background:none;color:var(--tekst);text-align:left;font-weight:500}.rijlijst>li>button:active:not(:disabled){background:var(--accent-licht);opacity:1}.rijlijst .naam{flex:1;min-width:0}.rijlijst .gerechten{color:var(--dempt);font-size:.88rem;font-weight:400;text-align:right}.rijlijst>li>button svg{flex:none;color:var(--dempt)}.rijlijst>li.bewerken{display:grid;gap:12px;padding:12px 16px;background:var(--accent-licht)}.kaartlijst{background:var(--kaart);border:1px solid var(--lijn);border-radius:var(--r-kaart);overflow:hidden}.kaartlijst>li+li{border-top:1px solid var(--lijn)}.groep,.schakelgroep{background:var(--kaart);border:1px solid var(--lijn);border-radius:var(--r-kaart);overflow:hidden;margin:12px 0}.schakelrij{display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:52px;padding:8px 16px}.schakelrij+.schakelrij{border-top:1px solid var(--lijn)}.extra{background:var(--kaart);border:1px solid var(--veldrand);border-radius:var(--r-kaart);padding:4px;margin:4px 0 12px}.extrainvoer{position:relative}.extraplus{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--accent-tekst);display:grid;pointer-events:none}.extrainvoer input{border:0;background:transparent;min-height:46px;padding-left:42px}.extrarij{padding:4px}.voortgang{margin:4px 2px 8px}.voortgang p{display:flex;justify-content:space-between;align-items:baseline;font-weight:700;margin-bottom:6px}.voortgang progress{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:8px;border:0;border-radius:4px;overflow:hidden;background:var(--lijn)}.voortgang progress::-webkit-progress-bar{background:var(--lijn)}.voortgang progress::-webkit-progress-value{background:var(--accent);border-radius:4px}.voortgang progress::-moz-progress-bar{background:var(--accent);border-radius:4px}.blok{background:var(--kaart);border:1px solid var(--lijn);border-radius:var(--r-kaart);margin:12px 0;overflow:hidden}.blok>h2{padding:14px 16px 8px}.blok>.leeg{padding:0 12px 12px;margin:0}.regels li{display:flex;align-items:center;border-top:1px solid var(--lijn)}.regels label{flex:1;min-width:0;display:flex;align-items:center;gap:14px;min-height:58px;padding:8px 8px 8px 16px;cursor:pointer}.tekst{flex:1;display:flex;flex-direction:column;min-width:0}.naam{font-weight:500}.gerechten{font-size:.84rem;color:var(--dempt)}.hoeveelheid{color:var(--dempt);white-space:nowrap;font-variant-numeric:tabular-nums;font-size:.94rem}.regels li.klaar .naam,.regels li.klaar .hoeveelheid{text-decoration:line-through;color:var(--dempt)}.weekbalk{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:4px 0 12px}.weekkiezer{flex:1 1 13rem;min-width:0;font-weight:600}.weekbalk>button{flex:none}.dagen{background:var(--kaart);border:1px solid var(--lijn);border-radius:var(--r-kaart);overflow:hidden}.dagen li{display:flex;flex-wrap:wrap;align-items:center;gap:2px 6px;min-height:64px;padding:6px 4px 6px 16px}.dagen li+li{border-top:1px solid var(--lijn)}.dagen li.vandaag{background:var(--accent-licht);box-shadow:inset 4px 0 0 var(--accent)}.dag{display:flex;flex-direction:column;line-height:1.2;flex:none;min-width:3.1rem;white-space:nowrap}.dagnaam{font-weight:700}.datum{font-size:.78rem;color:var(--dempt)}.dagen select.gerecht{flex:1 1 9rem;width:auto;min-width:0;border-color:transparent;background-color:transparent;font-weight:500;min-height:48px;padding-left:8px}.dagen select.gerecht.leeg{color:var(--dempt);font-weight:400}.dagen button.icoon{flex:none;color:var(--accent-tekst)}.icoonplek{flex:none;width:44px}.receptlijst{margin-top:12px}.recepttitel{display:block;font-size:1.55rem;line-height:1.2;font-weight:700;margin:4px}.receptmeta{color:var(--dempt);margin:0 4px}.ingredienten li{display:flex;gap:12px;padding:12px 16px}.ingredienten .hoeveelheid{min-width:96px}.stappen{counter-reset:stap}.stappen li{counter-increment:stap;position:relative;padding:14px 16px 14px 56px}.stappen li:before{content:counter(stap);position:absolute;left:16px;top:14px;width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--accent-licht);color:var(--accent-tekst);font-size:.85rem;font-weight:700}.acties{margin:24px 0 8px}.acties button{flex:1}.receptformulier{padding-bottom:8px}.actiebalk{position:sticky;bottom:calc(var(--nav-hoogte) + env(safe-area-inset-bottom));z-index:4;display:grid;grid-template-columns:1fr 1.7fr;gap:10px;margin:20px -16px 0;padding:12px 16px;background:var(--kop);border-top:1px solid var(--lijn)}.formregels li{margin:10px 0;padding:12px;background:var(--kaart);border:1px solid var(--lijn);border-radius:var(--r-kaart)}.formregels .regel{display:grid;grid-template-columns:84px minmax(0,1fr) 44px;grid-template-areas:"naam naam weg" "aantal eenheid eenheid";gap:8px;align-items:center}.formregels .regel>:nth-child(1){grid-area:aantal}.formregels .regel>:nth-child(2){grid-area:eenheid}.formregels .regel>:nth-child(3){grid-area:naam}.formregels .regel>:nth-child(4){grid-area:weg}.regelstatus{margin:6px 2px 0;font-size:.84rem;color:var(--dempt);display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center}.keuzes{margin:6px 0 0;display:flex;flex-wrap:wrap;gap:8px}.keuzes .keuze{min-height:44px;padding:6px 14px;font-size:.9rem}.formstappen li{display:grid;grid-template-columns:minmax(0,1fr) 44px;gap:6px;margin:10px 0;align-items:start}.uitwerken{background:var(--kaart);border:1px solid var(--lijn);border-radius:var(--r-kaart);padding:0 16px;margin:0 0 12px}.uitwerken summary{display:flex;align-items:center;min-height:48px;cursor:pointer;font-weight:600}.uitwerken[open] summary{border-bottom:1px solid var(--lijn);margin-bottom:4px}.stappen-uitleg{display:grid;gap:10px;padding-left:20px;list-style:decimal}.stappen-uitleg li{padding-left:4px}fieldset.beheer{border:0;padding:0;margin:0;min-width:0}fieldset.beheer:disabled{opacity:.6}.zoekrij{display:grid;grid-template-columns:1fr;gap:8px;margin:0 0 4px}.zoekrij:has(>button){grid-template-columns:1fr auto}.account{margin-top:8px}.account button{width:100%}.zoekkeuze{position:relative}.keuzelijst{margin:6px 0 0;padding:4px;max-height:min(16rem,40vh);overflow-y:auto;background:var(--kaart);border:1px solid var(--veldrand);border-radius:var(--r-veld)}.keuzelijst li button{width:100%;text-align:left;background:none;color:var(--tekst);border-radius:8px;padding:10px 12px;font-weight:400}.keuzelijst li button[data-actief=true]{background:var(--accent-licht)}.keuzelijst li button.gekozen{font-weight:700;color:var(--accent-tekst)}.keuzelijst li.leeg{padding:10px 12px;margin:0}.categorielijst>li.categorie{display:flex;align-items:center}.categorielijst>li.categorie.wordt-gesleept{background:var(--accent-licht);opacity:.55}.categorielijst .handvat{flex:none;width:48px;min-width:48px;padding:0;background:none;color:var(--dempt);font-size:1.2rem;letter-spacing:-.15em;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;display:inline-grid;place-items:center;font-weight:400}.categorielijst .handvat:active{cursor:grabbing}.categorielijst .handvat.vast{cursor:default;touch-action:auto;display:inline-grid;place-items:center;min-height:52px}.categorielijst .catnaam{flex:1;min-width:0;padding-left:0}.categorielijst>li.dropregel{height:4px;min-height:0;padding:0;border:0;background:var(--accent)}.agenda .blok{margin-top:8px}.agendastappen li{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:12px 16px;border-top:1px solid var(--lijn)}.agendastappen .dag{display:block}.agendastappen .dagnaam{font-weight:600;text-transform:capitalize}.agendastappen .actie{color:var(--accent-tekst);font-size:.88rem;font-weight:600;text-align:right}.agendastappen .titel{grid-column:1 / -1;color:var(--dempt);font-size:.92rem}.agendastappen .rustig .actie{color:var(--dempt);font-weight:400}.agendastappen .mislukt .actie,.agendastappen .mislukt .titel{color:var(--gevaar)}.blok>.knoppen{padding:4px 16px 16px}.inloggen{max-width:360px;margin:0 auto;padding:calc(env(safe-area-inset-top) + 48px) 16px 16px;display:grid;gap:14px}.inloggen h1{color:var(--accent-tekst);font-size:1.7rem}.inloggen label{display:grid;gap:6px;font-size:.92rem;color:var(--dempt);font-weight:500}.inloggen .fout{margin:0}