/* ui.css — consistency layer (task 031). Loaded after style.css; tokens only, light + dark via the same variables.
   Rules: tabs = underline, filters = compact controls that apply on change, KPI cards = one look, quiet row actions, no underlined link titles in tables. */

/* ---------- page header ---------- */
.toolbar{ margin-bottom:14px; }
.toolbar-right{ gap:8px; }
.toolbar-right form{ margin:0; }

/* tenant picker: one look everywhere (label inline, compact select) */
.mon-select-label, .chk-tenant label{ display:inline-flex; flex-direction:row; align-items:center; gap:8px; text-transform:none; letter-spacing:0; font-size:.78rem; font-weight:700; color:var(--text-muted); }
.mon-select-label select, .chk-tenant select{ width:auto; min-width:220px; font-size:.9rem; font-weight:600; }

/* ---------- controls ---------- */
select{ min-height:38px; padding-block:7px; }
.filters{ gap:10px; align-items:end; }
.filters select{ min-width:150px; }
.btn{ min-height:34px; }
.btn-sm{ min-height:30px; }
.auto-poll #autopoll-next{ display:none; }

/* ---------- tabs: navigation = underline (also the organization tabs) ---------- */
.org-tabs-main{ flex-wrap:nowrap; gap:2px; overflow-x:auto; scrollbar-width:none; border-bottom:1px solid var(--border); margin:0 0 18px; }
.org-tabs-main::-webkit-scrollbar{ display:none; }
.org-tabs-main .btn{ flex:none; position:relative; min-height:0; padding:10px 14px; font-size:.86rem; color:var(--text-muted); background:transparent; border:0; border-radius:10px 10px 0 0; white-space:nowrap; }
.org-tabs-main .btn:hover{ color:var(--accent); background:var(--accent-soft); }
.org-tabs-main .btn.btn-primary{ color:var(--accent); background:transparent; }
.org-tabs-main .btn.btn-primary::after{ content:""; position:absolute; left:10px; right:10px; bottom:-1px; height:3px; border-radius:3px 3px 0 0; background:var(--grad-brand); }
.org-tabs-main .subtab-sep{ flex:none; align-self:center; white-space:nowrap; }

/* ---------- KPI cards: one look ---------- */
.stats, .kpis{ grid-auto-rows:1fr; align-items:stretch; }
.stat-tile, .kpi{ min-width:0; }
/* balanced rows: tiles of an incomplete last row stretch instead of leaving a gap (ui.js sets --cols) */
.kpi-flex{ display:flex; flex-wrap:wrap; gap:12px; }
.kpi-flex > *{ flex:1 1 calc((100% - (var(--cols) - 1) * 12px) / var(--cols) - 1px); min-width:0; margin:0; }
.stats .stat-value, .mon-stats .stat-value{ font-family:'IBM Plex Mono',monospace; font-size:1.8rem; line-height:1.15; font-weight:600; }
.stat-tile, .stat-tile *{ overflow-wrap:break-word; word-break:normal; hyphens:none; }
.stat-ico svg{ display:block; }

/* ---------- tables: quiet ---------- */
tbody tr:hover > td{ background:var(--surface-raised); }
table a:not(.btn):not(.status-chip):not(.sev-pill){ text-decoration:none; }
table a:not(.btn):not(.status-chip):not(.sev-pill):hover{ text-decoration:underline; }
/* row actions are ghost buttons; the filled/danger ones keep their look */
td .btn-sm:not(.btn-primary):not(.btn-danger){ background:transparent; border-color:transparent; color:var(--accent); }
td .btn-sm:not(.btn-primary):not(.btn-danger):hover{ background:var(--accent-soft); border-color:transparent; }
/* level as a left colour bar */
tr.row-crit > td:first-child{ box-shadow:inset 3px 0 0 var(--crit); }
tr.row-warn > td:first-child{ box-shadow:inset 3px 0 0 var(--warn); }
tr.row-info > td:first-child{ box-shadow:inset 3px 0 0 var(--info); }

/* ---------- misc ---------- */
.note.small, p.note{ max-width:92ch; }
@media (prefers-reduced-motion:reduce){ *{ scroll-behavior:auto; } }

/* menus in the page header open towards the left so they never leave the viewport */
.toolbar-right .pl-pop{ left:auto; right:0; }
.mon-azure{ align-items:start; }

/* monitor pages (Azure, Microsoft 365, Zero Trust): title, status and controls share one header row */
.mon-head{ gap:10px 14px; margin-bottom:16px; }
.mon-head > h1{ font-size:1.3rem; font-weight:800; letter-spacing:-.02em; position:relative; padding-bottom:9px; }
.mon-head > h1::after{ content:""; position:absolute; left:0; bottom:0; width:34px; height:3px; border-radius:3px; background:var(--grad-brand); }
.mon-head > .toolbar-right{ margin-left:auto; }

/* Risk Board hero: cards that are shorter than the matrix centre their content instead of leaving a blank lower half */
.rb-hero > .card:first-child{ display:flex; flex-direction:column; justify-content:center; gap:14px; }
.rb-hero .rb-kpi{ justify-content:center; }

/* Zero Trust: pillars without data are one quiet list instead of big empty cards */
.zt-gap-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.zt-gap-list li{ display:grid; grid-template-columns:minmax(150px,220px) minmax(0,1fr); gap:4px 16px; align-items:baseline; padding:9px 0; border-top:1px solid var(--border); }
.zt-gap-list li:first-child{ border-top:0; }
.zt-gap-list li > .small:last-child{ grid-column:2; }
@media (max-width:700px){ .zt-gap-list li{ grid-template-columns:1fr; } .zt-gap-list li > .small:last-child{ grid-column:1; } }

/* filter links (e.g. Governance, Oversharing) read as chips */
.filters > a.btn-sm{ border-radius:999px; }

/* Policy catalog: dense rows (73 rules must be scannable), no heavy card shadows */
.fp-pol{ box-shadow:none; border-radius:var(--radius-s); }
.chk-list > .fp-pol{ margin-bottom:6px; }
.fp-head{ padding:8px 14px; gap:10px; }
.fp-hit{ flex-direction:row; flex-wrap:wrap; justify-content:flex-end; align-items:center; gap:2px 10px; min-width:0; max-width:300px; }
.fp-more > summary{ padding:4px 14px 6px; }
.fp-switch{ min-width:92px; }

/* subscription strip on phones: stacked, readable, button on its own row */
@media (max-width:700px){
  .sub-head > div{ flex:1 1 100%; }
  .sub-meta{ flex-direction:column; align-items:flex-start; gap:2px; }
  .sub-meta span{ flex-wrap:wrap; gap:4px; }
  .sub-meta span::after{ display:none; }
  .mon-head > .toolbar-right{ margin-left:0; width:100%; }
  .mon-select-label{ width:100%; } .mon-select-label select{ flex:1; min-width:0; }
}

/* the HTML hidden attribute must win over component display rules (e.g. .btn) */
[hidden]{ display:none !important; }

/* sections made of several pages: count next to a tab, picker next to the title */
.subtab-n{ margin-left:6px; padding:1px 7px; border-radius:999px; font-size:.7rem; font-weight:800; background:var(--accent-soft); color:var(--accent); }
.mon-head > .mon-pick{ margin-left:auto; }
.mon-head > .mon-pick + .toolbar-right{ margin-left:0; }

/* selectable table rows + bulk bar (Findings) */
th.sel, td.sel{ width:34px; padding-right:0; }

