@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--color-bg:#ebebeb;--color-surface:#fff;--color-surface-alt:#ebebeb;--color-border:#b8b8b8;--color-text:#0d0d0d;--color-text-muted:gray;--color-primary:#e12e2e;--color-primary-hover:#a92222;--color-primary-text:#fff;--color-danger:#701717;--color-danger-hover:#470f0f;--color-danger-text:#fff;--color-success:#1a7f4e;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--space-7:3rem;--space-8:4.5rem;--font-sans:"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-size-sm:.875rem;--font-size-base:1rem;--font-size-md:1.125rem;--font-size-lg:1.5rem;--font-size-xl:2rem;--font-size-2xl:3rem;--font-size-huge:clamp(4rem, 18vw, 9rem);--radius-sm:2px;--radius-md:3px;--radius-lg:3px;--shadow-sm:0 1px 2px #0d0d0d0f;--shadow-md:0 6px 24px #0d0d0d1f;--uitv-bg:#0a0c10;--uitv-surface:#14171d;--uitv-border:#2a2f38;--uitv-text:#f4f5f7;--uitv-text-muted:#a7aeb9;--uitv-accent:#e12e2e}*{box-sizing:border-box}html,body,#root{height:100%}body{font-family:var(--font-sans);font-size:var(--font-size-base);color:var(--color-text);background:var(--color-bg);margin:0}h1,h2,h3{margin:0;font-weight:600}button{font-family:inherit;font-size:var(--font-size-base);padding:var(--space-2) var(--space-4);border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);cursor:pointer;min-height:2.5rem}button:hover:not(:disabled){border-color:var(--color-primary)}button:disabled{opacity:.5;cursor:not-allowed}button.danger{border-color:var(--color-danger);color:var(--color-danger)}button.danger:hover:not(:disabled){background:var(--color-danger);color:var(--color-danger-text)}button[type=submit],.start-knop{background:var(--color-primary);border-color:var(--color-primary);color:var(--color-primary-text)}button[type=submit]:hover:not(:disabled),.start-knop:hover:not(:disabled){background:var(--color-primary-hover)}input[type=text],input[type=number],select,textarea{font-family:inherit;font-size:var(--font-size-base);padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text);min-height:2.5rem}input:focus-visible,select:focus-visible,textarea:focus-visible,button:focus-visible{outline:2px solid var(--color-primary);outline-offset:1px}ul{margin:0;padding:0;list-style:none}a{color:var(--color-primary)}.overview{max-width:960px;padding:var(--space-5) var(--space-4) var(--space-8);margin:0 auto}.overview-header{justify-content:space-between;align-items:center;gap:var(--space-4);margin-bottom:var(--space-6);flex-wrap:wrap;display:flex}.overview-header h1{font-size:var(--font-size-xl)}.nieuwe-map-form{gap:var(--space-2);display:flex}.instellingen-link{font-size:var(--font-size-sm);white-space:nowrap;text-decoration:none}.mappen-lijst{gap:var(--space-4);flex-direction:column;display:flex}.map-sectie-wrapper{background:var(--color-bg)}.map-sectie{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);overflow:hidden}.map-sectie-header{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);flex-wrap:wrap;display:flex}.map-toggle{min-height:auto;padding:var(--space-1);font-size:var(--font-size-sm);background:0 0;border:none}.map-naam{min-width:8rem;font-size:var(--font-size-md);cursor:pointer;flex:1}.map-naam-form{flex:1}.map-naam-form input{width:100%}.map-count{color:var(--color-text-muted);font-size:var(--font-size-sm);background:var(--color-surface-alt);padding:0 var(--space-2);border-radius:999px}.map-acties{gap:var(--space-2);flex-wrap:wrap;display:flex}.trainingen-lijst{border-top:1px solid var(--color-border)}.trainingen-leeg{padding:var(--space-3) var(--space-4);color:var(--color-text-muted);font-size:var(--font-size-sm)}.training-row{align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);border-top:1px solid var(--color-border);display:flex}.training-row:first-child{border-top:none}.training-info{cursor:pointer;gap:var(--space-1);flex-direction:column;flex:1;min-width:10rem;display:flex}.training-naam{font-weight:600}.training-meta{font-size:var(--font-size-sm);color:var(--color-text-muted)}.training-acties{gap:var(--space-2);flex-wrap:wrap;display:flex}.drag-handle{cursor:grab;color:var(--color-text-muted);touch-action:none;-webkit-user-select:none;user-select:none;padding:var(--space-1)}@media (width<=640px){.training-row{flex-wrap:wrap}.training-acties{width:100%}}.editor{max-width:960px;padding:var(--space-5) var(--space-4) var(--space-8);margin:0 auto}.editor-header{align-items:center;gap:var(--space-3);margin-bottom:var(--space-6);flex-wrap:wrap;display:flex}.editor-header a{font-size:var(--font-size-sm);text-decoration:none}.training-naam{font-size:var(--font-size-lg);padding:var(--space-1) var(--space-2);background:0 0;border:none;flex:1;min-width:12rem;font-weight:600}.training-naam:hover,.training-naam:focus{border:1px solid var(--color-border);background:var(--color-surface)}.rust-default{align-items:center;gap:var(--space-2);font-size:var(--font-size-sm);color:var(--color-text-muted);white-space:nowrap;display:flex}.rust-default input{width:4.5rem}.training-totaalduur{font-size:var(--font-size-sm);color:var(--color-text-muted);white-space:nowrap}.blokken-lijst{gap:var(--space-4);margin-bottom:var(--space-3);flex-direction:column;display:flex}.blok-item{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-4);gap:var(--space-3);flex-direction:column;display:flex}.blok-header{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.blok-naam{min-width:8rem;padding:var(--space-1) var(--space-2);background:0 0;border:none;flex:1;font-weight:600}.blok-naam:hover,.blok-naam:focus{border:1px solid var(--color-border);background:var(--color-surface-alt)}.blok-duur{color:var(--color-text-muted);font-size:var(--font-size-sm);white-space:nowrap}.subblokken-lijst{gap:var(--space-2);flex-direction:column;display:flex}.subblok-item{gap:var(--space-2);padding:var(--space-2);background:var(--color-surface-alt);border-radius:var(--radius-sm);flex-direction:column;display:flex}.subblok-rij{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.subblok-rij button.actief{border-color:var(--color-primary);color:var(--color-primary)}.subblok-naam{flex:2;min-width:8rem}.subblok-duur{width:4.5rem}.subblok-duur-label{color:var(--color-text-muted);font-size:var(--font-size-sm)}.subblok-notities{flex:3;min-width:10rem}.subblok-audio{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-2) var(--space-2) calc(var(--space-2) + 1.25rem);border-left:2px solid var(--color-border);flex-wrap:wrap;display:flex}.subblok-audio-speler{max-width:16rem;height:2.25rem}.subblok-audio-melding{font-size:var(--font-size-sm);color:var(--color-text-muted);margin:0}.subblok-audio-status{align-items:center;gap:var(--space-2);font-size:var(--font-size-sm);margin:0;display:flex}.subblok-audio-dot{background:var(--color-danger);border-radius:50%;width:.6rem;height:.6rem;animation:1s ease-in-out infinite subblok-audio-pulse}@keyframes subblok-audio-pulse{0%,to{opacity:1}50%{opacity:.3}}.afronding-audio-sectie{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-4);margin-bottom:var(--space-4);gap:var(--space-2);flex-direction:column;display:flex}.afronding-audio-uitleg{color:var(--color-text-muted);font-size:var(--font-size-sm);margin:0}.blok-herhalen{align-items:center;gap:var(--space-3);font-size:var(--font-size-sm);background:var(--color-surface-alt);border-radius:var(--radius-sm);padding:var(--space-3);flex-wrap:wrap;display:flex}.blok-herhalen label{align-items:center;gap:var(--space-2);white-space:nowrap;display:flex}.blok-herhalen input[type=number]{width:4.5rem}.blok-herhalen-melding{color:var(--color-danger);font-size:var(--font-size-sm);flex-basis:100%;margin:0}.rust-override{align-items:center;gap:var(--space-2);font-size:var(--font-size-sm);color:var(--color-text-muted);border-top:1px solid var(--color-border);padding-top:var(--space-3);flex-wrap:wrap;display:flex}.rust-override input{width:4.5rem}.uitvoering{background:var(--uitv-bg);min-height:100vh;color:var(--uitv-text);padding:var(--space-5);text-align:center;justify-content:center;align-items:center;gap:var(--space-5);flex-direction:column;display:flex}.uitvoering-met-bediening{height:100dvh;padding:var(--space-4) var(--space-4) 0;justify-content:flex-start;align-items:stretch;gap:var(--space-3);overflow:hidden}.uitvoering h1{color:var(--uitv-text)}.uitvoering button{background:var(--uitv-surface);border-color:var(--uitv-border);color:var(--uitv-text);font-size:var(--font-size-md);padding:var(--space-3) var(--space-6);min-height:3.5rem}.uitvoering button.danger{border-color:var(--color-danger);color:#ff8a80}.uitvoering button.danger:hover:not(:disabled){background:var(--color-danger);color:#fff}.uitvoering .start-knop{background:var(--uitv-accent);border-color:var(--uitv-accent);color:#fff;font-size:var(--font-size-lg);padding:var(--space-4) var(--space-7)}.uitvoering-start p,.uitvoering-geblokkeerd p{color:var(--uitv-text-muted);font-size:var(--font-size-md);max-width:32rem}.aanloop-label{font-size:var(--font-size-lg);color:var(--uitv-text-muted)}.aanloop-countdown{font-size:var(--font-size-huge);font-variant-numeric:tabular-nums;color:var(--uitv-accent);font-weight:700;line-height:1}.uitvoering-actief{gap:var(--space-3);flex-direction:column;width:100%;max-width:40rem;display:flex}.uitvoering-met-bediening .uitvoering-actief{flex:auto;min-height:0;margin:0 auto;overflow:hidden}.uitvoering-actief.is-breed{max-width:60rem}.uitvoering-grid{--naam-size:clamp(1.5rem, min(8vw, 5vh), 3rem);--countdown-size:clamp(2.5rem, min(18vw, 13vh), 7rem);--komend-size:clamp(1rem, min(4.5vw, 3vh), 1.5rem);gap:var(--space-3);flex:auto;grid-template-columns:minmax(0,1fr);min-height:0;display:grid}.uitvoering-grid.is-open{--naam-size:clamp(1rem, min(5vw, 3.4vh), 2rem);--countdown-size:clamp(1.75rem, min(13vw, 9vh), 5rem);--komend-size:clamp(.8rem, min(3vw, 2.2vh), 1.125rem);grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.grid-kolom{gap:var(--space-3);flex-direction:column;min-width:0;min-height:0;display:flex;overflow:hidden}.uitvoering-grid-kop{justify-content:flex-end;display:flex}.uitvoering .grid-toggle{font-size:var(--font-size-sm);min-height:2.25rem;padding:var(--space-1) var(--space-3)}.uitvoering-voortgang-groep{gap:var(--space-2);background:var(--uitv-surface);border:1px solid var(--uitv-border);border-radius:var(--radius-md);width:100%;padding:clamp(var(--space-2), 1.5vh, var(--space-4));flex-direction:column;flex:none;display:flex}.voortgang-rij{gap:var(--space-1);flex-direction:column;display:flex}.voortgang-label{font-size:var(--font-size-sm);color:var(--uitv-text-muted);text-align:left}.voortgangsbalk{background:var(--uitv-bg);border:1px solid var(--uitv-border);border-radius:999px;width:100%;height:.75rem;overflow:hidden}.voortgangsbalk-klein{height:.4rem}.voortgangsbalk-subblok{height:.5rem;margin-top:var(--space-2)}.voortgangsbalk-vulling{background:var(--uitv-accent);height:100%;transition:width .2s linear}.blok-huidig,.blok-komend{align-items:center;gap:var(--space-2);background:var(--uitv-surface);border-radius:var(--radius-md);width:100%;min-height:0;padding:clamp(var(--space-2), 2vh, var(--space-5)) var(--space-4);flex-direction:column;display:flex}.blok-huidig{border:2px solid var(--uitv-text);flex:auto;justify-content:center;overflow:hidden}.blok-komend{border:2px solid var(--uitv-accent);padding:clamp(var(--space-1), 1.2vh, var(--space-3)) var(--space-4);flex:none}.blok-label{font-size:var(--font-size-sm);text-transform:uppercase;letter-spacing:.08em;color:var(--uitv-text-muted);font-weight:600}.blok-komend .blok-label{color:var(--uitv-accent)}.huidig-naam{width:100%;font-size:var(--naam-size,var(--font-size-2xl));overflow-wrap:break-word;line-height:1.1}.huidig-countdown{font-size:var(--countdown-size,var(--font-size-huge));font-variant-numeric:tabular-nums;letter-spacing:.02em;font-weight:700;line-height:1}.huidig-notities{width:100%;font-size:clamp(.8rem, min(3.5vw, 2.2vh), var(--font-size-md));color:var(--uitv-text-muted);overflow-wrap:break-word;max-width:34rem}.komend-naam{width:100%;font-size:var(--komend-size,var(--font-size-lg));overflow-wrap:break-word;font-weight:600;line-height:1.2}.grid-kolom-blok{min-height:0}.blokoverzicht{gap:var(--space-2);background:var(--uitv-surface);border:1px solid var(--uitv-border);border-radius:var(--radius-md);min-height:0;padding:clamp(var(--space-2), 1.5vh, var(--space-4)) var(--space-3);text-align:left;flex-direction:column;display:flex;overflow:hidden}.blokoverzicht-titel{font-size:clamp(.8rem, min(3.4vw, 2.2vh), var(--font-size-md));overflow-wrap:break-word;line-height:1.2}.blokoverzicht-lijst{gap:var(--space-1);flex-direction:column;min-height:0;display:flex}.blokoverzicht-meer{font-size:clamp(.65rem, min(2.6vw, 1.6vh), var(--font-size-sm));color:var(--uitv-text-muted);margin:0}.blokoverzicht-item{align-items:baseline;gap:var(--space-2);font-size:clamp(.7rem, min(3vw, 1.9vh), var(--font-size-base));padding:clamp(.1rem, .6vh, var(--space-2)) var(--space-2);border-radius:var(--radius-sm);border-left:3px solid #0000;line-height:1.25;display:flex}.blokoverzicht-item .item-naam{text-overflow:ellipsis;white-space:nowrap;flex:auto;min-width:0;overflow:hidden}.blokoverzicht-item .item-duur{font-variant-numeric:tabular-nums;color:var(--uitv-text-muted);flex:none}.blokoverzicht-item .item-marker{text-align:center;flex:none;width:1em}.blokoverzicht-item.is-voorbij{color:var(--uitv-text-muted);opacity:.65;text-decoration:line-through;-webkit-text-decoration-color:var(--uitv-border);text-decoration-color:var(--uitv-border)}.blokoverzicht-item.is-bezig{color:var(--uitv-text);border-left-color:var(--uitv-text);background:#ffffff1a;font-weight:700}.blokoverzicht-item.is-bezig .item-duur{color:var(--uitv-text)}.blokoverzicht-item.is-komend{color:var(--uitv-text);border-left-color:var(--uitv-border)}.overlay-achtergrond{z-index:10;padding:var(--space-3);background:#0a0c10d9;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.overlay-paneel{gap:var(--space-2);background:var(--uitv-bg);border:1px solid var(--uitv-border);border-radius:var(--radius-md);width:100%;max-width:44rem;min-height:0;max-height:100%;padding:var(--space-4);text-align:left;flex-direction:column;display:flex}.overlay-kop{justify-content:space-between;align-items:center;gap:var(--space-3);display:flex}.overlay-titel{font-size:var(--font-size-md);overflow-wrap:break-word;line-height:1.2}.uitvoering .overlay-sluiten{font-size:var(--font-size-sm);min-height:2.5rem;padding:var(--space-1) var(--space-3);flex:none}.overlay-uitleg{font-size:var(--font-size-sm);color:var(--uitv-text-muted);margin:0}.overlay-inhoud{gap:var(--space-3);min-height:0;padding-right:var(--space-1);flex-direction:column;flex:auto;display:flex;overflow-y:auto}.overzicht-blok{border:1px solid var(--uitv-border);border-left:3px solid var(--uitv-border);border-radius:var(--radius-md);background:var(--uitv-surface);padding:var(--space-2) var(--space-3)}.overzicht-blok.is-bezig{border-left-color:var(--uitv-text)}.overzicht-blok.is-voorbij{opacity:.7}.overzicht-blok.is-komend{border-left-color:var(--uitv-accent)}.overzicht-blok-kop{justify-content:space-between;align-items:baseline;gap:var(--space-3);font-size:var(--font-size-base);padding-bottom:var(--space-1);display:flex}.overzicht-blok-duur{font-size:var(--font-size-sm);font-variant-numeric:tabular-nums;color:var(--uitv-text-muted)}.overzicht-lijst{flex-direction:column;gap:2px;display:flex}.uitvoering .overzicht-item{align-items:baseline;gap:var(--space-2);width:100%;min-height:2.5rem;padding:var(--space-1) var(--space-2);font-size:var(--font-size-base);text-align:left;border-radius:var(--radius-sm);background:0 0;border:1px solid #0000;display:flex}.uitvoering .overzicht-item:hover:not(:disabled){border-color:var(--uitv-accent)}.overzicht-item .item-naam{overflow-wrap:break-word;flex:auto;min-width:0}.overzicht-item .item-duur{font-variant-numeric:tabular-nums;color:var(--uitv-text-muted);flex:none}.overzicht-item .item-marker{text-align:center;flex:none;width:1em}.uitvoering .overzicht-item.is-voorbij{color:var(--uitv-text-muted)}.uitvoering .overzicht-item.is-bezig{color:var(--uitv-text);border-color:var(--uitv-text);background:#ffffff1f;font-weight:700}.bevestiging{z-index:20;padding:var(--space-4);background:#0a0c10e6;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.bevestiging-paneel{gap:var(--space-3);background:var(--uitv-surface);border:2px solid var(--color-danger);border-radius:var(--radius-md);width:100%;max-width:30rem;max-height:100%;padding:var(--space-4);text-align:left;flex-direction:column;display:flex;overflow-y:auto}.bevestiging-titel{font-size:var(--font-size-md);overflow-wrap:break-word;line-height:1.2}.bevestiging-tekst{font-size:var(--font-size-base);color:var(--uitv-text);margin:0}.bevestiging-knoppen{gap:var(--space-3);flex-wrap:wrap;display:flex}.uitvoering .bevestiging-knoppen button{font-size:var(--font-size-base);min-height:3rem;padding:var(--space-2) var(--space-3);flex:10rem}.visueel-verborgen{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.uitvoering-bediening{margin:0 calc(-1 * var(--space-4));gap:var(--space-2);padding:var(--space-3) var(--space-4);background:var(--uitv-surface);border-top:1px solid var(--uitv-border);flex-wrap:wrap;flex:none;justify-content:center;display:flex}.uitvoering .bediening-knop{max-width:14rem;font-weight:600;font-size:var(--font-size-base);min-height:3rem;padding:var(--space-2) var(--space-3);flex:6rem}.skip-knop{border-color:var(--uitv-accent);color:var(--uitv-accent)}.skip-knop:hover:not(:disabled){background:var(--uitv-accent);color:#fff}.instellingen{max-width:640px;padding:var(--space-5) var(--space-4) var(--space-8);margin:0 auto}.instellingen-header{align-items:flex-start;gap:var(--space-2);margin-bottom:var(--space-6);flex-direction:column;display:flex}.instellingen-header a{font-size:var(--font-size-sm);text-decoration:none}.instellingen-sectie{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);padding:var(--space-5);gap:var(--space-4);flex-direction:column;display:flex}.instellingen-sectie h2{font-size:var(--font-size-md)}.instellingen-sectie h3{font-size:var(--font-size-base)}.instellingen-uitleg{color:var(--color-text-muted);font-size:var(--font-size-sm);margin:0}.instellingen-toggles,.momenten-lijst{gap:var(--space-2);flex-direction:column;display:flex}.momenten-blok{border-top:1px solid var(--color-border);padding-top:var(--space-4);gap:var(--space-2);flex-direction:column;display:flex}.toggle-rij{justify-content:space-between;align-items:center;gap:var(--space-3);padding:var(--space-2) var(--space-3);background:var(--color-surface-alt);border-radius:var(--radius-sm);cursor:pointer;display:flex}.toggle-rij-vast{cursor:default;color:var(--color-text-muted)}.toggle-rij input[type=checkbox]{width:2.5rem;height:1.5rem;min-height:0;accent-color:var(--color-primary);cursor:pointer}.toggle-rij-vast input[type=checkbox]{cursor:default}.moment-rij{align-items:stretch;gap:var(--space-2);flex-wrap:wrap;display:flex}.moment-rij .toggle-rij{flex:1;min-width:12rem}.geluid-select{min-width:11rem}.test-meldingen{border-top:1px solid var(--color-border);padding-top:var(--space-4);gap:var(--space-2);flex-direction:column;display:flex}.test-meldingen-header{justify-content:space-between;align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.test-meldingen-header h3{font-size:var(--font-size-base)}.test-wakelock-live{font-size:var(--font-size-sm);color:var(--color-text-muted);margin:0}.test-resultaat{gap:var(--space-1);font-size:var(--font-size-sm);flex-direction:column;display:flex}.test-resultaat li{padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);background:var(--color-surface-alt)}.test-resultaat .resultaat-ok{color:var(--color-success)}.test-resultaat .resultaat-fout{color:var(--color-danger)}.test-resultaat .resultaat-neutraal{color:var(--color-text-muted)}
