/* ============================================================================
   CS-OS CONSOLE, per-client override slots (loaded AFTER theme.css).
   Only the tokens theme.css exposes as --client-* may be set here. Everything
   structural (ink weights, lines, status, spacing) stays the shared system.
   CS-OS accent = a confident support blue, distinct from the default coral/teal,
   high-contrast in corporate, light and dark.
   ============================================================================ */
:root {
  --client-accent:      #2E7DF0;   /* support blue */
  --client-accent-ink:  #1F63C8;   /* darker for text on a blue tint */
  --client-accent-glow: rgba(46,125,240,.18);
  --client-gradient:    linear-gradient(110deg, #2E7DF0, #4BA3F5);
  /* theme.css leaves --teal-wash on the default coral alpha; re-point it to the
     support-blue so accent-tinted surfaces (selected rows, pills, live panel)
     stay coherent now that the console is locked to the corporate look. */
  --teal-wash:   rgba(46,125,240,.07);
  --teal-wash-2: rgba(46,125,240,.11);
}
[data-theme="light"] {
  --client-accent:      #1F63C8;
  --client-accent-ink:  #1A56AE;
  --client-accent-glow: rgba(46,125,240,.20);
}
[data-theme="dark"] {
  --client-accent:      #4BA3F5;
  --client-accent-ink:  #6FB6F7;
  --client-accent-glow: rgba(75,163,245,.30);
}

/* a couple of CS-OS-specific status affordances reused across pages */
.pill { display:inline-flex; align-items:center; gap:7px; padding:3px 10px; border-radius:999px;
  font-family:var(--f-mono); font-size:10.5px; font-weight:500; letter-spacing:.08em;
  text-transform:uppercase; border:1px solid var(--line); color:var(--ink-muted); }
.pill.off    { color:var(--st-error);   border-color:color-mix(in srgb,var(--st-error) 40%,transparent);   background:var(--st-error-tint); }
.pill.draft  { color:var(--st-warn);    border-color:color-mix(in srgb,var(--st-warn) 40%,transparent);    background:var(--st-warn-tint); }
.pill.auto   { color:var(--st-live);    border-color:color-mix(in srgb,var(--st-live) 40%,transparent);    background:var(--st-live-tint); }
.pill.floor  { color:var(--st-error);   border-color:color-mix(in srgb,var(--st-error) 40%,transparent);   background:var(--st-error-tint); }
/* the amber escalate variant (used for an editable-L0 route-to-human leaf) */
.pill.escalate { color:var(--st-warn); border-color:color-mix(in srgb,var(--st-warn) 45%,transparent); background:var(--st-warn-tint); }
.mono-tag { font-family:var(--f-mono); font-size:11px; color:var(--ink-faint); letter-spacing:.04em; }

/* ============================================================================
   T11 dual-mode + policy-tree components (shared across the new pages).
   Structural only; reuses the shared status/line/ink tokens. No new accent.
   ============================================================================ */

/* the exact-endpoint chip a write control shows (a pointer to the real route) */
.ep-chip { display:inline-flex; align-items:center; font-family:var(--f-mono); font-size:10px;
  letter-spacing:.02em; padding:2px 8px; border-radius:6px; background:var(--surface-3);
  border:1px solid var(--line); color:var(--ink-muted); white-space:nowrap; }
/* the SIMULATED badge every demo write control carries */
.sim-badge { display:inline-flex; align-items:center; font-family:var(--f-mono); font-size:9px;
  font-weight:600; letter-spacing:.14em; padding:2px 7px; border-radius:5px; text-transform:uppercase;
  color:var(--st-pending); background:var(--st-pending-tint);
  border:1px solid color-mix(in srgb,var(--st-pending) 30%,transparent); }
/* a mono reference chip (secret_ref, fingerprint) shown verbatim, never a secret */
.ref-chip { font-family:var(--f-mono); font-size:11px; padding:2px 8px; border-radius:6px;
  background:var(--surface-2); border:1px solid var(--line); color:var(--ink-muted); word-break:break-all; }

/* the request-preview modal */
.csos-modal-scrim { position:fixed; inset:0; z-index:800; background:var(--tour-scrim);
  display:flex; align-items:center; justify-content:center; padding:24px; }
.csos-modal { width:min(620px,100%); max-height:82vh; overflow-y:auto; background:var(--surface);
  border:1px solid var(--line-strong); border-radius:var(--r-lg); box-shadow:var(--shadow-lg); padding:22px 24px; }
.csos-modal-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; }
.csos-modal-x { width:28px; height:28px; border-radius:7px; border:1px solid var(--line);
  background:var(--surface-2); color:var(--ink-muted); font-size:18px; line-height:1; }
.csos-modal-x:hover { color:var(--ink); border-color:var(--line-strong); }
.csos-modal-line { font-size:13px; color:var(--ink); margin:0; }
.csos-modal-note { font-size:12.5px; color:var(--ink-muted); line-height:1.55; margin:12px 0 0; max-width:66ch; }
.csos-pre { background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r-sm);
  padding:12px 14px; overflow-x:auto; font-family:var(--f-mono); font-size:11.5px; color:var(--ink);
  line-height:1.55; margin:0; white-space:pre; }

/* an honesty block: the payload's own label rendered verbatim in a bordered panel */
.honesty { border:1px solid var(--line); border-left:3px solid var(--st-warn); background:var(--st-warn-tint);
  border-radius:var(--r-sm); padding:12px 16px; font-size:12.5px; color:var(--ink-body); line-height:1.55;
  max-width:82ch; }
.honesty.info { border-left-color:var(--teal); background:var(--teal-wash); }