/* ---------- organization detail: header + tabbed panes ---------- */
.org-head{ display:flex; align-items:center; justify-content:space-between; gap:10px 16px; flex-wrap:wrap; padding:16px 20px; }
.org-head-main{ display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; }
.card h2.org-title, .org-title{ margin:0; font-size:1.35rem; font-weight:800; letter-spacing:-.02em; text-transform:none; color:var(--text); }
.org-head-chips{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.org-panes .card > h2{ font-size:1rem; font-weight:800; letter-spacing:-.01em; text-transform:none; color:var(--text); display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.org-pane > .card:last-child{ margin-bottom:0; }
.org-pane .card > p.small{ max-width:80ch; margin:0 0 12px; }
.org-pane .inline-form{ display:flex; align-items:flex-end; gap:10px; flex-wrap:wrap; }
.org-pane .inline-form label{ display:flex; flex-direction:column; gap:4px; }
.org-pane .inline-form select, .org-pane .inline-form input[type=text]{ width:auto; min-width:260px; }
.org-pane .plain-list{ flex-direction:column; gap:6px; }
.org-pane .plain-list li{ padding:8px 0; border-top:1px solid var(--border); }
.org-pane .plain-list li:first-child{ border-top:0; }
.org-pane .plain-list .inline-form{ align-items:center; }
.org-danger{ border-color:var(--crit); }
.org-danger > h2{ color:var(--crit); }
.pa-address input{ max-width:420px; }
.org-pane form + p.small{ margin-top:12px; }
.org-pane .form-grid{ align-items:end; }
/* organization detail uses the settings layout (side menu) */
.org-back{ margin:0 0 10px; }
.org-panes.settings-layout{ margin-top:16px; }
.org-pane-tabs .subtab-n{ margin-left:auto; flex:none; }
.org-pane-tabs a .sn-text{ flex:1; }
/* team workload */
.wl-bar{ width:90px; height:8px; vertical-align:middle; appearance:none; border:0; border-radius:999px; overflow:hidden; background:var(--surface-raised); }
.wl-bar::-webkit-progress-bar{ background:var(--surface-raised); }
.wl-bar::-webkit-progress-value{ background:var(--accent); border-radius:999px; }
.wl-bar::-moz-progress-bar{ background:var(--accent); border-radius:999px; }
.wl-share{ white-space:nowrap; }
/* number inputs look like the other fields */
input[type=number]{ font:inherit; font-size:.9rem; padding:9px 11px; border:1px solid var(--border-strong); color:var(--text); background:var(--surface); }
/* team workload: charts and conclusion */
.wl-charts{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr)); gap:16px; margin-bottom:16px; }
.wl-charts .card{ margin:0; min-width:0; }
.wl-svg{ width:100%; height:auto; display:block; }
.wl-svg text{ font-size:11px; fill:var(--text-muted); }
.wl-grid{ stroke:var(--border); stroke-width:1; }
.wl-created, .wl-sr, .wl-c1{ fill:var(--accent); background:var(--accent); }
.wl-resolved, .wl-cm, .wl-c2{ fill:var(--ok); background:var(--ok); }
.wl-pm, .wl-c3{ fill:var(--warn); background:var(--warn); }
.wl-c4{ fill:var(--crit); background:var(--crit); }
.wl-c5{ fill:var(--text-muted); background:var(--text-muted); }
.wl-line{ fill:none; stroke:var(--warn); stroke-width:2; }
.wl-dot{ fill:var(--warn); stroke:var(--surface); stroke-width:1.5; }
.wl-backlog{ background:var(--warn); }
.wl-legend{ list-style:none; display:flex; flex-wrap:wrap; gap:6px 16px; margin:8px 0 0; padding:0; font-size:.8rem; color:var(--text-muted); }
.wl-key{ display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:6px; vertical-align:baseline; }
.wl-verdict{ margin:0 0 10px; font-size:1.05rem; }
.wl-verdict strong{ font-size:1.5rem; margin-right:6px; }
.wl-signals{ list-style:none; margin:0 0 12px; padding:0; display:flex; flex-direction:column; gap:6px; }
.wl-signals li{ display:flex; gap:10px; align-items:baseline; }
.wl-mark{ flex:none; width:20px; height:20px; display:inline-grid; place-items:center; border-radius:50%; font-size:.75rem; font-weight:800; }
.wl-signals .met .wl-mark{ background:var(--warn-soft, var(--accent-soft)); color:var(--warn); }
.wl-signals .ok .wl-mark{ background:var(--accent-soft); color:var(--ok); }
.wl-facts{ margin:0 0 8px; }
.wl-ai-h{ margin:16px 0 6px; font-size:.95rem; }
.wl-ai{ margin:0 0 8px; max-width:80ch; line-height:1.55; }
.sr-only{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.wl-signals, .wl-facts{ font-size:.9rem; }
.wl-facts{ flex-direction:column; gap:4px; }
.wl-facts li{ padding:0; border:0; }
/* team workload: overall light and capacity answer */
.wl-light-row{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-bottom:8px; }
.wl-light-row h2{ margin:0; }
.status-chip.wl-light{ font-size:1rem; padding:6px 16px; }
.wl-headline{ margin:0 0 10px; font-size:1.05rem; font-weight:600; max-width:90ch; }
.wl-answer{ margin:0 0 6px; padding-left:20px; display:flex; flex-direction:column; gap:6px; max-width:90ch; }
/* team workload: capacity card as indicators */
.wl-reco{ margin:4px 0 2px; font-size:1.6rem; font-weight:800; letter-spacing:-.01em; }
.wl-reco-sub{ margin:0 0 14px; color:var(--text-muted); font-size:.95rem; }
.wl-kv{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin:0 0 14px; }
.wl-kv > div{ border:1px solid var(--border); border-radius:var(--radius-s); padding:10px 12px; background:var(--surface-raised); }
.wl-kv dt{ font-size:.75rem; color:var(--text-muted); font-weight:600; }
.wl-kv dd{ margin:2px 0 0; font-size:1.35rem; font-weight:800; }
.wl-kv dd.neg{ color:var(--crit); }
.wl-kv dd.pos{ color:var(--ok); }
.wl-how{ margin-top:10px; }
.wl-how summary{ cursor:pointer; font-size:.85rem; font-weight:600; color:var(--text-muted); }
/* team workload: collapsible cards */
.wl-fold > summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:8px; }
.wl-fold > summary::-webkit-details-marker{ display:none; }
.wl-fold > summary::before{ content:"▸"; color:var(--text-muted); font-size:.85rem; transition:transform .15s; }
.wl-fold[open] > summary::before{ transform:rotate(90deg); }
.wl-fold > summary h2, .wl-fold > summary h3{ margin:0; }
.wl-fold-ai{ margin-top:14px; }
.wl-fold-ai > summary .wl-ai-h{ margin:0; }
.wl-fold > summary + *{ margin-top:10px; }
/* dashboard KPI strip: equal columns whatever the number of tiles (some tiles are optional) */
@media (min-width:1101px){ .kpis{ grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr); } }
/* Customer Organizations: side menu with group headings, filter bar */
.settings-nav .sn-group{ font-size:.65rem; font-weight:800; letter-spacing:.09em; text-transform:uppercase; color:var(--text-muted); padding:12px 12px 4px; }
.settings-nav .sn-group:first-child{ padding-top:4px; }
.org-side-layout{ grid-template-columns:260px minmax(0,1fr); }
.org-side-layout .settings-body > .stats{ margin-top:0; }
.org-filterbar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:10px; }
.org-filterbar input[type=search]{ flex:1 1 220px; max-width:340px; font:inherit; font-size:.9rem; padding:9px 11px; border:1px solid var(--border-strong); border-radius:10px; background:var(--surface); color:var(--text); }
.org-filterbar select{ width:auto; min-width:200px; }
a.org-name{ font-weight:700; text-decoration:none; color:var(--text); }
a.org-name:hover{ color:var(--accent); text-decoration:underline; }
@media (max-width:900px){
  .org-side-layout{ grid-template-columns:minmax(0,1fr); }
  .settings-nav .sn-group{ display:none; }
}
/* Customer List table: one block per customer, the PRJP of the customer under one name */
.cust-table tbody.cust-group{ border-top:2px solid var(--border-strong); }
.cust-table tbody.cust-group:first-of-type{ border-top:0; }
.cust-table td.cust-cell{ vertical-align:top; background:var(--surface-raised); min-width:190px; border-right:1px solid var(--border); }
.cust-cell .org-name{ display:block; font-size:.95rem; }
.cust-cell .chip-link{ display:inline-block; margin-top:4px; }
.cust-cell .cust-meta{ display:block; margin-top:6px; font-size:.78rem; color:var(--text-muted); }
.cust-cell .cust-counts-mini{ display:flex; flex-wrap:wrap; gap:4px; margin-top:6px; }
/* top bar: Operations, Monitoring and Optimization are separate menus now, so the entries get tighter on narrower screens */
@media (min-width:901px) and (max-width:1560px){
  body.has-sidebar .topbar{ gap:12px; padding-right:10px; }
  body.has-sidebar .nav > a, body.has-sidebar .nav > .nav-item > a, body.has-sidebar .nav-dd-btn{ padding:8px 9px; font-size:.83rem; }
  body.has-sidebar .nav-top .nav-search{ width:150px; }
}
@media (min-width:901px) and (max-width:1480px){
  body.has-sidebar .nav > a, body.has-sidebar .nav > .nav-item > a, body.has-sidebar .nav-dd-btn{ padding:8px 6px; font-size:.8rem; gap:5px; }
  body.has-sidebar .nav-top .nav-search{ width:36px; padding-left:0; padding-right:0; }
  body.has-sidebar .nav-top .nav-search span, body.has-sidebar .nav-top .nav-search kbd{ display:none; }
}
@media (min-width:901px) and (max-width:1360px){
  body.has-sidebar .topbar{ gap:8px; padding-left:12px; }
  body.has-sidebar .nav > a, body.has-sidebar .nav > .nav-item > a, body.has-sidebar .nav-dd-btn{ padding:8px 5px; font-size:.78rem; gap:4px; }
  body.has-sidebar .nav{ gap:0; }
}
/* team workload: engineer scorecards */
.wl-score-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr)); gap:14px; margin:12px 0; }
.wl-score{ border:1px solid var(--border); border-left:4px solid var(--border-strong); border-radius:var(--radius-m); padding:14px 16px; background:var(--surface-raised); min-width:0; }
.wl-score-ok{ border-left-color:var(--ok); } .wl-score-warn{ border-left-color:var(--warn); } .wl-score-crit{ border-left-color:var(--crit); } .wl-score-na{ border-left-color:var(--text-muted); }
.wl-score header{ display:flex; align-items:center; justify-content:space-between; gap:8px 12px; flex-wrap:wrap; margin-bottom:10px; }
.wl-score-name{ font-size:1.05rem; }
.wl-score-chips{ display:flex; gap:6px; flex-wrap:wrap; }
.wl-kv-mini{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:0 0 8px; }
.wl-kv-mini > div{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-s); padding:8px 10px; }
.wl-kv-mini dt{ font-size:.72rem; color:var(--text-muted); font-weight:600; }
.wl-kv-mini dd{ margin:2px 0 0; font-size:1.25rem; font-weight:800; }
.wl-kv-mini dd.neg, strong.neg{ color:var(--crit); }
.wl-why{ margin:6px 0 0; padding-left:18px; font-size:.84rem; display:flex; flex-direction:column; gap:3px; }
/* Team workload: summary panel (always dark, like the dashboard hero), side menu, panes */
.wl-hero{ position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:20px 28px; padding:22px 24px; margin:0 0 14px; border-radius:16px; color:#fff; background:linear-gradient(135deg,#0B2A4A 0%,#0F4C81 100%); box-shadow:var(--shadow); --wl-glow:rgba(143,211,255,.25); }
.wl-hero::after{ content:""; position:absolute; right:-80px; top:-80px; width:320px; height:320px; border-radius:50%; background:radial-gradient(circle,var(--wl-glow),transparent 68%); pointer-events:none; }
.wl-hero-ok{ --wl-glow:rgba(61,214,140,.32); } .wl-hero-warn{ --wl-glow:rgba(245,176,65,.34); } .wl-hero-crit{ --wl-glow:rgba(255,99,99,.38); }
.wl-hero > *{ position:relative; z-index:1; }
.wl-hero-main{ display:flex; gap:20px; align-items:flex-start; min-width:0; }
.wl-ring{ flex:none; width:92px; height:92px; border-radius:50%; display:grid; place-items:center; border:6px solid; background:rgba(255,255,255,.08); font-weight:800; font-size:.95rem; letter-spacing:.03em; text-align:center; line-height:1.1; padding:4px; }
.wl-ring-ok{ border-color:#3DD68C; color:#3DD68C; } .wl-ring-warn{ border-color:#F5B041; color:#F5B041; } .wl-ring-crit{ border-color:#FF6B6B; color:#FF8A8A; }
.wl-hero-text{ min-width:0; flex:1; }
.wl-eyebrow{ display:block; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; opacity:.75; font-weight:700; }
.wl-hero .wl-hero-title{ margin:4px 0 6px; font-size:1.55rem; font-weight:800; letter-spacing:-.01em; color:#fff; text-transform:none; line-height:1.2; }
.wl-hero-sub{ margin:0; opacity:.86; font-size:.92rem; max-width:62ch; }
.wl-bullet{ margin-top:14px; max-width:560px; } .wl-bullet svg{ width:100%; height:auto; display:block; }
.wl-hero-kpis{ display:grid; grid-template-columns:repeat(auto-fit,minmax(132px,1fr)); gap:10px; align-content:start; }
.wl-kpi{ display:flex; flex-direction:column; gap:2px; min-width:0; padding:10px 12px; border-radius:12px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); }
.wl-kpi-l{ font-size:.68rem; letter-spacing:.07em; text-transform:uppercase; opacity:.78; font-weight:700; }
.wl-kpi-v{ font-size:1.7rem; font-weight:800; line-height:1.1; }
.wl-kpi-s{ font-size:.74rem; opacity:.78; }
.wl-kpi .wl-spark{ width:100%; height:30px; margin-top:4px; }
.wl-kpi-crit .wl-kpi-v{ color:#FF8A8A; }
.wl-hero .wl-sp-line{ stroke:#8FD3FF; } .wl-hero .wl-sp-area, .wl-hero .wl-sp-dot{ fill:#8FD3FF; }
.wl-hero .wl-sp-warn .wl-sp-line, .wl-hero .wl-sp-warn.wl-spark .wl-sp-line{ stroke:#F5B041; } .wl-hero .wl-sp-warn .wl-sp-area, .wl-hero .wl-sp-warn .wl-sp-dot{ fill:#F5B041; }
.wl-hero .wl-sp-ok .wl-sp-line{ stroke:#3DD68C; } .wl-hero .wl-sp-ok .wl-sp-area, .wl-hero .wl-sp-ok .wl-sp-dot{ fill:#3DD68C; }
.wl-toolbar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin:0 0 14px; }
.wl-toolbar-gap{ flex:1; }
.wl-excl{ font-size:.8rem; color:var(--text-muted); border:1px dashed var(--border-strong); border-radius:999px; padding:3px 11px; }
.wl-layout.settings-layout{ grid-template-columns:260px minmax(0,1fr); }
.wl-layout .settings-nav .subtab-n{ margin-left:auto; flex:none; }
.wl-layout .org-pane > .card:last-child{ margin-bottom:0; }
.wl-charts-one{ grid-template-columns:minmax(0,1fr); }
.wl-key.wl-st-ok, .wl-st-ok{ background:var(--ok); fill:var(--ok); } .wl-key.wl-st-warn, .wl-st-warn{ background:var(--warn); fill:var(--warn); } .wl-key.wl-st-crit, .wl-st-crit{ background:var(--crit); fill:var(--crit); }
.wl-demand{ stroke:var(--accent); } .wl-demand-lab{ fill:var(--accent) !important; }
@media (max-width:1100px){ .wl-hero{ grid-template-columns:minmax(0,1fr); } }
@media (max-width:900px){ .wl-layout.settings-layout{ grid-template-columns:minmax(0,1fr); } }
@media (max-width:560px){ .wl-hero{ padding:16px; } .wl-hero-main{ flex-direction:column; } .wl-ring{ width:72px; height:72px; font-size:.8rem; } .wl-hero .wl-hero-title{ font-size:1.25rem; } }
/* Tickets page: summary panel extras, quick filters, richer rows */
.wl-ring small{ display:block; font-size:.62rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; opacity:.85; }
.wl-ring span{ font-size:1.7rem; line-height:1; }
.wl-ring span small{ font-size:.6rem; margin-top:2px; }
.tk-legend{ list-style:none; display:flex; flex-wrap:wrap; gap:6px 16px; margin:10px 0 0; padding:0; font-size:.82rem; }
.tk-legend a{ color:#fff; text-decoration:none; opacity:.9; display:inline-flex; align-items:center; gap:6px; }
.tk-legend a:hover{ opacity:1; text-decoration:underline; }
.tk-legend .wl-key{ margin-right:0; }
a.tk-kpi-link{ color:#fff; text-decoration:none; } a.tk-kpi-link:hover{ background:rgba(255,255,255,.14); }
.tk-type{ display:inline-block; font-size:.68rem; font-weight:800; letter-spacing:.04em; padding:1px 6px; border-radius:6px; background:var(--surface-raised); color:var(--text-muted); border:1px solid var(--border); vertical-align:middle; }
.tk-SR, .tk-sr{ color:var(--accent); border-color:var(--accent-soft); background:var(--accent-soft); }
.tk-CM, .tk-cm{ color:var(--ok); border-color:var(--ok-soft); background:var(--ok-soft); }
.tk-PM, .tk-pm{ color:var(--warn); border-color:var(--warn-soft); background:var(--warn-soft); }
.tk-legend .tk-type{ color:#fff; background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.25); }
.tk-chips{ display:flex; gap:8px; flex-wrap:wrap; margin:14px 0 10px; }
.tk-chip{ display:inline-flex; align-items:center; gap:6px; padding:6px 13px; border-radius:999px; font-size:.84rem; font-weight:600; text-decoration:none; color:var(--text-muted); background:var(--surface); border:1px solid var(--border); }
.tk-chip b{ font-size:.74rem; padding:0 6px; border-radius:999px; background:var(--surface-raised); color:var(--text); }
.tk-chip:hover{ border-color:var(--accent); color:var(--text); }
.tk-chip.active{ background:var(--text); color:var(--surface); border-color:var(--text); }
.tk-chip.active b{ background:rgba(255,255,255,.2); color:inherit; }
.tk-filters{ align-items:flex-end; flex-wrap:wrap; gap:10px 12px; }
.tk-search{ flex:1 1 280px; max-width:420px; }
.tk-search input{ width:100%; font:inherit; font-size:.9rem; padding:9px 11px; border:1px solid var(--border-strong); border-radius:10px; background:var(--surface); color:var(--text); }
.tk-table td{ vertical-align:top; }
.tk-table tr.tk-over td:first-child{ box-shadow:inset 3px 0 0 var(--crit); }
.tk-who{ display:inline-flex; align-items:center; gap:7px; text-decoration:none; font-weight:600; }
.tk-avatar{ width:24px; height:24px; border-radius:50%; display:inline-grid; place-items:center; font-size:.72rem; font-weight:800; color:#fff; background:var(--accent); flex:none; }
.tk-avatar-none{ background:var(--border-strong); color:var(--surface); }
.tk-age, .tk-due{ font-size:.72rem; font-weight:700; color:var(--text-muted); }
.tk-age.warn, .tk-due.warn{ color:var(--warn); } .tk-age.crit, .tk-due.crit{ color:var(--crit); }
.tk-count{ padding:8px 4px 0; }
.tk-filters select{ width:auto; min-width:0; max-width:210px; }
.tk-filters .tk-search{ flex:1 1 260px; max-width:360px; }
.wl-key.wl-todo{ background:#1A89C9; } .wl-key.wl-prog{ background:#2A9D5C; } .wl-key.wait, .wl-key.wl-wait{ background:#B3790F; }
.wl-ring span small{ margin-top:3px; }
/* ticket page: extend the due date */
.tk-ext-btns{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
.tk-ext-btns .btn{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:9px 6px; }
.tk-ext-btns .btn small{ font-size:.7rem; font-weight:600; color:var(--text-muted); }
.tk-ext-btns .btn:disabled{ opacity:.45; cursor:not-allowed; transform:none; }
.tk-extend{ border-left:4px solid var(--warn); }
.tk-ext-list{ list-style:none; margin:8px 0 0; padding:0; display:flex; flex-direction:column; gap:10px; }
.tk-ext-list li{ display:flex; flex-direction:column; gap:2px; padding-bottom:10px; border-bottom:1px solid var(--border); }
.tk-ext-list li:last-child{ border-bottom:0; padding-bottom:0; }
.tk-ext-reason{ font-size:.86rem; }
/* ticket page: the overdue banner with the extension form (wide, above the ticket) */
.tk-banner{ display:grid; grid-template-columns:minmax(230px,.75fr) minmax(0,2.25fr); gap:14px 24px; align-items:center; padding:16px 20px; margin:0 0 16px; border-radius:14px; border:1px solid var(--border); border-left:6px solid var(--warn); background:var(--warn-soft); }
.tk-banner-crit{ border-left-color:var(--crit); background:var(--crit-soft); }
.tk-banner-msg{ display:flex; align-items:center; gap:14px; }
.tk-banner-warn .tk-banner-ico{ color:var(--warn); } .tk-banner-crit .tk-banner-ico{ color:var(--crit); }
.tk-banner-msg strong{ display:block; font-size:1.2rem; font-weight:800; letter-spacing:-.01em; }
.tk-banner-msg span{ font-size:.86rem; color:var(--text-muted); }
.tk-banner-form{ display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1.1fr); gap:14px; align-items:start; }
.tk-step{ display:flex; flex-direction:column; gap:6px; min-width:0; position:relative; }
.tk-step-t{ font-size:.8rem; font-weight:700; padding-left:26px; }
.tk-step-t em{ font-style:normal; font-weight:500; color:var(--text-muted); margin-left:6px; }
.tk-step-n{ position:absolute; left:0; top:-1px; width:20px; height:20px; border-radius:50%; background:var(--text); color:var(--surface); font-size:.72rem; font-weight:800; display:grid; place-items:center; }
.tk-banner textarea{ width:100%; min-height:62px; resize:vertical; background:var(--surface); }
.tk-banner .tk-ext-btns .btn:disabled{ opacity:.4; }
@media (max-width:1100px){ .tk-banner, .tk-banner-form{ grid-template-columns:minmax(0,1fr); } }
.tk-banner .tk-ext-btns .btn small{ color:inherit; opacity:.9; }
.tk-banner .tk-ext-btns .btn:disabled{ opacity:.55; }
/* extension buttons: readable while disabled (white, dashed), solid blue once the reason is written */
.tk-banner .tk-ext-btns .btn{ background:var(--surface); color:var(--text); border:1px solid var(--border-strong); box-shadow:none; opacity:1; }
.tk-banner .tk-ext-btns .btn small{ color:var(--text-muted); opacity:1; font-size:.76rem; font-weight:600; }
.tk-banner .tk-ext-btns .btn:disabled{ border-style:dashed; cursor:not-allowed; opacity:1; color:var(--text-muted); }
.tk-banner .tk-ext-btns .btn:not(:disabled){ background:var(--accent); color:#fff; border-color:var(--accent); }
.tk-banner .tk-ext-btns .btn:not(:disabled) small{ color:rgba(255,255,255,.88); }
.tk-banner .tk-ext-btns .btn:not(:disabled):hover{ filter:brightness(1.08); transform:translateY(-1px); }
/* long words in a ticket (comments, description) must not widen the page on a phone */
.ticket-grid > *{ min-width:0; }
.ticket-grid .comment-list, .ticket-grid .comment-list li, .ticket-grid .pre, .ticket-summary{ overflow-wrap:anywhere; }
/* Dashboard: the operational cards (my work, the strip, tickets, PM, contracts, engineer load) */
.ops-mine{ margin-bottom:14px; }
.ops-head{ display:flex; align-items:center; justify-content:space-between; gap:8px 14px; flex-wrap:wrap; margin-bottom:10px; }
.ops-head h2{ margin:0; font-size:1rem; display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.ops-who{ display:inline-flex; align-items:center; gap:7px; font-size:.85rem; font-weight:700; color:var(--text-muted); }
.ops-more{ font-size:.82rem; font-weight:600; text-decoration:none; }
.ops-pick summary{ list-style:none; cursor:pointer; } .ops-pick summary::-webkit-details-marker{ display:none; }
.ops-pick-form{ display:flex; gap:8px; align-items:center; margin-top:8px; }
.ops-pick-form select{ width:auto; min-width:180px; }
.ops-mine-nums{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:12px; }
.ops-mine-nums a{ display:flex; flex-direction:column; gap:2px; padding:10px 12px; border:1px solid var(--border); border-radius:var(--radius-s); background:var(--surface-raised); text-decoration:none; color:var(--text); }
.ops-mine-nums a b{ font-size:1.6rem; line-height:1.1; font-weight:800; }
.ops-mine-nums a span{ font-size:.76rem; color:var(--text-muted); font-weight:600; }
.ops-mine-nums a.crit{ border-color:var(--crit); } .ops-mine-nums a.crit b{ color:var(--crit); }
.ops-mine-nums a.warn{ border-color:var(--warn); } .ops-mine-nums a.warn b{ color:var(--warn); }
.ops-strip{ display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; margin-bottom:14px; }
.ops-tile{ display:flex; flex-direction:column; gap:3px; padding:14px 16px; border-radius:14px; text-decoration:none; color:var(--text); background:var(--surface); border:1px solid var(--border); border-left:5px solid var(--ok); box-shadow:var(--shadow); }
.ops-tile b{ font-size:2rem; line-height:1; font-weight:800; }
.ops-tile span{ font-size:.82rem; font-weight:700; } .ops-tile small{ font-size:.74rem; color:var(--text-muted); }
.ops-tile.warn{ border-left-color:var(--warn); } .ops-tile.crit{ border-left-color:var(--crit); } .ops-tile.crit b{ color:var(--crit); } .ops-tile.warn b{ color:var(--warn); }
.ops-tile:hover{ border-color:var(--accent); }
.ops-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-bottom:14px; }
.ops-card{ min-width:0; margin:0; }
.ops-list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.ops-list li{ display:flex; align-items:center; gap:8px; padding:7px 0; border-top:1px solid var(--border); font-size:.86rem; min-width:0; }
.ops-list li:first-child{ border-top:0; }
.ops-main{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ops-due{ flex:none; font-size:.74rem; font-weight:800; padding:2px 8px; border-radius:999px; white-space:nowrap; }
.ops-due.crit{ color:var(--crit); background:var(--crit-soft); } .ops-due.warn{ color:var(--warn); background:var(--warn-soft); }
.ops-who-s{ flex:none; }
.ops-foot{ margin:8px 0 0; }
.ops-team td, .ops-team th{ padding:6px 8px; }
@media (max-width:1100px){ .ops-strip{ grid-template-columns:repeat(2,minmax(0,1fr)); } .ops-grid{ grid-template-columns:minmax(0,1fr); } .ops-mine-nums{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.dash > [data-w], .ops-grid, .ops-strip, .ops-mine{ min-width:0; max-width:100%; }
.ops-list li{ flex-wrap:nowrap; } .ops-list li > *{ min-width:0; }
.ops-main{ min-width:0; }
@media (max-width:560px){ .ops-list li{ flex-wrap:wrap; row-gap:2px; } .ops-main{ flex:1 1 100%; white-space:normal; overflow-wrap:anywhere; } .ops-strip{ grid-template-columns:minmax(0,1fr); } .ops-mine-nums{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
.ops-pick-form{ flex-wrap:wrap; } .ops-pick-form select{ min-width:0; max-width:100%; flex:1 1 160px; }
.ops-card .table-wrap{ overflow-x:auto; }

/* Role access (RBAC): one table, a checkbox per role and page */
.rbac-form table { width: 100%; }
.rbac-col { text-align: center; width: 9rem; white-space: nowrap; }
.rbac-form .rbac-group th { text-align: left; background: var(--surface-raised); font-size: .8rem; letter-spacing: .04em; text-transform: uppercase; color: var(--text-muted); }
.rbac-form input[type="checkbox"] { width: 1.1rem; height: 1.1rem; }
@media (max-width: 600px) { .rbac-col { width: 3.6rem; padding-inline: .25rem; white-space: normal; } .rbac-form thead .status-chip { display: none; } .rbac-form th, .rbac-form td { padding-inline: .5rem; } }

/* Dashboard for the Day 2 team: command panel, age bars, timeline, load bars */
.dc-hero{ grid-template-columns:minmax(0,1fr); gap:18px; padding:24px 26px 20px; margin-bottom:14px; }
.dc-hero .wl-hero-title{ font-size:2rem; }
.dc-hero .wl-ring{ width:104px; height:104px; }
.dc-hero .wl-ring span{ font-size:1.05rem; }
.dc-kpis{ grid-template-columns:repeat(5,minmax(0,1fr)); }
.dc-kpi{ text-decoration:none; color:#fff; transition:transform .15s ease, background .15s ease; }
.dc-kpi:hover{ background:rgba(255,255,255,.14); transform:translateY(-2px); }
.dc-kpi .wl-kpi-v{ display:flex; align-items:baseline; gap:8px; font-size:2.2rem; }
.dc-kpi-crit .wl-kpi-v{ color:#FF8A8A; } .dc-kpi-warn .wl-kpi-v{ color:#F5B041; } .dc-kpi-ok .wl-kpi-v{ color:#fff; }
.dc-delta{ font-size:.72rem; font-weight:800; padding:1px 7px; border-radius:999px; background:rgba(255,255,255,.14); }
.dc-up{ color:#FF8A8A; } .dc-down{ color:#3DD68C; }
.wl-hero .wl-sp-crit .wl-sp-line, .wl-hero .wl-sp-crit.wl-spark .wl-sp-line{ stroke:#FF8A8A; } .wl-hero .wl-sp-crit .wl-sp-area, .wl-hero .wl-sp-crit .wl-sp-dot{ fill:#FF8A8A; }
.dc-mine-line{ margin:10px 0 0; font-size:.9rem; } .dc-mine-line a{ color:#fff; font-weight:700; text-decoration:none; border-bottom:1px solid rgba(255,255,255,.4); }
.dc-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
.dc-grid .ops-card{ display:flex; flex-direction:column; }
.dc-sub{ margin:14px 0 4px; font-size:.72rem; letter-spacing:.07em; text-transform:uppercase; color:var(--text-muted); font-weight:700; }
.dc-bars{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.dc-bars a{ display:grid; grid-template-columns:minmax(96px,9.5rem) minmax(0,1fr) 2.2rem; gap:12px; align-items:center; text-decoration:none; color:var(--text); font-size:.86rem; }
.dc-bars a:hover .dc-bar{ outline:1px solid var(--accent); }
.dc-bar-l{ color:var(--text-muted); font-weight:600; }
.dc-bar{ display:block; height:14px; border-radius:999px; background:var(--surface-raised); overflow:hidden; }
.dc-bar i{ display:block; height:100%; border-radius:999px; }
.dc-bars b{ text-align:right; font-size:1rem; }
.dc-age-0{ background:var(--warn); } .dc-age-1{ background:#E8872B; } .dc-age-2{ background:#E2603F; } .dc-age-3{ background:var(--crit); } .dc-age-soon{ background:var(--info); }
.dc-bars-soon{ margin-top:2px; padding-top:8px; border-top:1px dashed var(--border); }
.dc-tl-scroll{ overflow-x:auto; }
.dc-tl{ width:100%; min-width:520px; height:auto; display:block; }
.dc-tl-lane{ fill:var(--surface-raised); } .dc-tl-past{ fill:var(--crit-soft); opacity:.55; }
.dc-tl-lab, .dc-tl-tick{ fill:var(--text-muted); font-size:12px; font-weight:600; }
.dc-tl-tick-today{ fill:var(--accent); font-weight:800; }
.dc-tl-today{ stroke:var(--accent); stroke-width:2; stroke-dasharray:4 3; } .dc-tl-grid{ stroke:var(--border); stroke-width:1; }
.dc-m{ stroke:var(--surface); stroke-width:1.5; cursor:pointer; transition:opacity .15s; } .dc-m:hover{ opacity:.7; }
.dc-m-crit{ fill:var(--crit); } .dc-m-warn{ fill:var(--warn); } .dc-m-info{ fill:var(--accent); }
.dc-m-n{ fill:#fff; font-size:11px; font-weight:800; pointer-events:none; }
.dc-legend{ list-style:none; display:flex; flex-wrap:wrap; gap:4px 16px; margin:8px 0 10px; padding:0; color:var(--text-muted); }
.dc-legend li{ display:inline-flex; align-items:center; gap:6px; }
.dc-key{ display:inline-block; width:10px; height:10px; border-radius:50%; }
.dc-key-crit{ background:var(--crit); } .dc-key-warn{ background:var(--warn); } .dc-key-info{ background:var(--accent); } .dc-key-ok{ background:var(--accent); }
.ops-due.info{ color:var(--accent); background:var(--accent-soft); }
.dc-load{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.dc-load li{ display:grid; grid-template-columns:minmax(120px,10rem) minmax(0,1fr) auto auto; gap:12px; align-items:center; font-size:.86rem; }
.dc-load-who{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dc-load-bar{ display:flex; height:16px; border-radius:999px; background:var(--surface-raised); overflow:hidden; }
.dc-load-bar i{ display:block; height:100%; } .dc-lb-ok{ background:var(--accent); } .dc-lb-over{ background:var(--crit); }
.dc-load-n{ white-space:nowrap; text-align:right; } .dc-load-n b{ font-size:1rem; }
.dc-load-chips{ display:inline-flex; gap:6px; }
.dc-grid .ops-mine{ margin-bottom:0; }
@media (max-width:1100px){ .dc-kpis{ grid-template-columns:repeat(3,minmax(0,1fr)); } .dc-grid{ grid-template-columns:minmax(0,1fr); } }
@media (max-width:640px){
  .dc-hero{ padding:18px 16px; } .dc-hero .wl-hero-title{ font-size:1.35rem; } .dc-hero .wl-ring{ width:76px; height:76px; }
  .dc-kpis{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dc-bars a{ grid-template-columns:minmax(0,1fr) 2rem; } .dc-bars .dc-bar-l{ grid-column:1 / -1; } .dc-bars .dc-bar{ grid-column:1; } .dc-bars b{ grid-column:2; grid-row:2; }
  .dc-load li{ grid-template-columns:minmax(0,1fr) auto; } .dc-load-bar{ grid-column:1 / -1; grid-row:2; } .dc-load-chips{ grid-column:1 / -1; }
}

/* Top bar tiers (override the older ones above): the menu entries and the search box never run past the bar. The breakpoints were measured with the
   widest menu (Super Admin: Operations badge, Admin menu); search is an icon up to 1760px, entries get tighter step by step, then two rows. */
@media (min-width:901px) and (max-width:1760px){
  body.has-sidebar .nav-top .nav-search{ width:38px; padding:0; justify-content:center; }
  body.has-sidebar .nav-top .nav-search .ns-text, body.has-sidebar .nav-top .nav-search span, body.has-sidebar .nav-top .nav-search kbd{ display:none; }
  body.has-sidebar .nav > a, body.has-sidebar .nav > .nav-item > a, body.has-sidebar .nav-dd-btn{ padding:8px 10px; font-size:.84rem; }
}
@media (min-width:901px) and (max-width:1560px){
  body.has-sidebar .nav > a, body.has-sidebar .nav > .nav-item > a, body.has-sidebar .nav-dd-btn{ padding:8px 7px; font-size:.8rem; gap:5px; }
}
@media (min-width:901px) and (max-width:1400px){
  body.has-sidebar .topbar{ gap:8px; padding-left:12px; }
  body.has-sidebar .nav > a, body.has-sidebar .nav > .nav-item > a, body.has-sidebar .nav-dd-btn{ padding:8px 5px; font-size:.78rem; gap:4px; }
  body.has-sidebar .nav{ gap:0; }
}
@media (min-width:901px) and (max-width:1290px){
  body.has-sidebar .topbar{ flex-wrap:wrap; row-gap:8px; }
  body.has-sidebar .nav{ display:contents; }
  body.has-sidebar .topbar::after{ content:""; order:5; flex-basis:100%; height:0; }
  body.has-sidebar .nav > a, body.has-sidebar .nav > .nav-item, body.has-sidebar .nav > .nav-dd:not(.nav-me){ order:10; }
  body.has-sidebar .nav > .nav-top{ order:2; margin-left:auto; }
  body.has-sidebar .nav > .nav-me{ order:3; }
}
@media (min-width:901px) and (max-width:1100px){
  body.has-sidebar .nav > a, body.has-sidebar .nav > .nav-item > a, body.has-sidebar .nav-dd-btn{ padding:8px 4px; font-size:.75rem; gap:3px; }
}
.dc-cap{ margin-top:auto; padding-top:14px; border-top:1px dashed var(--border); }
.dc-cap-t{ display:block; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; font-weight:800; margin-bottom:4px; }
.dc-cap-crit{ color:var(--crit); } .dc-cap-warn{ color:var(--warn); } .dc-cap-ok{ color:var(--ok); }
.dc-cap-bar svg{ width:100%; height:auto; display:block; }

/* Azure > Monitor: filter pills and the alert table */
.am-filter{ display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:2px 0 12px; }
.am-pill{ padding:4px 11px; border:1px solid var(--border); border-radius:999px; font-size:.8rem; font-weight:600; color:var(--text-muted); text-decoration:none; background:var(--surface); }
.am-pill:hover{ color:var(--accent); border-color:var(--accent); }
.am-pill.on{ color:var(--accent); background:var(--accent-soft); border-color:var(--accent); }
.am-sep{ width:1px; height:18px; background:var(--border); margin:0 4px; }
.am-table td{ vertical-align:top; }
.am-main{ min-width:220px; }
.am-desc{ display:block; margin-top:2px; overflow-wrap:anywhere; }
.am-row.done{ opacity:.72; }
.az-mode select{ max-width:100%; }
.tn-form:has(select[name=azure_mode] option[value=webhook]:checked) .az-full{ display:none; }

/* Readiness review (super admin page): decisions first, then gates, path, numbers; the feature list is folded */
.rd-h{ margin:26px 0 12px; font-size:1.1rem; }
.rd-h3{ margin:22px 0 8px; font-size:1rem; }
.rd-verdicts{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:14px; }
.rd-vc{ display:flex; flex-direction:column; gap:8px; margin:0; border-top:5px solid var(--ok); }
.rd-vc.rd-wait{ border-top-color:var(--crit); }
.rd-vc h2{ margin:0; font-size:1.1rem; }
.rd-vc p{ margin:0; font-size:.9rem; }
.rd-badge{ align-self:flex-start; padding:3px 12px; border-radius:999px; font-weight:700; font-size:.88rem; color:var(--ok); background:var(--ok-soft); }
.rd-wait .rd-badge{ color:var(--crit); background:var(--crit-soft); }
.rd-gates, .rd-path{ list-style:none; margin:0; padding:0; display:grid; gap:12px; }
.rd-gates{ grid-template-columns:repeat(auto-fit,minmax(290px,1fr)); }
.rd-path{ grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); }
.rd-gates li.card{ display:flex; gap:14px; align-items:flex-start; margin:0; }
.rd-gates strong, .rd-path strong{ display:block; }
.rd-gates .muted, .rd-path .muted{ font-size:.88rem; }
.rd-num{ flex:none; width:28px; height:28px; border-radius:50%; display:grid; place-items:center; font-weight:700; color:var(--crit); background:var(--crit-soft); }
.rd-path li.card{ display:flex; flex-direction:column; gap:4px; margin:0; }
.rd-when{ font-size:.72rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); }
.rd-tiles{ display:grid; grid-template-columns:repeat(auto-fit,minmax(110px,1fr)); gap:10px; margin-bottom:12px; }
.rd-tile{ margin:0; padding:10px 14px; display:flex; flex-direction:column; border-top:4px solid var(--info); }
.rd-t-ready{ border-top-color:var(--ok); } .rd-t-half{ border-top-color:var(--warn); } .rd-t-quarter{ border-top-color:var(--crit); }
.rd-n{ font-size:1.6rem; font-weight:800; line-height:1.15; }
.rd-t-ready .rd-n{ color:var(--ok); } .rd-t-half .rd-n{ color:var(--warn); } .rd-t-quarter .rd-n{ color:var(--crit); }
.rd-stack{ display:flex; height:10px; border-radius:5px; overflow:hidden; gap:2px; background:var(--border); min-width:0; }
.rd-stack.rd-big{ height:14px; border-radius:7px; margin-bottom:14px; }
.rd-seg{ display:block; min-width:4px; } .rd-ready{ background:var(--ok); } .rd-half{ background:var(--warn); } .rd-quarter{ background:var(--crit); } .rd-none{ background:var(--info); }
.rd-areas{ list-style:none; margin:0 0 14px; padding:0; display:flex; flex-direction:column; gap:10px; }
.rd-areas li{ display:grid; grid-template-columns:minmax(150px,1.2fr) minmax(120px,2fr) 110px; gap:6px 16px; align-items:center; }
.rd-ac{ text-align:right; font-size:.8rem; color:var(--text-muted); }
.rd-all{ margin-top:18px; } .rd-all > summary{ cursor:pointer; font-weight:700; padding:10px 0; }
.rd-lv{ display:inline-flex; align-items:center; gap:8px; white-space:nowrap; } .rd-meter{ display:inline-flex; gap:3px; }
.rd-meter i{ display:block; width:11px; height:11px; border-radius:3px; background:var(--border); }
.rd-lv-ready .rd-meter i.on{ background:var(--ok); } .rd-lv-half .rd-meter i.on{ background:var(--warn); } .rd-lv-quarter .rd-meter i.on{ background:var(--crit); }
.rd-lvname{ font-size:.8rem; font-weight:700; } .rd-lv-ready .rd-lvname{ color:var(--ok); } .rd-lv-half .rd-lvname{ color:var(--warn); } .rd-lv-quarter .rd-lvname{ color:var(--crit); } .rd-lv-none .rd-lvname{ color:var(--info); }
@media (max-width:560px){ .rd-areas li{ grid-template-columns:1fr auto; } .rd-areas .rd-stack{ grid-column:1/-1; order:3; } }

/* path to release: each step opens a checklist */
.rd-path{ align-items:start; }
.rd-path li.card{ padding:0; display:block; }
.rd-step summary{ list-style:none; cursor:pointer; padding:16px 18px; display:flex; flex-direction:column; gap:4px; border-radius:inherit; }
.rd-step summary::-webkit-details-marker{ display:none; }
.rd-step summary:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.rd-more{ margin-top:6px; font-size:.8rem; font-weight:700; color:var(--accent); }
.rd-hide{ display:none; } .rd-step[open] .rd-hide{ display:inline; } .rd-step[open] .rd-show{ display:none; }
.rd-chk{ list-style:none; margin:0; padding:12px 18px 16px; display:flex; flex-direction:column; gap:9px; border-top:1px solid var(--border); }
.rd-chk li{ display:flex; gap:10px; align-items:flex-start; font-size:.88rem; }
.rd-box{ flex:none; width:18px; height:18px; margin-top:2px; border-radius:5px; border:2px solid var(--text-muted); display:grid; place-items:center; font-size:.72rem; font-weight:800; line-height:1; }
.rd-chk li.done .rd-box{ background:var(--ok); border-color:var(--ok); color:var(--on-solid); }
.rd-chk li.done span:last-child{ color:var(--text-muted); }
.rd-path .rd-chk{ padding-left:18px; padding-right:18px; } .rd-path .rd-chk li{ margin:0; padding:0; }

/* readiness: tabs and the amber decision */
.rd-tabs{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 14px; }
.rd-tabs a{ padding:8px 16px; border-radius:999px; font-weight:700; font-size:.88rem; color:var(--text-muted); background:var(--surface); text-decoration:none; border:1px solid var(--border); }
.rd-tabs a.active{ background:var(--text); color:var(--surface); border-color:var(--text); }
.rd-tabs a:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.rd-vc.rd-soon{ border-top-color:var(--warn); }
.rd-soon .rd-badge{ color:var(--warn); background:var(--warn-soft); }
.rd-plat table{ table-layout:fixed; min-width:880px; }
.rd-plat th:nth-child(1){ width:17%; } .rd-plat th:nth-child(2){ width:15%; } .rd-plat th:nth-child(3){ width:23%; } .rd-plat th:nth-child(4){ width:19%; } .rd-plat th:nth-child(5){ width:11%; } .rd-plat th:nth-child(6){ width:15%; }
.rd-plat td{ overflow-wrap:anywhere; }
tr.is-hit td{ background:var(--accent-soft); animation:rd-hit 2.4s ease-out; }
@keyframes rd-hit{ from{ background:color-mix(in srgb,var(--accent) 38%,var(--surface)); } to{ background:var(--accent-soft); } }
.rd-all tr{ scroll-margin-top:90px; }

/* Readiness tab "Core and Portal" */
.rd-cm-hero p{ margin:0 0 12px; max-width:74ch; }
.rd-cm-three{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; }
.rd-cm-three li{ background:var(--surface-raised); border-radius:var(--radius-m,14px); padding:12px 14px; display:flex; flex-direction:column; gap:4px; }
.rd-cm-three span{ color:var(--text-muted); font-size:.88rem; }
.rd-cm-list{ margin:0; padding-left:18px; display:flex; flex-direction:column; gap:8px; max-width:80ch; }

/* Readiness "Core and Portal": interactive flow */
.rdf-bar{ display:flex; flex-wrap:wrap; gap:10px 16px; align-items:center; margin:0 0 6px; }
.rdf-seg,.rdf-chips{ display:flex; flex-wrap:wrap; gap:6px; }
.rdf-seg .btn[aria-pressed=true],.rdf-chips .btn[aria-pressed=true]{ background:var(--text); color:var(--surface); border-color:var(--text); }
.rdf-chg{ font-size:.86rem; display:inline-flex; gap:6px; align-items:center; }
.rdf-note{ margin:0 0 10px; }
.rdf-grid{ display:grid; grid-template-columns:minmax(0,1.75fr) minmax(260px,1fr); gap:16px; align-items:start; }
@media(max-width:1000px){ .rdf-grid{ grid-template-columns:1fr; } }
.rdf-svg svg{ width:100%; height:auto; display:block; color:var(--text-muted); }
.rdf-panel{ background:var(--surface-raised); border-radius:var(--radius-m,14px); padding:14px 16px; min-height:200px; position:sticky; top:16px; }
.rdf-panel h3{ margin:0 0 8px; font-size:1rem; }
.rdf-panel p{ margin:0 0 10px; font-size:.9rem; }
.rdf-ph{ display:flex; gap:8px; align-items:flex-start; justify-content:space-between; }
.rdf-badge{ background:var(--accent); color:var(--surface); border-radius:999px; font-size:.7rem; font-weight:800; padding:2px 9px; text-transform:uppercase; }
.rdf-blk{ display:flex; flex-direction:column; gap:2px; border-radius:10px; padding:8px 10px; margin:0 0 8px; font-size:.86rem; background:var(--surface); }
.rdf-blk b{ font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); }
.rdf-ok{ border-left:3px solid var(--ok); }.rdf-gap{ border-left:3px solid var(--warn); }
.rdf-facts{ margin:0 0 10px; padding-left:18px; font-size:.86rem; display:flex; flex-direction:column; gap:4px; }
.rdf-code{ font-size:.8rem !important; color:var(--text-muted); }
.rdf-node,.rdf-edge{ cursor:pointer; outline:none; transition:opacity .15s; }
.rdf-node:focus-visible .rdf-box,.rdf-edge:focus-visible .rdf-line{ stroke:var(--accent); stroke-width:3; }
.rdf-box{ fill:var(--surface-raised); stroke:var(--border); stroke-width:1.5; }
.rdf-in{ fill:var(--surface); stroke:var(--border); stroke-width:1.5; }
.rdf-node text,.rdf-edge text{ text-anchor:middle; font-family:inherit; fill:var(--text); }
.rdf-t1{ font-size:16px; font-weight:800; }.rdf-t1s{ font-size:14px; font-weight:800; }.rdf-t2{ font-size:13px; font-weight:600; }.rdf-t3{ font-size:12px; fill:var(--text-muted) !important; }
.rdf-tag{ font-size:10px; font-weight:800; text-transform:uppercase; fill:var(--accent) !important; text-anchor:end !important; }
.rdf-new .rdf-box{ stroke:var(--accent); stroke-dasharray:6 4; }
.rdf-line{ fill:none; stroke-width:2.2; stroke:currentColor; }
.rdf-hit{ fill:none; stroke:transparent; stroke-width:16; }
.rdf-dash .rdf-line{ stroke-dasharray:6 5; }
.rdf-lbl{ font-size:12px; font-weight:700; paint-order:stroke; stroke:var(--surface); stroke-width:5px; stroke-linejoin:round; }
.rdf-k-staff .rdf-line{ color:#7c5cc4; }.rdf-k-link .rdf-line{ color:var(--accent); }.rdf-k-ms .rdf-line{ color:#2e8b63; }
.rdf-k-hook .rdf-line{ color:#c4443d; }.rdf-k-ops .rdf-line{ color:#a5711a; }.rdf-k-cust .rdf-line{ color:#4660b5; }
.rdf-edge:hover .rdf-line,.rdf-edge.rdf-sel .rdf-line{ stroke-width:4; }
.rdf-node:hover .rdf-box,.rdf-node.rdf-sel .rdf-box{ stroke:var(--accent); stroke-width:3; }
.rdf-dim{ opacity:.18; }
@media(prefers-reduced-motion:reduce){ .rdf-node,.rdf-edge{ transition:none; } }
.rd-flow .rdf-chg{ flex-direction:row; align-items:center; white-space:nowrap; }
.rd-flow .rdf-chg input{ margin:0; }
.rdf-zone{ fill-opacity:.07; stroke-width:1.5; stroke-dasharray:3 5; }
.rdf-z-private{ fill:var(--ok); stroke:var(--ok); }.rdf-z-public{ fill:var(--warn); stroke:var(--warn); }
.rdf-zl{ font-size:11px; font-weight:800; letter-spacing:.08em; }
.rdf-zl-private{ fill:var(--ok) !important; }.rdf-zl-public{ fill:var(--warn) !important; }
.rdf-ex{ font-size:10px; font-weight:800; text-transform:uppercase; text-anchor:start !important; letter-spacing:.04em; }
.rdf-ex-public{ fill:var(--crit) !important; }.rdf-ex-private{ fill:var(--ok) !important; }.rdf-ex-outbound{ fill:var(--text-muted) !important; }
.rdf-ex-public-b{ border-left:3px solid var(--crit); }.rdf-ex-private-b{ border-left:3px solid var(--ok); }.rdf-ex-outbound-b{ border-left:3px solid var(--border-strong,var(--border)); }
.rdf-addr{ font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:10px !important; }
.rdf-legend{ display:flex; flex-wrap:wrap; gap:6px 18px; font-size:.82rem; color:var(--text-muted); margin:8px 0 0; }
.rdf-legend i{ display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:6px; vertical-align:-1px; }
.rdf-lg-priv{ background:var(--ok); }.rdf-lg-pub{ background:var(--warn); }.rdf-lg-out{ background:var(--border-strong,var(--border)); }

/* Plan and menu editors: menus grouped by category */
.pa-cats{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:12px;margin-top:8px}
.pa-cat{border:1px solid var(--border);border-radius:14px;background:var(--surface);padding:0}
.pa-cat>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px;cursor:pointer;font-weight:700;list-style:none}
.pa-cat>summary::-webkit-details-marker{display:none}
.pa-cat>summary::after{content:"▾";color:var(--text-muted);margin-left:6px}
.pa-cat:not([open])>summary::after{content:"▸"}
.pa-cat-t{flex:1}
.pa-cat-n{font-size:.74rem;font-weight:800;background:var(--surface-raised);color:var(--text-muted);border-radius:999px;padding:2px 9px}
.pa-cat-tools{display:flex;gap:6px;padding:0 14px 6px}
.pa-cat-body{display:flex;flex-direction:column;gap:6px;padding:4px 14px 12px}
.pa-cat-body .pa-menu{margin:0}
.pa-managed{margin:0;padding:8px 14px 12px;color:var(--text-muted)}
.pa-menus.is-locked .pa-cat{opacity:.65}

/* plan editor: the menu block can be collapsed */
.pa-menus{border:1px solid var(--border);border-radius:8px;padding:8px 12px}.pa-menus-sum{cursor:pointer;font-weight:600;list-style:none;display:flex;align-items:center;gap:6px}.pa-menus-sum::-webkit-details-marker{display:none}.pa-menus-sum::before{content:'\25B8';display:inline-block;transition:transform .15s}.pa-menus[open]>.pa-menus-sum::before{transform:rotate(90deg)}.pa-menus[open]>.pa-menus-sum{margin-bottom:10px}
.rd-signoff{ display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(340px,1fr)); margin:0 0 6px; }
.rd-signoff .rd-chk{ border-top:0; padding:0; }
.fd-request{ margin:0 0 14px; padding:12px 14px; border-radius:12px; background:var(--warn-soft); border-left:4px solid var(--warn); }
.fd-request-note{ display:block; margin:4px 0; font-style:italic; }
.fd-request-decline{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:8px; }
.fd-request-decline input[type=text]{ flex:1 1 260px; min-width:200px; }
.noc-form .noc-delivery{ flex-direction:column; align-items:stretch; margin:14px 0 4px; }
.noc-form .noc-delivery label{ flex-wrap:wrap; align-items:center; }
.noc-form .noc-delivery label .muted{ flex-basis:100%; margin-left:24px; }
.noc-form .noc-warn{ color:var(--warn); font-weight:600; }
.fd-jira{ margin:16px 0 4px; padding:14px 16px; border:1px solid var(--border); border-radius:12px; background:var(--surface-raised); }
.fd-jira h2{ margin:0 0 6px; font-size:1rem; }
.fd-jira-comments{ list-style:none; margin:12px 0 0; padding:0; display:flex; flex-direction:column; gap:8px; font-size:.86rem; }
.fd-jira-comments li{ padding-left:10px; border-left:3px solid var(--border); }
.rq-filter{ display:flex; gap:8px; align-items:flex-end; flex-wrap:wrap; margin:0 0 10px; }
.rq-filter label{ display:flex; flex-direction:column; gap:4px; font-size:.82rem; }
.ops-req{ border-left:4px solid var(--warn); background:var(--warn-soft); }
.ops-req-n{ display:inline-block; min-width:22px; padding:1px 8px; border-radius:999px; background:var(--warn); color:var(--on-solid); font-size:.78rem; font-weight:800; text-align:center; vertical-align:middle; }
.ops-req-list{ list-style:none; margin:8px 0 0; padding:0; display:flex; flex-direction:column; gap:10px; }
.ops-req-list li{ display:flex; flex-direction:column; gap:2px; }
.ops-req-t{ font-weight:700; }
.tenant-name{ font-weight:700; }

.rq-h{ font-size:1rem; margin:18px 0 8px; }

.demo-tag{ display:inline-block; font-size:.62rem; font-weight:700; letter-spacing:.03em; padding:1px 6px; margin-left:4px; border-radius:999px; background:var(--surface-raised); color:var(--text-muted); border:1px solid var(--border-strong); vertical-align:middle; white-space:nowrap; }

.nav-dd-panel .nav-dd-head{ display:block; padding:8px 14px 4px; font-size:.68rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); }
.nav-dd-panel .nav-dd-head:not(:first-child){ margin-top:4px; border-top:1px solid var(--border); padding-top:10px; }