*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--color-so: #1565C0;--color-vso: #2E7D32;--color-vd: #E65100;--color-aanwezig: #2E7D32;--color-afwezig: #C62828;--color-ziek: #E65100;--color-vrijgesteld: #666;--color-pp: #1B5E20;--color-p: #388E3C;--color-min: #E65100;--color-minmin: #B71C1C;--color-diploma-behaald: #2E7D32;--color-diploma-ontwikkeling: #E65100;--color-diploma-niet: #999;--color-nav: #1A1D23;--color-bg: #F8F9FB;--color-diploma-btn: #7B1FA2;--font: "DM Sans", system-ui, sans-serif;--radius: 8px;--shadow: 0 2px 8px rgba(0,0,0,.1)}body{font-family:var(--font);background:var(--color-bg);color:#1a1d23;font-size:16px;line-height:1.4;min-height:100dvh}#root{display:flex;flex-direction:column;min-height:100dvh}button{font-family:var(--font);cursor:pointer;border:none;border-radius:var(--radius);font-size:15px;font-weight:500;transition:opacity .15s,transform .1s;-webkit-tap-highlight-color:transparent}button:active{transform:scale(.97);opacity:.85}input,select,textarea{font-family:var(--font);font-size:15px;border:1.5px solid #D0D5DD;border-radius:var(--radius);padding:8px 12px;outline:none;transition:border-color .15s;background:#fff}input:focus,select:focus,textarea:focus{border-color:var(--color-so)}.card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}.badge{display:inline-block;padding:2px 10px;border-radius:20px;font-size:13px;font-weight:600;color:#fff}.badge-so{background:var(--color-so)}.badge-vso{background:var(--color-vso)}.badge-vd{background:var(--color-vd)}.spinner{width:40px;height:40px;border:4px solid #e0e0e0;border-top-color:var(--color-so);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.toggle-group{display:flex;gap:4px}.toggle-btn{min-width:36px;height:36px;padding:0 8px;border-radius:6px;font-size:14px;font-weight:700;background:#eef0f4;color:#555;border:2px solid transparent}.toggle-btn.active{color:#fff;border-color:transparent}.toggle-btn.aanwezig.active{background:var(--color-aanwezig)}.toggle-btn.afwezig.active{background:var(--color-afwezig)}.toggle-btn.ziek.active{background:var(--color-ziek)}.toggle-btn.vrijgesteld.active{background:var(--color-vrijgesteld)}.toggle-btn.pp.active{background:var(--color-pp)}.toggle-btn.p.active{background:var(--color-p)}.toggle-btn.min.active{background:var(--color-min)}.toggle-btn.minmin.active{background:var(--color-minmin)}.screen-content{flex:1;overflow-y:auto;padding:16px 16px 80px}@media(max-width:600px){.screen-content{padding:12px 12px 80px}}