:root{
  --ink:#12331f; --green:#1e4729; --green-deep:#12331f; --accent2:#3f7a24;
  --lemon:#f7d65a; --lemon-deep:#dfb32b; --muted:#5f7a67; --border:#dbe7de;
  --surface:#ffffff; --bg:#f2f7f3; --soft:#eaf3ec; --radius:16px;
  --shadow:0 10px 30px rgba(18,51,31,.10);
  --on:#3f7a24; --off:#b04a3a; --report:#b8860b;
  --hover:#fafdf9; --line:#f0f5f1; --soft2:#f6faf7; --glow:#cdeed4;
  --ok-bg:#e5f3d9; --ok-bg2:#eef8f1; --ok-bd:#c3e0ad;
  --warn-bg:#fdf3c9; --warn-bg2:#fdf8e6; --warn-bd:#eeda8e; --warn-fg:#8a6d0b;
  --bad-bg:#f7e3df; --bad-bg2:#fdeeec; --bad-bd:#eec4bc;
  --crit-bg:#f7dfdb; --crit-fg:#8f2f1f; --high-bg:#fbe6d4; --high-fg:#a04d0b;
  --blue:#1f4e8f; --blue-bg:#dde9f7;
  --na:#cdd8d0; --faint:#b9ccbe; --ghost-bd:#26402f; --on-deep-mute:#c6d6ca;
  --hl:rgba(63,122,36,.10); --hl2:rgba(63,122,36,.22);
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--ink);font-size:14px}
button{font-family:inherit;cursor:pointer}
a{color:var(--accent2)}
.muted{color:var(--muted)}
.mini{font-size:12px;color:var(--muted)}

/* ---------- header ---------- */
header{background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:50}
.hwrap{max-width:1180px;margin:0 auto;padding:12px 24px;display:flex;align-items:center;gap:14px}
.logo{display:flex;align-items:center;gap:10px}
.logo{cursor:pointer}
.logo b{font-size:17px;letter-spacing:-.02em}
.logo b span{color:var(--accent2)}
.app-tag{background:var(--soft);color:var(--green);font-weight:600;font-size:12px;padding:4px 10px;border-radius:999px;border:1px solid var(--border)}
/* tool tab bar — sticky under the header. The inner strip is centred and
   aligned to the card width, so tabs open outward from the middle. */
.toolnav{position:sticky;top:58px;z-index:45;background:var(--surface);border-bottom:1px solid var(--border);padding:6px 0}
.toolnav-inner{max-width:1180px;margin:0 auto;padding:0 24px;display:flex;gap:4px;align-items:center;
  justify-content:center;overflow-x:auto;scrollbar-width:thin}
.toolnav-inner::-webkit-scrollbar{height:6px}
.toolnav-btn{flex:none;border:1px solid transparent;background:none;color:var(--muted);font-weight:600;font-size:12.5px;
  padding:6px 12px;border-radius:8px;white-space:nowrap;cursor:pointer;transition:.12s}