/* ---- the interactive decision tree (pure CSS flowchart, no libs) ---- */
.pt-wrap { display:grid; grid-template-columns:230px 1fr 340px; gap:18px; align-items:start; }
@media (max-width:1240px){ .pt-wrap{ grid-template-columns:1fr; } }
.pt-rail { display:flex; flex-direction:column; max-height:76vh; overflow-y:auto; scrollbar-width:thin; }
.pt-rail-item { display:flex; align-items:center; gap:9px; padding:9px 11px; border-bottom:1px solid var(--line-faint);
  cursor:pointer; border-left:2px solid transparent; }
.pt-rail-item:hover { background:var(--surface-2); }
.pt-rail-item.sel { background:var(--teal-wash); border-left-color:var(--teal); }
.pt-rail-item .rid { font-family:var(--f-mono); font-size:11px; color:var(--ink); flex:1; }
.pt-rail-item.locked .rid { color:var(--ink-muted); }
.pt-dots { display:inline-flex; gap:3px; }
.pt-dot { width:7px; height:7px; border-radius:50%; }
.pt-dot.auto_resolve { background:var(--st-live); }
.pt-dot.draft { background:var(--st-warn); }
.pt-dot.escalate { background:var(--st-warn); }
.pt-dot.hard_stop { background:var(--st-error); }

.pt-node { position:relative; }
.pt-children { margin-left:20px; padding-left:18px; border-left:1px solid var(--line); }
.pt-branch { position:relative; padding:5px 0; }
.pt-branch::before { content:""; position:absolute; left:-18px; top:20px; width:14px; height:1px; background:var(--line); }
.pt-cond { display:flex; flex-wrap:wrap; align-items:center; gap:9px; padding:9px 12px; border:1px solid var(--line);
  border-radius:var(--r-sm); background:var(--surface); margin:4px 0; }
.pt-cond .q { font-size:13px; color:var(--ink); font-weight:500; }
.pt-fact { font-family:var(--f-mono); font-size:10.5px; padding:2px 7px; border-radius:5px; background:var(--surface-2);
  border:1px solid var(--line); color:var(--ink-muted); }
.pt-blabel { font-family:var(--f-mono); font-size:10px; letter-spacing:.05em; text-transform:uppercase;
  color:var(--ink-faint); padding:2px 0 2px 2px; }
.pt-leaf { display:flex; flex-direction:column; gap:6px; padding:10px 13px; border:1px solid var(--line);
  border-radius:var(--r-sm); margin:4px 0; background:var(--surface); border-left:3px solid var(--line-strong); }
.pt-leaf.auto_resolve { border-left-color:var(--st-live); }
.pt-leaf.draft { border-left-color:var(--st-warn); }
.pt-leaf.escalate { border-left-color:var(--st-warn); }
.pt-leaf.hard_stop { border-left-color:var(--st-error); }
.pt-leaf .lhead { display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.pt-leaf .llabel { font-size:13px; font-weight:600; color:var(--ink); }
.pt-lock { display:inline-flex; align-items:center; gap:5px; font-family:var(--f-mono); font-size:10px;
  letter-spacing:.06em; color:var(--ink-faint); }
.pt-cap { font-size:11.5px; color:var(--ink-muted); line-height:1.5; margin:0; max-width:70ch; }
.pt-cap.locked { color:var(--st-error); }
.pt-cap.editable { color:var(--st-warn); }
.pt-drawer { margin-top:4px; }
.pt-drawer summary { font-family:var(--f-mono); font-size:10.5px; letter-spacing:.05em; color:var(--teal); cursor:pointer; }
.pt-drawer .pt-detail { margin-top:8px; display:grid; grid-template-columns:150px 1fr; gap:5px 12px; font-size:12px; }
.pt-detail .dk { font-family:var(--f-mono); font-size:10.5px; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-faint); }
.pt-provenance { font-size:11px; color:var(--ink-faint); margin:8px 0 0; font-style:italic; }

/* the knob editor + diff bar */
.knob-row { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--line-faint); flex-wrap:wrap; }
.knob-row .kk { font-family:var(--f-mono); font-size:11px; color:var(--ink-muted); min-width:220px; }
.knob-row input, .knob-row select { font:inherit; font-size:12.5px; padding:5px 9px; border:1px solid var(--line);
  border-radius:var(--r-sm); background:var(--surface); color:var(--ink); width:120px; }
.knob-row.dirty input, .knob-row.dirty select { border-color:var(--st-warn); }
.diff-bar { position:sticky; bottom:14px; display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  padding:12px 16px; border:1px solid var(--st-warn); background:var(--st-warn-tint); border-radius:var(--r-sm); margin-top:14px; }
.diff-bar .dtext { font-size:12.5px; color:var(--ink); font-weight:500; }

/* the simulator panel result + budget bar (cost page) */
.pt-sim label { display:block; font-size:12px; color:var(--ink-muted); margin:9px 0 4px; }
.pt-sim select, .pt-sim input { width:100%; font:inherit; font-size:12.5px; padding:6px 9px; border:1px solid var(--line);
  border-radius:var(--r-sm); background:var(--surface); color:var(--ink); }
.budget-track { position:relative; height:16px; border:1px solid var(--line-strong); border-radius:var(--r-pill);
  background:var(--surface-2); overflow:hidden; margin:14px 0 6px; }
.budget-fill { position:absolute; left:0; top:0; bottom:0; border-radius:var(--r-pill); }
.budget-fill.ok { background:var(--st-live); }
.budget-fill.warn { background:var(--st-warn); }
.budget-fill.kill { background:var(--st-error); }
.budget-tick { position:absolute; top:-4px; bottom:-4px; width:1px; background:var(--ink-faint); }
.budget-tick .tl { position:absolute; top:-16px; left:-14px; font-family:var(--f-mono); font-size:9px; color:var(--ink-faint); white-space:nowrap; }
