:root{--navy:#102a43;--navy2:#243b53;--teal:#0f766e;--bg:#f4f7fa;--panel:#fff;--line:#dce4eb;--text:#172b4d;--muted:#6b7c93;--red:#b42318;--shadow:0 10px 28px rgba(16,42,67,.08)}
*{box-sizing:border-box}html,body{max-width:100%;overflow-x:hidden}body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}button,input,select,textarea{font:inherit}.topbar{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:28px 34px;background:linear-gradient(135deg,var(--navy),var(--navy2));color:#fff}.topbar h1{margin:3px 0 5px;font-size:32px}.topbar p{margin:0;color:#d9e4ed}.eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:12px;color:#9dded5;font-weight:800}.top-actions{display:flex;gap:10px;flex-wrap:wrap}.layout{display:grid;grid-template-columns:270px minmax(0,1fr);gap:18px;padding:20px;max-width:100%}.sidebar{position:sticky;top:18px;display:grid;gap:16px;align-self:start;min-width:0}.workspace,.panel,#dataView,.entity-block{min-width:0;max-width:100%}.workspace{display:grid;gap:20px}.panel{background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow)}.panel h2{margin:0}.panel p{margin:4px 0 0;color:var(--muted);font-size:14px}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px}.wrap{flex-wrap:wrap}.sidebar label,.filter-field{display:block;margin-top:15px;font-size:13px;font-weight:800}.filter-label{display:block}.control{width:100%;margin-top:6px;padding:10px 11px;border:1px solid var(--line);border-radius:9px;background:#fff}.control:focus{outline:3px solid rgba(15,118,110,.13);border-color:var(--teal)}.btn{display:inline-block;border:1px solid var(--line);background:#fff;color:var(--text);padding:10px 14px;border-radius:9px;font-weight:800;cursor:pointer}.btn.primary{background:var(--teal);color:#fff;border-color:var(--teal)}.btn.danger{color:var(--red);background:#fff1f0;border-color:#efb6b0}.btn.full{width:100%;margin-top:9px}.link-btn{border:0;background:transparent;color:var(--teal);font-weight:800;cursor:pointer}.multi-select{position:relative;margin-top:6px;font-weight:500}.multi-select summary{list-style:none;padding:10px 34px 10px 11px;border:1px solid var(--line);border-radius:9px;background:#fff;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.multi-select summary::-webkit-details-marker{display:none}.multi-select summary::after{content:"⌄";position:absolute;right:12px;top:8px;font-size:18px;color:var(--muted)}.multi-select[open] summary{border-color:var(--teal);outline:3px solid rgba(15,118,110,.13)}.multi-select[open] summary::after{transform:rotate(180deg)}.check-list{display:grid;gap:6px}.multi-select .check-list{position:absolute;z-index:20;top:calc(100% + 6px);left:0;right:0;max-height:260px;overflow-y:auto;padding:8px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 14px 35px rgba(16,42,67,.18)}.check-item{display:flex!important;margin:0!important;gap:8px;align-items:center;padding:8px 9px;border:1px solid transparent;border-radius:8px;font-weight:500!important;cursor:pointer}.check-item:hover{background:#f1f7f6}.check-item input{accent-color:var(--teal)}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.stat{min-width:0;background:#fff;border:1px solid var(--line);border-radius:14px;padding:17px;box-shadow:var(--shadow)}.stat span{display:block;color:var(--muted);font-size:13px}.stat strong{display:block;margin-top:6px;font-size:27px;color:var(--navy)}.source-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(135px,1fr));gap:10px}.source-card{min-width:0;border:1px solid var(--line);background:#fff;border-radius:12px;padding:13px;text-align:left;cursor:pointer;overflow-wrap:anywhere}.source-card:hover,.source-card.active{border-color:var(--teal);background:#e5f6f3}.source-card strong,.source-card span,.source-card small{display:block}.source-card span{font-size:25px;font-weight:900;margin-top:7px}.source-card small{margin-top:4px;color:var(--muted)}.segmented{display:flex}.segmented button{padding:8px 12px;border:1px solid var(--line);background:#fff;font-weight:800;cursor:pointer}.segmented button:first-child{border-radius:8px 0 0 8px}.segmented button:last-child{border-radius:0 8px 8px 0;border-left:0}.segmented button.active{background:var(--navy);color:#fff;border-color:var(--navy)}.chips{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:12px}.chip{padding:6px 9px;border-radius:999px;background:#eaf2ff;color:#174ea6;font-size:12px;font-weight:800}.table-wrap{width:100%;max-width:100%;overflow:hidden;border:1px solid var(--line);border-radius:12px}table{width:100%;table-layout:fixed;border-collapse:collapse}th,td{min-width:0;padding:9px 7px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top;overflow-wrap:anywhere;word-break:break-word}th{background:#f8fafc;font-size:10px;color:var(--navy2)}td{font-size:12px}th:nth-last-child(-n+4),td:nth-last-child(-n+4){width:7%}th:last-child,td:last-child{width:6%}code{color:#075e57;font-weight:700;white-space:normal}.badge{display:inline-block;max-width:100%;padding:4px 6px;border-radius:999px;font-size:10px;font-weight:800;white-space:normal}.source{background:#eaf2ff;color:#174ea6}.yes{background:#e9f8ef;color:#166534}.no{background:#f1f3f5;color:#66788a}.personal{background:#fff0e6;color:#9a3412}.row-actions{display:grid;gap:4px}.small{max-width:100%;border:1px solid var(--line);background:#fff;border-radius:7px;padding:5px 6px;font-size:10px;font-weight:800;cursor:pointer;overflow-wrap:anywhere}.small.delete{color:var(--red)}.entity-block{margin-top:22px}.entity-block:first-child{margin-top:0}.entity-head{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--navy);color:#fff;padding:13px 15px;border-radius:10px 10px 0 0}.entity-head h3{margin:0}.entity-actions{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}.entity-actions .small{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.25)}.empty{text-align:center;padding:40px;color:var(--muted)}dialog{width:min(760px,calc(100% - 30px));border:0;border-radius:16px;padding:22px;box-shadow:0 25px 80px rgba(0,0,0,.28)}dialog::backdrop{background:rgba(16,42,67,.55)}.wide-dialog{width:min(1000px,calc(100% - 30px))}.dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:17px}.dialog-head h2{margin:0}.close{border:0;background:transparent;font-size:28px;cursor:pointer;color:var(--muted)}dialog label{display:block;margin-top:12px;font-size:13px;font-weight:800}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.form-grid label{margin-top:0}.form-grid .wide{grid-column:1/-1}.dialog-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:18px}.json-editor{width:100%;min-height:60vh;border:1px solid var(--line);border-radius:10px;padding:14px;font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace}.error{color:var(--red);font-weight:700;margin-top:8px}.toast{position:fixed;right:22px;bottom:22px;transform:translateY(100px);opacity:0;background:var(--navy);color:#fff;padding:12px 16px;border-radius:10px;transition:.2s;box-shadow:var(--shadow)}.toast.show{transform:translateY(0);opacity:1}
@media(max-width:1100px){.layout{grid-template-columns:230px minmax(0,1fr);padding:14px;gap:14px}.panel{padding:14px}th,td{padding:8px 5px;font-size:10px}.badge,.small{font-size:9px}.source-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:820px){.layout{grid-template-columns:1fr}.sidebar{position:static;grid-template-columns:1fr 1fr}.stats{grid-template-columns:repeat(2,1fr)}.table-wrap{border:0}table,thead,tbody,tr,th,td{display:block;width:100%!important}thead{display:none}tbody{display:grid;gap:12px}tr{padding:10px;border:1px solid var(--line);border-radius:12px;background:#fff}td{display:grid!important;grid-template-columns:minmax(105px,35%) minmax(0,1fr);gap:10px;border-bottom:1px solid var(--line);font-size:12px}td:last-child{border-bottom:0}td::before{font-weight:800;color:var(--navy2)}td:nth-child(1)::before{content:"Onderdeel"}td:nth-child(2)::before{content:"Groep"}td:nth-child(3)::before{content:"Omschrijving"}td:nth-child(4)::before{content:"Technisch veld"}td:nth-child(5)::before{content:"Type"}td:nth-child(6)::before{content:"Bron"}td:nth-child(7)::before{content:"Verantwoordelijke"}td:nth-child(8)::before{content:"Verplicht"}td:nth-child(9)::before{content:"Bewerkbaar"}td:nth-child(10)::before{content:"Persoonsgegeven"}td:nth-child(11)::before{content:"Acties"}.row-actions{display:flex}.entity-block td:nth-child(1)::before{content:"Groep"}.entity-block td:nth-child(2)::before{content:"Omschrijving"}.entity-block td:nth-child(3)::before{content:"Technisch veld"}.entity-block td:nth-child(4)::before{content:"Type"}.entity-block td:nth-child(5)::before{content:"Bron"}.entity-block td:nth-child(6)::before{content:"Verantwoordelijke"}.entity-block td:nth-child(7)::before{content:"Verplicht"}.entity-block td:nth-child(8)::before{content:"Bewerkbaar"}.entity-block td:nth-child(9)::before{content:"Persoonsgegeven"}.entity-block td:nth-child(10)::before{content:"Acties"}}@media(max-width:560px){.topbar{flex-direction:column;align-items:flex-start;padding:20px}.layout{padding:10px}.sidebar{grid-template-columns:1fr}.stats,.source-cards{grid-template-columns:1fr 1fr}.form-grid{grid-template-columns:1fr}.form-grid .wide{grid-column:auto}.panel-head,.entity-head{align-items:flex-start;flex-direction:column}.entity-actions{justify-content:flex-start}}
.icon-button{display:inline-grid;place-items:center;width:30px;height:30px;padding:6px}.icon-button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.icon-button:hover{color:var(--teal);border-color:var(--teal);background:#e5f6f3}.icon-button.delete:hover{color:var(--red);border-color:#efb6b0;background:#fff1f0}
.rules-field{margin-top:4px}.rules-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:12px}.rules-heading small{display:block;margin-top:4px;color:var(--muted);font-weight:500}.rule-list{display:grid;gap:8px;margin-top:10px}.rule-input{display:grid;grid-template-columns:minmax(0,1fr) 30px;align-items:center;gap:8px}.rule-input .control{margin:0}.field-rules{display:grid;gap:4px;margin-top:7px}.field-rules span{padding-left:9px;border-left:2px solid var(--teal);color:var(--muted);font-size:10px;line-height:1.35}
.option-buttons{display:flex;flex-wrap:wrap;gap:6px;margin-top:7px}.option-button{max-width:100%;padding:7px 9px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--text);font-size:12px;font-weight:700;cursor:pointer;text-align:left}.option-button:hover{border-color:var(--teal);background:#f1f7f6}.option-button.active{border-color:var(--teal);background:var(--teal);color:#fff}
.row-actions{display:flex;flex-wrap:nowrap;align-items:center;gap:5px}.technical-field{width:18%;white-space:nowrap;overflow:visible}.technical-field code{display:block;white-space:nowrap;font-size:clamp(8px,.72vw,11px)}.actions-cell{white-space:nowrap}@media(max-width:820px){td:nth-child(10)::before{content:"Persoonsdata"}.entity-block td:nth-child(9)::before{content:"Persoonsdata"}}
.page{display:grid;gap:18px;padding:20px;max-width:100%}.page>.layout{padding:0}.top-filters{position:relative;z-index:10}.filter-grid{display:grid;grid-template-columns:minmax(240px,1.4fr) minmax(190px,1fr) repeat(3,minmax(150px,1fr));gap:12px;align-items:start}.filter-grid label,.filter-grid .filter-field{margin:0}.filter-grid .multi-select .check-list{min-width:220px}.filter-grid .control{margin-top:6px}.entity-filter-panel .panel-head{margin-bottom:10px}.entity-filter-panel .option-buttons{display:grid;grid-template-columns:1fr}.entity-filter-panel .option-button{width:100%}
.grouped-table .col-group{width:9%}.grouped-table .col-description{width:16%}.grouped-table .col-technical{width:23%}.grouped-table .col-type{width:7%}.grouped-table .col-source{width:9%}.grouped-table .col-owner{width:16%}.grouped-table .col-required,.grouped-table .col-personal{width:7%}.grouped-table .col-actions{width:6%}.all-fields-table .col-entity{width:9%}.all-fields-table .col-group{width:8%}.all-fields-table .col-description{width:14%}.all-fields-table .col-technical{width:21%}.all-fields-table .col-type{width:6%}.all-fields-table .col-source{width:8%}.all-fields-table .col-owner{width:16%}.all-fields-table .col-required,.all-fields-table .col-personal,.all-fields-table .col-actions{width:6%}table th:nth-last-child(-n+4),table td:nth-last-child(-n+4),table th:last-child,table td:last-child,.technical-field{width:auto}@media(max-width:820px){.all-fields-table td:nth-child(9)::before{content:"Persoonsdata"}.all-fields-table td:nth-child(10)::before{content:"Acties"}.grouped-table td:nth-child(8)::before{content:"Persoonsdata"}.grouped-table td:nth-child(9)::before{content:"Acties"}}
@media(max-width:1250px){.filter-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.filter-grid .search-filter{grid-column:span 2}}@media(max-width:820px){.page{padding:14px}.filter-grid{grid-template-columns:1fr 1fr}.filter-grid .search-filter{grid-column:1/-1}}@media(max-width:560px){.page{padding:10px}.filter-grid{grid-template-columns:1fr}.filter-grid .search-filter{grid-column:auto}}
.signed-in-user{align-self:center;color:#d9e4ed;font-size:13px}.top-actions a.btn{text-decoration:none}.login-page{min-height:100vh;background:linear-gradient(135deg,var(--navy),var(--navy2));display:grid;place-items:center;padding:20px}.login-shell{width:min(440px,100%)}.login-card{background:#fff;border-radius:18px;padding:32px;box-shadow:0 28px 80px rgba(0,0,0,.3)}.login-card .eyebrow{color:var(--teal)}.login-card h1{margin:8px 0 6px;color:var(--navy)}.login-card>p{margin:0 0 24px;color:var(--muted)}.login-card label{display:block;font-size:13px;font-weight:800}.auth-submit{width:100%;margin-top:16px}.auth-message{margin:0 0 16px;padding:11px 12px;border-radius:9px;font-size:13px;font-weight:700}.error-message{color:var(--red);background:#fff1f0;border:1px solid #efb6b0}.notice-message{color:#166534;background:#e9f8ef;border:1px solid #b9e4c8}.code-control{font-size:24px;letter-spacing:.28em;text-align:center}.resend-form{text-align:center;margin-top:16px}.resend-form+.resend-form{margin-top:8px}.back-link{color:var(--muted)}.back-link:hover{color:var(--teal)}