:root{--brand:#1c2143;--brand-donker:#111430;--brand-licht:#e9ebf5;--brand-rand:#c3c8e0;--inkt:#1b1e33;--grijs:#5d6178;--wit:#fff;--schaduw:0 2px 10px #1c214314}*{box-sizing:border-box}body{color:var(--inkt);background:linear-gradient(180deg, var(--brand-licht) 0%, #f7f8fb 40%);min-height:100vh;margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}.app{max-width:640px;margin:0 auto;padding:24px 16px 64px}.app-header{justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px;display:flex}.app-header h1{color:var(--brand-donker);margin:0;font-size:1.7rem}.tagline{color:var(--grijs);margin:2px 0 0;font-size:.9rem}.company-badge{background:var(--brand);color:var(--wit);white-space:nowrap;border-radius:999px;padding:6px 14px;font-weight:600}.demo-noot{background:#fff4d6;border:1px solid #eed28a;border-radius:8px;padding:8px 12px;font-size:.9rem}.card{background:var(--wit);border:1px solid var(--brand-rand);box-shadow:var(--schaduw);border-radius:14px;margin-bottom:16px;padding:20px}.card h2{color:var(--brand-donker);margin:0 0 12px;font-size:1.1rem}.timer-card{text-align:center}.timer-fase{color:var(--grijs);margin:0}.timer-tijd{font-variant-numeric:tabular-nums;color:var(--brand-donker);margin:8px 0;font-size:3.2rem;font-weight:700}.timer-card--sta .timer-tijd{font-size:2.4rem}.timer-tijd--gepauzeerd{opacity:.45}.timer-knoppen{justify-content:center;align-items:center;gap:10px;display:flex}.timer-hint{color:var(--grijs);margin:10px 0 0;font-size:.85rem}.btn-pauzeer{background:var(--wit);color:var(--brand-donker);border:1px solid var(--brand-rand);cursor:pointer;border-radius:999px;padding:8px 20px;font-size:.95rem;font-weight:600}.btn-pauzeer:hover{background:var(--brand-licht)}.btn-primair{background:var(--brand);color:var(--wit);cursor:pointer;border:none;border-radius:999px;margin-top:10px;padding:12px 40px;font-size:1.1rem;font-weight:700}.btn-primair:hover{background:var(--brand-donker)}.btn-primair--licht{background:var(--wit);color:var(--brand-donker)}.btn-primair--licht:hover{background:var(--brand-licht)}.btn-secundair{color:var(--wit);cursor:pointer;background:#ffffff2e;border:1px solid #ffffff8c;border-radius:999px;margin-top:4px;padding:8px 20px;font-size:.95rem}.btn-secundair:hover{background:#ffffff4d}.btn-tekst{color:var(--grijs);cursor:pointer;background:0 0;border:none;padding:8px;font-size:.95rem;text-decoration:underline}.btn-tekst--licht{color:#ffffffd9}.instelling{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding:8px 0;display:flex}.instelling-label{font-weight:600}.preset-rij{flex-wrap:wrap;gap:8px;display:flex}.preset-knop{background:var(--wit);border:1px solid var(--brand-rand);cursor:pointer;border-radius:999px;padding:6px 14px;font-size:.9rem}.preset-knop--actief{background:var(--brand);border-color:var(--brand);color:var(--wit);font-weight:700}.preset-eigen{background:var(--wit);border:1px solid var(--brand-rand);border-radius:999px;align-items:center;gap:4px;padding:5px 12px 5px 6px;font-size:.9rem;display:inline-flex}.preset-eigen input{width:3.2em;font:inherit;color:inherit;text-align:right;background:0 0;border:none;padding:1px 2px}.preset-eigen input:focus{outline:none}.preset-eigen:focus-within{border-color:var(--brand);box-shadow:0 0 0 2px var(--brand-licht)}.preset-eigen--actief{background:var(--brand);border-color:var(--brand);color:var(--wit);font-weight:700}.breaktype-rij{gap:8px;width:100%;display:flex}.breaktype-kaart{background:var(--wit);border:1px solid var(--brand-rand);cursor:pointer;border-radius:12px;flex-direction:column;flex:1;align-items:center;gap:6px;padding:12px 8px;font-size:.85rem;line-height:1.25;display:flex}.breaktype-kaart--actief{background:var(--brand-licht);border-color:var(--brand);font-weight:700}.breaktype-icoon{font-size:1.6rem}.toggle{border:1px solid var(--brand-rand);background:var(--wit);color:var(--grijs);cursor:pointer;border-radius:999px;padding:6px 18px;font-size:.9rem}.toggle--aan{background:var(--brand);border-color:var(--brand);color:var(--wit);font-weight:700}.instelling-hint{color:var(--grijs);margin:10px 0 0;font-size:.85rem}.stats-regel{margin:0;font-size:1.05rem}.stats-sub{color:var(--grijs);font-size:.9rem}.stats-team{color:var(--brand-donker);margin:8px 0 0;font-weight:600}.stats-card--uit p{color:var(--grijs);margin:0;font-size:.9rem}.sta-banner{z-index:50;background:var(--wit);border:2px solid var(--brand);box-shadow:var(--schaduw);color:var(--brand-donker);cursor:pointer;border-radius:12px;max-width:min(90vw,480px);padding:12px 20px;font-size:1rem;font-weight:600;position:fixed;top:16px;left:50%;transform:translate(-50%)}.overlay{z-index:100;background:linear-gradient(160deg, var(--brand) 0%, var(--brand-donker) 100%);color:var(--wit);text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:24px;display:flex;position:fixed;inset:0}.overlay h2{margin:0;font-size:1.8rem}.overlay-timer{font-variant-numeric:tabular-nums;opacity:.9;margin:0;font-size:2.2rem;font-weight:700}.overlay-instructie{max-width:420px;margin:0;font-size:1.15rem;line-height:1.5}.volume-rij{align-items:center;gap:10px;min-width:200px;display:flex}.volume-rij input[type=range]{accent-color:var(--brand);flex:1}.volume-waarde{font-variant-numeric:tabular-nums;color:var(--grijs);text-align:right;min-width:3.2em;font-size:.9rem}.overlay-mindful{background:#ffffff1f;border:1px solid #ffffff59;border-radius:12px;max-width:420px;margin-top:6px;padding:12px 18px}.overlay-mindful-label{text-transform:uppercase;letter-spacing:.06em;opacity:.85;margin-bottom:4px;font-size:.8rem;font-weight:700;display:block}.overlay-mindful-tekst{margin:0;font-size:1.05rem;line-height:1.5}.overlay-sta-banner{background:#ffffff29;border:1px solid #ffffff80;border-radius:10px;max-width:min(90vw,480px);margin:0;padding:8px 16px;font-size:.95rem;position:absolute;top:20px;left:50%;transform:translate(-50%)}.regio-badge{text-transform:capitalize;letter-spacing:.03em;background:#fff3;border-radius:999px;padding:3px 14px;font-size:.85rem}.overlay-acties{flex-direction:column;align-items:center;gap:4px;margin-top:18px;display:flex}.figure{stroke:currentColor;stroke-width:7px;stroke-linecap:round;fill:none;width:150px;height:auto;color:var(--brand-donker);overflow:visible}.overlay .figure{color:var(--wit)}.figure circle{fill:currentColor;stroke:none}.figure-media{border-radius:12px;max-width:220px}.fig--nek-kantel .fig-hoofd{transform-origin:60px 38px;animation:4s ease-in-out infinite fig-nek-kantel}@keyframes fig-nek-kantel{0%,to{transform:rotate(0)}25%{transform:rotate(-22deg)}75%{transform:rotate(22deg)}}.fig--kin-intrek .fig-hoofd{animation:2.6s ease-in-out infinite fig-kin-intrek}@keyframes fig-kin-intrek{0%,to{transform:translate(0)}35%,65%{transform:translate(-7px)}}.fig--schouder-rol .fig-arm-l,.fig--schouder-rol .fig-arm-r{transform-origin:60px 48px;animation:2.4s ease-in-out infinite fig-schouder-rol}.fig--schouder-rol .fig-arm-r{animation-delay:-1.2s}@keyframes fig-schouder-rol{0%,to{transform:rotate(0)translateY(0)}25%{transform:rotate(-14deg)translateY(-4px)}50%{transform:rotate(0)translateY(-7px)}75%{transform:rotate(14deg)translateY(-3px)}}.fig--schouder-haal .fig-arm-l,.fig--schouder-haal .fig-arm-r{animation:2.2s ease-in-out infinite fig-schouder-haal}.fig--schouder-haal .fig-hoofd{animation:2.2s ease-in-out infinite fig-schouder-haal-hoofd}@keyframes fig-schouder-haal{0%,to{transform:translateY(0)}35%,60%{transform:translateY(-8px)}}@keyframes fig-schouder-haal-hoofd{0%,to{transform:translateY(0)}35%,60%{transform:translateY(2px)}}.fig--rug-strek .fig-boven{transform-origin:60px 90px;animation:3.6s ease-in-out infinite fig-rug-strek}@keyframes fig-rug-strek{0%,to{transform:rotate(0)}40%,60%{transform:rotate(-16deg)}}.fig--romp-rotatie .fig-boven{transform-origin:60px 90px;animation:4s ease-in-out infinite fig-romp-rotatie}@keyframes fig-romp-rotatie{0%,50%,to{transform:scaleX(1)}25%{transform:scaleX(.55)rotate(4deg)}75%{transform:scaleX(.55)rotate(-4deg)}}.fig--heup-cirkel .fig-boven{transform-origin:60px 90px;animation:3.2s linear infinite fig-heup-cirkel}@keyframes fig-heup-cirkel{0%,to{transform:translateY(-3px)}25%{transform:translate(5px)}50%{transform:translateY(3px)}75%{transform:translate(-5px)}}.fig--heupflexor .fig-been-l{transform-origin:60px 90px;transform:rotate(26deg)}.fig--heupflexor .fig-been-r{transform-origin:60px 90px;transform:rotate(-22deg)}.fig--heupflexor .fig-lichaam{animation:2.8s ease-in-out infinite fig-heupflexor}@keyframes fig-heupflexor{0%,to{transform:translateY(0)}45%,65%{transform:translateY(6px)}}.fig--kniebuiging .fig-boven{animation:2.8s ease-in-out infinite fig-kniebuiging-boven}.fig--kniebuiging .fig-been-l{transform-origin:60px 90px;animation:2.8s ease-in-out infinite fig-kniebuiging-been-l}.fig--kniebuiging .fig-been-r{transform-origin:60px 90px;animation:2.8s ease-in-out infinite fig-kniebuiging-been-r}@keyframes fig-kniebuiging-boven{0%,to{transform:translateY(0)}40%,60%{transform:translateY(14px)}}@keyframes fig-kniebuiging-been-l{0%,to{transform:rotate(0)}40%,60%{transform:rotate(-22deg)}}@keyframes fig-kniebuiging-been-r{0%,to{transform:rotate(0)}40%,60%{transform:rotate(22deg)}}.fig--kuithef .fig-lichaam{animation:1.8s ease-in-out infinite fig-kuithef}@keyframes fig-kuithef{0%,to{transform:translateY(0)}40%,60%{transform:translateY(-9px)}}.fig--nek-rek .fig-hoofd{transform-origin:60px 38px;animation:5.2s ease-in-out infinite fig-nek-rek}@keyframes fig-nek-rek{0%,50%,to{transform:rotate(0)}15%,40%{transform:rotate(-26deg)}65%,90%{transform:rotate(26deg)}}.fig--arm-cirkel .fig-arm-l,.fig--arm-cirkel .fig-arm-r{transform-origin:60px 48px;animation:2.2s linear infinite fig-arm-cirkel}.fig--arm-cirkel .fig-arm-r{animation-delay:-1.1s}@keyframes fig-arm-cirkel{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.fig--zij-buig .fig-boven{transform-origin:60px 90px;animation:4.4s ease-in-out infinite fig-zij-buig}.fig--zij-buig .fig-arm-r{transform-origin:60px 48px;transform:rotate(160deg)}@keyframes fig-zij-buig{0%,50%,to{transform:rotate(0)}15%,35%{transform:rotate(18deg)}65%,85%{transform:rotate(-18deg)}}.fig--been-zwaai .fig-been-r{transform-origin:60px 90px;animation:1.7s ease-in-out infinite fig-been-zwaai}.fig--been-zwaai .fig-arm-l{transform-origin:60px 48px;transform:rotate(-18deg)}@keyframes fig-been-zwaai{0%,to{transform:rotate(28deg)}50%{transform:rotate(-32deg)}}.fig--uitvalspas .fig-boven{animation:3s ease-in-out infinite fig-uitvalspas-boven}.fig--uitvalspas .fig-been-l{transform-origin:60px 90px;animation:3s ease-in-out infinite fig-uitvalspas-been-l}.fig--uitvalspas .fig-been-r{transform-origin:60px 90px;animation:3s ease-in-out infinite fig-uitvalspas-been-r}@keyframes fig-uitvalspas-boven{0%,to{transform:translateY(0)}40%,60%{transform:translateY(12px)}}@keyframes fig-uitvalspas-been-l{0%,to{transform:rotate(0)}40%,60%{transform:rotate(32deg)}}@keyframes fig-uitvalspas-been-r{0%,to{transform:rotate(0)}40%,60%{transform:rotate(-24deg)}}.fig--wandel .fig-been-l{transform-origin:60px 90px;animation:1.4s ease-in-out infinite fig-wandel-swing}.fig--wandel .fig-been-r{transform-origin:60px 90px;animation:1.4s ease-in-out -.7s infinite fig-wandel-swing}.fig--wandel .fig-arm-l{transform-origin:60px 48px;animation:1.4s ease-in-out -.7s infinite fig-wandel-swing}.fig--wandel .fig-arm-r{transform-origin:60px 48px;animation:1.4s ease-in-out infinite fig-wandel-swing}@keyframes fig-wandel-swing{0%,to{transform:rotate(20deg)}50%{transform:rotate(-20deg)}}.fig--bureau .fig-arm-l{transform-origin:60px 48px;animation:4s ease-in-out infinite fig-bureau-strek-l}.fig--bureau .fig-arm-r{transform-origin:60px 48px;animation:4s ease-in-out infinite fig-bureau-strek-r}@keyframes fig-bureau-strek-l{0%,to{transform:rotate(0)}40%,65%{transform:rotate(-140deg)}}@keyframes fig-bureau-strek-r{0%,to{transform:rotate(0)}40%,65%{transform:rotate(140deg)}}@media (prefers-reduced-motion:reduce){.figure *{animation:none!important}}@media (width<=480px){.app-header{flex-direction:column;align-items:flex-start;gap:8px}.breaktype-rij{flex-direction:column}.breaktype-kaart{flex-direction:row;justify-content:flex-start}}