:root{font-family:"Plus Jakarta Sans",system-ui,sans-serif;color:#17243a;background:#f8faff;font-synthesis:none}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}.shell{display:block;min-height:100vh}.sidebar{background:#fff;border-right:1px solid #e2e8f0;padding:30px 20px;display:flex;flex-direction:column;gap:42px}.brand{font-weight:800;font-size:24px;color:#2563eb}.brand small{display:block;font-size:11px;color:#64748b;font-weight:500;margin-top:8px}.sidebar nav{display:grid;gap:8px}.sidebar nav a{padding:12px 14px;border-radius:12px;color:#64748b}.sidebar nav a.active,.sidebar nav a:hover{background:#eff6ff;color:#2563eb}.side-note{margin-top:auto;padding:16px;background:#f8faff;border-radius:12px;font-size:11px;letter-spacing:.08em;color:#64748b}.side-note small{display:block;letter-spacing:normal;line-height:1.5;margin-top:8px}main{width:min(1280px,100%);margin:0 auto;padding:44px 32px}header{display:flex;justify-content:space-between;align-items:start;gap:16px;margin-bottom:32px}.eyebrow{font-size:12px;letter-spacing:.1em;font-weight:800;color:#2563eb}h1{font-size:clamp(28px,4vw,38px);margin:10px 0}p{color:#64748b;line-height:1.6;margin:6px 0}.environment{background:#e9faf6;color:#087f67;border-radius:100px;padding:8px 12px;font-size:12px;white-space:nowrap}.metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:24px}.metric,.panel{background:#fff;border:1px solid #e2e8f0;border-radius:20px;padding:24px}.metric span{font-size:13px;color:#64748b}.metric strong{display:block;font-size:32px;margin-top:10px}.panel{margin-bottom:24px}.panel h2{font-size:21px;margin:0 0 8px}.form{display:grid;grid-template-columns:minmax(0,1fr) 180px auto;align-items:end;gap:12px;margin:24px 0}.form label{font-size:12px;font-weight:700;display:grid;gap:8px}input{font:inherit;border:1px solid #cbd5e1;border-radius:10px;padding:12px;min-width:0;width:100%;height:46px}input:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid #93c5fd;outline-offset:2px}button{font:inherit;border:0;border-radius:10px;padding:12px 16px;background:#2563eb;color:white;cursor:pointer;min-height:46px}button:hover{background:#1d4ed8}.assignment-list,.planning-list{display:grid;gap:10px}.assignment{display:flex;align-items:center;gap:12px;border:1px solid #e2e8f0;border-radius:12px;padding:14px}.assignment .details{flex:1;min-width:0}.assignment strong{display:block;overflow-wrap:anywhere}.assignment small{color:#64748b}.assignment.done strong{text-decoration:line-through;color:#64748b}.assignment input{height:20px;width:20px;accent-color:#2563eb}.assignment button{background:transparent;color:#b91c1c;min-height:36px;padding:6px 10px}.empty{padding:20px;background:#f8faff;border-radius:12px;color:#64748b}.planning-item{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid #e2e8f0}.planning-item button{background:#eff6ff;color:#1d4ed8;font-size:13px}footer{font-size:12px;color:#64748b;padding:12px 0 36px}@media(max-width:850px){.sidebar{padding:18px;gap:12px;border-right:0;border-bottom:1px solid #e2e8f0}.sidebar nav{display:flex;overflow:auto}.sidebar nav a{white-space:nowrap}.side-note{display:none}main{padding:24px 16px}.form{grid-template-columns:1fr}.metrics{gap:8px}.metric{padding:14px}.metric strong{font-size:24px}}@media(max-width:480px){header{display:block}.environment{display:inline-block;margin-top:12px}.metrics{grid-template-columns:1fr}.planning-item{align-items:start;flex-direction:column}}
/* DSM v1.6 / approved LifeOS top navigation */
.topbar{background:#fff;border-bottom:1px solid #e2e8f0}.topbar-inner{max-width:1280px;margin:auto;min-height:90px;padding:0 32px;display:flex;align-items:center;gap:30px}.brand{font-weight:800;font-size:24px;color:#2563eb;white-space:nowrap}.topbar nav{display:flex;align-items:center;gap:24px;flex:1;min-width:0}.topbar nav a,.nav-soon{font-size:14px;font-weight:600;color:#64748b;white-space:nowrap}.topbar nav a:hover,.topbar nav a.active{color:#2563eb}.topbar nav a.active{border-bottom:2px solid #2563eb;padding:10px 0 8px}.nav-soon{opacity:.65;cursor:not-allowed}.nav-soon small{display:none}.topbar-account{font-size:13px;color:#64748b;white-space:nowrap}.menu-toggle{display:none;background:transparent;color:#17243a;font-size:22px;padding:8px;min-height:44px;min-width:44px}.menu-toggle:hover{background:#eff6ff}.topbar nav a:focus-visible{border-radius:4px}section{scroll-margin-top:24px}.topbar{width:100%;position:relative;z-index:2}.topbar-inner>*{min-width:0}.topbar .brand{flex-shrink:0}.topbar-account{flex-shrink:0}@media(max-width:1050px){.topbar-inner{min-height:74px;padding:0 20px;gap:12px;flex-wrap:wrap}.menu-toggle{display:block;margin-left:auto}.topbar-account{display:none}.topbar nav{display:none;flex-basis:100%;flex-direction:column;align-items:stretch;gap:0;padding:0 0 16px}.topbar nav.is-open{display:flex}.topbar nav a,.nav-soon{padding:13px 12px;border-radius:8px}.topbar nav a.active{border:0;background:#eff6ff}.nav-soon small{display:inline;font-size:10px;margin-left:8px}}
/* Navigation remains available when anchor links scroll to content. */
html{scroll-padding-top:112px;scroll-behavior:smooth}
.topbar{position:sticky;top:0;z-index:100;background:#fff;box-shadow:0 1px 0 rgba(23,36,58,.06)}
#overzicht,#opdrachten,#planning{scroll-margin-top:112px}
@media(max-width:1050px){html{scroll-padding-top:90px}#overzicht,#opdrachten,#planning{scroll-margin-top:90px}}