:root{
  /* McKinsey-inspired palette: deep navy, electric blue, white surfaces */
  --navy:#051C2C; --navy2:#0a2940; --accent:#2251FF; --accent2:#00A9F4;
  --bg:#f5f6f8; --bg2:#ffffff; --bg3:#eef1f5; --line:#dfe4ea;
  --txt:#051C2C; --dim:#5f6b7a;
  --ok:#1f8a4c; --warn:#b8860b; --bad:#c62828; --crit:#b71c1c;
  --radius:8px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--txt);font-size:14px}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
button{font-family:inherit}

/* ---------- login ---------- */
.login-wrap{display:flex;align-items:center;justify-content:center;height:100vh;
  background:linear-gradient(135deg,var(--navy) 0%,#0d3350 60%,#10476e 100%)}
.login-card{background:#fff;border-radius:4px;box-shadow:0 18px 50px rgba(5,28,44,.45);
  padding:44px;width:400px;display:flex;flex-direction:column;gap:12px}
.logo{font-size:26px;font-weight:700;letter-spacing:.3px;color:var(--navy)}
.logo span{color:var(--accent)}
.logo.sm{font-size:18px;padding:20px 20px 10px;color:#fff}
.logo.sm span{color:var(--accent2)}
.tag{color:var(--dim);margin-bottom:10px}
.login-card input{background:#fff;border:1px solid #c4ccd6;border-radius:4px;
  padding:11px 12px;color:var(--txt);font-size:14px}
.login-card input:focus{outline:none;border-color:var(--accent)}
.err{color:var(--bad);min-height:18px;font-size:13px}
.hint{color:var(--dim);font-size:11.5px;line-height:1.5;margin-top:6px}

/* ---------- layout ---------- */
#app-view{display:flex;min-height:100vh}
.sidebar{width:225px;background:var(--navy);display:flex;flex-direction:column;
  position:fixed;top:0;bottom:0;z-index:10}
#nav{display:flex;flex-direction:column;padding:10px;gap:1px;flex:1}
#nav a{padding:9px 12px;border-radius:3px;color:#9fb0c0;font-weight:500;
  border-left:3px solid transparent;text-decoration:none}
#nav a:hover{background:var(--navy2);color:#fff;text-decoration:none}
#nav a.active{background:var(--navy2);color:#fff;border-left-color:var(--accent2)}
.side-footer{padding:14px;border-top:1px solid #12314a;font-size:12px;color:#9fb0c0;
  display:flex;flex-direction:column;gap:6px}
.side-footer a{color:#9fb0c0}
.llm-badge{padding:4px 8px;border-radius:3px;font-size:11px;width:fit-content}
.llm-badge.off{background:#3d3110;color:#e8c96a}
.llm-badge.on{background:#0e3b26;color:#7ede9f}
main{margin-left:225px;flex:1;min-width:0}
.topbar{display:flex;justify-content:space-between;align-items:center;
  padding:15px 28px;border-bottom:1px solid var(--line);background:#fff;
  position:sticky;top:0;z-index:5}
#page-title{font-size:17px;font-weight:700;color:var(--navy)}
#content{padding:24px 28px 60px}

/* ---------- widgets ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-bottom:22px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:16px;
  border-top:3px solid var(--navy)}
.card .num{font-size:26px;font-weight:700;margin-top:4px;color:var(--navy)}
.card .lbl{color:var(--dim);font-size:12.5px}
.card.alert{border-top-color:var(--crit)}
.card.alert .num{color:var(--crit)}
.panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:18px;margin-bottom:18px;box-shadow:0 1px 2px rgba(5,28,44,.04)}
.panel h3{font-size:14px;margin-bottom:12px;color:var(--navy)}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.spread{justify-content:space-between}

table.grid{width:100%;border-collapse:collapse;font-size:13px}
table.grid th{color:var(--dim);text-align:left;font-weight:600;padding:8px 10px;
  border-bottom:2px solid var(--navy);white-space:nowrap;background:#fff}
table.grid td{padding:8px 10px;border-bottom:1px solid var(--line);vertical-align:top}
table.grid tr:hover td{background:#f2f6ff}
.clickable{cursor:pointer}

.btn{background:#fff;color:var(--navy);border:1px solid #b9c2cd;
  padding:8px 14px;border-radius:3px;cursor:pointer;font-size:13px;font-weight:500}
.btn:hover{border-color:var(--accent);color:var(--accent)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.btn.primary:hover{background:#1a41d4;color:#fff}
.btn.danger{background:#fff;border-color:#e3a0a0;color:var(--bad)}
.btn.danger:hover{border-color:var(--bad)}
.btn.sm{padding:4px 10px;font-size:12px}
.btn.wide{width:100%}
.btn:disabled{opacity:.5;cursor:default}

input.inp,select.inp,textarea.inp{background:#fff;border:1px solid #c4ccd6;
  border-radius:3px;padding:8px 10px;color:var(--txt);font-size:13px}
input.inp:focus,select.inp:focus,textarea.inp:focus{outline:none;border-color:var(--accent)}
textarea.inp{width:100%;min-height:70px}
label.fld{display:flex;flex-direction:column;gap:5px;font-size:12.5px;color:var(--dim)}

.pill{display:inline-block;padding:2px 9px;border-radius:11px;font-size:11.5px;font-weight:600;white-space:nowrap}
.p-no{background:#eef1f5;color:#5f6b7a}
.p-pot{background:#fdf3d7;color:#8a6d00}
.p-pii{background:#fde8d7;color:#b35c00}
.p-sens{background:#fbdde2;color:#ad1435}
.p-crit{background:#fbdde2;color:#ad1435}
.p-high{background:#fde8d7;color:#b35c00}
.p-med{background:#fdf3d7;color:#8a6d00}
.p-low{background:#ddf3e4;color:#166b39}
.p-ok{background:#ddf3e4;color:#166b39}
.p-info{background:#e2ecff;color:#1d43cc}
.p-law{background:#e9e4fb;color:#5335b8}

.sev-Critical{color:var(--crit);font-weight:700}
.sev-High{color:#b35c00;font-weight:700}
.sev-Medium{color:#8a6d00}
.sev-Low{color:var(--ok)}

.tabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin-bottom:16px}
.tabs .tab{padding:8px 16px;cursor:pointer;color:var(--dim);border-bottom:2px solid transparent;font-weight:600;font-size:13px}
.tabs .tab.active{color:var(--navy);border-bottom-color:var(--accent)}
.tabs .tab:hover{color:var(--navy)}

/* modal */
.modal-bg{position:fixed;inset:0;background:rgba(5,28,44,.55);display:flex;
  align-items:center;justify-content:center;z-index:50}
.modal{background:#fff;border-radius:6px;box-shadow:0 24px 60px rgba(5,28,44,.35);
  padding:24px;min-width:440px;max-width:860px;max-height:88vh;overflow:auto;position:relative}
.modal h3{margin-bottom:14px;color:var(--navy)}
.modal .form{display:flex;flex-direction:column;gap:12px}
.modal-close{position:absolute;top:12px;right:14px;background:#fff;
  border:1px solid #c4ccd6;color:var(--dim);border-radius:3px;width:30px;height:30px;
  cursor:pointer;font-size:14px;line-height:1}
.modal-close:hover{color:var(--accent);border-color:var(--accent)}

/* toast */
#toast-root{position:fixed;bottom:20px;right:20px;display:flex;flex-direction:column;gap:8px;z-index:99}
.toast{background:var(--navy);color:#fff;border-left:4px solid var(--accent2);
  padding:11px 16px;border-radius:4px;max-width:380px;animation:fadein .2s;
  box-shadow:0 8px 24px rgba(5,28,44,.35)}
.toast.err{border-left-color:#ff6b6b}
.toast.ok{border-left-color:#51cf66}
@keyframes fadein{from{opacity:0;transform:translateY(8px)}to{opacity:1}}

/* alerts */
.bell{background:none;border:none;font-size:19px;cursor:pointer;position:relative}
.bell-count{position:absolute;top:-6px;right:-8px;background:var(--crit);color:#fff;
  font-size:10px;border-radius:10px;padding:1px 5px;font-weight:700}
.alerts-panel{position:fixed;right:18px;top:60px;width:400px;max-height:70vh;overflow:auto;
  background:#fff;border:1px solid var(--line);border-radius:6px;z-index:40;padding:10px;
  box-shadow:0 16px 40px rgba(5,28,44,.18)}
.alert-item{padding:10px;border-bottom:1px solid var(--line);font-size:12.5px}
.alert-item.unread{background:#f2f6ff}
.alert-item .t{font-weight:600}
.alert-item .d{color:var(--dim);margin-top:3px}

/* graph */
#kg-canvas{width:100%;height:640px;background:#fff;border:1px solid var(--line);border-radius:8px}
.kg-legend{display:flex;gap:14px;flex-wrap:wrap;margin:10px 0;font-size:12px;color:var(--dim)}
.kg-legend .sw{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px}

.muted{color:var(--dim)}
.small{font-size:12px}
.mono{font-family:Consolas,monospace;font-size:12px}
pre.sql{background:#f4f6f9;border:1px solid var(--line);border-left:3px solid var(--accent);
  border-radius:4px;padding:12px;overflow:auto;font-size:12px;font-family:Consolas,monospace;
  white-space:pre-wrap;color:#12314a}
.dupe{color:#8a6d00}
.bar{height:8px;border-radius:4px;background:var(--bg3);overflow:hidden;min-width:80px}
.bar>i{display:block;height:100%;background:var(--ok)}
.progress-note{color:var(--dim);font-size:12.5px;margin-top:8px}
.schema-law{display:grid;grid-template-columns:1fr 220px;gap:8px;align-items:center}
.badge-count{background:var(--bg3);border-radius:11px;padding:1px 9px;font-size:11.5px;color:var(--dim)}

/* master-detail (Regulations) */
.split{display:grid;grid-template-columns:270px minmax(0,1fr);gap:16px;align-items:start}
.side-list{padding:8px;position:sticky;top:74px;max-height:calc(100vh - 100px);overflow:auto}
.list-geo{font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;
  color:var(--dim);padding:10px 8px 4px}
.list-item{padding:8px 10px;border-radius:4px;cursor:pointer;border-left:3px solid transparent}
.list-item:hover{background:var(--bg3)}
.list-item.active{background:#eaf0ff;border-left-color:var(--accent)}
.list-item .li-name{font-weight:600;font-size:13px;color:var(--navy)}
@media (max-width:900px){.split{grid-template-columns:1fr}.side-list{position:static;max-height:none}}

/* rule matrix */
.matrix-wrap{overflow-x:auto}
table.matrix{table-layout:fixed;min-width:820px}
table.matrix th{white-space:normal}
table.matrix td{word-wrap:break-word}
table.matrix td{padding-right:16px}
table.matrix .pill{max-width:100%;overflow:hidden;text-overflow:ellipsis}

/* collapsible panes */
.nav-toggle{background:none;border:1px solid var(--line);border-radius:3px;color:var(--navy);
  font-size:15px;cursor:pointer;padding:3px 9px}
.nav-toggle:hover{border-color:var(--accent);color:var(--accent)}
body.nav-collapsed .sidebar{display:none}
body.nav-collapsed main{margin-left:0}
.split{grid-template-columns:270px auto minmax(0,1fr)}
.split.list-collapsed{grid-template-columns:auto minmax(0,1fr)}
.pane-toggle{position:sticky;top:74px;padding:6px 7px}
@media (max-width:900px){.split,.split.list-collapsed{grid-template-columns:1fr}.pane-toggle{display:none}}

/* connection wizard */
.wiz{display:flex;gap:6px;margin-bottom:16px}
.wiz-step{padding:6px 14px;border-radius:16px;font-size:12px;font-weight:600;
  background:var(--bg3);color:var(--dim);cursor:default}
.wiz-step.active{background:var(--accent);color:#fff}
.wiz-step.done{background:#ddf3e4;color:#166b39}

/* inline button spinner */
.spin{display:inline-block;width:12px;height:12px;border:2px solid rgba(34,81,255,.25);
  border-top-color:var(--accent);border-radius:50%;vertical-align:-2px;
  animation:spin .7s linear infinite}
.btn.primary .spin{border-color:rgba(255,255,255,.35);border-top-color:#fff}
@keyframes spin{to{transform:rotate(360deg)}}

/* scan progress stepper */
.scan-steps .step{display:flex;align-items:center;gap:8px;padding:3px 0;font-size:13px}
.scan-steps .step.pend{color:var(--dim);opacity:.6}
.scan-steps .step.done .step-ic{color:var(--ok);font-weight:700}
.scan-steps .step.active{font-weight:600;color:var(--navy)}
.scan-steps .step-ic{width:16px;text-align:center}
.scan-steps .step-detail{font-weight:400;margin-left:6px;max-width:520px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}

/* ---------- governance blueprint (logical-first) ---------- */
.bp-pick{display:grid;grid-template-columns:repeat(auto-fit,minmax(330px,1fr));gap:16px;margin-top:16px}
.bp-card{border-top:3px solid var(--accent)}
.bp-card h3{font-size:15px}
.bp-tree{list-style:none;margin:4px 0;padding-left:16px;font-size:13px}
.bp-tree>li{padding:2px 0}
.bp-prev-cols{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:10px}
.bp-prev-cols h4{font-size:13px;color:var(--navy);margin-bottom:6px}
@media(max-width:900px){.bp-prev-cols{grid-template-columns:1fr}}
.bp-two{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:1000px){.bp-two{grid-template-columns:1fr}}
.bp-meter{display:flex;align-items:center;gap:12px;margin:9px 0}
.bp-meter .lbl{font-size:12.5px;color:var(--dim);min-width:170px}
.bp-meter .bar{flex:0 0 220px;height:8px;background:var(--bg3);border-radius:5px;overflow:hidden}
.bp-meter .bar i{display:block;height:100%;border-radius:5px}
.bp-meter .pct{font-size:12.5px;font-weight:700;color:var(--navy);min-width:44px;text-align:right}
.bp-meter .hint{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pill.t-draft{background:#fdf3dc;color:#8a6d1a}
.pill.t-verified{background:#e2f3e8;color:var(--ok)}
.pill.t-deprecated{background:#f3e2e2;color:var(--bad)}
.modal.wide{width:min(980px,94vw);max-height:88vh;overflow-y:auto}
.bp-steps{margin:6px 0 4px 0;padding-left:32px;font-size:13px}
.bp-steps li{margin:3px 0}
.pill.t-inh{background:#e8e5f7;color:#5b3fd6}
tr.inh-row td{opacity:.82}
.pill.p-ext{background:#dcefe6;color:#1f8a4c}
.pill.p-board{background:#051c2c;color:#fff}
.tree-tgl{cursor:pointer;user-select:none;color:var(--accent);display:inline-block;
  width:18px;text-align:center;font-size:11px}
.tree-tgl:hover{color:var(--navy)}
.tree-tgl-sp{display:inline-block;width:18px}
.tree-count{margin-left:6px}
details.gloss-group{margin:10px 0;border:1px solid var(--line);border-radius:8px;padding:10px 14px;background:#fff}
details.gloss-group summary{cursor:pointer;user-select:none;font-size:13.5px;color:var(--navy)}
details.gloss-group summary:hover{color:var(--accent)}
/* richer job loader detail - wrap instead of truncating */
.scan-steps .step-detail{white-space:normal;max-width:640px;overflow:visible;
  text-overflow:clip;line-height:1.4}
.dqb-row{display:flex;align-items:flex-start;gap:10px;padding:7px 10px;margin-top:6px;
  background:var(--bg3);border-radius:6px}
.dqb-row .pill{margin-top:1px;min-width:92px;text-align:center}

/* obligations register */
.obl-cat{margin:14px 0 4px;font-weight:600;color:var(--navy);
  text-transform:uppercase;font-size:11px;letter-spacing:.06em;
  border-bottom:2px solid var(--navy);padding-bottom:3px}
.obl-cat:first-child{margin-top:2px}
.obl-row{display:grid;grid-template-columns:250px 1fr 44px 20px;gap:12px;
  align-items:start;padding:7px 0;border-bottom:1px solid var(--line)}
.obl-row:last-of-type{border-bottom:none}
.obl-who{font-size:11px;color:var(--dim);margin-top:1px}
.obl-row .pill{justify-self:end;margin-top:2px}
.obl-row .obl-del{color:var(--dim);text-decoration:none;font-size:13px;
  justify-self:end;margin-top:2px}
.obl-row .obl-del:hover{color:#c92a2a}

/* guided journey bar */
.bp-journey{display:flex;align-items:center;flex-wrap:wrap;gap:8px;
  background:var(--bg3);border:1px solid var(--line);border-radius:6px;
  padding:9px 14px;margin-bottom:12px;font-size:12px}
.bpj-step{color:var(--dim);white-space:nowrap}
.bpj-step.done{color:#2b8a3e}
.bpj-step.cur{color:var(--navy);font-weight:700;background:#fff;
  border:1px solid var(--accent);border-radius:12px;padding:3px 10px}
.bpj-sep{color:var(--line)}
.bpj-next{margin-left:auto;display:flex;align-items:center;gap:10px;
  color:var(--navy)}

/* BCBS 239 lens */
.bcbs-row{display:grid;grid-template-columns:320px 1fr;gap:14px;
  padding:8px 0;border-bottom:1px solid var(--line);align-items:start}
.bcbs-row:last-of-type{border-bottom:none}
.bcbs-head .pill{margin-right:4px}
.bcbs-ev{color:#2b8a3e;padding:1px 0}
.bcbs-gap{color:#b0871a;padding:1px 0}

/* floating job progress - visible regardless of scroll position */
#job-float{position:fixed;bottom:24px;right:24px;z-index:80;display:none;
  width:420px;max-width:calc(100vw - 48px);background:#fff;
  border:1px solid var(--line);border-left:4px solid var(--accent);
  border-radius:8px;box-shadow:0 12px 40px rgba(5,28,44,.25);
  padding:14px 16px;max-height:50vh;overflow-y:auto}

/* guided setup panel */
#guide-panel{position:fixed;top:90px;right:18px;z-index:60;width:330px;
  background:#fff;border:1px solid var(--line);border-radius:10px;
  box-shadow:0 14px 44px rgba(5,28,44,.22);padding:14px 16px;
  max-height:calc(100vh - 120px);overflow-y:auto}
.gp-head{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.gp-head .gp-close{margin-left:auto;background:none;border:none;cursor:pointer;
  color:var(--dim);font-size:14px}
.gp-step{display:flex;gap:10px;padding:7px 0;border-bottom:1px solid var(--bg3)}
.gp-step:last-of-type{border-bottom:none}
.gp-num{width:22px;height:22px;border-radius:50%;background:var(--bg3);
  color:var(--dim);display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:700;flex-shrink:0;margin-top:1px}
.gp-step.done .gp-num{background:#d3f9d8;color:#2b8a3e}
.gp-step.cur .gp-num{background:var(--accent);color:#fff}
.gp-step.cur{background:#f6f9ff;margin:0 -8px;padding:7px 8px;border-radius:8px}
.gp-step:not(.cur):not(.done) .gp-body{color:var(--dim)}

/* retired buttons: step complete - still clickable for deliberate re-runs */
.btn.dim{opacity:.42;filter:grayscale(.65)}
.btn.dim:hover{opacity:.85;filter:grayscale(0)}

/* type-to-filter for long selects */
.sel-search{margin-bottom:4px;font-size:12px;padding:4px 8px}

/* compact CDE rows */
.clamp2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cov-list summary{list-style:none}
.cov-list summary::-webkit-details-marker{display:none}

/* scan pipeline: stages joined by arrows, current stage lit by the journey */
.scan-pipe{display:inline-flex;align-items:center;gap:4px;
  border:1px dashed var(--line);border-radius:8px;padding:3px 8px;
  background:var(--bg3)}
.scan-pipe .pipe-arrow{color:var(--dim);font-size:12px}
.scan-pipe .btn{border:none;background:transparent;box-shadow:none;pointer-events:none;cursor:default}
.scan-pipe .btn.primary{background:var(--accent);color:#fff;border-radius:6px}
.scan-pipe .btn.dim{opacity:.45}

/* attestation lifecycle */
.pill.t-expiring{background:#fdebd3;color:#9a5b00}
.pill.t-expired{background:#fde3e3;color:#a11d2b}
.pill.t-disp{background:#e7e3fb;color:#4b35b3}
.dq-gap{display:flex;gap:6px;align-items:center;margin-top:4px;flex-wrap:wrap}

/* catalogue */
details.cat-unit{border:1px solid var(--line,#e3e6ee);border-radius:8px;padding:8px 12px;margin:8px 0;background:var(--panel,#fff)}
details.cat-unit>summary{cursor:pointer;font-weight:600;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
details.cat-dom{margin:6px 0 6px 18px;padding-left:10px;border-left:2px solid var(--line,#e3e6ee)}
details.cat-dom>summary{cursor:pointer;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
details.cat-dom.lvl1>summary .cat-name{font-weight:600}
.cat-name{color:var(--accent,#2b5fd9)}
.cat-meta{display:inline-flex;gap:10px;align-items:center;font-size:12px;color:#6b7280;margin-left:auto;flex-wrap:wrap}
.cat-desc{margin:2px 0 4px 22px}
table.cat-tables{margin:4px 0 6px 22px;width:calc(100% - 22px);font-size:12.5px}

.pill.p-share{background:#e3f0fb;color:#1f5fa8}

.pill.p-cut{background:#eef0f5;color:#5a6b8c;border:1px dashed #b9c1d1}
.bpj-step.opt{opacity:.6}
.modal.wide{max-width:min(1180px,96vw);width:min(1180px,96vw)}
.pd-grid td.pd-cell{vertical-align:top;background:#fafbfd;transition:background .15s}
.pd-grid td.pd-cell.on{background:#eaf3ff}
.pd-grid td.pd-cell label{display:flex;gap:6px;align-items:flex-start;cursor:pointer}
.pd-grid td.pd-cell input{margin-top:3px}
