/* Startklaar: echte voorbereiding, één vervolgstap en bereikbare bediening. */
html[data-paginasleutel="klaar"] .klaar-meter .wrap { max-width:1100px; }
html[data-paginasleutel="klaar"] .klaar-meter progress.klaar-voortgang { display:block; width:100%; height:8px; margin:0 0 20px; border:0; border-radius:999px; overflow:hidden; appearance:none; accent-color:var(--raam-aan); background:rgba(238,243,244,.16); }
html[data-paginasleutel="klaar"] .klaar-voortgang::-webkit-progress-bar { background:rgba(238,243,244,.16); }
html[data-paginasleutel="klaar"] .klaar-voortgang::-webkit-progress-value { background:var(--raam-aan); border-radius:999px; }
html[data-paginasleutel="klaar"] .klaar-voortgang::-moz-progress-bar { background:var(--raam-aan); border-radius:999px; }
html[data-paginasleutel="klaar"] .klaar-meter .st-tegels { max-width:none; gap:8px; }
html[data-paginasleutel="klaar"] .klaar-meter .st-tegel { min-height:64px; padding:10px 8px; font-size:14px; }
html[data-paginasleutel="klaar"] .klaar-meter .st-tegel b { white-space:normal; overflow:visible; hyphens:auto; overflow-wrap:anywhere; }
html[data-paginasleutel="klaar"] .klaar-meter .st-tegel.is-klaar { color:var(--kalk-2); background:rgba(238,243,244,.07); border-color:rgba(238,243,244,.2); }
html[data-paginasleutel="klaar"] .klaar-meter .st-tegel.is-klaar i { color:var(--raam-aan); background:transparent; border-color:var(--raam-aan); }
html[data-paginasleutel="klaar"] .klaar-meter .st-zin { font-size:18px; margin:20px 0; }
html[data-paginasleutel="klaar"] .klaar-vervolg { padding:22px; margin:20px 0; border:1px solid rgba(217,166,91,.38); border-left:3px solid var(--messing); border-radius:var(--radius); background:rgba(217,166,91,.09); }
html[data-paginasleutel="klaar"] .klaar-vervolg p { max-width:64ch; margin:0 0 18px; font-size:18px; line-height:1.6; }
html[data-paginasleutel="klaar"] .klaar-vervolg .mk-label { font-size:14px; }
html[data-paginasleutel="klaar"] .klaar-vervolg .btn { min-height:48px; font-size:16px; }
html[data-paginasleutel="klaar"] .klaar-vervolg.is-klaar h2 { font-size:28px; margin:0 0 12px; }
html[data-paginasleutel="klaar"] .klaar-vervolg.is-klaar p { margin:0; color:var(--kalk-2); }
html[data-paginasleutel="klaar"] .klaar-meter .st-regel { font-size:14px; line-height:1.6; }
html[data-paginasleutel="klaar"] #klaar-bewaar-status { display:flex; flex-wrap:wrap; align-items:center; gap:10px; color:var(--kalk-2); font-size:14px; min-height:24px; }
html[data-paginasleutel="klaar"] #klaar-bewaar-status:empty { display:none; }
html[data-paginasleutel="klaar"] .klaar-opnieuw { min-height:44px; padding:7px 12px; background:transparent; border:1px solid rgba(238,243,244,.3); border-radius:8px; color:var(--kalk-tekst); font:inherit; cursor:pointer; }
html[data-paginasleutel="klaar"] .panelen-tabs { gap:10px; padding-block:20px 16px; flex-wrap:wrap; overflow:visible; }
html[data-paginasleutel="klaar"] .panelen-tabs a { min-height:48px; display:inline-flex; align-items:center; padding:10px 16px; font-size:16px; border:1px solid var(--lijn); }
html[data-paginasleutel="klaar"] .panelen { display:grid; grid-template-columns:minmax(0,1fr); gap:20px; overflow:visible; scroll-snap-type:none; }
html[data-paginasleutel="klaar"] .panelen > .paneel { min-width:0; padding:24px; scroll-margin-top:90px; }
html[data-paginasleutel="klaar"] .panelen .paneel-naam { font-size:18px; letter-spacing:0; text-transform:none; margin-bottom:16px; }
html[data-paginasleutel="klaar"] .klaar-extra-kop { margin:24px 0 8px; font-size:16px; color:var(--ink-3); }
html[data-paginasleutel="klaar"] .klaar-rij > summary { grid-template-columns:44px minmax(0,1fr) auto 13px; gap:8px 12px; min-height:60px; padding:8px 0; font-size:16px; }
html[data-paginasleutel="klaar"] .klaar-rij > summary > input[type=checkbox] { position:relative; width:44px; height:44px; border:0; border-radius:8px; background:transparent; }
html[data-paginasleutel="klaar"] .klaar-rij > summary > input[type=checkbox]::before { content:""; position:absolute; inset:11px; border:1.6px solid var(--lijn-sterk); border-radius:6px; background:var(--wit); }
html[data-paginasleutel="klaar"] .klaar-rij > summary > input[type=checkbox]:checked { background:transparent; border:0; }
html[data-paginasleutel="klaar"] .klaar-rij > summary > input[type=checkbox]:checked::before { background:var(--messing); border-color:var(--messing); }
html[data-paginasleutel="klaar"] .klaar-rij > summary > input[type=checkbox]:checked::after { position:absolute; width:11px; height:6px; top:18px; left:16px; border-color:var(--nacht); }
html[data-paginasleutel="klaar"] .klaar-rij.is-af > summary { color:var(--ink-3); }
html[data-paginasleutel="klaar"] .klaar-rij .klaar-min { font-size:14px;line-height:1.3; }
html[data-paginasleutel="klaar"] .klaar-rij:not(.is-af) .klaar-min:not(.klaar-min-geen):not(.klaar-min-uren) { color:var(--ink-2);background:var(--kalk-diep); }
html[data-paginasleutel="klaar"] .klaar-rij.is-af .klaar-rij-naam { font-weight:500; }
html[data-paginasleutel="klaar"] .klaar-rij.is-af .klaar-min { background:transparent; color:var(--ink-3); font-weight:500; }
html[data-paginasleutel="klaar"] .klaar-rij.is-nu:not(.is-af) > summary { border-radius:10px; background:var(--kalk-diep); }
html[data-paginasleutel="klaar"] .klaar-rij-uitleg > p { font-size:16px; line-height:1.6; }
html[data-paginasleutel="klaar"] .panelen .brief-blad { padding:20px; }
html[data-paginasleutel="klaar"] .panelen .brief-tekst { font-size:16px; line-height:1.65; }
html[data-paginasleutel="klaar"] .panelen .beloning { margin-top:24px; border-radius:var(--radius); }
html[data-paginasleutel="klaar"] .panelen .beloning h3 { font-size:24px; }
html[data-paginasleutel="klaar"] .panelen .beloning-knoppen { display:flex; flex-wrap:wrap; gap:10px; }
@media(max-width:600px) {
  html[data-paginasleutel="klaar"] .klaar-meter .st-tegels { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
  html[data-paginasleutel="klaar"] .klaar-meter .st-tegel { font-size:14px; }
  html[data-paginasleutel="klaar"] .klaar-vervolg { padding:18px; }
  html[data-paginasleutel="klaar"] .klaar-vervolg .btn { width:100%; }
  html[data-paginasleutel="klaar"] .panelen > .paneel { padding:20px 16px; }
  html[data-paginasleutel="klaar"] .klaar-rij > summary { grid-template-columns:44px minmax(0,1fr) 13px; }
  html[data-paginasleutel="klaar"] .klaar-rij > summary .klaar-min { grid-column:2; grid-row:2; justify-self:start; }
  html[data-paginasleutel="klaar"] .klaar-rij > summary::after { grid-column:3; grid-row:1; }
  html[data-paginasleutel="klaar"] .klaar-rij-uitleg { padding-left:0; }
}
@media(min-width:1024px) {
  html[data-paginasleutel="klaar"] .panelen { grid-template-columns:repeat(2,minmax(0,1fr)); }
  html[data-paginasleutel="klaar"] .panelen > #vinkjes { grid-row:1 / span 2; }
  html[data-paginasleutel="klaar"] .panelen.ac-kaarten-gemeten { grid-auto-rows:1px; column-gap:20px; row-gap:0; }
}
@media(prefers-reduced-motion:no-preference) {
  html[data-paginasleutel="klaar"] .klaar-vervolg .btn:active, html[data-paginasleutel="klaar"] .klaar-opnieuw:active { transform:scale(.97); transition:transform 80ms ease; }
}
@media(prefers-reduced-motion:reduce) {
  html[data-paginasleutel="klaar"] .klaar-meter *, html[data-paginasleutel="klaar"] .panelen *, html[data-paginasleutel="klaar"] .panelen-tabs * { animation:none!important; transition:none!important; scroll-behavior:auto; }
}