.toolnav-btn:hover{background:var(--soft);color:var(--ink)}
/* home reads as a real button, not a stray glyph */
.toolnav-btn.home{padding:6px 11px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--muted)}
.toolnav-btn.home svg{width:19px;height:19px;display:block}
.toolnav-btn.home:hover{background:var(--soft);border-color:var(--green);color:var(--green)}
.toolnav-btn.home.active{background:var(--green);border-color:var(--green);color:#fff}
:root[data-theme="dark"] .toolnav-btn.home.active{color:#0b120e}
/* header "Tools" button — same house, sized to sit next to the label */
.btn.home-btn{display:inline-flex;align-items:center;gap:7px}
.btn.home-btn svg{width:16px;height:16px;flex:none}
.toolnav-btn.add{font-size:15px;padding:5px 11px;color:var(--green)}
/* an open tab = label + close, sharing a pill */
.toolnav-tab{flex:none;display:inline-flex;align-items:center;border:1px solid var(--border);border-radius:8px;background:var(--soft)}
.toolnav-tab .toolnav-btn{border:0;padding:6px 6px 6px 12px}
.toolnav-tab .toolnav-x{border:0;background:none;color:var(--muted);cursor:pointer;font-size:15px;line-height:1;padding:4px 9px 4px 4px;border-radius:0 8px 8px 0}
.toolnav-tab .toolnav-x:hover{color:var(--off)}
.toolnav-tab.active{background:var(--green);border-color:var(--green)}
.toolnav-tab.active .toolnav-btn,.toolnav-tab.active .toolnav-x{color:#fff}
/* keep the active (green) tab readable on hover — the generic .toolnav-btn:hover
   paints a light background, which left white text unreadable on green */
.toolnav-tab.active .toolnav-btn:hover{background:rgba(255,255,255,.15);color:#fff}
.toolnav-tab.active .toolnav-x:hover{background:rgba(255,255,255,.15);color:#fff}
:root[data-theme="dark"] .toolnav-tab.active .toolnav-btn,:root[data-theme="dark"] .toolnav-tab.active .toolnav-x{color:#0b120e}
:root[data-theme="dark"] .toolnav-tab.active .toolnav-btn:hover,:root[data-theme="dark"] .toolnav-tab.active .toolnav-x:hover{background:rgba(0,0,0,.12);color:#0b120e}
/* + menu popover */
.toolnav-menu{position:fixed;z-index:410;background:var(--surface);border:1px solid var(--border);border-radius:12px;
  box-shadow:var(--shadow);padding:6px;max-height:60vh;overflow:auto;width:264px}
.toolnav-menu button{display:block;width:100%;text-align:left;border:0;background:none;color:var(--ink);
  font-size:13px;padding:8px 10px;border-radius:8px;cursor:pointer}
.toolnav-menu button:hover{background:var(--soft)}
.toolnav-menu button.open{color:var(--muted)}
.spacer{flex:1}
.tenant{display:none;align-items:center;gap:10px;font-size:13px;color:var(--muted)}
.avatar{width:32px;height:32px;border-radius:50%;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:13px}
.btn{border:1px solid var(--border);background:var(--surface);color:var(--ink);padding:8px 16px;border-radius:10px;font-weight:600;font-size:13px;display:inline-flex;align-items:center;gap:8px;transition:.15s}
.btn:hover{border-color:var(--accent2)}
.btn.primary{background:var(--green);color:#fff;border-color:var(--green)}
.btn.primary:hover{background:var(--accent2);border-color:var(--accent2)}
.btn.lemon{background:var(--lemon);border-color:var(--lemon-deep);color:var(--green-deep)}
.btn.ghost{background:none;color:#fff;border-color:var(--ghost-bd)}
.btn:disabled{opacity:.45;cursor:not-allowed}

main{max-width:1180px;margin:0 auto;padding:28px 24px 80px}

/* ---------- login / loading ---------- */
#screen-login,#screen-loading{align-items:center;justify-content:center;min-height:calc(100vh - 160px)}
#screen-login.active,#screen-loading.active{display:flex}
.login-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:48px;max-width:460px;text-align:center;
  background-image:radial-gradient(500px 260px at 85% -80px,var(--glow) 0%,transparent 60%)}
.login-card h1{font-size:24px;margin:18px 0 8px;letter-spacing:-.02em}
.login-card p{color:var(--muted);line-height:1.55;margin-bottom:26px}
.ms-btn{width:100%;justify-content:center;padding:12px;font-size:14px}
.login-note{margin-top:20px;font-size:12px;color:var(--muted);line-height:1.5}
.login-note code{background:var(--soft);padding:1px 6px;border-radius:6px;font-size:11px}
.spinner{width:44px;height:44px;border:4px solid var(--soft);border-top-color:var(--accent2);border-radius:50%;margin:0 auto 18px;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---------- toolbar (sticky below the header while scrolling) ---------- */
/* One toolbar shape for every tool: search / filters / view switch on the left,
   actions in a right-aligned group that wraps as a unit instead of scattering. */
.toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;row-gap:10px;
  position:sticky;top:106px;z-index:40;background:var(--bg);
  padding:12px 0;margin:-12px 0 6px;box-shadow:0 6px 12px -8px rgba(18,51,31,.15)}
.tb-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-left:auto}
.toolbar > .chk{margin:0}
/* every control in a toolbar shares one height, so nothing sits half a row off */
.toolbar .btn,.toolbar .seg,.toolbar .fchip,.toolbar .chk,.toolbar .search input,
.toolbar select.btn,.toolbar input.btn{min-height:38px}
.toolbar .seg button{padding:0 16px}
.toolbar .fchip{padding:0 14px;display:inline-flex;align-items:center}
.toolbar .chk{display:inline-flex;align-items:center;gap:8px;padding:0 4px}
.toolbar .search input{padding-top:0;padding-bottom:0}
.toolbar .search svg{top:50%;transform:translateY(-50%)}
.search{flex:1;min-width:220px;position:relative}
.search input{width:100%;padding:9px 32px 9px 36px;border:1px solid var(--border);border-radius:10px;font:inherit;background:var(--surface)}
.search svg{position:absolute;left:11px;top:9px;opacity:.45}
/* Clear (×). Visibility is driven by :placeholder-shown rather than a JS flag,
   so it also disappears when a tool resets its own box in code. */
.search-x{position:absolute;right:4px;top:50%;transform:translateY(-50%);display:none;
  width:24px;height:24px;line-height:22px;text-align:center;padding:0;border:0;border-radius:50%;
  background:none;color:var(--muted);font-size:18px;cursor:pointer}
.search-x:hover{background:var(--hover);color:var(--text)}
.search input:not(:placeholder-shown)~.search-x{display:block}
.seg{display:flex;border:1px solid var(--border);border-radius:10px;overflow:hidden;background:var(--surface)}
.seg button{border:0;background:none;padding:8px 16px;font-weight:600;font-size:13px;color:var(--muted)}
.seg button.active{background:var(--green);color:#fff}
.chip-filter{display:flex;gap:6px;flex-wrap:wrap}
.fchip{border:1px solid var(--border);background:var(--surface);border-radius:999px;padding:6px 12px;font-size:12px;font-weight:600;color:var(--muted)}
.fchip.active{background:var(--soft);color:var(--green);border-color:var(--accent2)}

/* ---------- policy list ---------- */
.list-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
table.plist{width:100%;border-collapse:collapse}
table.plist th{background:var(--soft);text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:10px 14px;border-bottom:1px solid var(--border)}
table.plist td{padding:12px 14px;border-bottom:1px solid var(--border);vertical-align:middle}
table.plist tr:last-child td{border-bottom:0}
table.plist tr:hover td{background:var(--hover)}
.pname{font-weight:600;cursor:pointer}
.pname:hover{color:var(--accent2);text-decoration:underline}
.state{font-size:11px;font-weight:700;padding:3px 10px;border-radius:999px;white-space:nowrap}
.state.on{background:var(--ok-bg);color:var(--on)}
.state.off{background:var(--bad-bg);color:var(--off)}
.state.report{background:var(--warn-bg);color:var(--report)}
/* stays put while you scroll and select — sticks just under the sticky toolbar
   (header 58 + tab bar 48 + toolbar ~62). z-index below the toolbar so the two
   never fight if the toolbar wraps on a narrow width. */
/* sits directly under the sticky toolbar — the toolbar wraps to more rows on
   narrow screens, so its real height is measured in JS into --selbar-top */
.selbar{display:none;align-items:center;gap:12px;background:var(--green-deep);color:#fff;border-radius:12px;padding:10px 16px;margin-bottom:14px;box-shadow:var(--shadow);
  position:sticky;top:var(--selbar-top,168px);z-index:39;flex-wrap:wrap;row-gap:8px}
.selbar.visible{display:flex}
.selbar b{color:var(--lemon)}
.selhint{color:var(--on-deep-mute)}
/* actions on the current selection, inside the (dark) selection bar. Ghost by
   default so the highlighted one — the tool you entered from — stands out. */
.sel-actions{display:flex;flex-wrap:wrap;gap:8px}
.sel-actions .btn{padding:6px 12px;font-size:12px;background:none;color:#fff;border-color:var(--ghost-bd)}
.sel-actions .btn:hover{background:rgba(255,255,255,.10);border-color:#fff}
.sel-actions .btn.on{background:var(--lemon);border-color:var(--lemon-deep);color:var(--green-deep)}
.sel-actions .btn.on:hover{background:var(--lemon)}
/* destructive action — visually separated from the rest so it is never the
   button you hit by muscle memory */
.sel-actions .btn.danger{border-color:var(--bad-bd);color:#ffb4a6}
.sel-actions .btn.danger:hover{background:var(--off);border-color:var(--off);color:#fff}
.sel-sep{width:1px;align-self:stretch;background:var(--ghost-bd);margin:0 2px}

/* ---------- Conditional Access groups ---------- */
/* Own table styling rather than .mtable: this is a plain list, so the header
   scrolls with it instead of sticking under the (already sticky) toolbar. */
.cg-tablewrap{background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden;margin-top:14px}
.cg-table{width:100%;border-collapse:collapse;font-size:13px}
.cg-table thead th{background:var(--soft);text-align:left;padding:9px 12px;font-size:11px;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--border);white-space:nowrap}
.cg-table td{padding:9px 12px;border-bottom:1px solid var(--border);vertical-align:top}
.cg-table tbody tr:last-child td{border-bottom:0}
.cg-table .tag{font-size:10px;padding:1px 6px}
.cg-mem{white-space:nowrap}
.btn.sm{padding:3px 10px;font-size:11px;border-radius:8px}
/* persona quick-pick in the assign wizard */
.persona-row{display:flex;flex-wrap:wrap;gap:6px}
.persona-chip{background:var(--soft);border-color:var(--border)}
.persona-chip.on,.btn.sm.on{background:var(--lemon);border-color:var(--lemon-deep);color:var(--green-deep)}
/* per-persona apply-flow trigger on the group headers */
.flow-btn{margin-left:10px;vertical-align:middle}
.cardgroup .flow-btn{margin-left:auto}
.cg-table .cg-ic{text-align:center;font-weight:700}
.cg-ic.ok{color:var(--on)} .cg-ic.bad{color:var(--off)} .cg-ic.warn{color:var(--report)} .cg-ic.info{color:var(--na)}
.cg-row{cursor:pointer}
.cg-row:hover{background:var(--ok-bg2)}
.cg-err{color:var(--off);font-weight:600}
.cg-matrix td.cellv{text-align:center;color:var(--on);font-size:15px}
.cg-panel{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:16px 18px;margin-top:14px}
.cg-panel h4{font-size:13px;margin-bottom:8px}
.cg-progress{height:6px;border-radius:3px;background:var(--border);overflow:hidden;margin:10px 0}
.cg-progress > div{height:100%;background:var(--green);transition:width .2s}
.cg-pick{max-height:44vh;overflow:auto;border:1px solid var(--border);border-radius:10px;padding:8px 10px;margin-top:8px}

/* ---------- What-If flow (per policy + simulator) ---------- */
.wf-flow{max-width:640px;margin:0 auto}
.wf-note{background:var(--warn-bg);border:1px solid var(--warn-bd);color:var(--report);border-radius:8px;padding:8px 12px;font-size:12.5px;margin-bottom:10px}
.wf-stage{border:1px solid var(--border);border-radius:12px;background:var(--surface);overflow:hidden}
.wf-stage-h{padding:8px 14px;font-weight:600;font-size:13px;background:var(--soft);border-bottom:1px solid var(--border)}
.wf-stage-b{padding:10px 14px;font-size:13px}
.wf-scope .wf-stage-h{background:var(--ok-bg2)}
.wf-cond .wf-stage-h{background:var(--warn-bg)}
.wf-grant .wf-stage-h{background:var(--ok-bg);color:var(--on)}
.wf-block .wf-stage-h{background:var(--bad-bg);color:var(--off)}
.wf-session .wf-stage-h{background:var(--soft)}
.wf-arrow{text-align:center;color:var(--accent2);font-size:14px;line-height:1.1;padding:3px 0}
.wf-arrow span{display:block;font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.wf-row{display:flex;gap:8px;align-items:flex-start;margin:4px 0;flex-wrap:wrap}
.wf-lbl{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;padding:2px 7px;border-radius:6px;white-space:nowrap;margin-top:1px}
.wf-lbl.in{background:var(--ok-bg);color:var(--on)}.wf-lbl.ex{background:var(--bad-bg);color:var(--off)}
.wf-chip{display:inline-block;background:var(--soft);border:1px solid var(--border);border-radius:6px;padding:1px 8px;font-size:12px;margin:2px 3px 2px 0}
.wf-chip.in{border-color:var(--ok-bd)}.wf-chip.ex{border-color:var(--bad-bd);color:var(--off)}
.wf-chip.ro{background:var(--warn-bg);border-color:var(--warn-bd);color:var(--report)}
.wf-chip.muted{color:var(--muted)}
.wf-hint,.wf-mut{color:var(--muted);font-size:11.5px}
.wf-hint{margin-top:6px}
.wf-gates{display:flex;flex-direction:column;gap:5px}
.wf-gate{background:var(--warn-bg2);border:1px solid var(--warn-bd);border-radius:7px;padding:5px 9px;font-size:12.5px}
.wf-ctrl{background:var(--ok-bg2);border:1px solid var(--ok-bd);border-radius:7px;padding:5px 9px;font-size:12.5px;margin:3px 0}
.wf-outcome{border-radius:10px;padding:11px 14px;font-weight:600;font-size:13.5px;text-align:center;margin-top:2px}
.wf-outcome.allow,.wf-outcome.grant{background:var(--ok-bg);color:var(--on);border:1px solid var(--ok-bd)}
.wf-outcome.block{background:var(--bad-bg);color:var(--off);border:1px solid var(--bad-bd)}
.wf-outcome.none{background:var(--soft);color:var(--muted);border:1px solid var(--border)}
.wf-outcome{text-align:left}
.wf-blockers{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.wf-blk{display:inline-block;background:var(--surface);border:1px solid currentColor;border-radius:6px;padding:2px 9px;font-size:12px;font-weight:600;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wf-outcome.block .wf-blk{cursor:pointer}
.wf-outcome.grant .wf-blk{background:var(--surface)}
.wf-notes{margin:10px 0 2px;display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
.wf-nk{display:inline-block;min-width:82px;font-weight:600;color:var(--ink);text-transform:uppercase;font-size:10.5px;letter-spacing:.04em;margin-right:6px}
.wf-dot.maybe{background:var(--report)}
.wf-chip.maybe{background:var(--warn-bg);border-color:var(--warn-bd);color:var(--report)}
/* the trigger + panel on the policy card */
.wf-toggle{margin:2px 0 0}
.wf-panel{border-top:1px solid var(--border);margin-top:10px;padding-top:12px}
/* per-policy quick actions under the detail card */
.pcard-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:12px}
.pcard-actions .pa-sep{width:1px;align-self:stretch;background:var(--border);margin:2px 2px}

/* simulator */
.wf-sim{font-size:13px}
.wf-sub{font-size:14px;margin-bottom:6px}
.wf-scrow{margin-bottom:10px}
.wf-cols{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:12px}
@media(max-width:820px){.wf-cols{grid-template-columns:1fr}}
.wf-colh{font-size:12px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:6px}
.wf-pol{border:1px solid var(--border);border-radius:9px;padding:7px 10px;margin-bottom:6px;background:var(--surface)}
.wf-pol.off{opacity:.72}
.wf-pol-h{display:flex;align-items:center;gap:7px}
.wf-pol-h .pol-link{cursor:pointer}
.wf-pol-h .pol-link:hover{text-decoration:underline}
.wf-pol-why{font-size:11.5px;color:var(--muted);margin-top:3px}
.wf-dot{width:9px;height:9px;border-radius:50%;flex:none}
.wf-dot.on{background:var(--on)}.wf-dot.ro{background:var(--report)}.wf-dot.off{background:var(--na)}
.wf-simform{display:flex;flex-direction:column;gap:12px;margin-bottom:12px}
.wf-simform .fld{display:flex;flex-direction:column;gap:4px;min-width:0}
.wf-simform label{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.wf-simform input,.wf-simform select{width:100%;border:1px solid var(--border);background:var(--surface);color:var(--ink);border-radius:8px;padding:8px 11px;font-size:13px;min-height:38px}
.wf-userrow{display:flex;gap:8px}
.wf-userrow input{flex:1}
.wf-userrow .btn{white-space:nowrap}
/* the five condition dropdowns share the row evenly and wrap gracefully */
.wf-conds{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
@media(max-width:820px){.wf-conds{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.wf-conds{grid-template-columns:1fr}}

/* rendered Markdown report inside the viewer overlay */
.md-view{max-height:62vh;overflow:auto;padding-right:6px;font-size:13px;line-height:1.6}
.md-view h1{font-size:18px;margin:0 0 10px}
.md-view h2{font-size:15px;margin:18px 0 8px;padding-bottom:5px;border-bottom:1px solid var(--border);color:var(--green)}
.md-view h3{font-size:13.5px;margin:14px 0 6px}
.md-view p{margin:6px 0}
.md-view ul{margin:6px 0 6px 18px}
.md-view li{margin:3px 0}
.md-view code{background:var(--bad-bg2);border:1px solid var(--border);border-radius:5px;padding:1px 5px;font-size:12px}
.md-view table{width:100%;border-collapse:collapse;margin:8px 0;font-size:12.5px}
.md-view th,.md-view td{border:1px solid var(--border);padding:6px 9px;text-align:left;vertical-align:top}
.md-view th{background:var(--ok-bg2);font-weight:600}
.md-view hr{border:0;border-top:1px solid var(--border);margin:14px 0}
.md-view .md-bad{color:var(--off);font-weight:600}
.md-view .md-ok{color:var(--on);font-weight:600}

/* delete confirmation */
.btn.danger{background:var(--off);border-color:var(--off);color:#fff}
.btn.danger:hover{background:#8f3a2d;border-color:#8f3a2d}
.danger-note{background:var(--bad-bg2);border:1px solid var(--bad-bd);color:var(--off);border-radius:10px;padding:10px 12px;margin:10px 0;font-size:13px;line-height:1.5}
.danger-note b{color:var(--off)}
input.txt{width:100%;border:1px solid var(--border);background:var(--surface);color:var(--ink);border-radius:10px;padding:9px 12px;font-size:13px;font-weight:600;letter-spacing:.06em}
input.txt:focus{outline:none;border-color:var(--off)}
input[type=checkbox]{width:16px;height:16px;accent-color:var(--green)}
.excl-note{color:var(--off)}

/* persona group header spanning the full cards grid (click to collapse/expand) */
.cardgroup{grid-column:1/-1;display:flex;align-items:baseline;gap:10px;margin-top:10px;padding-bottom:6px;border-bottom:2px solid var(--border);cursor:pointer;user-select:none}
.cardgroup:first-child{margin-top:0}
.cardgroup h3{font-size:15px;letter-spacing:-.01em;color:var(--green)}
.cardgroup:hover h3{color:var(--accent2)}
.cardgroup .caret{display:inline-block;width:13px;color:var(--accent2);font-size:10px;transform:rotate(90deg);transition:transform .15s}
.cardgroup.collapsed .caret{transform:rotate(0deg)}
.cardgroup input[type=checkbox]{margin-right:2px}

/* list view persona group header row */
tr.grouprow{cursor:pointer;user-select:none}
tr.grouprow td{background:var(--soft);border-bottom:1px solid var(--border)}
tr.grouprow b{color:var(--green)}
tr.grouprow .caret{display:inline-block;width:13px;color:var(--accent2);font-size:10px;transform:rotate(90deg);transition:transform .15s}
tr.grouprow.collapsed .caret{transform:rotate(0deg)}
tr.grouprow:hover td{background:var(--line)}

/* ---------- cards view (compact summary cards, multiple per row) ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:18px;align-items:start}
.scard{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px;display:flex;flex-direction:column;gap:13px;cursor:pointer;transition:.15s}
.scard:hover{border-color:var(--accent2);transform:translateY(-1px)}
.scard-top{display:flex;gap:12px;align-items:flex-start}
.scard-ic{width:40px;height:40px;border-radius:10px;background:var(--soft);display:flex;align-items:center;justify-content:center;flex:none}
.scard-title{flex:1;min-width:0}
.scard-title h3{font-size:14.5px;line-height:1.35;letter-spacing:-.01em;overflow-wrap:anywhere}
.scard-title .mini{margin-top:4px}
.scard-right{display:flex;gap:8px;align-items:center;flex:none}
.scard-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px}
.scard-grid label,.scard-controls label{display:block;font-size:11px;color:var(--muted);margin-bottom:3px}
.scard-grid b{font-size:13px;font-weight:600}
.scard-controls{border-top:1px solid var(--border);padding-top:11px}
.scard-foot{font-size:11px;color:var(--muted);border-top:1px solid var(--border);padding-top:10px;overflow-wrap:anywhere}
.modal.wide{max-width:1140px;width:100%;max-height:88vh;overflow:auto;padding:0;background:transparent;box-shadow:none}

/* ---------- detailed policy card (detail modal + exports) ---------- */
.pcard{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.pcard-head{background:linear-gradient(100deg,var(--green-deep) 0%,var(--green) 70%);color:#fff;padding:16px 22px;display:flex;align-items:center;gap:14px}
.pcard-head img{flex:none}
.pcard-head h3{font-size:16px;letter-spacing:-.01em}
.pcard-head .meta{font-size:11px;opacity:.75;margin-top:3px;font-weight:400}
.pcard-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.sect{padding:16px 20px;border-right:1px solid var(--border);border-bottom:1px solid var(--border)}
.sect:nth-child(3n){border-right:0}
.sect.wide{grid-column:1/-1;border-right:0}
.sect h4{font-size:11px;text-transform:uppercase;letter-spacing:.07em;color:var(--accent2);margin-bottom:9px}
.sect ul{list-style:none}
.sect li{padding:3px 0;font-size:13px;line-height:1.45;overflow-wrap:anywhere}
.sect li.excl{color:var(--off)}
.sect li.flow{font-size:12px;line-height:1.6;color:var(--ink)}
.sect li.flow.excl{color:var(--off)}
.sect li.na{color:var(--faint);font-style:italic}
.sect code{background:var(--soft);padding:1px 5px;border-radius:5px;font-size:11px}
.tag{display:inline-block;background:var(--soft);border:1px solid var(--border);border-radius:6px;padding:1px 7px;font-size:11px;font-weight:600;color:var(--green);margin:1px 2px 1px 0}
.tag.grant{background:var(--ok-bg);border-color:var(--ok-bd)}
.tag.block{background:var(--bad-bg);border-color:var(--bad-bd);color:var(--off)}
.tag.new{background:var(--warn-bg);border-color:var(--warn-bd);color:var(--warn-fg)}
.pcard-foot{padding:10px 22px;display:flex;align-items:center;gap:10px;background:var(--hover)}
.dep-bar{padding:10px 22px;border-top:1px solid var(--border);display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.dep-link{cursor:pointer}
.dep-link:hover{border-color:var(--accent2);color:var(--accent2)}
.dep-kv{list-style:none;margin:0 0 12px;padding:0}
.dep-kv li{padding:6px 0;border-bottom:1px solid var(--line);font-size:13px;display:flex;gap:12px}
.dep-kv li b{min-width:220px;color:var(--muted);font-weight:600}
.dep-raw pre{background:var(--soft);border-radius:8px;padding:12px;font-size:11px;overflow:auto;max-height:260px}
.pcard-foot .mini{flex:1}

/* ---------- matrix ---------- */
/* exclusion analyzer: matrix wrapper with a visible horizontal scrollbar */
/* every matrix view uses the same scroll container: card surface, visible
   horizontal scrollbar, sticky header + first column */
.mwrap-x,.matrix-wrap,.gc-wrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:auto;scrollbar-width:thin;scrollbar-color:var(--accent2) var(--soft)}
/* the exclusion grid scrolls inside its own box (height refined in JS) so the
   sticky policy header row and sticky first column stay on screen */
.mwrap-x{max-height:calc(100vh - 260px);min-height:280px}
.mwrap-x::-webkit-scrollbar,.matrix-wrap::-webkit-scrollbar,.gc-wrap::-webkit-scrollbar{height:12px;width:12px}
.mwrap-x::-webkit-scrollbar-thumb,.matrix-wrap::-webkit-scrollbar-thumb,.gc-wrap::-webkit-scrollbar-thumb{background:var(--accent2);border-radius:6px}
.mwrap-x::-webkit-scrollbar-track,.matrix-wrap::-webkit-scrollbar-track,.gc-wrap::-webkit-scrollbar-track{background:var(--soft);border-radius:6px}

.scroll-hint{background:var(--soft);border:1px solid var(--border);border-radius:10px;color:var(--green);font-weight:600;font-size:12px;padding:8px 14px;margin-bottom:10px;text-align:center}
table.matrix{border-collapse:collapse;min-width:900px;width:100%}
table.matrix th,table.matrix td{border-bottom:1px solid var(--border);border-right:1px solid var(--border);padding:9px 12px;font-size:12px;text-align:left;vertical-align:top}
table.matrix thead th{background:var(--green-deep);color:#fff;font-size:11px;position:sticky;top:0}
table.matrix tbody th{background:var(--soft);font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);white-space:nowrap;font-weight:600}
table.matrix td .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px}
.clip-btn{border:0;background:var(--soft);color:var(--accent2);font-weight:600;font-size:11px;padding:2px 8px;border-radius:999px;margin-top:4px;cursor:pointer}
.clip-btn:hover{background:var(--line)}

/* ---------- impact analysis ---------- */
.an-cards{display:flex;gap:14px;flex-wrap:wrap}
.an-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:12px 18px;min-width:140px;cursor:pointer;box-shadow:var(--shadow)}
.an-card.active{border-color:var(--accent2);background:var(--soft)}
.an-card .n{font-size:24px;font-weight:700}
.an-card .l{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.an-card.risk .n{color:var(--off)}
.an-card.gap .n{color:var(--report)}
.an-table td.num,.an-table th.num{text-align:right}
.an-table tr.urow{cursor:pointer}
.an-table tr.urow:hover td{background:var(--hover)}
.uupn{color:var(--muted);font-family:ui-monospace,Consolas,monospace;font-size:11px}
.caret{display:inline-block;width:13px;color:var(--faint);font-size:10px;transition:transform .15s}
tr.urow.open .caret{transform:rotate(90deg);color:var(--accent2)}
tr.urow.open td{background:var(--soft)}
.pill{display:inline-block;padding:1px 9px;border-radius:11px;font-weight:700;font-size:11px;min-width:22px;text-align:center}
.pill.green{background:var(--ok-bg);color:var(--on)}
.pill.amber{background:var(--warn-bg);color:var(--report)}
.pill.red{background:var(--bad-bg);color:var(--off)}
.pill.zero{background:var(--soft);color:#9aa89e}
tr.detail>td{background:var(--hover);padding:12px 18px}
.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:1000px){.detail-grid{grid-template-columns:1fr}}
.panel{background:var(--surface);border:1px solid var(--border);border-radius:8px;overflow:hidden}
.panel.enforced{border-left:3px solid var(--on)}
.panel.bypass{border-left:3px solid var(--off)}
.panel-h{padding:8px 12px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);border-bottom:1px solid var(--border)}
.pol-link{cursor:pointer;font-weight:600}
.pol-link:hover{color:var(--accent2);text-decoration:underline}
.plist2{list-style:none;margin:0;padding:0}
.plist2 li{padding:8px 12px;border-bottom:1px solid var(--line);font-size:13px}
.plist2 li:last-child{border-bottom:0}

/* users × policies impact matrix grid */
.an-pager{display:flex;gap:10px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.mtable{border-collapse:separate;border-spacing:0;font-size:12px;width:max-content;min-width:100%}
.mtable th,.mtable td{border-bottom:1px solid var(--line);border-right:1px solid var(--line);white-space:nowrap}
.mtable thead th{position:sticky;top:0;z-index:3;background:var(--soft);vertical-align:bottom}
.mtable thead th.pcol{padding:8px 6px;text-align:center;max-width:42px}
.mtable thead th.pcol .ph{writing-mode:vertical-rl;transform:rotate(180deg);margin:0 auto;max-height:220px;overflow:hidden;text-overflow:ellipsis;font-weight:600;font-size:11px;cursor:default}
/* first column: fixed to --ucol-w (drag the grip in the header to resize) so a
   single long exclusion name cannot push the policy columns off screen */
.mtable th.ucol,.mtable td.ucol{position:sticky;left:0;z-index:2;background:var(--surface);text-align:left;padding:6px 12px;
  width:var(--ucol-w,260px);min-width:var(--ucol-w,260px);max-width:var(--ucol-w,260px);overflow:hidden;box-shadow:1px 0 0 var(--border)}
.mtable thead th.ucol{z-index:4;background:var(--soft);position:sticky;left:0}
.mtable td.ucol .uname,.mtable td.ucol .uupn{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.colgrip{position:absolute;top:0;right:0;width:9px;height:100%;cursor:col-resize;background:transparent}
.colgrip:hover,.colgrip.drag{background:linear-gradient(90deg,transparent,var(--accent2))}
.mtable thead th.ucol{position:sticky;padding-right:14px}
.mtable tbody tr:hover td{background:var(--hover)}
/* ---------- near-fullscreen matrix popout ---------- */
.fs-bg{display:none;position:fixed;inset:0;background:rgba(18,51,31,.45);z-index:200;padding:2vh 1vw}
.fs-bg.show{display:block}
.fs-panel{background:var(--surface);border-radius:14px;box-shadow:0 24px 60px rgba(18,51,31,.35);
  width:98vw;max-width:98vw;height:96vh;margin:0 auto;display:flex;flex-direction:column;overflow:hidden}
.fs-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 16px;
  border-bottom:1px solid var(--border);background:var(--soft);flex:none}
.fs-head b{font-size:15px;letter-spacing:-.01em}
.fs-body{flex:1;overflow:auto;padding:8px}
.fs-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;flex:1}
/* inside the panel the wrapper is just content — the panel body does the scrolling */
.fs-body .mwrap-x,.fs-body .matrix-wrap,.fs-body .gc-wrap{max-height:none;overflow:visible;border:0;box-shadow:none;background:none;border-radius:0}
.fs-body .toolbar{position:static;margin:0;padding:0;box-shadow:none;background:none}
.fs-body .mtable thead th,.fs-body table.matrix thead th{top:0}
.fs-body > div{margin-top:0 !important}

/* ---------- exclusion analyzer: grouped view ---------- */
.ex-card{margin-bottom:14px}
.ex-card-h{background:var(--soft);padding:12px 16px;border-top:1px solid var(--border)}
.ex-card-t{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:600;margin-bottom:7px}
.ex-card-t b{color:var(--green);font-size:13px}
.ex-pols{display:flex;flex-wrap:wrap;gap:6px}
.ex-pol{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:4px 10px;font-size:12px;font-weight:600;color:var(--green)}
.ex-pol.off{color:var(--muted);border-style:dashed}
.ex-pol.ro{color:var(--report);border-color:var(--warn-bd)}
.ex-card-b{padding:12px 16px}
.ex-kind + .ex-kind{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.ex-kind-h{font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:7px}
.ex-kind-h b{color:var(--ink)}
.ex-chips{display:flex;flex-wrap:wrap;gap:6px}
.ex-ent{background:var(--soft2);border:1px solid var(--border);border-radius:999px;padding:3px 11px;font-size:12px;cursor:default}
.ex-ent i{font-style:normal;color:var(--muted);font-size:11px;margin-left:6px;padding-left:6px;border-left:1px solid var(--border)}
/* merged exclusion row: the member names wrap instead of forcing a wide table */
.mtable td.ucol.merged{white-space:normal;background:var(--soft2)}
.mtable td.ucol.merged .uupn{font-family:inherit;line-height:1.4;margin-top:2px;white-space:normal;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mtable td.cellv{text-align:center;padding:5px 6px;font-weight:700;cursor:default}
.cell{display:inline-block;min-width:16px;text-align:center;font-weight:700}
.cell.ok{color:var(--on)}.cell.ro{color:var(--report)}.cell.no{color:var(--off)}.cell.na{color:var(--na)}
.mtable td.cellv.ok{background:var(--ok-bg2)}.mtable td.cellv.ro{background:var(--warn-bg2)}.mtable td.cellv.no{background:var(--bad-bg2)}
.dot.g{background:var(--on)} .dot.r{background:var(--off)} .dot.y{background:var(--report)}
/* click-to-filter on the exclusion / effective-user matrices */
.mtable td.ucol.clickable,.mtable thead th.pcol.clickable{cursor:pointer}
.mtable td.ucol.clickable:hover{background:var(--hover)}
.mtable td.ucol.clickable:hover .uname{color:var(--accent2)}
.mtable td.ucol.focused,.mtable thead th.pcol.focused{box-shadow:inset 0 0 0 2px var(--accent2)}
.mtable td.ucol.focused .uname,.mtable thead th.pcol.focused .ph{color:var(--accent2)}
/* stays pinned under the toolbar while the matrix scrolls, so you can always
   see what the grid is filtered to (and clear it) — offset is measured in JS */
.ex-focus{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 10px;padding:8px 12px;
  background:var(--soft);border:1px solid var(--border);border-radius:var(--radius);font-size:13px;
  position:sticky;top:var(--ex-focus-top,168px);z-index:38;box-shadow:0 2px 6px rgba(0,0,0,.06)}
.ex-focus .fchip{margin-left:auto}
/* a group's member count opens its member list */
.ex-memlink{border:0;background:none;padding:0;font:inherit;color:var(--green);cursor:pointer;
  text-decoration:underline;text-underline-offset:2px}
.ex-memlink:hover{color:var(--accent2)}
/* exclusion risk review */
.rk-card{padding:12px 16px;margin-bottom:10px;border-left:4px solid var(--border)}
.rk-card.high{border-left-color:var(--off)}
.rk-card.medium{border-left-color:var(--report)}
.rk-card.info{border-left-color:var(--accent2)}
.rk-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rk-h .pol-link{cursor:pointer}
.rk-h .pol-link:hover{color:var(--accent2);text-decoration:underline}
.rk-meta{margin-left:auto}
.rk-lv,.rk-fl{font-size:11px;font-weight:700;padding:1px 9px;border-radius:999px;white-space:nowrap}
.rk-lv.high,.rk-fl.high{background:var(--bad-bg2);color:var(--off)}
.rk-lv.medium,.rk-fl.medium{background:var(--warn-bg2);color:var(--report)}
.rk-lv.info,.rk-fl.info{background:var(--soft);color:var(--muted)}
.rk-lv.none{background:var(--ok-bg2);color:var(--on)}
.rk-flags{list-style:none;margin:8px 0 0;padding:0;font-size:13px}
.rk-flags li{display:flex;gap:9px;align-items:flex-start;padding:5px 0;border-top:1px solid var(--line)}
.rk-d{color:var(--muted);font-size:12px;margin-top:2px}
/* changelog / what's new */
.cl-rel{margin-bottom:20px}
.cl-h{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;padding-bottom:6px;
  border-bottom:2px solid var(--green);margin-bottom:8px}
.cl-list{list-style:none;margin:0;padding:0}
.cl-i{display:flex;gap:10px;align-items:flex-start;padding:6px 0;border-bottom:1px solid var(--line);font-size:13px;line-height:1.6}
.cl-i:last-child{border-bottom:0}
.cl-k{font-size:11px;font-weight:700;padding:1px 9px;border-radius:999px;white-space:nowrap;flex:none;margin-top:2px}
.cl-k.new{background:var(--ok-bg2);color:var(--on)}
.cl-k.improved{background:var(--warn-bg2);color:var(--report)}
.cl-k.fixed{background:var(--soft);color:var(--muted)}
/* home page section headings */
.tool-sec{margin:26px 0 10px}
.tool-sec:first-of-type{margin-top:6px}
.tool-sec h3{margin:0;font-size:16px}
.tool-sec p{margin:2px 0 0;font-size:13px;color:var(--muted)}
/* change audit */
.au-card{padding:12px 16px;margin-bottom:8px}
.au-h{display:flex;align-items:center;gap:8px;flex-wrap:wrap;cursor:pointer}
.au-h:hover{background:var(--hover)}
.au-act{font-size:11px;font-weight:700;padding:1px 9px;border-radius:999px;white-space:nowrap}
.au-act.add{background:var(--ok-bg2);color:var(--on)}
.au-act.update{background:var(--warn-bg2);color:var(--report)}
.au-act.delete{background:var(--bad-bg2);color:var(--off)}
.au-when{margin-left:auto;font-size:12px;color:var(--muted);white-space:nowrap}
.au-sub{font-size:12px;color:var(--muted);margin-top:3px}
.au-why{color:var(--report);background:var(--warn-bg2);border-radius:var(--radius);padding:5px 9px;margin-top:5px}
.au-sum td{vertical-align:top}
.au-sumrow{cursor:pointer}
.au-sumrow:hover td{background:var(--hover)}
.au-sumdet td{background:var(--soft);padding:12px 14px}
.au-n{display:inline-block;font-size:12px;font-weight:700;padding:1px 8px;border-radius:999px;margin-right:5px;white-space:nowrap}
.au-n.add{background:var(--ok-bg2);color:var(--on)}
.au-n.rem{background:var(--bad-bg2);color:var(--off)}
.au-n.upd{background:var(--warn-bg2);color:var(--report)}
.au-diff{margin-top:8px;padding-top:8px;border-top:1px solid var(--line);font-size:12.5px;
  font-family:var(--mono,ui-monospace,monospace)}
.au-diff div{padding:2px 0;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.au-op{font-weight:700;min-width:56px}
.au-op.add{color:var(--on)}.au-op.remove{color:var(--off)}
.au-op.change,.au-op.set,.au-op.clear{color:var(--report)}
.au-path{color:var(--muted)}
.au-from{color:var(--off);text-decoration:line-through}
.au-to{color:var(--on)}
/* import assignment-mode chooser */
.im-mode{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:4px 0 2px}
.im-mode-opt{display:grid;grid-template-columns:auto 1fr;gap:2px 8px;align-items:start;
  padding:10px 12px;border:1px solid var(--border);border-radius:10px;cursor:pointer;background:var(--surface)}
.im-mode-opt input{grid-row:1 / span 2;align-self:center}
.im-mode-opt b{align-self:center}
.im-mode-opt .mini{grid-column:2}
.im-mode-opt.on{border-color:var(--green);background:var(--soft);box-shadow:inset 0 0 0 1px var(--green)}
@media(max-width:640px){.im-mode{grid-template-columns:1fr}}
/* help modal */
/* fixed header + independently scrolling body, so the modal itself never
   scrolls (avoids the padding-gap / see-through problem) */
/* Help is a normal tool screen now — main provides width and padding;
   help-page just keeps the prose column readable */
.help-page{max-width:920px}
/* sticky, scroll-spying table of contents — jump to any section, and the chip
   for the section you're reading stays highlighted */
.help-toc{display:flex;flex-wrap:wrap;gap:6px;margin:0 -8px 14px;padding:10px 8px;
  position:sticky;top:106px;z-index:38;background:var(--bg);border-bottom:1px solid var(--border)}
.help-toc a{font-size:12px;text-decoration:none;color:var(--ink);border:1px solid var(--border);border-radius:999px;padding:3px 10px;background:var(--soft);white-space:nowrap;transition:background .12s,color .12s,border-color .12s}
.help-toc a:hover{border-color:var(--green);color:var(--green)}
.help-toc a.active{background:var(--green);border-color:var(--green);color:#fff}
.help-sec{border-top:1px solid var(--line);padding:14px 0 2px}
.help-sec:first-of-type{border-top:0}
.help-sec h4{margin:0 0 6px;font-size:15px;scroll-margin-top:120px}
/* CA validator simulation report */
.va-card{padding:0;margin-bottom:10px;overflow:hidden}
.va-h{display:flex;align-items:center;gap:8px;padding:12px 16px;cursor:pointer;user-select:none}
.va-h:hover{background:var(--hover)}
.va-caret{color:var(--muted);width:14px}
.va-tablewrap{overflow:auto;border-top:1px solid var(--line)}
.va-table{border-collapse:collapse;width:100%;font-size:12px;white-space:nowrap}
.va-table th,.va-table td{text-align:left;padding:6px 12px;border-bottom:1px solid var(--line)}
.va-table thead th{position:sticky;top:0;background:var(--soft);color:var(--muted);font-weight:600;z-index:1}
.va-table tbody tr:hover td{background:var(--hover)}
.va-yes{font-weight:700;color:var(--green)}
.va-no{font-weight:700;color:var(--off)}
/* compact per-policy summary cards */
.va-persona{margin:18px 0 8px;padding-bottom:5px;border-bottom:2px solid var(--green)}
.va-persona:first-child{margin-top:0}
.va-persona h4{margin:0;font-size:14px;color:var(--green)}
.va-compact{padding:14px 16px;margin-bottom:10px}
.va-c-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.va-enfs{display:inline-flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.va-enf{background:var(--ok-bg2);color:var(--on);font-size:12px;font-weight:600;padding:2px 10px;border-radius:999px;white-space:nowrap}
.va-c-tbl{width:100%;font-size:13px;border-collapse:collapse}
.va-c-tbl td{padding:3px 0;vertical-align:top}
.va-c-k{color:var(--muted);width:110px;white-space:nowrap;padding-right:12px}
.va-c-excl{margin-top:10px;padding-top:8px;border-top:1px solid var(--line);font-size:13px;color:var(--muted)}
/* baseline "what changed" column */
.bl-chcell{vertical-align:top}
.bl-ch{display:flex;flex-direction:column;gap:3px;align-items:flex-start}
.bl-chip{font-size:11px;line-height:1.5;padding:1px 8px;border-radius:999px;max-width:100%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;border:1px solid transparent}
.bl-chip.add{background:var(--ok-bg2);color:var(--on);border-color:var(--on)}
.bl-chip.del{background:var(--bad-bg2);color:var(--off);border-color:var(--off)}
.bl-chip.chg{background:var(--warn-bg2);color:var(--report);border-color:var(--report)}
/* validator: policies that do not reach the target */
.va-oos{margin-top:12px;padding:12px 16px}
.va-oos-h{margin-bottom:6px}
.va-oos-l{list-style:none;margin:0;padding:0;font-size:13px}
.va-oos-l li{display:flex;gap:10px;align-items:baseline;padding:4px 0;border-top:1px solid var(--line);flex-wrap:wrap}
.va-oos-l li:first-child{border-top:0}
.va-oos-n{flex:1;min-width:200px}
.va-oos-r{color:var(--muted);font-size:12px;white-space:nowrap}
/* What-If */
.wi-form{margin-top:14px;padding:16px}
.wi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.wi-f{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
.wi-f .req{color:var(--off)}
.wi-f input,.wi-f select{height:38px;padding:0 10px;border:1px solid var(--border);border-radius:8px;
  background:var(--surface);color:var(--ink);font:inherit;font-size:13px;width:100%}
.wi-f input:focus,.wi-f select:focus{outline:none;border-color:var(--green)}
.wi-actions{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.wi-res{margin-bottom:12px;padding:14px 16px}
.wi-verdict{font-size:15px;padding:8px 12px;border-radius:var(--radius)}
.wi-verdict.block{background:var(--bad-bg2);color:var(--off)}
.wi-verdict.grant{background:var(--ok-bg2);color:var(--on)}
.wi-verdict.none{background:var(--soft);color:var(--muted)}
.wi-h{margin:0 0 8px;font-size:14px}
.wi-list{list-style:none;margin:0;padding:0}
.wi-list li{padding:8px 0;border-top:1px solid var(--line)}
.wi-list li:first-child{border-top:0}
.wi-pn{font-weight:600;font-size:13px}
.wi-ctrls{display:flex;gap:12px;flex-wrap:wrap;font-size:12px;margin-top:3px}
.wi-g{color:var(--on)}.wi-s{color:var(--report)}.wi-w{color:var(--off)}
.wi-why{font-size:12px;color:var(--muted);margin-top:2px}
.wi-list.dim .wi-pn{font-weight:400;color:var(--muted)}
.wi-f textarea{padding:8px 10px;border:1px solid var(--border);border-radius:8px;background:var(--surface);
  color:var(--ink);font:inherit;font-size:13px;width:100%;resize:vertical;font-family:var(--mono,ui-monospace,monospace)}
.wi-f textarea:focus{outline:none;border-color:var(--green)}
/* named locations — cards tile two-plus per row; a tenant can easily have 80 */
.lo-grid{display:grid;gap:10px;align-items:start;
  grid-template-columns:repeat(auto-fill,minmax(330px,1fr))}
.lo-card{padding:10px 13px;margin-bottom:0;display:flex;flex-direction:column;min-width:0}
.lo-h{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:13px}
.lo-h b{overflow-wrap:anywhere}
.lo-ic{font-size:14px}
/* Actions sit on their own row at the foot of the card: at this width there is
   no room to float them right of a wrapping title. */
.lo-act{margin-top:8px;display:flex;gap:6px;justify-content:flex-end}
.lo-d{margin-top:4px;font-family:var(--mono,ui-monospace,monospace);font-size:11.5px;overflow-wrap:anywhere}
/* One location used by 30 policies must not stretch its card past the others */
.lo-u{margin-top:6px;font-size:11.5px;color:var(--muted);padding-top:6px;border-top:1px solid var(--line);
  line-height:1.6;max-height:96px;overflow:auto;overflow-wrap:anywhere}
.lo-imp{color:var(--report)}
.lo-table td{font-size:12.5px}
.lo-table td.lo-d{margin:0;white-space:normal;max-width:280px}
.lo-tact{white-space:nowrap;text-align:right}
.lo-more{cursor:pointer;font-weight:600;color:var(--accent2);white-space:nowrap}
.lo-more:hover{text-decoration:underline}
/* one changed field per line in the compare view */
.lo-drift{padding:1px 0}
/* CA groups — member scan picker */
.cg-picklist{max-height:44vh;overflow:auto;border:1px solid var(--border);border-radius:var(--radius);
  padding:6px 10px;background:var(--surface)}
.cg-picklist .chk{display:flex;align-items:center;gap:8px;padding:4px 2px;margin:0;font-size:13px;
  border-bottom:1px solid var(--line)}
.cg-picklist .chk:last-child{border-bottom:0}
.cg-picklist .chk:hover{background:var(--hover)}
.tag.ok{background:var(--ok-bg2);color:var(--on)}
.va-target{display:flex;align-items:center;gap:6px;flex:1 1 320px;min-width:220px;flex-wrap:nowrap}
.va-target input{flex:1 1 auto;min-width:0;height:38px;padding:0 11px;border:1px solid var(--border);border-radius:8px;background:var(--surface);color:var(--ink);font-size:13px}
.va-target .btn{flex:none}
.va-target input:focus{outline:none;border-color:var(--green)}
.va-targetbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px;padding:8px 12px;background:var(--soft);border:1px solid var(--border);border-radius:var(--radius);font-size:13px}
.va-targetbar .fchip{margin-left:auto}
.va-tablewrap{-webkit-overflow-scrolling:touch}
/* idle "run scan" prompt for the exclusion / gap / validator tools */
.run-prompt{display:flex;flex-direction:column;align-items:center;gap:10px;padding:44px 20px;text-align:center}
.run-prompt .btn.primary{font-size:15px;padding:10px 22px}
.run-prompt .mini{max-width:420px}
/* close-all-tabs button in the tab bar */
.toolnav-btn.closeall{color:var(--off)}
@media(max-width:640px){
  .va-target{width:100%}
  .va-target input{min-width:0}
  .toolnav-inner{justify-content:flex-start}
}
.help-sec p{margin:0 0 8px}
.help-sec ul{margin:0 0 8px;padding-left:20px}
.help-sec li{margin:4px 0}
.help-sec code{background:var(--soft);border:1px solid var(--border);border-radius:4px;padding:0 4px;font-size:12px}
.help-x{font-size:12.5px;color:var(--muted);font-style:italic}
.toolnav-btn.help{color:var(--green)}

/* ---------- modal / toast ---------- */
/* stacking order: full-screen matrix panel 200 < modals 300 < dependency
   inspector 320 (opened FROM a modal) < toast 400 */
.modal-bg{display:none;position:fixed;inset:0;background:rgba(18,51,31,.55);z-index:300;align-items:center;justify-content:center;padding:24px}
.modal-bg.open{display:flex}
.modal{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);max-width:520px;width:100%;padding:30px}
.modal h3{margin-bottom:6px}
.modal p{color:var(--muted);margin-bottom:20px;line-height:1.5}
.exp-opt{display:flex;gap:14px;border:1px solid var(--border);border-radius:12px;padding:14px;margin-bottom:10px;cursor:pointer;align-items:center}
.exp-opt:hover,.exp-opt.sel{border-color:var(--accent2);background:var(--soft)}
.exp-ic{width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:11px;color:#fff}
.exp-ic.png{background:var(--accent2)} .exp-ic.pdf{background:var(--green-deep)}
.exp-ic.docx{background:#2b579a} .exp-ic.zip{background:var(--warn-fg)} .exp-ic.json{background:#5f7a67} .exp-ic.md{background:#333}

/* ---------- tools home ---------- */
.home-title{font-size:22px;letter-spacing:-.02em;margin:18px 0 22px}
.tools{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;max-width:1180px}
.tool{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px;cursor:pointer;transition:.15s;
  background-image:radial-gradient(300px 160px at 90% -40px,var(--glow) 0%,transparent 60%)}
.tool:hover{border-color:var(--accent2);transform:translateY(-2px)}
.tool-ic{font-size:30px;margin-bottom:12px}
.tool h3{font-size:17px;letter-spacing:-.01em;margin-bottom:8px;color:var(--green)}
.tool p{font-size:13px;color:var(--muted);line-height:1.5}
.readme{margin-top:26px;padding:26px;max-width:1180px}
.readme h3{font-size:16px;margin-bottom:10px;color:var(--green)}
.readme h4{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--accent2);margin:18px 0 6px}
.readme p{font-size:13.5px;line-height:1.65;color:var(--ink);max-width:900px}
.readme code{background:var(--soft);padding:1px 6px;border-radius:6px;font-size:12px}
.modal .row{display:flex;gap:10px;justify-content:flex-end;margin-top:18px}
.chk{display:flex;gap:8px;align-items:center;margin-top:14px;font-size:13px;color:var(--muted)}
#depModal{z-index:320}
/* the popup-blocked prompt appears while another modal is already open, so it
   has to sit above every one of them (but below the toast) */
#popupModal{z-index:340}
/* the assign confirm sits above the assign wizard modal */
#asConfirm{z-index:330}
.toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%);background:var(--green-deep);color:#fff;padding:12px 22px;border-radius:12px;box-shadow:var(--shadow);display:none;z-index:400;font-weight:600}
.toast.show{display:block}
.toast span{color:var(--lemon)}

.screen{display:none}
.screen.active{display:block}
.back{background:none;border:0;color:var(--accent2);font-weight:600;font-size:13px;padding:0;margin-bottom:14px;display:inline-flex;gap:6px;align-items:center}
footer{border-top:1px solid var(--border);background:var(--surface)}
.fwrap{max-width:1180px;margin:0 auto;padding:16px 24px;font-size:12px;color:var(--muted);display:flex;gap:14px;flex-wrap:wrap}
@media(max-width:860px){.pcard-grid{grid-template-columns:1fr 1fr}.sect:nth-child(3n){border-right:1px solid var(--border)}.sect:nth-child(2n){border-right:0}}

/* neutral export theme: no Limon-IT colors in generated files */
.pcard.neutral .pcard-head{background:linear-gradient(100deg,#1f2933 0%,#323f4b 70%)}
.pcard.neutral .sect h4{color:#52606d}
.pcard.neutral .pcard-foot{background:var(--soft2)}

/* export rendering: fixed width so PNG/PDF output is consistent */
.export-stage{position:fixed;left:-10000px;top:0;width:1100px;background:var(--bg);padding:0}
.export-stage .pcard{width:1100px}

/* ---------- MS Learn documented exclusion checks ---------- */
.sev{display:inline-block;font-size:11px;font-weight:700;padding:2px 10px;border-radius:999px;text-transform:uppercase;letter-spacing:.04em;white-space:nowrap}
.sev.critical{background:var(--crit-bg);color:var(--crit-fg)}
.sev.high{background:var(--high-bg);color:var(--high-fg)}
.sev.medium{background:var(--warn-bg);color:var(--report)}
.sev.info{background:var(--blue-bg);color:var(--blue)}
.ml-card{margin-bottom:14px;overflow:visible}
.ml-head{width:100%;display:flex;align-items:center;gap:10px;padding:14px 18px;border:0;background:none;text-align:left;font:inherit}
.ml-head .caret{flex:none}
.ml-head.open .caret{transform:rotate(90deg);color:var(--accent2)}
.ml-head:hover .ml-title{color:var(--accent2)}
.ml-title{font-weight:600;font-size:14px}
.ml-head .mini{margin-left:auto;flex:none}
.ml-detail{border-top:1px solid var(--border);padding:16px 18px 18px 41px}
.ml-detail h5{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:14px 0 5px}
.ml-detail h5:first-child{margin-top:0}
.ml-detail h5.ml-red{color:var(--off)}
.ml-detail h5.ml-blue{color:var(--blue)}
.ml-detail h5.ml-green{color:var(--on)}
.ml-detail p{font-size:13px;line-height:1.55;max-width:860px}
.ml-detail .ml-pols{border:1px solid var(--border);border-radius:8px;max-width:860px}
.ml-detail .ml-res{list-style:disc;margin:0 0 0 18px;padding:0}
.ml-detail .ml-res li{font-size:13px;color:var(--muted);padding:2px 0}
.ml-doc{display:inline-block;margin-top:14px;font-size:12px;font-weight:600}

/* ---------- gap analysis ---------- */
.sev.low{background:#e7ede9;color:#4a6152}
.gc-cat{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--green);margin:22px 0 10px}
.gc-cat:first-child{margin-top:0}
table.gc-matrix{border-collapse:collapse;width:100%;min-width:760px}
.gc-matrix th,.gc-matrix td{border-top:1px solid var(--border);padding:7px 8px;font-size:12px}
.gc-matrix thead th{border-top:0}
.gc-matrix th.gc-ch{vertical-align:bottom;padding:6px 4px;max-width:36px}
.gc-matrix th.gc-ch span{writing-mode:vertical-rl;transform:rotate(180deg);display:inline-block;max-height:150px;font-size:11px;font-weight:600;color:var(--muted);white-space:nowrap}
.gc-matrix th.gc-rh{text-align:left;font-weight:600;white-space:nowrap;padding-left:18px}
.gc-matrix td.gc-cell{text-align:center;font-weight:700;width:36px;cursor:default}
.gc-matrix td.gc-cell.present{color:var(--on);background:var(--ok-bg2)}
.gc-matrix td.gc-cell.partial{color:var(--report);background:var(--warn-bg2)}
.gc-matrix td.gc-cell.off{color:var(--muted);background:var(--soft2)}
.gc-matrix td.gc-cell.missing{color:var(--off);background:var(--bad-bg2)}
.gc-matrix td.gc-cell.na{color:var(--na)}


/* ================= dark theme =================
   Auto: follows the OS under prefers-color-scheme while the theme picker is on
   Auto (no data-theme attribute). Explicit: html[data-theme="dark"|"light"].
   The theme button in the header cycles Auto → Light → Dark. */
:root[data-theme="dark"]{
  --ink:#e6f0e8; --green:#7fc98f; --green-deep:#0b120e; --accent2:#8fd977;
  --lemon:#e9c94f; --lemon-deep:#c9a92c;
  --muted:#93a89a; --border:#2a3630; --surface:#161d19; --bg:#0f1512; --soft:#1c2620;
  --shadow:0 10px 30px rgba(0,0,0,.5);
  --on:#7fc98f; --off:#e58a78; --report:#e0b64f;
  --hover:#1b241e; --line:#232e28; --soft2:#1a231d; --glow:#1e3a28;
  --ok-bg:#1d3325; --ok-bg2:#18291d; --ok-bd:#2f5c3a;
  --warn-bg:#392f14; --warn-bg2:#2b2513; --warn-bd:#5c4a1c; --warn-fg:#e8c766;
  --bad-bg:#3a231f; --bad-bg2:#2b1b18; --bad-bd:#6a3a31;
  --crit-bg:#42201a; --crit-fg:#f0a091; --high-bg:#3d2a15; --high-fg:#e8b072;
  --blue:#8ab4e8; --blue-bg:#1a2637;
  --na:#4a574f; --faint:#5d6b62; --ghost-bd:#3a4a40; --on-deep-mute:#9db3a4;
  --hl:rgba(143,217,119,.13); --hl2:rgba(143,217,119,.26);
  color-scheme:dark;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]):not([data-theme="dark"]){
  --ink:#e6f0e8; --green:#7fc98f; --green-deep:#0b120e; --accent2:#8fd977;
  --lemon:#e9c94f; --lemon-deep:#c9a92c;
  --muted:#93a89a; --border:#2a3630; --surface:#161d19; --bg:#0f1512; --soft:#1c2620;
  --shadow:0 10px 30px rgba(0,0,0,.5);
  --on:#7fc98f; --off:#e58a78; --report:#e0b64f;
  --hover:#1b241e; --line:#232e28; --soft2:#1a231d; --glow:#1e3a28;
  --ok-bg:#1d3325; --ok-bg2:#18291d; --ok-bd:#2f5c3a;
  --warn-bg:#392f14; --warn-bg2:#2b2513; --warn-bd:#5c4a1c; --warn-fg:#e8c766;
  --bad-bg:#3a231f; --bad-bg2:#2b1b18; --bad-bd:#6a3a31;
  --crit-bg:#42201a; --crit-fg:#f0a091; --high-bg:#3d2a15; --high-fg:#e8b072;
  --blue:#8ab4e8; --blue-bg:#1a2637;
  --na:#4a574f; --faint:#5d6b62; --ghost-bd:#3a4a40; --on-deep-mute:#9db3a4;
  --hl:rgba(143,217,119,.13); --hl2:rgba(143,217,119,.26);
  color-scheme:dark;
  }
}

/* dark-mode rules that need more than a variable swap (incl. the logo variant) */
:root[data-theme="dark"] .btn.primary, :root[data-theme="dark"] .seg button.active, :root[data-theme="dark"] .avatar{color:#0b120e}
:root[data-theme="dark"] .btn.lemon{color:#0b120e}
:root[data-theme="dark"] .pcard-head{background:linear-gradient(100deg,#132119 0%,#20402a 70%)}
:root[data-theme="dark"] table.matrix thead th{background:#132119}
:root[data-theme="dark"] .selbar, :root[data-theme="dark"] .toast{background:#0d1a12;border:1px solid var(--border)}
:root[data-theme="dark"] .exp-ic.md{background:#4a5450}
:root[data-theme="dark"] .fs-bg{background:rgba(0,0,0,.62)}
:root[data-theme="dark"] .logo img, :root[data-theme="dark"] .login-card > img{content:url("../assets/logo-mark-dark.svg")}

@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]):not([data-theme="dark"]) .btn.primary, :root:not([data-theme="light"]):not([data-theme="dark"]) .seg button.active, :root:not([data-theme="light"]):not([data-theme="dark"]) .avatar{color:#0b120e}
  :root:not([data-theme="light"]):not([data-theme="dark"]) .btn.lemon{color:#0b120e}
  :root:not([data-theme="light"]):not([data-theme="dark"]) .pcard-head{background:linear-gradient(100deg,#132119 0%,#20402a 70%)}
  :root:not([data-theme="light"]):not([data-theme="dark"]) table.matrix thead th{background:#132119}
  :root:not([data-theme="light"]):not([data-theme="dark"]) .selbar, :root:not([data-theme="light"]):not([data-theme="dark"]) .toast{background:#0d1a12;border:1px solid var(--border)}
  :root:not([data-theme="light"]):not([data-theme="dark"]) .exp-ic.md{background:#4a5450}
  :root:not([data-theme="light"]):not([data-theme="dark"]) .fs-bg{background:rgba(0,0,0,.62)}
  :root:not([data-theme="light"]):not([data-theme="dark"]) .logo img, :root:not([data-theme="light"]):not([data-theme="dark"]) .login-card > img{content:url("../assets/logo-mark-dark.svg")}
}

/* theme toggle in the header */
#themeBtn{padding:8px 12px;line-height:1}
#themeBtn .tico{font-size:15px}

/* ---------- matrix crosshair: highlight the hovered row and column ----------
   Painted with a background-image tint so the cell's own state colour
   (excluded / report-only / not-applicable) still shows through. */
.mtable tbody tr.hl-row > td,.mtable tbody tr.hl-row > th,.mtable .hl-col,
table.matrix tbody tr.hl-row > td,table.matrix tbody tr.hl-row > th,table.matrix .hl-col,
.gc-matrix tbody tr.hl-row > td,.gc-matrix tbody tr.hl-row > th,.gc-matrix .hl-col{background-image:linear-gradient(var(--hl),var(--hl))}
.mtable tbody tr.hl-row > td.hl-col,
table.matrix tbody tr.hl-row > td.hl-col,
.gc-matrix tbody tr.hl-row > td.hl-col{background-image:linear-gradient(var(--hl2),var(--hl2))}
.mtable thead th.hl-col,table.matrix thead th.hl-col,.gc-matrix thead th.hl-col{background-image:linear-gradient(var(--hl2),var(--hl2))}
.mtable thead th.hl-col .ph,.gc-matrix thead th.hl-col span{color:var(--accent2)}
.mtable tbody tr.hl-row > td.ucol .uname,.gc-matrix tbody tr.hl-row > th.gc-rh{color:var(--accent2)}

/* select-all control in the policies toolbar */
.chk.selall{background:var(--surface);border:1px solid var(--border);border-radius:10px;
  padding:7px 13px;font-weight:600;font-size:13px;gap:8px;cursor:pointer;white-space:nowrap}
.chk.selall:hover{border-color:var(--accent2)}

/* ---------- baseline policies ---------- */
.bl-chip{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:4px 11px;
  font-size:12px;font-weight:600;border:1px solid var(--border)}
.bl-chip.ok{background:var(--ok-bg);color:var(--on);border-color:var(--ok-bd)}
.bl-chip.warn{background:var(--warn-bg);color:var(--warn-fg);border-color:var(--warn-bd)}
.bl-chip.bad{background:var(--bad-bg);color:var(--off);border-color:var(--bad-bd)}
.bl-chip.info{background:var(--soft);color:var(--muted)}
.bl-badge{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;
  border-radius:8px;font-weight:700;font-size:13px}
.bl-badge.ok{background:var(--ok-bg);color:var(--on)}
.bl-badge.warn{background:var(--warn-bg);color:var(--warn-fg)}
.bl-badge.bad{background:var(--bad-bg);color:var(--off)}
.bl-badge.info{background:var(--soft);color:var(--muted)}
.bl-table td{vertical-align:top}
.bl-table td.bl-st{text-align:center}
.bl-ver{font-weight:600;font-size:12px;white-space:nowrap}
.bl-ver.warn{color:var(--warn-fg)}

/* ---------- MS Learn: suggested fixes ---------- */
.fx-card{margin-bottom:14px}
.fx-head{display:flex;align-items:center;gap:12px;padding:14px 18px;background:var(--soft);border-bottom:1px solid var(--border);flex-wrap:wrap}
.fx-new{font-weight:700;font-size:14px;color:var(--green);overflow-wrap:anywhere}
.fx-body{padding:14px 18px}
.fx-body h5{font-size:11px;text-transform:uppercase;letter-spacing:.05em;margin:0 0 6px}
.fx-body h5 + ul{margin-bottom:12px}

/* ---------- baseline policy cards ---------- */
.bc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:16px;align-items:start}
.bc-grid .cardgroup{grid-column:1/-1}
.bc-card{display:flex;flex-direction:column;border-left:4px solid var(--border)}
.bc-card.ok{border-left-color:var(--on)}
.bc-card.warn{border-left-color:var(--report)}
.bc-card.bad{border-left-color:var(--off)}
.bc-card.info{border-left-color:var(--muted)}
.bc-head{display:flex;gap:12px;align-items:flex-start;padding:14px 16px 10px}
.bc-head h3{font-size:13.5px;line-height:1.35;letter-spacing:-.01em;overflow-wrap:anywhere}
.bc-ic{width:36px;height:36px;border-radius:9px;background:var(--soft);display:flex;align-items:center;justify-content:center;flex:none;font-size:17px}
.bc-status{display:flex;flex-direction:column;gap:2px;padding:8px 16px;font-size:12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.bc-status.ok{background:var(--ok-bg2);color:var(--on)}
.bc-status.warn{background:var(--warn-bg2);color:var(--warn-fg)}
.bc-status.bad{background:var(--bad-bg2);color:var(--off)}
.bc-status.info{background:var(--soft2);color:var(--muted)}
.bc-status .mini{color:inherit;opacity:.8}
.bc-body{padding:12px 16px 14px;display:flex;flex-direction:column;gap:10px}
.bc-sect label{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin-bottom:3px}
.bc-sect{font-size:12.5px}
.bc-list{list-style:none;margin:0;padding:0}
.bc-list li{padding:1px 0;overflow-wrap:anywhere}
.bc-list.excl li{color:var(--off)}
.bc-list.excl li::before{content:"− ";opacity:.7}

/* ---------- MS Learn: apply-in-tenant confirmation ---------- */
.ml-apply-list{max-height:300px;overflow:auto;border:1px solid var(--border);border-radius:12px;
  padding:10px 12px;margin:12px 0;background:var(--soft2);font-size:12.5px}
.ml-apply-row{padding:7px 0;border-bottom:1px solid var(--line)}
.ml-apply-row:last-child{border-bottom:0}
.ml-apply-row.ok{color:var(--on)}
.ml-apply-row.bad{color:var(--off)}
.ml-op{display:inline-block;min-width:62px;text-align:center;font-size:10px;font-weight:700;
  letter-spacing:.05em;padding:2px 7px;border-radius:6px;margin-right:6px}
.ml-op.create{background:var(--ok-bg);color:var(--on)}
.ml-op.delete{background:var(--bad-bg);color:var(--off)}
.ml-op.delete.skip{background:var(--soft);color:var(--muted);text-decoration:line-through}

/* build stamp on the sign-in card */
.build-stamp{margin-top:22px;padding-top:14px;border-top:1px solid var(--border);
  font-size:11px;letter-spacing:.04em;color:var(--muted);font-family:ui-monospace,Consolas,monospace}
footer #buildStampFoot{color:var(--muted);font-size:12px;font-family:ui-monospace,Consolas,monospace}

/* per-tool version, tucked into the tile corner */
.tool{position:relative}
.tool-ver{position:absolute;top:14px;right:16px;font-size:10.5px;letter-spacing:.04em;
  font-family:ui-monospace,Consolas,monospace;color:var(--muted);background:var(--soft);
  border:1px solid var(--border);border-radius:999px;padding:2px 8px;cursor:help}
.tool:hover .tool-ver{border-color:var(--accent2);color:var(--green)}