:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--code-bg:#f4f3ec;--accent:#aa3bff;--accent-bg:#aa3bff1a;--accent-border:#aa3bff80;--social-bg:#f4f3ec80;--shadow:#0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:16px}}@media (prefers-color-scheme:dark){:root{--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--code-bg:#1f2028;--accent:#c084fc;--accent-bg:#c084fc26;--accent-border:#c084fc80;--social-bg:#2f303a80;--shadow:#0006 0 10px 15px -3px, #00000040 0 4px 6px -2px}#social .button-icon{filter:invert()brightness(2)}}#root{text-align:center;border-inline:1px solid var(--border);box-sizing:border-box;flex-direction:column;width:1126px;max-width:100%;min-height:100svh;margin:0 auto;display:flex}body{margin:0}h1,h2{font-family:var(--heading);color:var(--text-h);font-weight:500}h1{letter-spacing:-1.68px;margin:32px 0;font-size:56px}@media (width<=1024px){h1{margin:20px 0;font-size:36px}}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--text-h);border-radius:4px;display:inline-flex}code{background:var(--code-bg);padding:4px 8px;font-size:15px;line-height:135%}*{box-sizing:border-box}html,body,#root{width:100%;min-width:320px;min-height:100%;margin:0}body{color:#0b2d49;background:#f3f6f8;min-height:100vh;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}.login-page{background:radial-gradient(circle at 0 0,#23c5d621,#0000 34%),#f4f7f8;place-items:center;min-height:100vh;padding:24px;display:grid}.login-card{background:#fff;border-radius:26px;width:min(100%,480px);padding:42px;box-shadow:0 24px 70px #05263e1c}.login-logo-wrap{justify-content:center;margin-bottom:28px;display:flex}.login-logo{width:min(100%,360px);height:auto}.login-heading{text-align:center}.login-heading h1{margin:0 0 10px;font-size:30px}.login-heading p{color:#6a7680;margin:0 0 30px}.login-form{gap:22px;display:grid}.login-form label>span{align-items:center;gap:8px;margin-bottom:8px;font-size:14px;font-weight:700;display:flex}.user-switch{background:#edf2f4;border-radius:13px;grid-template-columns:1fr 1fr;padding:4px;display:grid}.user-switch button{color:#68757e;background:0 0;border:0;border-radius:10px;padding:12px;font-weight:700}.user-switch button.active{color:#0b2d49;background:#fff;box-shadow:0 2px 10px #08263d17}.login-form input{border:1px solid #d2dce2;border-radius:11px;width:100%;padding:14px}.login-button{color:#fff;background:#0b2d49;border:0;border-radius:11px;padding:14px;font-weight:750}.login-error,.error-banner{color:#a33530;background:#fff0ef;border-radius:10px;padding:12px 14px}.login-card small{text-align:center;color:#8b959d;margin-top:22px;display:block}.loading-screen{place-items:center;min-height:100vh;font-weight:700;display:grid}.app-shell{width:100%;max-width:1440px;margin:0 auto;padding:28px 32px 70px}.topbar,.intro,.stats-grid,.progress-card,.toolbar,.task-sections,.error-banner{width:100%;max-width:1280px;margin-left:auto;margin-right:auto}.topbar{border-bottom:1px solid #dce4e8;justify-content:space-between;align-items:center;gap:24px;padding-bottom:24px;display:flex}.brand{align-items:center;gap:15px;display:flex}.brand img{object-fit:contain;width:55px;height:55px}.brand span,.eyebrow,.modal-header span,.section-title span{color:#20bfd0;letter-spacing:.16em;text-transform:uppercase;font-size:11px;font-weight:850}.brand h1{margin:3px 0 0;font-size:25px}.topbar-actions{align-items:center;gap:10px;display:flex}.account-pill{background:#fff;border:1px solid #dce4e8;border-radius:999px;align-items:center;gap:7px;padding:10px 14px;font-weight:700;display:flex}.primary-button,.secondary-button{border-radius:10px;justify-content:center;align-items:center;gap:8px;min-height:42px;padding:0 16px;font-weight:750;display:inline-flex}.primary-button{color:#fff;background:linear-gradient(135deg,#0b304f,#125071);border:0}.secondary-button{color:#0b2d49;background:#fff;border:1px solid #d4dee4}.intro{justify-content:space-between;align-items:flex-end;gap:24px;padding:38px 0 24px;display:flex}.intro h2{margin:4px 0 6px;font-size:34px}.intro p{color:#65747f;margin:0}.stats-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;display:grid}.stat-card{background:#fff;border:1px solid #e0e7eb;border-radius:17px;padding:20px;box-shadow:0 7px 22px #0b2d490a}.stat-card span{color:#75828b;font-size:13px;font-weight:700;display:block}.stat-card strong{margin:5px 0 2px;font-size:30px;display:block}.stat-card small{color:#86929a}.stat-card.warning strong{color:#b6463e}.progress-card{background:#fff;border:1px solid #e0e7eb;border-radius:17px;margin-top:14px;padding:18px 20px}.progress-header{justify-content:space-between;margin-bottom:10px;display:flex}.progress-track{background:#e8eef1;border-radius:99px;height:10px;overflow:hidden}.progress-fill{border-radius:inherit;background:linear-gradient(90deg,#0d3555,#24c4d4);height:100%;transition:width .25s}.toolbar{flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;margin-top:26px;margin-bottom:26px;display:flex}.search-box{background:#fff;border:1px solid #dce4e8;border-radius:11px;flex:0 340px;align-items:center;gap:8px;min-height:44px;padding:0 12px;display:flex}.search-box input{border:0;outline:0;width:100%}.filter-row{flex-wrap:wrap;justify-content:center;gap:7px;display:flex}.filter{color:#65737d;background:#fff;border:1px solid #d8e1e6;border-radius:999px;padding:8px 11px;font-size:13px;font-weight:700}.filter.active{color:#fff;background:#0e395a;border-color:#0e395a}.task-sections{gap:24px;display:grid}.task-section{background:#fff;border:1px solid #e0e7eb;border-radius:18px;width:100%;overflow:hidden}.section-title{border-bottom:1px solid #e6ecef;justify-content:space-between;align-items:center;padding:18px 20px;display:flex}.section-title h3{margin:3px 0 0;font-size:20px}.section-title strong{color:#137589;background:#eaf6f7;border-radius:10px;place-items:center;min-width:34px;height:34px;display:grid}.task-table-head,.task-row{grid-template-columns:38px minmax(260px,1fr) 125px 115px 95px 135px 34px;align-items:center;gap:10px;display:grid}.task-table-head{color:#7a8790;text-transform:uppercase;letter-spacing:.05em;background:#f8fafb;border-bottom:1px solid #e8edef;min-height:40px;padding:0 16px;font-size:11px;font-weight:800}.compact-task{border-bottom:1px solid #edf1f3}.compact-task:last-child{border-bottom:0}.compact-task.expanded{background:#fcfefe}.task-row{min-height:62px;padding:9px 16px}.complete-button,.expand-button{color:#1ab7c8;background:0 0;border:0;place-items:center;display:grid}.expand-button{color:#60737e}.task-name{text-align:left;color:#123752;background:0 0;border:0;min-width:0;padding:5px 0}.task-name>span{white-space:nowrap;text-overflow:ellipsis;font-weight:750;display:block;overflow:hidden}.task-name>span.done{color:#8a969d;text-decoration:line-through}.task-name small{color:#71818b;align-items:center;gap:4px;margin-top:5px;display:inline-flex}.compact-select{color:#21435c;background:#fafcfd;border:1px solid #dbe4e8;border-radius:8px;outline:none;width:100%;padding:8px;font-size:12px;font-weight:700}.priority{border-radius:999px;justify-self:start;padding:5px 8px;font-size:11px;font-weight:800}.priority.Laag{color:#66747e;background:#eef2f4}.priority.Normaal{color:#187687;background:#e9f5f7}.priority.Hoog{color:#92640f;background:#fff3d9}.priority.Kritiek{color:#a83e36;background:#ffebe8}.compact-deadline{color:#64737d;align-items:center;gap:5px;font-size:12px;font-weight:700;display:inline-flex}.compact-deadline.overdue{color:#ae4038}.task-details{padding:0 16px 18px 64px}.detail-grid{grid-template-columns:minmax(250px,.8fr) minmax(400px,1.4fr);gap:16px;display:grid}.description-panel,.notes-panel{background:#f7fafb;border:1px solid #e2e9ec;border-radius:13px;padding:17px}.detail-label{color:#74828b;text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;font-size:10px;font-weight:850;display:block}.description-panel p{color:#536771;margin:0;font-size:13px;line-height:1.55}.notes-title{justify-content:space-between;align-items:center;display:flex}.notes-title>span:last-child{color:#859198;font-size:11px}.notes-list{gap:8px;margin-bottom:12px;display:grid}.note-item{background:#fff;border:1px solid #e1e8eb;border-radius:9px;padding:11px 12px}.note-meta{justify-content:space-between;gap:12px;margin-bottom:5px;font-size:11px;display:flex}.note-meta strong{color:#123c5a}.note-meta span{color:#8a959c}.note-item p{color:#52656f;white-space:pre-wrap;margin:0;font-size:13px;line-height:1.45}.notes-empty{color:#8a959c;background:#fff;border-radius:8px;margin-bottom:12px;padding:11px;font-size:12px}.note-input-row{grid-template-columns:1fr auto;align-items:end;gap:9px;display:grid}.note-input-row textarea{resize:vertical;color:#173950;background:#fff;border:1px solid #d8e2e6;border-radius:9px;outline:none;width:100%;min-height:70px;padding:10px 11px}.note-input-row textarea:focus{border-color:#24c0d0;box-shadow:0 0 0 3px #24c0d017}.send-note-button{color:#fff;background:#0d3857;border:0;border-radius:9px;align-items:center;gap:6px;min-height:42px;padding:0 13px;font-size:12px;font-weight:800;display:inline-flex}.send-note-button:disabled{opacity:.5;cursor:default}.empty-state{text-align:center;color:#76848e;max-width:1280px;margin:0 auto;padding:50px}.modal-backdrop{z-index:100;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#051b2c78;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.task-modal{background:#fff;border-radius:20px;width:min(600px,100%);max-height:calc(100vh - 40px);padding:26px;overflow:auto;box-shadow:0 30px 90px #051b2c3d}.modal-header{justify-content:space-between;margin-bottom:22px;display:flex}.modal-header h3{margin:3px 0 0;font-size:25px}.modal-header button{background:#f0f3f5;border:0;border-radius:10px;width:36px;height:36px;font-size:23px;line-height:1}.task-modal>label,.two-columns label{gap:7px;margin-bottom:17px;font-size:13px;font-weight:750;display:grid}.task-modal input,.task-modal select,.task-modal textarea{color:#163852;background:#fff;border:1px solid #d5dfe4;border-radius:9px;outline:0;width:100%;padding:11px 12px}.task-modal textarea{resize:vertical}.two-columns{grid-template-columns:1fr 1fr;gap:14px;display:grid}.modal-actions{justify-content:flex-end;gap:10px;margin-top:5px;display:flex}@media (width<=1050px){.task-table-head{display:none}.task-row{grid-template-columns:34px minmax(180px,1fr) 110px 95px 34px}.task-row>.priority,.compact-deadline{display:none}.detail-grid{grid-template-columns:1fr}}@media (width<=900px){.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width<=650px){.app-shell{padding:18px 14px 60px}.topbar,.intro,.stats-grid,.progress-card,.toolbar,.task-sections,.error-banner{max-width:100%}.topbar{align-items:flex-start}.brand img{width:46px;height:46px}.brand h1{font-size:19px}.account-pill{display:none}.topbar .secondary-button{padding:0 10px;font-size:0}.topbar .secondary-button svg{margin:0}.intro{flex-direction:column;align-items:flex-start}.intro h2{font-size:28px}.intro .primary-button{width:100%}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.stat-card:last-child{grid-column:span 2}.toolbar{justify-content:flex-start;align-items:stretch}.search-box{flex-basis:100%}.filter-row{flex-wrap:nowrap;justify-content:flex-start;padding-bottom:4px;overflow-x:auto}.filter{flex:none}.task-row{grid-template-columns:32px minmax(0,1fr) 32px;min-height:58px;padding:9px 11px}.task-row .compact-select,.task-row .priority,.task-row .compact-deadline{display:none}.task-name>span{white-space:normal}.task-details{padding:0 11px 13px 43px}.detail-grid,.note-input-row{grid-template-columns:1fr}.send-note-button{justify-content:center;width:100%}.two-columns{grid-template-columns:1fr;gap:0}.login-card{padding:28px 22px}.login-logo{width:min(100%,290px)}}