:root{--groen:#2e7d46;--groen-donker:#1d5631;--groen-licht:#e7f4ec;--groen-rand:#bfe0cc;--inkt:#1c2a21;--grijs:#5c6b62;--wit:#fff;--schaduw:0 2px 10px #1d563114}*{box-sizing:border-box}body{color:var(--inkt);background:linear-gradient(180deg, var(--groen-licht) 0%, #f6faf7 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(--groen-donker);margin:0;font-size:1.7rem}.tagline{color:var(--grijs);margin:2px 0 0;font-size:.9rem}.company-badge{background:var(--groen);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(--groen-rand);box-shadow:var(--schaduw);border-radius:14px;margin-bottom:16px;padding:20px}.card h2{color:var(--groen-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(--groen-donker);margin:8px 0;font-size:3.2rem;font-weight:700}.timer-card--sta .timer-tijd{font-size:2.4rem}.btn-primair{background:var(--groen);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(--groen-donker)}.btn-primair--licht{background:var(--wit);color:var(--groen-donker)}.btn-primair--licht:hover{background:var(--groen-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{gap:8px;display:flex}.preset-knop{background:var(--wit);border:1px solid var(--groen-rand);cursor:pointer;border-radius:999px;padding:6px 14px;font-size:.9rem}.preset-knop--actief{background:var(--groen);border-color:var(--groen);color:var(--wit);font-weight:700}.breaktype-rij{gap:8px;width:100%;display:flex}.breaktype-kaart{background:var(--wit);border:1px solid var(--groen-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(--groen-licht);border-color:var(--groen);font-weight:700}.breaktype-icoon{font-size:1.6rem}.toggle{border:1px solid var(--groen-rand);background:var(--wit);color:var(--grijs);cursor:pointer;border-radius:999px;padding:6px 18px;font-size:.9rem}.toggle--aan{background:var(--groen);border-color:var(--groen);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(--groen-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(--groen);box-shadow:var(--schaduw);color:var(--groen-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(--groen) 0%, var(--groen-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}.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(--groen-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--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}}