:root{--c-bg: #F0F4F8;--c-surface: #FFFFFF;--c-surface2: #E8EEF4;--c-line: #D1DCE8;--c-fg: #0F1F2E;--c-fg-mute: #6B7E90;--c-accent: #0077B6;--c-accent-h: #005F92;--c-danger: #DC2626;--c-success: #16A34A;--c-a: var(--c-accent);--c-a-h: var(--c-accent-h);--font-display: "Syne", sans-serif;--font-mono: "IBM Plex Mono", monospace;--font-body: system-ui, sans-serif;--sp-xs: 4px;--sp-sm: 8px;--sp-md: 16px;--sp-lg: 24px;--sp-xl: 40px;--r-sm: 4px;--r-md: 8px;--r-lg: 12px;--sidebar-w: 200px;--topbar-h: 48px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;background:var(--c-bg);color:var(--c-fg);font-family:var(--font-body);font-size:13.5px;line-height:1.5;-webkit-font-smoothing:antialiased}.app{display:flex;height:100vh;overflow:hidden}.main{display:flex;flex-direction:column;flex:1;min-width:0;overflow:hidden}.content{flex:1;overflow-y:auto;padding:var(--sp-lg)}.sidebar{width:var(--sidebar-w);background:var(--c-surface);border-right:1px solid var(--c-line);display:flex;flex-direction:column;flex-shrink:0}.sidebar-brand{display:flex;align-items:center;gap:var(--sp-sm);padding:var(--sp-md);border-bottom:1px solid var(--c-line)}.brand-mark{width:32px;height:32px;background:var(--c-a);color:#fff;font-family:var(--font-display);font-weight:700;font-size:12px;display:flex;align-items:center;justify-content:center;border-radius:var(--r-sm);flex-shrink:0}.brand-text{line-height:1.2}.brand-line1{font-family:var(--font-mono);font-size:11px;font-weight:500;letter-spacing:.08em}.brand-line2{font-family:var(--font-mono);font-size:10px;color:var(--c-fg-mute)}.sidebar-nav{display:flex;flex-direction:column;gap:2px;padding:var(--sp-sm);flex:1}.nav-btn{display:flex;align-items:center;gap:var(--sp-sm);width:100%;padding:7px var(--sp-sm);background:transparent;border:none;border-radius:var(--r-sm);color:var(--c-fg-mute);cursor:pointer;font-size:13px;text-align:left;transition:background .1s,color .1s}.nav-btn:hover,.nav-btn.is-active{background:var(--c-surface2);color:var(--c-fg)}.nav-btn.is-active .nav-key{color:var(--c-a)}.nav-label{flex:1}.nav-key{font-family:var(--font-mono);font-size:10px}.nav-icon{display:flex;align-items:center;width:16px}.sidebar-foot{padding:var(--sp-md);border-top:1px solid var(--c-line);font-family:var(--font-mono);font-size:10px;color:var(--c-fg-mute);line-height:1.6}.topbar{height:var(--topbar-h);border-bottom:1px solid var(--c-line);display:flex;align-items:center;padding:0 var(--sp-md);gap:var(--sp-md);flex-shrink:0}.tb-crumb{font-family:var(--font-mono);font-size:11px;color:var(--c-fg-mute)}.tb-spacer{flex:1}.tb-user{display:flex;align-items:center;gap:var(--sp-sm);font-size:12.5px}.initials{width:26px;height:26px;border-radius:50%;background:var(--c-surface2);border:1px solid var(--c-line);font-family:var(--font-mono);font-size:10px;display:inline-flex;align-items:center;justify-content:center;color:var(--c-fg-mute)}.btn-primary{display:inline-flex;align-items:center;gap:6px;padding:6px 14px;background:var(--c-a);color:#fff;border:none;border-radius:var(--r-sm);font-size:12.5px;font-weight:600;cursor:pointer;transition:background .1s}.btn-primary:hover{background:var(--c-a-h)}.btn-ghost{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:transparent;color:var(--c-fg-mute);border:1px solid var(--c-line);border-radius:var(--r-sm);font-size:12.5px;cursor:pointer;transition:color .1s,border-color .1s}.btn-ghost:hover{color:var(--c-fg);border-color:var(--c-fg-mute)}.btn-icon{width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:1px solid var(--c-line);border-radius:var(--r-sm);color:var(--c-fg-mute);cursor:pointer}.btn-icon:hover{color:var(--c-fg)}.page{max-width:1200px}.page-bar{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:var(--sp-xl);gap:var(--sp-md)}.page-title{display:flex;flex-direction:column;gap:2px}.page-eyebrow{font-family:var(--font-mono);font-size:10px;color:var(--c-fg-mute);letter-spacing:.06em}.page-h1{font-family:var(--font-display);font-size:28px;font-weight:700;line-height:1.1}.page-sub{font-family:var(--font-mono);font-size:11px;color:var(--c-fg-mute);margin-top:4px}.page-actions{display:flex;align-items:center;gap:var(--sp-sm)}.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--c-bg)}.login-card{width:360px;background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--r-lg);padding:var(--sp-xl);display:flex;flex-direction:column;gap:var(--sp-lg)}.login-brand{display:flex;align-items:center;gap:var(--sp-sm)}.login-title{font-family:var(--font-display);font-size:22px;font-weight:700}.login-sub{font-family:var(--font-mono);font-size:11px;color:var(--c-fg-mute);margin-top:2px}.login-form{display:flex;flex-direction:column;gap:var(--sp-sm)}.field-wrap{display:flex;flex-direction:column;gap:4px}.field-label{font-family:var(--font-mono);font-size:10px;color:var(--c-fg-mute);letter-spacing:.06em}.field-input{width:100%;padding:8px 10px;background:var(--c-surface2);border:1px solid var(--c-line);border-radius:var(--r-sm);color:var(--c-fg);font-size:13.5px;outline:none;transition:border-color .1s}.field-input:focus{border-color:var(--c-a)}.login-error{font-family:var(--font-mono);font-size:11px;color:var(--c-danger);padding:8px 10px;background:#dc26261a;border-radius:var(--r-sm)}.mono{font-family:var(--font-mono)}.dim{color:var(--c-fg-mute)}.login-tabs{display:flex;gap:2px;background:var(--c-surface2);border-radius:var(--r-sm);padding:3px}.login-tab{flex:1;padding:6px;background:transparent;border:none;border-radius:var(--r-sm);color:var(--c-fg-mute);font-size:12.5px;cursor:pointer;transition:background .1s,color .1s}.login-tab.is-active{background:var(--c-surface);color:var(--c-fg)}.ix-page{display:flex;flex-direction:column;height:calc(100vh - var(--topbar-h));margin:calc(-1 * var(--sp-lg));overflow:hidden}.ix-head{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-md) var(--sp-lg);border-bottom:1px solid var(--c-line);flex-shrink:0}.ix-tabs{display:flex;align-items:center;gap:2px;padding:0 var(--sp-lg);border-bottom:1px solid var(--c-line);flex-shrink:0;overflow-x:auto}.ix-tab{display:flex;align-items:center;gap:5px;padding:10px;background:transparent;border:none;border-bottom:2px solid transparent;color:var(--c-fg-mute);font-size:12.5px;cursor:pointer;white-space:nowrap;margin-bottom:-1px;transition:color .1s}.ix-tab:hover{color:var(--c-fg)}.ix-tab.is-active{color:var(--c-a);border-bottom-color:var(--c-a)}.ix-tab.has-badge .ix-tab-n{background:var(--c-a);color:#fff}.ix-tab-n{font-family:var(--font-mono);font-size:10px;padding:1px 5px;border-radius:10px;background:var(--c-surface2)}.ix-search{display:flex;align-items:center;gap:6px;padding:5px 10px;background:var(--c-surface2);border:1px solid var(--c-line);border-radius:var(--r-sm);margin:6px 0 6px 8px}.ix-search input{border:none;background:transparent;outline:none;font-size:12.5px;color:var(--c-fg);width:140px}.ix-search svg{color:var(--c-fg-mute);flex-shrink:0}.ix-split{display:flex;flex:1;overflow:hidden}.ix-list{width:300px;flex-shrink:0;overflow-y:auto;border-right:1px solid var(--c-line)}.ix-detail{flex:1;overflow-y:auto;background:var(--c-surface)}.ix-leeg,.ix-laden{padding:var(--sp-xl) var(--sp-lg);text-align:center}.ix-card{display:flex;align-items:flex-start;gap:10px;width:100%;padding:12px var(--sp-md);background:transparent;border:none;border-bottom:1px solid var(--c-line);text-align:left;cursor:pointer;transition:background .08s}.ix-card:hover{background:var(--c-surface2)}.ix-card.is-active{background:#ebf3fb}.ix-card.is-urgent{border-left:3px solid var(--c-a)}.ix-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;margin-top:5px}.ix-dot-urgent{background:var(--c-a)}.ix-dot-def{background:var(--c-success)}.ix-dot-ann{background:var(--c-fg-mute)}.ix-dot-idle{background:var(--c-line);border:1.5px solid var(--c-fg-mute)}.ix-card-body{flex:1;min-width:0}.ix-card-row1{display:flex;align-items:baseline;justify-content:space-between;gap:6px;margin-bottom:2px}.ix-card-bedrijf{font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ix-card-type{font-size:10px;color:var(--c-fg-mute);flex-shrink:0}.ix-card-row2{font-size:11.5px;margin-bottom:5px}.ix-card-row3{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.ix-card-handler{font-size:10.5px}.ix-card-due{font-size:10.5px;color:var(--c-a);margin-left:auto}.badge{display:inline-flex;align-items:center;padding:2px 7px;border-radius:10px;font-size:10.5px;font-weight:600;border:1px solid transparent}.badge-aanvraag{background:#f0f4f8;color:#4b6080;border-color:#c8d8e8}.badge-offerte{background:#ebf3fb;color:var(--c-a);border-color:#b8d4ee}.badge-optie{background:#fff7e6;color:#b45309;border-color:#f5d89a}.badge-def{background:#edfbf3;color:#15803d;border-color:#a7dfc0}.badge-ann{background:#fef2f2;color:#b91c1c;border-color:#fecaca}.actie-badge{display:inline-flex;align-items:center;gap:4px;padding:2px 7px;border-radius:10px;font-size:10.5px;font-weight:600}.actie-laat{background:#fef2f2;color:#b91c1c}.actie-soon{background:#fff7e6;color:#b45309}.pn{display:flex;flex-direction:column;height:100%}.pn-leeg{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--sp-md);height:100%;color:var(--c-fg-mute)}.pn-head{padding:var(--sp-md) var(--sp-lg);border-bottom:1px solid var(--c-line);flex-shrink:0}.pn-head-top{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--sp-md);margin-bottom:var(--sp-md)}.pn-bedrijf{font-family:var(--font-display);font-size:20px;font-weight:700}.pn-contact{font-size:12.5px;margin-top:2px}.pn-head-badges{display:flex;align-items:center;gap:6px;flex-shrink:0}.pn-hero{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-sm)}.pn-hero-cel{background:var(--c-bg);border:1px solid var(--c-line);border-radius:var(--r-md);padding:10px 12px}.pn-hero-label{font-size:9.5px;font-family:var(--font-mono);color:var(--c-fg-mute);letter-spacing:.06em;margin-bottom:3px}.pn-hero-val{font-size:16px;font-weight:600;line-height:1.2}.pn-hero-sub{font-size:11px;margin-top:2px}.pn-tabs{display:flex;gap:2px;padding:0 var(--sp-lg);border-bottom:1px solid var(--c-line);flex-shrink:0}.pn-tab{display:flex;align-items:center;gap:5px;padding:9px 10px;background:transparent;border:none;border-bottom:2px solid transparent;color:var(--c-fg-mute);font-size:12.5px;cursor:pointer;margin-bottom:-1px}.pn-tab:hover{color:var(--c-fg)}.pn-tab.is-active{color:var(--c-a);border-bottom-color:var(--c-a)}.pn-tab-n{font-family:var(--font-mono);font-size:10px;background:var(--c-surface2);padding:1px 5px;border-radius:8px}.pn-body{flex:1;overflow-y:auto}.log-wrap{display:flex;flex-direction:column;height:100%}.log-add{display:flex;flex-direction:column;gap:var(--sp-sm);padding:var(--sp-md) var(--sp-lg);border-bottom:1px solid var(--c-line);flex-shrink:0}.log-input{width:100%;padding:8px 10px;background:var(--c-bg);border:1px solid var(--c-line);border-radius:var(--r-sm);color:var(--c-fg);font-size:13px;font-family:var(--font-body);resize:none;outline:none;transition:border-color .1s}.log-input:focus{border-color:var(--c-a)}.log-send{align-self:flex-end}.log-timeline{flex:1;padding:var(--sp-md) var(--sp-lg);display:flex;flex-direction:column;gap:var(--sp-md)}.log-leeg{font-size:12px;color:var(--c-fg-mute)}.log-item{border-left:2px solid var(--c-line);padding-left:var(--sp-md)}.log-item-meta{display:flex;align-items:center;gap:6px;font-size:11px;margin-bottom:3px}.log-door{font-weight:600;color:var(--c-fg)}.log-item-bericht{font-size:13px;line-height:1.5}.dos-wrap{padding:var(--sp-md) var(--sp-lg);display:flex;flex-direction:column;gap:var(--sp-md)}.dos-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-sm)}.dos-field{display:flex;flex-direction:column;gap:4px}.dos-label{font-family:var(--font-mono);font-size:10px;color:var(--c-fg-mute);letter-spacing:.06em}.dos-input,.dos-select,.dos-textarea{padding:7px 10px;background:var(--c-bg);border:1px solid var(--c-line);border-radius:var(--r-sm);color:var(--c-fg);font-size:13px;font-family:var(--font-body);outline:none;transition:border-color .1s}.dos-input:focus,.dos-select:focus,.dos-textarea:focus{border-color:var(--c-a)}.dos-textarea{resize:vertical}.dos-toggle{display:flex;align-items:center;gap:8px;font-size:13px;cursor:pointer;padding:7px 0}.dos-actions{display:flex;justify-content:flex-end}.ct-wrap{padding:var(--sp-md) var(--sp-lg);display:flex;flex-direction:column;gap:2px}.ct-rij{display:flex;gap:var(--sp-md);padding:8px 0;border-bottom:1px solid var(--c-line)}.ct-label{font-family:var(--font-mono);font-size:10.5px;color:var(--c-fg-mute);width:140px;flex-shrink:0;padding-top:1px}.ct-waarde{font-size:13px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000059;display:flex;align-items:center;justify-content:center;z-index:100}.modal{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--r-lg);width:560px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #0003}.modal-head{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-md) var(--sp-lg);border-bottom:1px solid var(--c-line)}.modal-titel{font-family:var(--font-display);font-size:17px;font-weight:700}.modal-form{padding:var(--sp-lg);display:flex;flex-direction:column;gap:var(--sp-md)}.modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-sm)}.modal-foot{display:flex;justify-content:flex-end;gap:var(--sp-sm);padding-top:var(--sp-md);border-top:1px solid var(--c-line);margin-top:var(--sp-sm)}.modal-lg{width:700px}.form-sectie{font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;color:var(--c-fg-mute);padding:var(--sp-sm) 0 var(--sp-xs);border-top:1px solid var(--c-line);margin-top:var(--sp-xs)}.btn-sm{padding:5px 12px;font-size:12px}.warn{color:#b45309}.dos-sectie-titel{font-size:10px;color:var(--c-fg-mute);letter-spacing:.06em;padding:var(--sp-md) 0 var(--sp-xs);border-top:1px solid var(--c-line);margin-top:var(--sp-sm)}.dos-sectie-titel:first-child{border-top:none;margin-top:0;padding-top:0}.dos-field-wide{grid-column:1 / -1}.btn-danger{background:var(--c-danger);color:#fff;border:none}.btn-danger:hover{background:#b91c1c}.btn-danger-ghost{color:var(--c-danger);border-color:#fecaca}.btn-danger-ghost:hover{background:#fef2f2;color:#b91c1c;border-color:var(--c-danger)}.verwijder-confirm{display:flex;align-items:center;gap:var(--sp-sm);padding:6px 10px;background:#fef2f2;border:1px solid #FECACA;border-radius:var(--r-sm)}.db-page{max-width:1100px}.db-stats-rij{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-md);margin-bottom:var(--sp-lg)}.db-stat{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--r-lg);padding:var(--sp-md) var(--sp-lg)}.db-stat-accent{border-left:3px solid var(--c-a)}.db-stat-ok{border-left:3px solid var(--c-success)}.db-stat-waarde{font-family:var(--font-display);font-size:36px;font-weight:700;line-height:1;margin-bottom:4px}.db-stat-accent .db-stat-waarde{color:var(--c-a)}.db-stat-ok .db-stat-waarde{color:var(--c-success)}.db-stat-label{font-size:9.5px;letter-spacing:.07em;color:var(--c-fg-mute)}.db-stat-sub{font-size:10.5px;margin-top:2px}.db-pijplijn{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--r-lg);padding:var(--sp-md) var(--sp-lg);margin-bottom:var(--sp-lg)}.db-sectie-titel{font-size:9.5px;letter-spacing:.07em;color:var(--c-fg-mute);margin-bottom:var(--sp-md);display:block}.db-pijplijn-bars{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--sp-md)}.db-pijplijn-item{display:flex;flex-direction:column;gap:6px}.db-pijplijn-top{display:flex;align-items:baseline;gap:6px}.db-pijplijn-n{font-family:var(--font-display);font-size:22px;font-weight:700;line-height:1}.db-pijplijn-label{font-size:10.5px}.db-pijplijn-track{height:4px;background:var(--c-surface2);border-radius:2px;overflow:hidden}.db-pijplijn-fill{height:100%;border-radius:2px;transition:width .3s ease}.db-onderste{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-md)}.db-kolom-links,.db-kolom-rechts{display:flex;flex-direction:column;gap:var(--sp-md)}.db-kaart{background:var(--c-surface);border:1px solid var(--c-line);border-radius:var(--r-lg);overflow:hidden}.db-kaart-head{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-md) var(--sp-lg);border-bottom:1px solid var(--c-line)}.db-kaart-n{font-size:11px}.db-leeg{padding:var(--sp-lg);font-size:12px}.db-rij{display:flex;align-items:center;gap:10px;width:100%;padding:10px var(--sp-lg);background:transparent;border:none;border-bottom:1px solid var(--c-line);text-align:left;cursor:pointer;transition:background .08s}.db-rij:last-child{border-bottom:none}.db-rij:hover{background:var(--c-surface2)}.db-rij-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.db-dot-laat{background:var(--c-danger)}.db-dot-soon{background:#b45309}.db-dot-idle{background:var(--c-line);border:1.5px solid var(--c-fg-mute)}.db-rij-body{flex:1;min-width:0}.db-rij-bedrijf{font-weight:600;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.db-rij-sub{font-size:11px;margin-top:1px}.db-event-datum{display:flex;flex-direction:column;align-items:center;width:30px;flex-shrink:0}.db-event-dag{font-size:16px;font-weight:700;line-height:1}.db-event-mnd{font-size:10px}.db-activiteit-item{padding:10px var(--sp-lg);border-bottom:1px solid var(--c-line)}.db-activiteit-item:last-child{border-bottom:none}.db-act-meta{display:flex;align-items:center;gap:6px;font-size:10.5px;margin-bottom:2px}.db-act-door{font-weight:600;color:var(--c-fg)}.db-act-tijd{margin-left:auto}.db-act-bericht{font-size:12.5px;line-height:1.4;color:var(--c-fg-mute)}