/* breken — a Brekfuz product. App · Warm Neutral family of the Brekfuz Design
   System: a flat canvas (no aurora film), liquid-glass surfaces, the
   per-org --brand accent on chrome, monochrome var(--ui-ink-strong) buttons, colour rationed
   to status pills. Tokens come from /bkz/styles.css (vendored verbatim); this
   file only composes them. Light only — the system has no dark family.
   Auth is the Auth · Horizon family: the holographic grid, the 30px card. */

/* ---------- theme ----------
   breken is dark. The Brekfuz system has no dark family, so this palette is derived
   from its Warm Neutral one — warm blacks for warm whites, the same --brand, the
   same glass and sheen logic. The original light values live under
   [data-theme="light"] so the flip is one attribute. */
:root {
  color-scheme: dark;
  --bkz-bg: #131211; --bkz-bg-shell: #161513; --bkz-surface: #1c1a18; --bkz-surface-sunken: #191715; --bkz-surface-input: #1a1917;
  --bkz-border: rgba(255, 255, 255, 0.10); --bkz-border-hairline: #292622; --bkz-border-rail: #2a2724; --bkz-border-soft: #242120; --bkz-border-input: #332f2b;
  --bkz-ink: #f1ede7; --bkz-muted: #a19b92; --bkz-ink-black: #ffffff; --bkz-ink-strong: #f2efe9; --bkz-ink-rail: #d3cdc4; --bkz-ink-body: #bdb6ac; --bkz-ink-muted: #a9a399; --bkz-ink-soft: #9d978e; --bkz-ink-slate: #807a72; --bkz-ink-faint: #77716a; --bkz-ink-ghost: #6b665f; --bkz-ink-disabled: #4d4945;
  --brand-soft: color-mix(in srgb, var(--brand) 24%, #131211); --brand-softer: color-mix(in srgb, var(--brand) 14%, #131211); --brand-ink: color-mix(in srgb, var(--brand) 62%, #ffffff);
  --glass-bg: rgba(255, 255, 255, 0.05); --glass-bg-hover: rgba(255, 255, 255, 0.08); --glass-border: rgba(255, 255, 255, 0.10); --glass-border-strong: rgba(255, 255, 255, 0.16);
  --glass-shadow: 0 2px 12px rgba(0, 0, 0, 0.35), 0 8px 32px rgba(0, 0, 0, 0.28); --glass-shadow-lg: 0 4px 20px rgba(0, 0, 0, 0.45), 0 12px 48px rgba(0, 0, 0, 0.35); --glass-inset: inset 0 1px 0 rgba(255, 255, 255, 0.08), inset 0 -1px 0 rgba(255, 255, 255, 0.02);
  --bkz-success-tint: color-mix(in srgb, #059669 18%, #131211); --bkz-success-border: color-mix(in srgb, #059669 36%, #131211); --bkz-success-ink: #86d6ac;
  --bkz-warn-tint: color-mix(in srgb, #d97706 16%, #131211); --bkz-warn-ink: #e6b86f;
  --bkz-danger-tint: color-mix(in srgb, #dc2626 16%, #131211); --bkz-danger-border: color-mix(in srgb, #dc2626 36%, #131211); --bkz-danger-ink: #f29690;
  --bkz-danger-alert-bg: color-mix(in srgb, #dc2626 14%, #131211); --bkz-danger-alert-ink: #f5a9a3; --bkz-danger-alert-border: color-mix(in srgb, #dc2626 34%, #131211);
  --bkz-blue-link: #8fa7ff; --bkz-blue-deep: #b3c2ff;
  --bkz-shadow-menu-rail: 0 12px 34px rgba(0, 0, 0, 0.6); --bkz-shadow-automation-hover: 0 12px 32px rgba(0, 0, 0, 0.45);

  --ui-surface: #1c1a18; --ui-sunk: #191715; --ui-sunk-a: rgba(25, 23, 21, 0.8); --ui-hover: #262320; --ui-row-hover: rgba(255, 255, 255, 0.04); --ui-trough: #221f1c; --ui-chip: #26231f; --ui-chip-ink: #a9a399; --ui-track: #2a2724;
  --ui-border: #2f2c28; --ui-border-hover: #403b36; --ui-warn-border: color-mix(in srgb, #d97706 30%, #131211); --ui-brand-border: color-mix(in srgb, var(--brand) 38%, #131211);
  --ui-ink-strong: #f2efe9; --ui-ink-body: #c9c3ba; --ui-ink-soft: #a9a399; --ui-ink-muted: #948e85; --ui-ink-faint: #6f6a63; --ui-eyebrow: color-mix(in srgb, #8fa7ff 75%, transparent);
  --ui-accent-btn: #f2efe9; --ui-accent-btn-hover: #ffffff; --ui-on-accent: #141311;
  --ui-tint-5: rgba(255, 255, 255, 0.05); --ui-tint-6: rgba(255, 255, 255, 0.06); --ui-tint-8: rgba(255, 255, 255, 0.08); --ui-tint-10: rgba(255, 255, 255, 0.10);
  --ui-glass-bg: rgba(255, 255, 255, 0.04); --ui-glass-solid: rgba(28, 26, 24, 0.78); --ui-glass-border: rgba(255, 255, 255, 0.08); --ui-glass-border-solid: rgba(255, 255, 255, 0.10); --ui-sheen: inset 0 1px 0 rgba(255, 255, 255, 0.06);
  --ui-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4); --ui-shadow-sm-wide: 0 2px 12px rgba(0, 0, 0, 0.35); --ui-shadow: 0 4px 24px rgba(0, 0, 0, 0.45); --ui-shadow-menu: 0 8px 40px rgba(0, 0, 0, 0.6), 0 2px 8px rgba(0, 0, 0, 0.4);
  --ui-bad-row: color-mix(in srgb, #dc2626 10%, transparent); --ui-warn-row: color-mix(in srgb, #d97706 10%, transparent);
  --ui-tip-bg: #f2efe9; --ui-tip-ink: #141311; --ui-drawer-bg: rgba(28, 26, 24, 0.92); --ui-scrim: rgba(0, 0, 0, 0.55);

  --au-shell: radial-gradient(circle at 58% 38%, rgba(92, 118, 255, 0.16), transparent 30%), radial-gradient(circle at 18% 82%, rgba(92, 118, 255, 0.12), transparent 36%), linear-gradient(180deg, #0b0f1f 0%, #0d1226 47%, #0a0e1c 100%);
  --au-sky: radial-gradient(ellipse at 50% 21%, rgba(120, 140, 255, 0.16), transparent 28%), linear-gradient(180deg, rgba(11, 15, 31, 0.9) 0%, rgba(13, 18, 38, 0.3) 44%, rgba(10, 14, 28, 0.85) 100%);
  --au-fog: radial-gradient(ellipse at center, rgba(18, 24, 52, 0.9), transparent 68%); --au-plane-opacity: 0.55;
  --au-card: linear-gradient(135deg, rgba(26, 32, 60, 0.9), rgba(16, 20, 42, 0.72)); --au-card-border: rgba(120, 140, 230, 0.28); --au-card-shadow: 0 28px 80px rgba(0, 0, 0, 0.55), 0 8px 24px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  --au-ink: #e9edff; --au-body: #aab6e0; --au-muted: #8b98c6; --au-faint: #6f7da8; --au-link: #9fb2ff; --au-rule: rgba(120, 140, 230, 0.25);
  --au-input-bg: rgba(10, 14, 30, 0.72); --au-input-border: rgba(120, 140, 230, 0.3); --au-input-border-hover: rgba(140, 160, 240, 0.5); --au-input-sheen: inset 0 1px 0 rgba(255, 255, 255, 0.06);
  --au-pill-bg: rgba(92, 118, 255, 0.14); --au-pill-border: rgba(120, 140, 230, 0.3);
}
:root[data-theme="light"] {
  color-scheme: light;
  --bkz-bg: #f5f3f0; --bkz-bg-shell: #f9f9f9; --bkz-surface: #ffffff; --bkz-surface-sunken: #fafafa; --bkz-surface-input: #fbfbfb;
  --bkz-border: rgba(148, 142, 132, 0.20); --bkz-border-hairline: #eaeaea; --bkz-border-rail: #ececec; --bkz-border-soft: #f0f0f0; --bkz-border-input: #e1e1e1;
  --bkz-ink: #0f172a; --bkz-muted: #64748b; --bkz-ink-black: #000000; --bkz-ink-strong: #202020; --bkz-ink-rail: #3a3a3a; --bkz-ink-body: #555555; --bkz-ink-muted: #666666; --bkz-ink-soft: #707070; --bkz-ink-slate: #9aa4b2; --bkz-ink-faint: #8b8b8b; --bkz-ink-ghost: #909090; --bkz-ink-disabled: #c0c0c0;
  --brand-soft: color-mix(in srgb, var(--brand) 12%, #fff); --brand-softer: color-mix(in srgb, var(--brand) 7%, #fff); --brand-ink: color-mix(in srgb, var(--brand) 72%, #12203a);
  --glass-bg: rgba(255, 255, 255, 0.52); --glass-bg-hover: rgba(255, 255, 255, 0.62); --glass-border: rgba(255, 255, 255, 0.65); --glass-border-strong: rgba(255, 255, 255, 0.85);
  --glass-shadow: 0 2px 12px rgba(15, 23, 42, 0.04), 0 8px 32px rgba(15, 23, 42, 0.03); --glass-shadow-lg: 0 4px 20px rgba(15, 23, 42, 0.06), 0 12px 48px rgba(15, 23, 42, 0.04); --glass-inset: inset 0 1px 0 rgba(255, 255, 255, 0.92), inset 0 -1px 0 rgba(255, 255, 255, 0.12);
  --bkz-success-tint: #f1fbf4; --bkz-success-border: #cfe8d7; --bkz-success-ink: #2f6741;
  --bkz-warn-tint: #f6f0e4; --bkz-warn-ink: #7c5310;
  --bkz-danger-tint: #fff6f4; --bkz-danger-border: #f4d4cf; --bkz-danger-ink: #8a3429;
  --bkz-danger-alert-bg: #fff8f7; --bkz-danger-alert-ink: #7a2e24; --bkz-danger-alert-border: #f3d5d0;
  --bkz-blue-link: #526df5; --bkz-blue-deep: #3147c8;
  --bkz-shadow-menu-rail: 0 12px 34px rgba(0, 0, 0, 0.12); --bkz-shadow-automation-hover: 0 12px 32px rgba(20, 22, 26, 0.07);

  --ui-surface: #ffffff; --ui-sunk: #fafafa; --ui-sunk-a: rgba(250, 250, 250, 0.8); --ui-hover: #f4f4f4; --ui-row-hover: rgba(255, 255, 255, 0.6); --ui-trough: #f5f5f5; --ui-chip: #f4f6f9; --ui-chip-ink: #7b8595; --ui-track: #eceff4;
  --ui-border: #e5e5e5; --ui-border-hover: #d4d4d4; --ui-warn-border: #e7dcc4; --ui-brand-border: #cfe0f5;
  --ui-ink-strong: #202020; --ui-ink-body: #404040; --ui-ink-soft: #6b7280; --ui-ink-muted: #737373; --ui-ink-faint: #a3a3a3; --ui-eyebrow: rgba(92, 118, 255, 0.7);
  --ui-accent-btn: #202020; --ui-accent-btn-hover: #2c2c2c; --ui-on-accent: #ffffff;
  --ui-tint-5: rgba(23, 23, 23, 0.05); --ui-tint-6: rgba(23, 23, 23, 0.06); --ui-tint-8: rgba(23, 23, 23, 0.08); --ui-tint-10: rgba(23, 23, 23, 0.10);
  --ui-glass-bg: rgba(255, 255, 255, 0.40); --ui-glass-solid: rgba(255, 255, 255, 0.72); --ui-glass-border: rgba(255, 255, 255, 0.50); --ui-glass-border-solid: rgba(255, 255, 255, 0.60); --ui-sheen: inset 0 1px 0 rgba(255, 255, 255, 0.8);
  --ui-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05); --ui-shadow-sm-wide: 0 2px 12px rgba(0, 0, 0, 0.04); --ui-shadow: 0 4px 24px rgba(0, 0, 0, 0.06); --ui-shadow-menu: 0 8px 40px rgba(15, 23, 42, 0.12), 0 2px 8px rgba(15, 23, 42, 0.06);
  --ui-bad-row: rgba(255, 246, 244, 0.7); --ui-warn-row: rgba(246, 240, 228, 0.75);
  --ui-tip-bg: #202020; --ui-tip-ink: #ffffff; --ui-drawer-bg: rgba(255, 255, 255, 0.86); --ui-scrim: rgba(15, 23, 42, 0.20);

  --au-shell: radial-gradient(circle at 58% 38%, rgba(92,118,255,0.12), transparent 30%), radial-gradient(circle at 18% 82%, rgba(166,182,255,0.22), transparent 36%), linear-gradient(180deg, #ffffff 0%, #fbfcff 47%, #f7f9ff 100%);
  --au-sky: radial-gradient(ellipse at 50% 21%, rgba(180,194,255,0.22), transparent 28%), linear-gradient(180deg, rgba(255,255,255,0.98) 0%, rgba(247,250,255,0.34) 44%, rgba(255,255,255,0.82) 100%);
  --au-fog: radial-gradient(ellipse at center, rgba(238,243,255,0.86), transparent 68%); --au-plane-opacity: 0.72;
  --au-card: linear-gradient(135deg, rgba(255,255,255,0.92), rgba(255,255,255,0.62)), linear-gradient(180deg, rgba(255,255,255,0.64), rgba(235,240,255,0.28)); --au-card-border: rgba(184,196,229,0.72); --au-card-shadow: var(--bkz-shadow-auth-card);
  --au-ink: #071845; --au-body: #52638c; --au-muted: #657397; --au-faint: #7b89ad; --au-link: #526adf; --au-rule: #dce3f5;
  --au-input-bg: rgba(255,255,255,0.72); --au-input-border: #d8def0; --au-input-border-hover: #bdc8ec; --au-input-sheen: inset 0 1px 0 rgba(255,255,255,0.85);
  --au-pill-bg: rgba(238,242,255,0.65); --au-pill-border: rgba(93,116,244,0.18);
}
:root:not([data-theme="light"]) ::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, 0.12); }
:root:not([data-theme="light"]) ::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, 0.22); }
:root:not([data-theme="light"]) .login-primary { border-color: rgba(111, 134, 255, 0.6); }

/* ---------- resets on top of the tokens ---------- */
body { background: var(--bkz-bg); color: var(--bkz-ink-strong); font-size: var(--bkz-text-md); line-height: var(--bkz-leading-body); }
h1, h2, h3, h4 { margin: 0; font-weight: 600; line-height: 1.2; }
p { margin: 0; }
button, input, select { font: inherit; color: inherit; }
a { color: var(--brand-ink); }
a:hover { color: var(--brand-ink); text-decoration: underline; }
code { font-size: .9em; background: var(--ui-tint-5); padding: 1px 5px; border-radius: var(--bkz-radius-xs); }
.mono { font-family: var(--bkz-font-mono); font-size: .92em; }
.muted { color: var(--bkz-muted); }
.tiny { font-size: var(--bkz-text-sm); }
.ellip { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.clamp { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
.row { display: flex; align-items: center; gap: 10px; }
.spread { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.stack { display: flex; flex-direction: column; gap: 10px; }
.mt { margin-top: 14px; }
.lbad { color: var(--bkz-danger-ink); }
.lwarn { color: var(--bkz-warn-ink); }

/* ---------- boot / loading ---------- */
.boot { display: grid; place-items: center; min-height: 100vh; }
.boot-mark { width: 26px; height: 26px; border-radius: 50%; border: 2px solid var(--bkz-border-rail); border-top-color: var(--brand); animation: spin .7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.spin { display: inline-block; width: 13px; height: 13px; border-radius: 50%; border: 1.7px solid currentColor; border-top-color: transparent; animation: spin .65s linear infinite; vertical-align: -2px; }
.spin-sm { width: 10px; height: 10px; border-width: 1.5px; }
/* IngestSweep: the honest indeterminate bar. It says "working" and nothing about how far. */
.loading { position: relative; display: block; overflow: hidden; max-width: 420px; margin: 18px 0; padding: 22px 0 0; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.16em; color: var(--bkz-ink-slate); }
.loading .spin { display: none; }
.loading::before { content: ""; position: absolute; left: 0; right: 0; top: 8px; height: 4px; border-radius: 9999px; background: var(--ui-track); }
.loading::after { content: ""; position: absolute; left: 0; top: 8px; height: 4px; width: 35%; border-radius: 9999px; background: var(--brand); animation: bkz-ingest-sweep 1.9s ease-in-out infinite; }

/* ---------- type ---------- */
.eyebrow { font-size: var(--bkz-text-xs); font-weight: 500; letter-spacing: 0.25em; text-transform: uppercase; color: var(--ui-eyebrow); }
.eyebrow.warn { color: var(--bkz-warn-ink); }
.h-display { font-size: var(--bkz-text-6xl); font-weight: 700; letter-spacing: var(--bkz-tracking-tight); margin-top: 6px; color: var(--bkz-ink); text-wrap: balance; }
.h-page { font-size: var(--bkz-text-4xl); font-weight: 700; letter-spacing: var(--bkz-tracking-snug); color: var(--bkz-ink); }
.h-count { font-size: var(--bkz-text-md); font-weight: 400; color: var(--bkz-muted); margin-left: 8px; }
.lede-lg { font-size: var(--bkz-text-md); line-height: 24px; color: var(--bkz-muted); max-width: 42rem; margin-top: 8px; }
.lede { color: var(--bkz-muted); font-size: var(--bkz-text-base); }
.sec-h { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 28px 0 10px; font-size: var(--bkz-text-md); font-weight: 600; color: var(--bkz-ink); }
.sec-h .muted { font-weight: 400; font-size: var(--bkz-text-base); }
.page-intro { margin: 2px 0 18px; animation: bkz-fade-up .45s var(--bkz-ease-settle) both; }
.page-intro .muted { margin-top: 4px; max-width: 42rem; line-height: 24px; }
.page-intro .tiny { margin-top: 6px; max-width: 42rem; line-height: 20px; }

/* ---------- buttons (Button.jsx) ---------- */
.btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 8px 16px; font-size: var(--bkz-text-base); font-weight: 500; line-height: 1.3;
  border-radius: var(--bkz-radius-md); cursor: pointer; white-space: nowrap;
  background: var(--ui-surface); color: var(--ui-ink-strong); border: 1px solid var(--ui-border); box-shadow: var(--ui-shadow-sm);
  transition: all var(--bkz-duration-base) var(--bkz-ease-settle);
}
.btn:hover { background: var(--ui-sunk); border-color: var(--ui-border-hover); text-decoration: none; color: var(--ui-ink-strong); }
.btn:active { transform: scale(0.97); }
.btn:disabled { opacity: 0.4; cursor: not-allowed; pointer-events: none; }
.btn-primary { background: var(--ui-accent-btn); color: var(--ui-on-accent); border-color: transparent; box-shadow: none; }
.btn-primary:hover { background: var(--ui-accent-btn-hover); border-color: transparent; color: var(--ui-on-accent); }
.btn-ghost { background: transparent; color: var(--ui-ink-muted); border-color: transparent; box-shadow: none; }
.btn-ghost:hover { background: var(--ui-trough); color: var(--ui-ink-strong); border-color: transparent; }
.btn-danger { color: var(--ui-ink-muted); }
.btn-sm { padding: 6px 12px; font-size: var(--bkz-text-sm); }
.btn-lg { padding: 10px 18px; font-size: var(--bkz-text-md); }
.btn-oauth { font-weight: 600; }
a.btn { text-decoration: none; }
.btn-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 16px; }
.linkish { background: none; border: 0; padding: 0; color: var(--brand-ink); cursor: pointer; font-weight: 500; font-size: inherit; }
.linkish:hover { text-decoration: underline; }

/* ---------- fields (TextInput.jsx) ---------- */
.field { display: block; margin-bottom: 14px; }
.field > span { display: block; margin-bottom: 6px; font-size: var(--bkz-text-base); font-weight: 650; color: var(--bkz-ink-strong); letter-spacing: -0.01em; }
.input { width: 100%; padding: 8px 12px; border: 1px solid var(--ui-border); border-radius: var(--bkz-radius-md); background: var(--ui-surface); color: var(--ui-ink-strong); font-size: var(--bkz-text-base); outline: none; transition: all var(--bkz-duration-base); }
.input:hover { border-color: var(--ui-border-hover); }
.input:focus { border-color: var(--ui-ink-strong); box-shadow: 0 0 0 1px var(--ui-tint-10); }
.input.mono { font-family: var(--bkz-font-mono); }
.pol-in { padding: 5px 8px; border: 1px solid var(--ui-border); border-radius: var(--bkz-radius-md); background: var(--ui-surface); color: var(--ui-ink-strong); font: inherit; font-size: var(--bkz-text-base); width: 74px; }
.pol-in:focus { outline: none; border-color: var(--ui-ink-strong); box-shadow: 0 0 0 1px var(--ui-tint-10); }
.pol-in.pol-wide { width: 92px; }

/* ---------- alerts and notes (ErrorState / LoginAlert) ---------- */
.alert { padding: 10px 12px; border-radius: var(--bkz-radius-3xl); font-size: var(--bkz-text-sm); line-height: 1.55; background: var(--bkz-danger-alert-bg); color: var(--bkz-danger-alert-ink); border: 1px solid var(--bkz-danger-alert-border); margin: 0 0 14px; }
.alert-loud { padding: 14px 16px; border-radius: var(--bkz-radius-3xl); font-size: var(--bkz-text-md); line-height: 1.5; background: var(--bkz-danger-alert-bg); color: var(--bkz-danger-alert-ink); border: 1px solid var(--bkz-danger-border); margin: 0 0 16px; }
.alert-loud .muted { display: block; margin-top: 3px; color: var(--bkz-danger-ink); }
.note { border-radius: var(--bkz-radius-3xl); border: 1px solid var(--ui-border); background: var(--ui-sunk); padding: 12px 16px; margin: 10px 0; font-size: var(--bkz-text-base); line-height: 20px; color: var(--ui-ink-body); }
.note-warn { background: var(--bkz-warn-tint); border-color: var(--ui-warn-border); color: var(--bkz-warn-ink); }
.note-warn .muted { color: var(--bkz-warn-ink); opacity: .85; }
.note b { color: var(--bkz-ink); }

/* ---------- badges: Badge (monochrome) and StatusPill (colour = status) ---------- */
.badge { display: inline-flex; align-items: center; gap: 4px; border-radius: var(--bkz-radius-full); border: 1px solid var(--ui-tint-8); background: var(--ui-tint-5); color: var(--ui-ink-muted); padding: 2px 8px; font-size: var(--bkz-text-2xs); font-weight: 500; letter-spacing: 0.05em; text-transform: uppercase; white-space: nowrap; vertical-align: middle; margin-left: 6px; }
.b-ok, .b-bad, .b-use, .b-ask { text-transform: none; letter-spacing: 0; font-size: var(--bkz-text-xs); font-weight: 600; padding: 3px 10px 3px 8px; gap: 6px; }
.b-ok::before, .b-bad::before, .b-use::before, .b-ask::before { content: ""; width: 6px; height: 6px; border-radius: 9999px; flex-shrink: 0; background: currentColor; }
.b-ok { background: var(--bkz-success-tint); color: var(--bkz-success-ink); border-color: var(--bkz-success-border); }
.b-ok::before { background: var(--bkz-success); }
.b-bad { background: var(--bkz-danger-tint); color: var(--bkz-danger-ink); border-color: var(--bkz-danger-border); }
.b-bad::before { background: var(--bkz-danger); }
.b-use { background: var(--bkz-warn-tint); color: var(--bkz-warn-ink); border-color: var(--ui-warn-border); }
.b-use::before { background: var(--bkz-warn); }
.b-ask { background: var(--brand-soft); color: var(--brand-ink); border-color: color-mix(in srgb, var(--brand) 30%, transparent); }
.b-ask::before { background: var(--brand); }
.b-quiet { }
.b-lg { font-size: var(--bkz-text-sm); padding: 6px 12px; margin-left: 0; }

/* ---------- surfaces (Surface.jsx) ---------- */
.card { position: relative; border-radius: var(--bkz-radius-3xl); background: var(--ui-glass-bg); backdrop-filter: blur(40px); -webkit-backdrop-filter: blur(40px); border: 1px solid var(--ui-glass-border); box-shadow: var(--ui-shadow), var(--ui-sheen); transition: all var(--bkz-duration-base) var(--bkz-ease-settle); }
.card-pad { padding: 20px 22px; }
.card-lg { padding: 36px 32px; }
.chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 6px; }
.chip { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-radius: var(--bkz-radius-full); background: var(--ui-chip); color: var(--ui-chip-ink); padding: 4px 10px; font-size: var(--bkz-text-xs); font-weight: 500; }
.chip-link { background: var(--brand-soft); color: var(--brand-ink); text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 2px; }
.chip.muted { color: var(--bkz-ink-slate); }
.cmd { display: flex; align-items: center; gap: 8px; margin: 8px 0; background: var(--ui-sunk); border: 1px solid var(--ui-border); border-radius: var(--bkz-radius-md); padding: 7px 10px; }
.cmd code { background: none; padding: 0; font-size: var(--bkz-text-sm); color: var(--ui-ink-body); flex: 1; min-width: 0; white-space: pre-wrap; word-break: break-all; line-height: 18px; }
.copy { border: 0; background: transparent; color: var(--ui-ink-faint); cursor: pointer; padding: 3px 5px; border-radius: var(--bkz-radius-sm); flex-shrink: 0; display: inline-grid; place-items: center; transition: all var(--bkz-duration-base); }
.copy:hover { background: var(--ui-hover); color: var(--ui-ink-strong); }
.copy.copied { color: var(--bkz-success); }
.copy.copy-failed { color: var(--bkz-danger); }
.copy-inline { justify-self: end; }

/* ---------- the shell: rail (AppSidebar.jsx), main (AppMain) ---------- */
.shell { position: relative; z-index: 1; min-height: 100vh; }
.sidebar { position: fixed; inset-block: 0; left: 0; z-index: 40; display: flex; flex-direction: column; width: 280px; background: var(--ui-surface); border-right: 1px solid var(--bkz-border-rail); transition: width 300ms var(--bkz-ease-settle); }
.sidebar.collapsed { width: 60px; align-items: center; padding: 16px 0; }
.sb-top { display: flex; align-items: center; justify-content: space-between; padding: 16px; }
.sb-brand { display: flex; align-items: center; gap: 10px; color: var(--bkz-ink-strong); }
.sb-brand:hover { text-decoration: none; color: var(--bkz-ink-strong); }
.sb-brand img { display: block; width: 32px; height: 32px; flex-shrink: 0; user-select: none; border-radius: 8px; }
.sidebar.collapsed .sb-brand img { width: 36px; height: 36px; margin-bottom: 8px; }
.sb-word { font-size: var(--bkz-text-lg); font-weight: 600; color: var(--bkz-ink-strong); }
.sb-iconbtn { display: flex; height: 36px; width: 36px; align-items: center; justify-content: center; border-radius: var(--bkz-radius-xl); border: 0; cursor: pointer; background: transparent; color: var(--ui-ink-faint); transition: all var(--bkz-duration-base); }
.sb-iconbtn:hover { background: var(--ui-hover); color: var(--bkz-ink-strong); }
.sidebar.collapsed .sb-iconbtn { margin-bottom: 16px; }
.sb-nav { display: flex; flex-direction: column; gap: 2px; padding: 0 12px; }
.sidebar.collapsed .sb-nav { padding: 0; align-items: center; gap: 6px; flex: 1; }
.sb-link { display: flex; align-items: center; gap: 12px; width: 100%; border: 0; cursor: pointer; border-radius: var(--bkz-radius-xl); padding: 8px 12px; font-size: var(--bkz-text-md); font-weight: 500; text-align: left; background: transparent; color: var(--bkz-ink-rail); transition: all var(--bkz-duration-base); min-width: 0; }
.sb-link:hover { background: var(--ui-hover); color: var(--bkz-ink-strong); text-decoration: none; }
.sb-link.on { background: var(--brand-soft); color: var(--brand-ink); }
.sb-link svg { flex-shrink: 0; }
.sb-link .lbl { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sb-link .sub { display: block; font-size: var(--bkz-text-xs); color: var(--bkz-ink-slate); font-weight: 400; margin-top: 1px; }
.sb-link.on .sub { color: var(--brand-ink); opacity: .8; }
.sidebar.collapsed .sb-link { height: 40px; width: 40px; justify-content: center; padding: 0; color: var(--ui-ink-faint); }
.sidebar.collapsed .sb-link.on { color: var(--brand-ink); }
.sb-initial { width: 20px; height: 20px; border-radius: var(--bkz-radius-sm); display: grid; place-items: center; font-size: 11px; font-weight: 700; background: var(--ui-tint-6); color: inherit; flex-shrink: 0; }
.sb-section { margin-top: 16px; display: flex; min-height: 0; flex: 1; flex-direction: column; padding: 0 12px; }
.sb-label { padding: 0 8px 6px; font-size: var(--bkz-text-xs); font-weight: 600; text-transform: uppercase; letter-spacing: 0.08em; color: var(--bkz-ink-slate); }
.sb-scroll { flex: 1; overflow-y: auto; display: flex; flex-direction: column; gap: 2px; }
.sb-empty { margin: 0; padding: 12px 8px; font-size: 12.5px; line-height: 20px; color: var(--bkz-ink-slate); }
.sb-foot { border-top: 1px solid var(--bkz-border-soft); padding: 12px; }
.sidebar.collapsed .sb-foot { border-top: 0; padding: 0; margin-top: auto; }
.acct-btn { display: flex; width: 100%; align-items: center; gap: 10px; border-radius: var(--bkz-radius-xl); border: 0; background: transparent; padding: 6px 8px; cursor: pointer; text-align: left; transition: background var(--bkz-duration-base); }
.acct-btn:hover { background: var(--ui-hover); }
.sidebar.collapsed .acct-btn { width: 36px; height: 36px; padding: 0; justify-content: center; border-radius: 9999px; background: var(--ui-accent-btn); }
.sidebar.collapsed .acct-btn:hover { background: var(--ui-accent-btn-hover); }
.avatar { width: 32px; height: 32px; border-radius: 9999px; background: var(--ui-accent-btn); display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--ui-on-accent); font-weight: 700; font-size: 10px; overflow: hidden; }
.avatar img { width: 100%; height: 100%; object-fit: cover; }
.sidebar.collapsed .avatar { width: 36px; height: 36px; }
.acct-main { min-width: 0; flex: 1; }
.acct-name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--bkz-text-base); font-weight: 500; color: var(--bkz-ink-strong); }
.acct-mail { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--bkz-text-xs); color: var(--bkz-ink-slate); }
.acct-gear { flex-shrink: 0; color: var(--ui-ink-faint); }
.menu-scrim { position: fixed; inset: 0; z-index: 40; }
.account-menu { position: fixed; bottom: 16px; left: 288px; z-index: 50; width: 256px; overflow: hidden; border-radius: var(--bkz-radius-xl); border: 1px solid var(--bkz-border-hairline); background: var(--ui-surface); box-shadow: var(--bkz-shadow-menu-rail); animation: bkz-fade-up .25s var(--bkz-ease-settle) both; }
.account-menu.from-collapsed { left: 70px; }
.am-head { border-bottom: 1px solid var(--bkz-border-hairline); padding: 12px 16px; }
.am-eyebrow { font-size: var(--bkz-text-2xs); font-weight: 500; text-transform: uppercase; letter-spacing: 0.18em; color: var(--bkz-ink-ghost); }
.am-who { margin-top: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: var(--bkz-text-md); font-weight: 500; color: var(--bkz-ink-strong); }
.am-item { display: flex; width: 100%; align-items: center; gap: 8px; border: 0; border-bottom: 1px solid var(--bkz-border-hairline); background: var(--ui-surface); padding: 10px 16px; text-align: left; font-size: var(--bkz-text-md); color: var(--bkz-ink-strong); cursor: pointer; transition: background var(--bkz-duration-base); text-decoration: none; }
.am-item:last-child { border-bottom: 0; }
.am-item:hover { background: var(--bkz-bg-shell); text-decoration: none; color: var(--bkz-ink-strong); }
.am-item svg { color: var(--ui-ink-faint); flex-shrink: 0; }
.main { min-height: 100vh; padding-left: 280px; transition: padding 300ms var(--bkz-ease-settle); }
.main.main-collapsed { padding-left: 60px; }
.main-inner { margin: 0 auto; max-width: 1152px; padding: 24px 32px 80px; min-width: 0; }

/* ---------- page header (PageHeader.jsx) + segmented subnav (Segmented.jsx) ---------- */
.page-head { margin-bottom: 20px; animation: bkz-fade-up .45s var(--bkz-ease-settle) both; }
.page-title-row { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.page-title { font-size: var(--bkz-text-4xl); font-weight: 700; letter-spacing: var(--bkz-tracking-snug); color: var(--bkz-ink); }
.page-sub { color: var(--bkz-muted); font-size: var(--bkz-text-md); }
.subnav { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 2px; margin-top: 14px; border-radius: var(--bkz-radius-md); padding: 2px; background: var(--ui-trough); }
.nav-item { display: inline-flex; align-items: center; justify-content: center; gap: 6px; white-space: nowrap; border-radius: var(--bkz-radius-sm); padding: 6px 12px; font-size: var(--bkz-text-xs); font-weight: 500; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ui-ink-muted); transition: all var(--bkz-duration-base); }
.nav-item:hover { color: var(--ui-ink-body); text-decoration: none; }
.nav-item.on { background: var(--ui-surface); color: var(--ui-ink-strong); box-shadow: var(--ui-shadow-sm); }
.nav-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--bkz-warn); display: inline-block; }
.nav-count { font-size: var(--bkz-text-2xs); padding: 1px 6px; border-radius: 9999px; background: var(--brand-soft); color: var(--brand-ink); letter-spacing: 0; }

/* ---------- connect ---------- */
.connect { max-width: 640px; }
.empty-hero { text-align: left; }
.connect .empty-hero { margin-bottom: 24px; }
.connect-grid { display: grid; gap: 12px; }
.opt { display: flex; align-items: flex-start; gap: 13px; padding: 16px 20px; border: 1px solid var(--bkz-border-rail); border-radius: var(--bkz-radius-3xl); background: var(--ui-surface); text-align: left; width: 100%; cursor: pointer; color: inherit; transition: all var(--bkz-duration-base); }
.opt:hover { border-color: var(--ui-brand-border); transform: translateY(-2px); box-shadow: var(--bkz-shadow-automation-hover); text-decoration: none; color: inherit; }
.opt:disabled { opacity: .4; cursor: not-allowed; pointer-events: none; }
.opt-primary { align-items: center; }
.oi { width: 36px; height: 36px; flex-shrink: 0; display: grid; place-items: center; border-radius: var(--bkz-radius-xl); background: var(--brand-soft); color: var(--brand-ink); }
.ot { font-weight: 600; font-size: 14.5px; color: var(--bkz-ink-strong); }
.od { color: var(--ui-ink-soft); font-size: 12.5px; line-height: 1.55; margin-top: 2px; }
.disclose { padding: 0 2px; }
.divider-or { display: flex; align-items: center; gap: 12px; color: var(--bkz-ink-slate); font-size: var(--bkz-text-sm); margin: 2px 0; }
.divider-or::before, .divider-or::after { content: ""; flex: 1; height: 1px; background: var(--bkz-border-hairline); }
.repo-picker { max-height: 380px; overflow-y: auto; margin: 0 -6px; padding: 6px; }
.repo-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: var(--bkz-radius-md); cursor: pointer; border: 1px solid transparent; transition: background var(--bkz-duration-base); }
.repo-row:hover { background: var(--ui-hover); }
.repo-row .rr-name { font-weight: 500; font-size: var(--bkz-text-base); }
.repo-row .rr-desc { color: var(--bkz-ink-slate); font-size: var(--bkz-text-sm); margin-top: 1px; }
.setup-steps { margin: 0; padding-left: 18px; font-size: var(--bkz-text-sm); color: var(--ui-ink-body); line-height: 1.6; }
.setup-steps li { margin-bottom: 8px; }

/* ---------- the six checks ---------- */
.dot { width: 7px; height: 7px; border-radius: 50%; flex-shrink: 0; display: inline-block; }
.dot-on { background: var(--brand); }
.dot-off { background: var(--bkz-ink-disabled); }
.dot-ready { background: var(--bkz-warn); }

/* ---------- results: headline ---------- */
.headline { position: relative; display: grid; grid-template-columns: auto 1fr; gap: 10px 28px; align-items: center; padding: 24px 28px; border-radius: var(--bkz-radius-panel); background: var(--ui-glass-solid); backdrop-filter: blur(28px) saturate(210%); -webkit-backdrop-filter: blur(28px) saturate(210%); border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow), var(--glass-inset); overflow: hidden; animation: bkz-fade-up .45s var(--bkz-ease-settle) both; }
.headline::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(135deg, rgba(255,255,255,0.2) 0%, transparent 50%); }
.headline > * { position: relative; z-index: 1; }
.headline .big .n { display: block; font-size: var(--bkz-text-8xl); font-weight: 600; letter-spacing: var(--bkz-tracking-tight); line-height: .95; color: var(--bkz-ink); font-variant-numeric: tabular-nums; }
.headline-zero .big .n { color: var(--bkz-muted); }
.headline .big small { display: block; margin-top: 8px; font-size: var(--bkz-text-xs); font-weight: 500; letter-spacing: var(--bkz-tracking-eyebrow-widest); text-transform: uppercase; color: var(--bkz-muted); }
.headline .say { font-size: var(--bkz-text-md); line-height: 24px; color: var(--ui-ink-body); max-width: 48ch; }
.headline .say b { color: var(--bkz-ink); }
.checks-line { display: block; margin-top: 8px; font-size: var(--bkz-text-sm); color: var(--bkz-muted); }
.head-acts { grid-column: 1 / -1; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 4px; }
@media (max-width: 720px) { .headline { grid-template-columns: 1fr; } }

/* ---------- results: funnel ---------- */
.funnel { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px; margin: 14px 0 0; padding: 10px 14px; border: 1px solid var(--bkz-border-rail); border-radius: var(--bkz-radius-3xl); background: var(--ui-surface); }
.funnel-k { font-size: var(--bkz-text-2xs); letter-spacing: 0.16em; text-transform: uppercase; color: var(--bkz-ink-slate); margin-right: 8px; font-weight: 600; }
.fchip { display: inline-flex; align-items: baseline; gap: 5px; padding: 4px 10px; border-radius: var(--bkz-radius-full); color: var(--ui-chip-ink); font-size: var(--bkz-text-xs); font-weight: 500; background: var(--ui-chip); border: 1px solid transparent; }
.fchip b { font-size: var(--bkz-text-base); color: var(--bkz-ink-strong); font-variant-numeric: tabular-nums; font-weight: 600; }
.fchip:hover { border-color: var(--brand); text-decoration: none; color: var(--ui-chip-ink); }
.fchip-minus { background: var(--bkz-warn-tint); color: var(--bkz-warn-ink); }
.fchip-minus b { color: var(--bkz-warn-ink); }
.fchip-eq { background: var(--brand-soft); color: var(--brand-ink); }
.fchip-eq b { color: var(--brand-ink); }
.fop { color: var(--bkz-ink-slate); font-size: var(--bkz-text-base); }

/* ---------- results: veto ---------- */
.veto { margin-top: 16px; padding: 14px 16px 8px; border-color: var(--ui-warn-border); background: var(--ui-warn-row); }
.veto-h { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: var(--bkz-text-md); color: var(--bkz-ink); }
.veto-h .badge { margin-left: 0; }
.veto .tiny { margin: 4px 0 8px; }
.flist-flat { margin-top: 0; border: 0; background: transparent; box-shadow: none; backdrop-filter: none; }
.flist-flat .frow { padding-left: 0; padding-right: 0; }

/* ---------- results: the list (Surface solid) ---------- */
.flist { margin-top: 18px; border-radius: var(--bkz-radius-3xl); overflow: hidden; background: var(--ui-glass-solid); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); border: 1px solid var(--ui-glass-border-solid); box-shadow: var(--ui-shadow-sm-wide), var(--ui-sheen); }
.flist + .flist { margin-top: 14px; }
.fgrp { display: flex; justify-content: space-between; align-items: center; gap: 6px 12px; flex-wrap: wrap; padding: 9px 16px; background: var(--ui-sunk-a); border-bottom: 1px solid var(--bkz-border-hairline); font-size: var(--bkz-text-2xs); letter-spacing: 0.16em; text-transform: uppercase; color: var(--bkz-muted); font-weight: 600; }
.fgrp + .fgrp, .frow + .fgrp { border-top: 1px solid var(--bkz-border-hairline); }
.fgrp em { font-style: normal; text-transform: none; letter-spacing: 0; color: var(--bkz-ink-slate); font-size: var(--bkz-text-sm); font-weight: 400; }
.fgrp .linkish { text-transform: none; letter-spacing: 0; font-size: var(--bkz-text-sm); }
.fgrp > span:first-child { display: inline-flex; align-items: center; gap: 8px; }
.gdot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.g-ok { background: var(--bkz-success); } .g-ask { background: var(--brand); } .g-use { background: var(--bkz-warn); }
.frow { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--bkz-border-hairline); transition: background var(--bkz-duration-base); }
.frow:last-child { border-bottom: 0; }
.frow:hover { background: var(--ui-row-hover); }
.frow-kept { opacity: .6; }
.frow-sel { background: var(--brand-softer); }
.frow-bad { background: var(--ui-bad-row); }
.frow-empty, .frow-more { color: var(--bkz-muted); font-size: var(--bkz-text-base); padding: 12px 16px; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.fmark { width: 18px; height: 18px; border-radius: var(--bkz-radius-sm); flex-shrink: 0; display: grid; place-items: center; font-size: 11px; font-weight: 700; }
.fmark-on { background: var(--ui-accent-btn); color: var(--ui-on-accent); }
.fmark-off { background: var(--ui-tint-6); color: var(--ui-ink-muted); }
.fmark-use { color: var(--bkz-warn); background: var(--bkz-warn-tint); font-size: 8px; }
.fmark-bad { background: var(--bkz-danger); color: var(--ui-on-accent); }
.fchk { width: 18px; height: 18px; border-radius: var(--bkz-radius-sm); flex-shrink: 0; border: 1px solid var(--ui-border-hover); background: var(--ui-surface); cursor: pointer; display: grid; place-items: center; font-size: 11px; color: var(--ui-on-accent); padding: 0; transition: all var(--bkz-duration-base); }
.fchk:hover { border-color: var(--ui-ink-strong); }
.fchk.on { background: var(--ui-accent-btn); border-color: var(--ui-accent-btn); }
.fmain { flex: 1; min-width: 0; color: inherit; display: block; }
.fmain:hover { text-decoration: none; color: inherit; }
.fmain:hover .fname { color: var(--brand-ink); }
.fname { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; font-weight: 600; font-size: var(--bkz-text-md); color: var(--bkz-ink-strong); }
.fdir { font-family: var(--bkz-font-mono); font-size: var(--bkz-text-xs); color: var(--bkz-ink-slate); font-weight: 400; margin-left: 4px; }
.fverdict { display: block; font-size: var(--bkz-text-sm); color: var(--ui-ink-soft); margin-top: 2px; line-height: 1.5; }
.fverdict b { color: var(--ui-ink-body); }
.fverdict code { font-size: var(--bkz-text-xs); }
.flines { font-size: var(--bkz-text-2xl); font-weight: 600; color: var(--bkz-ink); text-align: right; flex-shrink: 0; font-variant-numeric: tabular-nums; line-height: 1.05; min-width: 44px; letter-spacing: -0.02em; }
.flines small { display: block; font-size: var(--bkz-text-2xs); color: var(--bkz-ink-slate); font-weight: 500; letter-spacing: 0.05em; text-transform: uppercase; }
.flines-na { color: var(--bkz-ink-disabled); }
.caret { color: var(--bkz-ink-disabled); font-size: 18px; line-height: 1; }
.caret-link { flex-shrink: 0; padding: 4px; }
.caret-link:hover { text-decoration: none; }

/* ---------- results: tray, verify, ledger, exports ---------- */
.tray { margin-top: 16px; padding: 14px 16px; }
.tray-h { display: flex; flex-direction: column; gap: 2px; margin-bottom: 10px; font-size: var(--bkz-text-md); color: var(--bkz-ink); }
.tray-h .muted { font-size: var(--bkz-text-sm); }
.tray .btn-row { margin-top: 10px; }
.pol-line { display: flex; flex-wrap: wrap; gap: 4px 6px; align-items: center; }
.pol-edit { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font-size: var(--bkz-text-sm); margin: 6px 0 10px; }
.pr-result { margin-top: 10px; display: flex; flex-direction: column; gap: 4px; color: var(--ui-ink-body); }
.verify { margin-top: 16px; padding: 14px 16px; }
.mini-title { font-size: var(--bkz-text-md); font-weight: 600; margin-bottom: 10px; color: var(--bkz-ink); }
.mini-title .muted { font-weight: 400; }
.mini-count { font-size: var(--bkz-text-lg); color: var(--bkz-muted); margin-left: 6px; }
.vphases { display: flex; flex-direction: column; gap: 5px; }
.vphase { display: flex; align-items: center; gap: 10px; font-size: var(--bkz-text-base); }
.vphase.pending { opacity: .5; }
.vph-i { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; background: var(--ui-tint-6); color: var(--ui-ink-muted); flex-shrink: 0; }
.vphase.done .vph-i { background: var(--bkz-success-tint); color: var(--bkz-success-ink); }
.vph-l { flex: 1; }
.vph-d { font-family: var(--bkz-font-mono); font-size: var(--bkz-text-xs); color: var(--bkz-muted); }
.verdict-ok { margin-top: 12px; padding: 12px 14px; border-radius: var(--bkz-radius-xl); background: var(--bkz-success-tint); color: var(--bkz-success-ink); border: 1px solid var(--bkz-success-border); font-weight: 500; font-size: var(--bkz-text-md); line-height: 1.5; }
.verdict-bad { margin-top: 12px; padding: 12px 14px; border-radius: var(--bkz-radius-xl); background: var(--bkz-danger-tint); color: var(--bkz-danger-ink); border: 1px solid var(--bkz-danger-border); font-weight: 500; font-size: var(--bkz-text-md); line-height: 1.5; }
.verdict-ok .tiny, .verdict-bad .tiny { font-weight: 400; margin-top: 4px; }
.verdict-ok .muted { color: var(--bkz-success-ink); opacity: .85; }
.verdict-bad .muted { color: var(--bkz-danger-ink); opacity: .85; }
.verdict-bad .btn-row { margin-top: 10px; }
.ledger { margin-top: 8px; }
.lrow { display: flex; align-items: flex-start; gap: 12px; padding: 11px 16px; border-bottom: 1px solid var(--bkz-border-hairline); }
.lrow:last-child { border-bottom: 0; }
.lrow-bad { background: var(--ui-bad-row); }
.lstate { flex-shrink: 0; font-size: var(--bkz-text-2xs); letter-spacing: 0.05em; text-transform: uppercase; font-weight: 500; padding: 3px 9px; border-radius: 9999px; min-width: 104px; text-align: center; margin-top: 2px; border: 1px solid transparent; }
.ls-quiet { background: var(--ui-tint-5); color: var(--ui-ink-muted); border-color: var(--ui-tint-8); }
.ls-watch { background: var(--brand-soft); color: var(--brand-ink); }
.ls-ok { background: var(--bkz-success-tint); color: var(--bkz-success-ink); border-color: var(--bkz-success-border); }
.ls-bad { background: var(--bkz-danger); color: #fff; font-weight: 600; }
.lmain { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.exports .dex-file, .surgical .dex-file { display: flex; gap: 12px; align-items: flex-start; padding: 9px 16px; border-bottom: 1px solid var(--bkz-border-hairline); font-size: var(--bkz-text-sm); }
.exports .dex-file:last-child, .surgical .dex-file:last-child { border-bottom: 0; }
.exports .dex-file > .mono, .surgical .dex-file > .mono { flex-shrink: 0; max-width: 40%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.exports .chips, .surgical .chips { margin-top: 0; }
.surgical .chip .muted { font-family: var(--bkz-font-mono); font-size: var(--bkz-text-2xs); }
.surgical-foot { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 12px 16px; }
.surgical-foot .tiny { max-width: 60ch; }
.foot-links { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 30px; padding-top: 16px; border-top: 1px solid var(--bkz-border-hairline); font-size: var(--bkz-text-base); }

/* ---------- scoreboard (StatCard.jsx) ---------- */
.scoreboard { display: grid; grid-template-columns: repeat(auto-fit, minmax(124px, 1fr)); gap: 8px; margin-bottom: 16px; }
.sb-tile { display: flex; flex-direction: column; gap: 1px; padding: 14px 16px; border-radius: var(--bkz-radius-3xl); background: var(--ui-glass-solid); backdrop-filter: blur(28px) saturate(210%); -webkit-backdrop-filter: blur(28px) saturate(210%); border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow), var(--glass-inset); color: inherit; min-width: 0; transition: all var(--bkz-duration-base) var(--bkz-ease-settle); }
a.sb-tile:hover { transform: translateY(-1px); box-shadow: var(--glass-shadow-lg), var(--glass-inset); text-decoration: none; color: inherit; }
.sb-l { order: -1; font-size: var(--bkz-text-xs); font-weight: 500; letter-spacing: var(--bkz-tracking-eyebrow-widest); text-transform: uppercase; color: var(--bkz-muted); }
.sb-n { margin-top: 8px; font-size: var(--bkz-text-4xl); font-weight: 600; letter-spacing: -0.02em; color: var(--bkz-ink); font-variant-numeric: tabular-nums; line-height: 1.1; }
.sb-ok .sb-n { color: var(--bkz-success-ink); }
.sb-warn .sb-n { color: var(--bkz-warn-ink); }
.sb-bad .sb-n { color: var(--bkz-danger-ink); }
.sb-s { font-size: var(--bkz-text-xs); color: var(--bkz-muted); margin-top: 2px; }
.sb-stale { grid-column: 1 / -1; padding: 10px 14px; border-radius: var(--bkz-radius-3xl); background: var(--bkz-danger-alert-bg); color: var(--bkz-danger-alert-ink); border: 1px solid var(--bkz-danger-alert-border); font-size: var(--bkz-text-base); }
.sb-stale a { color: var(--bkz-danger-alert-ink); text-decoration: underline; }

/* ---------- CI states ---------- */
.ci { margin-top: 10px; padding: 12px 14px; border-radius: var(--bkz-radius-xl); font-size: var(--bkz-text-base); line-height: 1.5; }
.ci-judging, .ci-pending { background: var(--brand-soft); color: var(--brand-ink); }
.ci-judging .muted, .ci-pending .muted { color: var(--brand-ink); opacity: .8; }
.ci-skipped { background: var(--bkz-warn-tint); color: var(--bkz-warn-ink); border: 1px solid var(--ui-warn-border); }
.ci-skipped b { color: var(--bkz-warn-ink); }
.ci-none { background: var(--ui-sunk); color: var(--ui-ink-body); border: 1px solid var(--ui-border); }
.ci .btn-row { margin-top: 10px; }

/* ---------- decide rows, summaries ---------- */
.decide-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 0; border-top: 1px solid var(--bkz-border-hairline); font-size: var(--bkz-text-base); }
.decide-row:first-of-type { border-top: 0; }
.decide-row .badge { margin-left: 0; }
.decide-title { font-weight: 600; color: var(--bkz-ink-strong); }
.decide-rule { flex-basis: 100%; }
.decide-cta { margin: 4px 0 14px; padding: 14px 16px; }
.decide-cta .btn-row .tiny { max-width: 44ch; }
.decide-open { font-size: var(--bkz-text-base); color: var(--ui-ink-body); margin-bottom: 4px; }
.pr-summary { margin-bottom: 16px; padding: 12px 16px; }
.pr-summary .mini-title { display: flex; align-items: center; gap: 8px; }

/* ---------- the PR board ---------- */
.pr-list { display: flex; flex-direction: column; gap: 12px; margin-bottom: 22px; }
.pr-card { padding: 16px 18px; background: var(--ui-surface); backdrop-filter: none; -webkit-backdrop-filter: none; border: 1px solid var(--bkz-border-rail); box-shadow: none; }
.pr-card:hover { border-color: var(--ui-brand-border); box-shadow: var(--bkz-shadow-automation-hover); }
.pr-closed { opacity: .85; }
.pr-reverted { border-color: var(--bkz-danger-border); }
.pr-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pr-head .badge { margin-left: 0; }
.pr-title { font-weight: 600; font-size: 14.5px; color: var(--bkz-ink-strong); }
.pr-meta { margin-left: auto; }
.pr-tl { display: flex; align-items: center; margin: 12px 0 10px; overflow-x: auto; }
.pr-node { display: inline-flex; align-items: center; gap: 6px; flex-shrink: 0; font-size: var(--bkz-text-sm); color: var(--bkz-muted); }
.pr-dot { width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; font-size: 10px; background: var(--ui-tint-6); color: var(--ui-ink-faint); flex-shrink: 0; }
.pr-node.done .pr-dot { background: var(--bkz-success-tint); color: var(--bkz-success-ink); }
.pr-node.current .pr-dot { background: var(--brand); color: #fff; }
.pr-node.current .pr-label { color: var(--bkz-ink); font-weight: 600; }
.pr-node.bad .pr-dot { background: var(--bkz-danger); color: #fff; }
.pr-node.bad .pr-label { color: var(--bkz-danger-ink); font-weight: 600; }
.pr-node.skip { opacity: .35; }
.pr-label small { display: block; font-family: var(--bkz-font-mono); font-size: var(--bkz-text-2xs); color: var(--bkz-ink-slate); }
.pr-line { width: 22px; height: 1px; background: var(--ui-border); margin: 0 8px; flex-shrink: 0; }
.pr-acts { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 10px; }
.watch-block { margin-top: 10px; padding: 12px 14px; border-radius: var(--bkz-radius-xl); background: var(--brand-softer); border: 1px solid color-mix(in srgb, var(--brand) 18%, transparent); }
.watch-day .sb-n { color: var(--brand-ink); font-size: 22px; margin-top: 0; display: inline; }
.watch-bar { height: 6px; border-radius: 999px; background: color-mix(in srgb, var(--brand) 18%, transparent); margin: 8px 0; overflow: hidden; }
.watch-bar span { display: block; height: 100%; background: var(--brand); border-radius: 999px; transition: width .3s; }
.watch-block .tiny b { color: var(--brand-ink); }
.surgical-strip { border-left: 3px solid var(--brand); }

/* ---------- refused / empty (EmptyState.jsx) ---------- */
.refused { border-color: var(--ui-warn-border); }
.refused .lede-lg { color: var(--bkz-ink); }
.empty { padding: 40px 24px; text-align: center; color: var(--ui-ink-muted); margin-top: 14px; display: flex; flex-direction: column; align-items: center; gap: 12px; font-size: var(--bkz-text-sm); line-height: 24px; }
.empty .et { font-size: var(--bkz-text-md); font-weight: 600; color: var(--ui-ink-strong); }
.empty .btn-row { margin-top: 4px; }

/* ---------- the sweep (Disclosure.jsx for stages) ---------- */
.sweep-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; animation: bkz-fade-up .45s var(--bkz-ease-settle) both; }
.sweep-head .muted { margin-top: 4px; }
.sweep-head .btn-row { margin-top: 0; }
.rail { display: flex; align-items: center; gap: 0; overflow-x: auto; padding: 2px 0 10px; }
.rnode { display: flex; align-items: center; gap: 8px; padding-right: 12px; flex-shrink: 0; color: var(--bkz-muted); font-size: var(--bkz-text-sm); }
.rnode:hover { text-decoration: none; color: var(--bkz-ink); }
.rdot { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-family: var(--bkz-font-mono); font-size: 11px; flex-shrink: 0; background: var(--ui-tint-6); color: var(--ui-ink-faint); }
.rnode.done .rdot { background: var(--bkz-success-tint); color: var(--bkz-success-ink); }
.rnode.active .rdot { background: var(--brand); color: #fff; }
.rnode.active .rlabel { color: var(--bkz-ink); font-weight: 600; }
.rnode.skipped { opacity: .5; }
.rline { width: 22px; height: 1px; background: var(--ui-border); flex-shrink: 0; margin-right: 12px; }
.stages { display: flex; flex-direction: column; gap: 8px; }
.stage { border: 1px solid var(--ui-border); border-radius: var(--bkz-radius-xl); background: var(--ui-surface); transition: border-color var(--bkz-duration-base); }
.stage:hover { border-color: var(--ui-border-hover); }
.stage.active { border-color: var(--brand); box-shadow: 0 0 0 3px var(--brand-softer); }
.stage.todo { opacity: .55; }
.stage.skipped { opacity: .7; }
.stage-h { display: flex; align-items: center; gap: 12px; width: 100%; padding: 16px 20px; background: none; border: 0; text-align: left; cursor: pointer; color: inherit; border-radius: var(--bkz-radius-xl); }
.stage-h:disabled { cursor: default; }
.stage-n { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-family: var(--bkz-font-mono); font-size: 11.5px; flex-shrink: 0; background: var(--ui-tint-6); color: var(--ui-ink-muted); }
.stage.done .stage-n { background: var(--bkz-success-tint); color: var(--bkz-success-ink); }
.stage.active .stage-n { background: var(--brand); color: #fff; }
.stage-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.stage-title { font-weight: 600; font-size: var(--bkz-text-md); color: var(--ui-ink-strong); }
.stage-verdict { font-size: var(--bkz-text-sm); line-height: 20px; color: var(--ui-ink-muted); }
.stage-verdict b { color: var(--bkz-ink); font-weight: 600; font-variant-numeric: tabular-nums; }
.stage-sub { font-size: var(--bkz-text-sm); line-height: 20px; color: var(--ui-ink-muted); }
.stage-elapsed { font-family: var(--bkz-font-mono); font-size: var(--bkz-text-sm); color: var(--bkz-muted); font-variant-numeric: tabular-nums; }
.stage-caret { color: var(--ui-ink-faint); font-size: 12px; transition: transform var(--bkz-duration-base); }
.stage.open .stage-caret { transform: rotate(90deg); }
.stage-body { padding: 4px 20px 20px 56px; }
.stage-body p { margin: 8px 0 0; }
.bignums { display: flex; gap: 24px; flex-wrap: wrap; }
.bn-v { font-size: var(--bkz-text-4xl); font-weight: 600; letter-spacing: -0.02em; color: var(--bkz-ink); line-height: 1.1; font-variant-numeric: tabular-nums; }
.bn-v.warn { color: var(--bkz-warn-ink); }
.bn-v.ok { color: var(--bkz-success-ink); }
.bn-v.use { color: var(--bkz-warn-ink); }
.bn-l { font-size: var(--bkz-text-xs); color: var(--bkz-muted); margin-top: 2px; }
.subchecks { display: flex; flex-direction: column; gap: 6px; }
.subcheck { display: flex; align-items: center; gap: 10px; font-size: var(--bkz-text-base); }
.subcheck.todo { opacity: .5; }
.sc-i { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; background: var(--ui-tint-6); color: var(--ui-ink-muted); flex-shrink: 0; }
.subcheck.done .sc-i { background: var(--bkz-success-tint); color: var(--bkz-success-ink); }
.sc-l { flex: 1; }
.sc-v { font-family: var(--bkz-font-mono); font-size: var(--bkz-text-xs); color: var(--bkz-muted); }
.sub-h { margin-top: 14px; font-size: var(--bkz-text-base); color: var(--bkz-ink); }
.sub-h:first-child { margin-top: 0; }
.sub-h .muted { font-weight: 400; }
.tbl { display: flex; flex-direction: column; margin-top: 8px; border: 1px solid var(--ui-border); border-radius: var(--bkz-radius-md); overflow: hidden; }
.trow { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 14px; align-items: center; padding: 6px 12px; font-size: var(--bkz-text-sm); border-top: 1px solid var(--bkz-border-hairline); background: var(--ui-surface); min-width: 0; }
.trow:first-child { border-top: 0; }
.trow-3 { grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr) 26px; }
.trow-h { grid-template-columns: 1fr auto; background: var(--ui-sunk); font-weight: 600; color: var(--ui-ink-body); }
.trow-more { grid-template-columns: 1fr; }
.trow.trow-auto { grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) auto; }
.trow-auto .badge { margin-left: 0; }
.tnum { font-variant-numeric: tabular-nums; color: var(--bkz-muted); }
.tcell-why { min-width: 0; color: var(--ui-ink-muted); }
.trow .mono { font-size: var(--bkz-text-xs); color: var(--ui-ink-body); }
.trow code { font-size: var(--bkz-text-xs); }

/* ---------- drawer (ConfirmDialog scrim + Surface solid) ---------- */
.scrim { position: fixed; inset: 0; background: var(--ui-scrim); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); z-index: 60; animation: fade .15s ease; display: block; }
@keyframes fade { from { opacity: 0; } }
.drawer { position: fixed; top: 12px; right: 12px; bottom: 12px; width: min(600px, calc(100vw - 24px)); background: var(--ui-drawer-bg); backdrop-filter: blur(28px) saturate(210%); -webkit-backdrop-filter: blur(28px) saturate(210%); border: 1px solid var(--ui-glass-border-solid); border-radius: var(--bkz-radius-4xl); z-index: 61; overflow-y: auto; box-shadow: var(--ui-shadow-menu), var(--ui-sheen); animation: bkz-fade-up .35s var(--bkz-ease-settle) both; }
.dr-top { position: sticky; top: 0; background: var(--ui-drawer-bg); backdrop-filter: blur(12px); border-bottom: 1px solid var(--bkz-border-hairline); padding: 14px 22px; display: flex; align-items: center; justify-content: space-between; gap: 14px; z-index: 1; }
.dr-path { font-size: var(--bkz-text-sm); color: var(--bkz-muted); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dr-verdict { padding: 22px 24px; border-bottom: 1px solid var(--bkz-border-hairline); }
.dr-eyebrow { font-size: var(--bkz-text-xs); font-weight: 500; letter-spacing: var(--bkz-tracking-eyebrow-widest); text-transform: uppercase; color: var(--bkz-muted); display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.dr-eyebrow .badge { margin-left: 4px; }
.dr-lead { font-size: var(--bkz-text-3xl); font-weight: 600; letter-spacing: var(--bkz-tracking-snug); line-height: 1.35; margin-top: 8px; color: var(--bkz-ink); }
.dr-lead code { font-size: var(--bkz-text-md); }
.dr-plain { font-size: var(--bkz-text-md); color: var(--bkz-muted); margin-top: 6px; max-width: 56ch; line-height: 24px; }
.caveats { margin-top: 12px; display: flex; flex-direction: column; gap: 6px; }
.caveat { padding: 9px 12px; border-radius: var(--bkz-radius-md); background: var(--bkz-warn-tint); color: var(--bkz-warn-ink); border: 1px solid var(--ui-warn-border); font-size: var(--bkz-text-sm); line-height: 1.5; }
.dr-acts { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 18px; }
.dr-disclosure { width: 100%; padding: 14px 24px; display: flex; align-items: center; justify-content: space-between; gap: 10px; background: none; border: 0; border-bottom: 1px solid var(--bkz-border-hairline); color: var(--ui-ink-body); font-size: var(--bkz-text-base); cursor: pointer; text-align: left; transition: background var(--bkz-duration-base); }
.dr-disclosure:hover { background: var(--ui-sunk-a); }
.dr-proof { padding: 6px 24px 28px; }
.proofline { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--bkz-border-hairline); font-size: var(--bkz-text-base); }
.proofline:last-child { border-bottom: 0; }
.pw { font-weight: 600; font-size: var(--bkz-text-sm); color: var(--ui-ink-body); }
.pw-ok { color: var(--bkz-success-ink); }
.pd { color: var(--ui-ink-body); min-width: 0; line-height: 1.5; }
.pd .cmd { margin: 6px 0 0; }
.tl { font-size: var(--bkz-text-sm); margin-top: 3px; }

/* ---------- connections ---------- */
.conn { margin-top: 14px; padding: 16px 18px; }
.conn-h { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: var(--bkz-text-md); color: var(--bkz-ink); }
.conn-status { color: var(--bkz-muted); font-size: var(--bkz-text-sm); flex: 1; min-width: 0; }
.conn p { margin-top: 8px; max-width: 78ch; line-height: 20px; }
.conn .cmd { margin: 10px 0; }
.conn .btn-row { margin-top: 10px; }
.conn .note { margin: 10px 0 0; }
.token-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 6px; max-width: 640px; margin-top: 10px; }
.token-form .pol-in { width: 100%; }
.danger { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 28px; padding: 16px 18px; border-radius: var(--bkz-radius-3xl); border: 1px solid var(--bkz-danger-border); background: var(--ui-surface); }
.danger .dz { font-size: var(--bkz-text-xs); font-weight: 500; letter-spacing: var(--bkz-tracking-eyebrow-widest); text-transform: uppercase; color: var(--bkz-danger-ink); display: block; margin-bottom: 4px; }

/* ---------- activity ---------- */
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.split > * { min-width: 0; }
@media (max-width: 1000px) { .split { grid-template-columns: 1fr; } }
.prrow, .runrow { display: flex; align-items: center; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--bkz-border-hairline); color: inherit; }
.prrow:last-child, .runrow:last-child { border-bottom: 0; }
.prrow:hover, .runrow:hover { text-decoration: none; color: inherit; }
.prrow:hover .prtitle, .runrow:hover .runname { color: var(--brand-ink); }
.prbadge { flex-shrink: 0; font-size: var(--bkz-text-2xs); letter-spacing: 0.05em; text-transform: uppercase; font-weight: 500; padding: 2px 8px; border-radius: 9999px; min-width: 54px; text-align: center; border: 1px solid var(--ui-tint-8); background: var(--ui-tint-5); color: var(--ui-ink-muted); }
.pr-open { background: var(--bkz-success-tint); color: var(--bkz-success-ink); border-color: var(--bkz-success-border); }
.pr-merged { background: var(--brand-soft); color: var(--brand-ink); border-color: transparent; }
.prmain, .runmain { flex: 1; min-width: 0; }
.prtitle, .runname { display: block; font-size: var(--bkz-text-base); font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.prmeta, .runmeta { display: block; font-size: var(--bkz-text-xs); color: var(--bkz-ink-slate); margin-top: 1px; }
.prcomments { flex-shrink: 0; font-size: var(--bkz-text-sm); color: var(--bkz-muted); }
.chk { flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; }
.chk-ok { background: var(--bkz-success-tint); color: var(--bkz-success-ink); }
.chk-bad { background: var(--bkz-danger-tint); color: var(--bkz-danger-ink); }
.chk-run { background: var(--bkz-warn-tint); color: var(--bkz-warn-ink); }
.chk-mut { background: var(--ui-tint-5); color: var(--ui-ink-faint); }

/* ---------- the watch ---------- */
.watch-summary { display: flex; gap: 28px; flex-wrap: wrap; padding: 16px 20px; border-radius: var(--bkz-radius-3xl); background: var(--ui-glass-solid); backdrop-filter: blur(28px) saturate(210%); -webkit-backdrop-filter: blur(28px) saturate(210%); border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow), var(--glass-inset); margin-bottom: 14px; }
.dossiers { display: flex; flex-direction: column; gap: 10px; }
.dossier { padding: 14px 16px; background: var(--ui-surface); backdrop-filter: none; -webkit-backdrop-filter: none; border: 1px solid var(--bkz-border-rail); box-shadow: none; }
.dossier.alive { border-color: var(--ui-warn-border); background: var(--ui-warn-row); }
.dossier.cleared { opacity: .85; }
.dossier-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.dossier-h .badge { margin-left: 0; }
.dossier-file { font-weight: 600; color: var(--bkz-ink-strong); }
.dossier-file:hover { color: var(--brand-ink); text-decoration: none; }
.dossier-meta { margin-left: auto; }
.dossier-alive { margin-top: 8px; font-size: var(--bkz-text-base); color: var(--bkz-warn-ink); font-weight: 500; }
.timeline { margin-top: 10px; border-left: 2px solid var(--bkz-border-hairline); padding-left: 12px; display: flex; flex-direction: column; gap: 6px; }
.tl-row { display: flex; align-items: center; gap: 8px; font-size: var(--bkz-text-sm); flex-wrap: wrap; }
.tl-row .badge { margin-left: 0; }
.tl-when { color: var(--bkz-muted); font-size: var(--bkz-text-xs); min-width: 84px; }
.tl-detail { color: var(--ui-ink-body); }
.auto-line { margin-top: 10px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.auto-line .badge { margin-left: 0; }
.modes { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 2px; margin-top: 12px; border-radius: var(--bkz-radius-md); padding: 2px; background: var(--ui-trough); }
.mode { text-align: left; padding: 6px 12px; border: 0; border-radius: var(--bkz-radius-sm); background: transparent; cursor: pointer; display: flex; flex-direction: column; gap: 0; color: var(--ui-ink-muted); transition: all var(--bkz-duration-base); }
.mode b { font-size: var(--bkz-text-xs); font-weight: 500; letter-spacing: 0.05em; text-transform: uppercase; }
.mode span { display: none; }
.mode:hover { color: var(--ui-ink-body); }
.mode.on { background: var(--ui-surface); color: var(--ui-ink-strong); box-shadow: var(--ui-shadow-sm); }
.mode-note { margin-top: 8px; font-size: 12.5px; line-height: 1.55; color: var(--ui-ink-soft); max-width: 70ch; }
.verdict-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-top: 12px; }
.vg { padding: 12px 14px; border: 1px solid var(--bkz-border-rail); border-radius: var(--bkz-radius-3xl); background: var(--ui-surface); }

/* ---------- hover explanations ---------- */
[data-tip] { position: relative; }
span[data-tip]:not(.badge):not(.fmark):not(.lstate):not(.fchip) { border-bottom: 1px dotted var(--ui-ink-faint); cursor: help; }
[data-tip]::after { content: attr(data-tip); position: absolute; left: 50%; bottom: calc(100% + 9px); transform: translateX(-50%) translateY(3px); width: max-content; max-width: 300px; padding: 8px 11px; background: var(--ui-tip-bg); color: var(--ui-tip-ink); border-radius: var(--bkz-radius-md); font-size: var(--bkz-text-sm); line-height: 1.5; font-weight: 400; font-family: var(--bkz-font-sans); letter-spacing: 0; text-transform: none; white-space: normal; text-align: left; opacity: 0; pointer-events: none; transition: opacity .13s ease .1s, transform .13s ease .1s; z-index: 70; }
[data-tip]::before { content: ''; position: absolute; left: 50%; bottom: calc(100% + 4px); transform: translateX(-50%); border: 5px solid transparent; border-top-color: var(--ui-tip-bg); opacity: 0; pointer-events: none; transition: opacity .13s ease .1s; z-index: 70; }
[data-tip]:hover::after { opacity: 1; transform: translateX(-50%) translateY(0); }
[data-tip]:hover::before { opacity: 1; }
.funnel .fchip:first-of-type[data-tip]::after { left: 0; transform: translateY(3px); }
.funnel .fchip:first-of-type[data-tip]:hover::after { transform: translateY(0); }
.drawer [data-tip]::after { max-width: 260px; }

/* ---------- auth: the Horizon family (LoginCard.jsx, HoloGrid.jsx) ---------- */
.auth-shell { display: flex; align-items: center; justify-content: center; padding: 48px 16px; background: var(--au-shell) !important; color: var(--au-ink); }
.auth-shell .bkz-holo-sky { background: var(--au-sky); }
.auth-shell .bkz-holo-plane { opacity: var(--au-plane-opacity); }
.auth-shell .bkz-holo-fog { background: var(--au-fog); }
.auth-stage { position: relative; z-index: 1; width: 100%; max-width: 500px; }
.login-card { position: relative; width: 100%; padding: 36px; border-radius: var(--bkz-radius-auth-card); background: var(--au-card); border: 1px solid var(--au-card-border); box-shadow: var(--au-card-shadow); backdrop-filter: blur(28px) saturate(160%); -webkit-backdrop-filter: blur(28px) saturate(160%); animation: bkz-login-rise 720ms var(--bkz-ease-settle) both; color: var(--au-ink); }
.wordmark { display: flex; align-items: center; gap: 12px; margin-bottom: 22px; }
.wordmark img { display: block; width: 44px; height: 44px; flex-shrink: 0; user-select: none; border-radius: 11px; }
.wordmark span { font-size: var(--bkz-text-6xl); font-weight: 600; letter-spacing: -0.045em; color: var(--au-ink); }
.auth-eyebrow { display: inline-flex; align-items: center; gap: 8px; border-radius: var(--bkz-radius-full); border: 1px solid var(--au-pill-border); background: var(--au-pill-bg); padding: 4px 12px; font-size: var(--bkz-text-xs); font-weight: 600; text-transform: uppercase; letter-spacing: 0.2em; color: var(--au-link); }
.auth-h1 { margin-top: 14px; font-size: var(--bkz-text-7xl); font-weight: 700; letter-spacing: var(--bkz-tracking-display); line-height: 1.05; color: var(--au-ink); }
@media (min-width: 640px) { .auth-h1 { font-size: var(--bkz-text-8xl); } }
.auth-lede { margin-top: 10px; font-size: var(--bkz-text-md); line-height: 24px; color: var(--au-body); }
.login-form { margin-top: 24px; display: flex; flex-direction: column; gap: 16px; }
.login-label { display: block; color: var(--au-ink); font-size: var(--bkz-text-base); font-weight: 650; letter-spacing: -0.01em; }
.login-input { width: 100%; height: 46px; margin-top: 8px; border-radius: var(--bkz-radius-auth); border: 1px solid var(--au-input-border); background: var(--au-input-bg); color: var(--au-ink); font-size: var(--bkz-text-md); padding: 0 16px; outline: none; box-shadow: var(--au-input-sheen); transition: border-color var(--bkz-duration-fast), box-shadow var(--bkz-duration-fast); }
.login-input:hover { border-color: var(--au-input-border-hover); }
.login-input:focus { border-color: var(--bkz-blue); box-shadow: 0 0 0 4px rgba(92,118,255,0.12), inset 0 1px 0 rgba(255,255,255,0.9); }
.login-input.mono { font-family: var(--bkz-font-mono); font-size: var(--bkz-text-base); }
.login-primary { display: inline-flex; width: 100%; height: 48px; align-items: center; justify-content: center; gap: 8px; border-radius: var(--bkz-radius-auth); border: 1px solid rgba(67,91,234,0.72); background: linear-gradient(135deg, #6f86ff 0%, #4964f3 100%); color: #fff; font-size: var(--bkz-text-lg); font-weight: 650; cursor: pointer; box-shadow: var(--bkz-shadow-auth-primary); transition: transform 180ms ease, box-shadow 180ms ease, filter 180ms ease; }
.login-primary:hover { box-shadow: var(--bkz-shadow-auth-primary-hover); filter: saturate(1.04); transform: translateY(-1px); }
.login-primary:active { transform: translateY(0) scale(0.99); }
.login-primary:disabled { opacity: .48; cursor: not-allowed; transform: none; }
.login-secondary { display: inline-flex; width: 100%; height: 45px; align-items: center; justify-content: center; gap: 12px; border-radius: var(--bkz-radius-lg); border: 1px solid var(--au-input-border); background: var(--au-input-bg); color: var(--au-ink); font-size: var(--bkz-text-md); font-weight: 650; box-shadow: var(--au-input-sheen); cursor: pointer; text-decoration: none; }
.login-secondary:hover { text-decoration: none; color: var(--au-ink); border-color: var(--au-input-border-hover); }
.login-alert { border-radius: var(--bkz-radius-3xl); border: 1px solid var(--bkz-danger-alert-border); background: var(--bkz-danger-alert-bg); color: var(--bkz-danger-alert-ink); padding: 10px 12px; font-size: var(--bkz-text-sm); line-height: 1.55; margin-top: 14px; }
.auth-rule { display: flex; align-items: center; gap: 12px; color: var(--au-faint); font-size: var(--bkz-text-sm); }
.auth-rule::before, .auth-rule::after { content: ""; flex: 1; height: 1px; background: var(--au-rule); }
.auth-foot { margin-top: 18px; text-align: center; font-size: var(--bkz-text-base); color: var(--au-muted); }
.auth-foot .linkish { color: var(--au-link); }
.auth-setup { margin-top: 14px; text-align: left; color: var(--ui-ink-strong); }

/* ---------- small screens ---------- */
@media (max-width: 880px) {
  .sidebar { position: static; width: 100% !important; height: auto; flex-direction: row; align-items: center; padding: 8px 12px; border-right: 0; border-bottom: 1px solid var(--bkz-border-rail); gap: 8px; overflow-x: auto; }
  .sb-section, .sb-foot { display: none; }
  .sb-nav { flex-direction: row; padding: 0; }
  .main, .main.main-collapsed { padding-left: 0; }
  .main-inner { padding: 20px 18px 60px; }
  .proofline { grid-template-columns: 1fr; gap: 2px; }
  .trow, .trow-3 { grid-template-columns: 1fr; gap: 2px; }
  .account-menu { left: 16px; }
}

/* ---------- the three pages ---------- */
.home { animation: bkz-fade-up .45s var(--bkz-ease-settle) both; }
.home-hero { padding: 8px 0 0; max-width: 640px; }
.home-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 6px; }
.hs { display: flex; flex-direction: column; gap: 2px; padding: 22px 24px; border-radius: var(--bkz-radius-panel); background: var(--ui-glass-solid); backdrop-filter: blur(28px) saturate(210%); -webkit-backdrop-filter: blur(28px) saturate(210%); border: 1px solid var(--glass-border); box-shadow: var(--glass-shadow), var(--glass-inset); color: inherit; min-width: 0; transition: all var(--bkz-duration-base) var(--bkz-ease-settle); }
a.hs:hover { transform: translateY(-1px); box-shadow: var(--glass-shadow-lg), var(--glass-inset); text-decoration: none; color: inherit; }
.hs-l { font-size: var(--bkz-text-xs); font-weight: 500; letter-spacing: var(--bkz-tracking-eyebrow-widest); text-transform: uppercase; color: var(--bkz-muted); }
.hs-n { margin-top: 10px; font-size: var(--bkz-text-8xl); font-weight: 600; letter-spacing: var(--bkz-tracking-tight); line-height: .95; color: var(--bkz-ink); font-variant-numeric: tabular-nums; }
.hs-n.ok { color: var(--bkz-success-ink); }
.hs-n.brand { color: var(--brand-ink); }
.hs-s { margin-top: 8px; font-size: var(--bkz-text-sm); color: var(--bkz-muted); }
.home-cta { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-top: 22px; }
.home-next { font-size: var(--bkz-text-base); color: var(--bkz-muted); max-width: 48ch; }
.home-line { margin-top: 16px; font-size: var(--bkz-text-base); color: var(--ui-ink-body); line-height: 20px; }
.home-line + .home-line { margin-top: 8px; }
.home-foot { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 28px; padding-top: 14px; border-top: 1px solid var(--bkz-border-hairline); font-size: var(--bkz-text-base); }
@media (max-width: 880px) { .home-stats { grid-template-columns: 1fr; } }

.subnav-row { display: flex; align-items: center; gap: 10px; margin-top: 14px; }
.subnav-row .subnav { margin-top: 0; }
.subnav-row .sb-iconbtn.on { background: var(--ui-hover); color: var(--bkz-ink-strong); }
.filters { margin: 0 0 14px; }

.inbox { border-radius: var(--bkz-radius-3xl); background: var(--ui-glass-solid); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); border: 1px solid var(--ui-glass-border-solid); box-shadow: var(--ui-shadow-sm-wide), var(--ui-sheen); }
.irow { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border-bottom: 1px solid var(--bkz-border-hairline); transition: background var(--bkz-duration-base); }
.irow:last-child { border-bottom: 0; }
.irow:hover { background: var(--ui-row-hover); }
.irow-sel { background: var(--bkz-success-tint); }
.imain { flex: 1; min-width: 0; color: inherit; display: block; }
.imain:hover { text-decoration: none; color: inherit; }
.imain:hover .iname { color: var(--brand-ink); }
.iname { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; font-weight: 600; font-size: var(--bkz-text-md); color: var(--bkz-ink-strong); }
.iwhy { display: block; margin-top: 3px; font-size: var(--bkz-text-base); line-height: 20px; color: var(--ui-ink-soft); max-width: 78ch; }
.iwhy b { color: var(--ui-ink-body); }
.iwhy code { font-size: var(--bkz-text-xs); }
.iacts { display: flex; gap: 6px; align-items: center; flex-shrink: 0; }
.inbox-empty { padding: 48px 24px; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.inbox-empty .et { font-size: var(--bkz-text-3xl); font-weight: 600; letter-spacing: var(--bkz-tracking-snug); color: var(--bkz-ink); }
.quiet-group { margin-top: 14px; padding: 14px 18px; border-radius: var(--bkz-radius-3xl); border: 1px solid var(--ui-border); background: var(--ui-sunk); font-size: var(--bkz-text-base); color: var(--ui-ink-body); line-height: 20px; }
.quiet-group .qg-h .linkish { margin-left: 8px; }
.quiet-group .tbl { margin-top: 10px; }

.hist { padding: 4px 0; }
.hist-line { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 9px 18px; border-bottom: 1px solid var(--bkz-border-hairline); font-size: var(--bkz-text-base); color: var(--ui-ink-body); }
.hist-line:last-child { border-bottom: 0; }
.hist-line .badge { margin-left: 0; }
.hist-line a { margin-left: auto; font-size: var(--bkz-text-sm); }
.hist-bad { background: var(--ui-bad-row); }

/* ---------- widths: laptop → monitor ----------
   One column up to 1680px (a 13–16" laptop, or a monitor with the window not maximised).
   From 1680px the column widens and Activity and Settings go two-up; from 2200px wider again. */
.iwhy { max-width: 92ch; }
.act-grid { display: block; }
@media (max-width: 1440px) {
  .sidebar:not(.collapsed) { width: 248px; }
  .main:not(.main-collapsed) { padding-left: 248px; }
  .main-inner { padding: 20px 28px 72px; }
  .hs { padding: 20px 22px; }
  .hs-n { font-size: var(--bkz-text-7xl); }
}
@media (max-width: 1180px) {
  .hs-n { font-size: var(--bkz-text-6xl); }
  .home-stats { gap: 10px; }
  .irow { flex-wrap: wrap; }
  .iacts { margin-left: auto; }
}
@media (min-width: 1680px) {
  .main-inner { max-width: 1480px; padding: 32px 48px 96px; }
  .main-inner.page-sweep { max-width: 1240px; }
  .home-stats { gap: 16px; }
  .hs { padding: 30px 32px; }
  .hs-n { font-size: 56px; }
  .hs-s { font-size: var(--bkz-text-base); }
  .act-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 0 32px; align-items: start; }
  .act-grid > .act-main:only-child, .act-grid > .act-side:only-child { grid-column: 1 / -1; }
  .act-side > .sec-h:first-child { margin-top: 14px; }
  .act-side .pr-tl { flex-wrap: wrap; row-gap: 6px; }
}
@media (min-width: 2200px) {
  .sidebar:not(.collapsed) { width: 300px; }
  .main:not(.main-collapsed) { padding-left: 300px; }
  .main-inner { max-width: 1720px; padding: 40px 56px 112px; }
  .main-inner.page-sweep { max-width: 1320px; }
  .hs-n { font-size: 64px; }
}

/* ---------- deep sweep ---------- */
.dp-run { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; margin-left: auto; max-width: 280px; flex-shrink: 0; }
.dp-run .btn { align-self: flex-start; }
.dp-cost { margin: 2px 0 16px; font-size: var(--bkz-text-base); color: var(--ui-ink-body); font-variant-numeric: tabular-nums; }
.dp-cost b { color: var(--bkz-ink); }
.dp-head { margin: 8px 0 12px; font-size: var(--bkz-text-3xl); font-weight: 600; letter-spacing: var(--bkz-tracking-snug); color: var(--bkz-ink); }
.dp-list { display: flex; flex-direction: column; gap: 6px; }
.dp { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 2px 10px; align-items: center; padding: 10px 14px; border: 1px solid var(--ui-border); border-radius: var(--bkz-radius-xl); background: var(--ui-surface); font-size: var(--bkz-text-base); }
.dp-i { width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; font-size: 12px; font-weight: 700; background: var(--ui-tint-5); color: var(--ui-ink-faint); grid-row: span 2; }
.dp-ok .dp-i { background: var(--bkz-success-tint); color: var(--bkz-success-ink); }
.dp-bad .dp-i { background: var(--bkz-danger-tint); color: var(--bkz-danger-ink); }
.dp-live .dp-i { background: var(--brand-soft); color: var(--brand-ink); }
.dp-todo { opacity: .55; }
.dp-skip .dp-t { color: var(--ui-ink-muted); font-weight: 500; }
.dp-t { font-weight: 600; color: var(--ui-ink-strong); }
.dp-d { grid-column: 2; font-size: var(--bkz-text-sm); color: var(--ui-ink-muted); line-height: 18px; }
.dp .spin { display: block; width: 12px; height: 12px; border: 2px solid var(--brand-soft); border-top-color: var(--brand); border-radius: 50%; animation: dp-spin .9s linear infinite; }
@keyframes dp-spin { to { transform: rotate(360deg); } }
.dup { display: flex; align-items: center; gap: 14px; padding: 12px 18px; border-bottom: 1px solid var(--bkz-border-hairline); }
.dup:last-child { border-bottom: 0; }
.dup-main { flex: 1; min-width: 0; text-align: left; background: none; border: 0; padding: 0; color: inherit; cursor: pointer; font: inherit; }
.dup-main:disabled { cursor: default; }
.dup-names { font-family: var(--bkz-font-mono); font-size: var(--bkz-text-base); color: var(--bkz-ink-strong); overflow-wrap: anywhere; }
.dup-names b { font-weight: 600; }
.dup-eq { margin: 0 8px; color: var(--brand-ink); font-weight: 600; }
.dup-files { margin-top: 3px; font-size: var(--bkz-text-xs); color: var(--ui-ink-muted); overflow-wrap: anywhere; }
.dup-files .mono { font-size: inherit; color: inherit; }
.dup-sep { margin: 0 6px; }
.dup-why { margin-top: 6px; font-size: var(--bkz-text-sm); line-height: 19px; color: var(--ui-ink-body); max-width: 80ch; }
.dup-lines { flex-shrink: 0; font-size: var(--bkz-text-sm); color: var(--ui-ink-muted); font-variant-numeric: tabular-nums; }
.dup .badge { flex-shrink: 0; margin-left: 0; }
.dp-hero { display: flex; flex-direction: column; gap: 4px; padding: 16px 18px; border-radius: var(--bkz-radius-3xl); margin-bottom: 10px; }
.dp-hero b { font-size: var(--bkz-text-2xl); font-weight: 600; letter-spacing: var(--bkz-tracking-snug); }
.dp-hero span { font-size: var(--bkz-text-base); opacity: .9; }
.dp-hero.ok { background: var(--bkz-success-tint); border: 1px solid var(--bkz-success-border); color: var(--bkz-success-ink); }
.dp-hero.bad { background: var(--bkz-danger-tint); border: 1px solid var(--bkz-danger-border); color: var(--bkz-danger-ink); }
.dp-hero.none { background: var(--bkz-warning-tint, rgba(255,180,60,.08)); border: 1px solid var(--bkz-warning-border, rgba(255,180,60,.3)); color: var(--bkz-warning-ink, inherit); }
.reh-list { display: flex; flex-direction: column; border: 1px solid var(--ui-border); border-radius: var(--bkz-radius-xl); background: var(--ui-surface); overflow: hidden; }
.reh { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 9px 14px; border-bottom: 1px solid var(--bkz-border-hairline); font-size: var(--bkz-text-base); color: var(--ui-ink-body); }
.reh:last-child { border-bottom: 0; }
.reh-bad { background: var(--ui-bad-row); }
.reh-name { min-width: 110px; color: var(--bkz-ink-strong); }
.reh-res b { color: var(--bkz-ink); }
.reh-bad .reh-res b { color: var(--bkz-danger-ink); }
.reh-fails { flex-basis: 100%; margin: 4px 0 0; padding: 10px 12px; border-radius: var(--bkz-radius-md); background: var(--ui-sunk); border: 1px solid var(--ui-border); font-family: var(--bkz-font-mono); font-size: var(--bkz-text-xs); line-height: 17px; color: var(--bkz-danger-ink); white-space: pre-wrap; overflow-wrap: anywhere; max-height: 320px; overflow: auto; }
@media (max-width: 880px) { .dp-run { align-items: flex-start; text-align: left; max-width: none; } .dup { flex-wrap: wrap; } }

/* ---------- home: the split and the queue ---------- */
.hs-more { display: flex; flex-direction: column; gap: 3px; margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--bkz-border-hairline); font-size: var(--bkz-text-sm); line-height: 18px; color: var(--ui-ink-muted); font-variant-numeric: tabular-nums; }
.queue .q { display: flex; align-items: center; gap: 14px; padding: 12px 18px; border-bottom: 1px solid var(--bkz-border-hairline); }
.queue .q:last-child { border-bottom: 0; }
.q-n { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; font-family: var(--bkz-font-mono); font-size: 11.5px; background: var(--ui-tint-6); color: var(--ui-ink-muted); }
.q-main { flex: 1; min-width: 0; }
.q-t { display: block; font-weight: 600; font-size: var(--bkz-text-md); color: var(--ui-ink-strong); }
a.q-t:hover { color: var(--brand-ink); text-decoration: none; }
.q-s { margin-top: 2px; font-size: var(--bkz-text-sm); line-height: 18px; color: var(--ui-ink-muted); }
.q-chip { flex-shrink: 0; }
.q-chip .badge { margin-left: 0; }
.sec-h a.muted { color: var(--ui-ink-muted); }
@media (max-width: 880px) { .queue .q { flex-wrap: wrap; } }

/* ---------- settings: sections of rows ---------- */
.main-inner.page-settings { max-width: 1040px; }
.set-sec { margin-top: 26px; }
.set-sec-h { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 2px 8px; font-size: var(--bkz-text-xs); font-weight: 600; letter-spacing: var(--bkz-tracking-eyebrow-widest); text-transform: uppercase; color: var(--bkz-muted); }
.set-sec-h .muted { text-transform: none; letter-spacing: 0; font-weight: 400; font-size: var(--bkz-text-sm); }
.set-list { border-radius: var(--bkz-radius-3xl); border: 1px solid var(--ui-glass-border-solid); background: var(--ui-glass-solid); overflow: hidden; }
.srow { display: grid; grid-template-columns: 168px minmax(0, 1fr) auto; gap: 4px 20px; align-items: center; padding: 13px 18px; border-bottom: 1px solid var(--bkz-border-hairline); }
.srow:last-child { border-bottom: 0; }
.srow-t { font-weight: 600; font-size: var(--bkz-text-md); color: var(--ui-ink-strong); }
.srow-s { font-size: var(--bkz-text-sm); line-height: 19px; color: var(--ui-ink-muted); max-width: 76ch; }
.srow-s b { color: var(--ui-ink-body); font-weight: 600; }
.srow-r { display: flex; align-items: center; gap: 8px; justify-self: end; white-space: nowrap; }
.srow-r .badge { margin-left: 0; }
.srow-r .modes { margin: 0; }
.srow-x { grid-column: 1 / -1; padding-top: 4px; }
.srow-x .cmd { margin: 6px 0; }
.srow-x p { margin: 6px 0 0; max-width: 80ch; }
.srow-x .note { margin: 6px 0 0; }
.srow-x .token-form { margin-top: 4px; }
.srow-x .pol-edit { margin: 4px 0 2px; }
@media (max-width: 880px) { .srow { grid-template-columns: 1fr; } .srow-r { justify-self: start; white-space: normal; flex-wrap: wrap; } }

/* ---------- tooltips near the card edge, and the impact figure ---------- */
.inbox > :first-child { border-top-left-radius: inherit; border-top-right-radius: inherit; }
.inbox > :last-child { border-bottom-left-radius: inherit; border-bottom-right-radius: inherit; }
/* action-column tooltips grow leftward instead of clipping at the right edge */
.iacts [data-tip]::after { left: auto; right: 0; transform: translateY(3px); }
.iacts [data-tip]:hover::after { transform: translateY(0); }
.iacts [data-tip]::before { left: auto; right: 18px; transform: none; }
.impact { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; margin-left: 12px; flex-shrink: 0; cursor: help; }
.impact b { font-size: var(--bkz-text-4xl); font-weight: 600; line-height: 1; letter-spacing: -0.02em; color: var(--bkz-ink); font-variant-numeric: tabular-nums; }
.impact > span { font-size: var(--bkz-text-2xs); font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--bkz-ink-slate); }
.impact-sm { flex-direction: row; align-items: baseline; gap: 5px; margin-left: 0; min-width: 86px; }
.impact-sm b { font-size: var(--bkz-text-xl); }
.impact[data-tip]::after { left: auto; right: 0; transform: translateY(3px); max-width: 340px; font-family: var(--bkz-font-mono); font-size: var(--bkz-text-xs); }
.impact[data-tip]:hover::after { transform: translateY(0); }
.impact[data-tip]::before { left: auto; right: 18px; transform: none; }
.impact-sm[data-tip]::after { left: 0; right: auto; }
.impact-sm[data-tip]::before { left: 18px; right: auto; }
.hist-line .impact-sm { cursor: help; }

/* ---------- onboarding stepper ---------- */
.ob-card { padding: 22px 24px; }
.ob-step { display: grid; grid-template-columns: 30px minmax(0, 1fr); gap: 0 14px; }
.ob-rail { position: relative; display: flex; justify-content: center; }
.ob-step:not(:last-child) .ob-rail::after { content: ""; position: absolute; top: 30px; bottom: -4px; width: 1px; background: var(--ui-border); }
.ob-dot { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; font-family: var(--bkz-font-mono); font-size: 12px; font-weight: 700; background: var(--ui-tint-6); color: var(--ui-ink-muted); flex-shrink: 0; }
.ob-done .ob-dot { background: var(--ui-accent-btn); color: var(--ui-on-accent); }
.ob-active .ob-dot { background: var(--brand); color: #fff; }
.ob-todo { opacity: .5; }
.ob-t { font-weight: 600; font-size: var(--bkz-text-lg); color: var(--ui-ink-strong); line-height: 26px; }
.ob-b { padding: 8px 0 22px; }
.ob-step:last-child .ob-b { padding-bottom: 4px; }
.ob-line { font-size: var(--bkz-text-base); color: var(--ui-ink-body); }
.ob-line b { color: var(--ui-ink-strong); }
.ob-panel { border: 1px solid var(--ui-border); border-radius: var(--bkz-radius-xl); background: var(--ui-sunk); overflow: hidden; }
.ob-panel-h { padding: 9px 14px; font-size: var(--bkz-text-sm); font-weight: 600; color: var(--ui-ink-body); border-bottom: 1px solid var(--bkz-border-hairline); }
.ob-org { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 14px; border: 0; background: var(--ui-surface); color: inherit; font: inherit; cursor: pointer; text-align: left; border-bottom: 1px solid var(--bkz-border-hairline); }
.ob-org:hover { background: var(--ui-hover); }
.ob-org.on { background: var(--brand-softer); }
.ob-org-n { font-weight: 600; font-size: var(--bkz-text-md); color: var(--ui-ink-strong); flex: 1; min-width: 0; }
.ob-radio { width: 16px; height: 16px; border-radius: 50%; border: 1.5px solid var(--ui-border-hover); display: grid; place-items: center; flex-shrink: 0; }
.ob-org.on .ob-radio { border-color: var(--brand); }
.ob-org.on .ob-radio span { width: 8px; height: 8px; border-radius: 50%; background: var(--brand); }
.ob-panel-f { padding: 9px 14px; font-size: var(--bkz-text-sm); color: var(--ui-ink-muted); }
.ob-repos { max-height: 320px; overflow-y: auto; background: var(--ui-surface); }
.ob-repos .repo-row { border-radius: 0; }

/* ---------- home insights ---------- */
.stat-strip { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; margin-top: 6px; padding: 0; overflow: hidden; }
.stc { display: flex; flex-direction: column; gap: 3px; padding: 16px 20px 14px; border-right: 1px solid var(--bkz-border-hairline); min-width: 0; color: inherit; }
.stc:last-child { border-right: 0; }
a.stc-link:hover { background: var(--ui-row-hover); text-decoration: none; color: inherit; }
a.stc-link:hover .stc-n { color: var(--brand-ink); }
.stc-l { font-size: var(--bkz-text-xs); font-weight: 500; letter-spacing: var(--bkz-tracking-eyebrow-widest); text-transform: uppercase; color: var(--bkz-muted); }
.stc-n { font-size: var(--bkz-text-6xl); font-weight: 600; letter-spacing: -0.02em; line-height: 1.1; color: var(--bkz-ink); font-variant-numeric: tabular-nums; }
.stc-n.ok { color: var(--bkz-success-ink); }
.stc-n.brand { color: var(--brand-ink); }
.stc-s { font-size: var(--bkz-text-sm); color: var(--ui-ink-muted); line-height: 17px; }
.insights { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 12px; }
.panel { border-radius: var(--bkz-radius-3xl); border: 1px solid var(--ui-glass-border-solid); background: var(--ui-glass-solid); padding: 16px 20px; min-width: 0; }
.panel-h { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 14px; font-size: var(--bkz-text-md); font-weight: 600; color: var(--bkz-ink); }
.panel-h .muted { font-weight: 400; font-size: var(--bkz-text-sm); }
.cols { display: flex; align-items: flex-end; gap: 6px; height: 132px; }
.colw { flex: 1; min-width: 0; display: flex; flex-direction: column; height: 100%; cursor: help; }
.colbars { flex: 1; display: flex; flex-direction: column; justify-content: flex-end; gap: 1px; }
.col-g { background: color-mix(in srgb, var(--bkz-success) 55%, var(--bkz-success-tint)); border-radius: 3px 3px 0 0; min-height: 0; }
.colbars .col-g:only-child { border-radius: 3px 3px 2px 2px; }
.col-r { background: color-mix(in srgb, var(--bkz-danger) 60%, var(--bkz-danger-tint)); border-radius: 3px 3px 0 0; }
.col-r[style="height:0%"] { display: none; }
.col-x { height: 16px; margin-top: 4px; font-size: var(--bkz-text-2xs); color: var(--bkz-ink-slate); white-space: nowrap; }
.colw:last-child .col-x { text-align: right; }
.panel-note { display: flex; align-items: center; gap: 6px; margin-top: 8px; font-size: var(--bkz-text-xs); color: var(--ui-ink-muted); }
.key { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.key-g { background: color-mix(in srgb, var(--bkz-success) 55%, var(--bkz-success-tint)); }
.key-r { background: color-mix(in srgb, var(--bkz-danger) 60%, var(--bkz-danger-tint)); margin-left: 10px; }
.panel-empty { display: grid; place-items: center; height: 132px; font-size: var(--bkz-text-base); color: var(--ui-ink-muted); }
.hbars { display: flex; flex-direction: column; gap: 9px; padding-top: 4px; }
.hrow { display: grid; grid-template-columns: minmax(90px, 34%) minmax(0, 1fr) 56px; gap: 12px; align-items: center; cursor: help; }
.hrow-l { font-size: var(--bkz-text-xs); color: var(--ui-ink-body); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hrow-bar { height: 10px; border-radius: 5px; background: var(--ui-tint-5); overflow: hidden; display: block; }
.hrow-bar span { display: block; height: 100%; border-radius: 5px; background: color-mix(in srgb, var(--brand) 70%, var(--brand-soft)); }
.hrow-v { font-size: var(--bkz-text-xs); color: var(--ui-ink-muted); text-align: right; font-variant-numeric: tabular-nums; }
@media (max-width: 1400px) { .stat-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); } .stc { border-bottom: 1px solid var(--bkz-border-hairline); } }
@media (max-width: 1100px) { .insights { grid-template-columns: 1fr; } .stat-strip { grid-template-columns: repeat(2, 1fr); } .stc { border-bottom: 1px solid var(--bkz-border-hairline); } }

/* ================= the grotesk-and-grid skin =================
   Space Grotesk everywhere, IBM Plex Mono for labels and figures. Corners go
   square; the page carries a drafting grid — rails, ticks and crosshairs do
   the structuring that rounded corners used to fake. */
:root {
  --bkz-font-sans: "Space Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --bkz-font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --bkz-font-brand: var(--bkz-font-sans);
  --bkz-radius-xs: 0; --bkz-radius-sm: 0; --bkz-radius-md: 0; --bkz-radius-lg: 0;
  --bkz-radius-auth: 0; --bkz-radius-xl: 0; --bkz-radius-2xl: 0; --bkz-radius-3xl: 0;
  --bkz-radius-4xl: 0; --bkz-radius-5xl: 0; --bkz-radius-panel: 0; --bkz-radius-panel-lg: 0;
  --bkz-radius-auth-card: 0; --bkz-radius-full: 0;
  --grid-line: rgba(255, 255, 255, 0.030);
  --grid-rail: rgba(255, 255, 255, 0.085);
  --grid-tick: rgba(255, 255, 255, 0.14);
  --grid-cross: rgba(255, 255, 255, 0.22);
}
:root[data-theme="light"] { --grid-line: rgba(23, 23, 23, 0.04); --grid-rail: rgba(23, 23, 23, 0.10); --grid-tick: rgba(23, 23, 23, 0.18); --grid-cross: rgba(23, 23, 23, 0.28); }
body { letter-spacing: 0.005em; }

/* the big divisions across the canvas */
.main { background-image: linear-gradient(var(--grid-line) 1px, transparent 1px), linear-gradient(90deg, var(--grid-line) 1px, transparent 1px); background-size: 168px 168px; }
/* the content column runs between two rails with ruler ticks */
.main-inner { position: relative; border-left: 1px solid var(--grid-rail); border-right: 1px solid var(--grid-rail); }
.main-inner::before, .main-inner::after { content: ""; position: absolute; top: 0; bottom: 0; width: 7px; pointer-events: none; background: repeating-linear-gradient(180deg, var(--grid-tick) 0 1px, transparent 1px 28px); }
.main-inner::before { left: 0; }
.main-inner::after { right: 0; transform: scaleX(-1); }

/* crosshairs at panel corners */
.card, .panel, .inbox, .set-list { position: relative; }
.card::before, .panel::before, .inbox::before, .set-list::before { content: "+"; position: absolute; top: -6.5px; left: -4.5px; font: 500 12px/1 var(--bkz-font-mono); color: var(--grid-cross); pointer-events: none; z-index: 1; }
.card::after, .panel::after, .inbox::after, .set-list::after { content: "+"; position: absolute; bottom: -6.5px; right: -4.5px; font: 500 12px/1 var(--bkz-font-mono); color: var(--grid-cross); pointer-events: none; z-index: 1; }
.stat-strip::before, .stat-strip::after { display: none; } /* overflow-clipped: the marks would shear */

/* mono where Greptile is mono: eyebrows, section labels, badges, figures */
.eyebrow, .set-sec-h, .hs-l, .stc-l, .sb-label, .dz, .col-x, .impact > span, .funnel-k, .conn-status .mono { font-family: var(--bkz-font-mono); }
.badge, .b-ok, .b-bad, .b-use, .b-ask { font-family: var(--bkz-font-mono); text-transform: uppercase; letter-spacing: 0.07em; font-size: 10.5px; font-weight: 500; }
.sec-h { border-bottom: 1px dashed var(--grid-rail); padding-bottom: 7px; }
.sec-h > span:first-child { font-family: var(--bkz-font-mono); text-transform: uppercase; letter-spacing: 0.10em; font-size: var(--bkz-text-sm); font-weight: 600; }
.sec-h .muted { text-transform: none; letter-spacing: 0; font-family: var(--bkz-font-sans); }
.tag { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--ui-border); background: var(--ui-sunk); padding: 3px 9px; font: 500 10.5px/1.6 var(--bkz-font-mono); text-transform: uppercase; letter-spacing: 0.12em; color: var(--ui-ink-muted); }

/* number boxes go square with the rest of the geometry */
.q-n, .stage-n, .dp-i, .ob-dot, .chk, .sb-initial, .avatar, .sb-brand img, .wordmark img, .oi { border-radius: 0; }
.hrow-bar, .hrow-bar span, .col-g, .col-r, .colbars .col-g:only-child { border-radius: 0; }
.loading::before, .loading::after { border-radius: 0; }

/* ================= sign-in, on the grid ================= */
.auth2 { min-height: 100vh; display: grid; place-items: center; padding: 48px 16px; background: var(--bkz-bg); background-image: linear-gradient(var(--grid-line) 1px, transparent 1px), linear-gradient(90deg, var(--grid-line) 1px, transparent 1px); background-size: 168px 168px; background-position: center top; }
.auth2-card { position: relative; width: min(430px, calc(100vw - 32px)); border: 1px solid var(--grid-rail); background: var(--ui-surface); padding: 34px 32px 28px; animation: bkz-fade-up .45s var(--bkz-ease-settle) both; }
.x2 { position: absolute; width: 13px; height: 13px; pointer-events: none; }
.x2::before, .x2::after { content: ""; position: absolute; background: var(--grid-cross); }
.x2::before { left: 6px; top: 0; width: 1px; height: 13px; }
.x2::after { top: 6px; left: 0; height: 1px; width: 13px; }
.x2-tl { top: -7px; left: -7px; } .x2-tr { top: -7px; right: -7px; } .x2-bl { bottom: -7px; left: -7px; } .x2-br { bottom: -7px; right: -7px; }
.auth2-brand { display: flex; align-items: center; gap: 10px; margin-bottom: 22px; }
.auth2-brand img { width: 34px; height: 34px; display: block; }
.auth2-brand span { font-size: var(--bkz-text-2xl); font-weight: 700; letter-spacing: -0.02em; color: var(--ui-ink-strong); }
.auth2-h1 { margin: 14px 0 0; font-size: var(--bkz-text-7xl); font-weight: 700; letter-spacing: -0.025em; line-height: 1.04; color: var(--ui-ink-strong); }
.auth2-lede { margin: 8px 0 0; font-size: var(--bkz-text-md); line-height: 22px; color: var(--ui-ink-soft); }
.auth2-alert { margin-top: 14px; border: 1px solid var(--bkz-danger-alert-border); background: var(--bkz-danger-alert-bg); color: var(--bkz-danger-alert-ink); padding: 9px 12px; font-size: var(--bkz-text-base); line-height: 19px; }
.auth2-form { margin-top: 20px; display: flex; flex-direction: column; gap: 14px; }
.auth2-label { display: block; margin-bottom: 5px; font: 500 10.5px/1 var(--bkz-font-mono); text-transform: uppercase; letter-spacing: 0.12em; color: var(--ui-ink-muted); }
.auth2-in { width: 100%; height: 44px; border: 1px solid var(--ui-border); background: var(--ui-sunk); color: var(--ui-ink-strong); font: inherit; font-size: var(--bkz-text-md); padding: 0 13px; outline: none; transition: border-color var(--bkz-duration-base); }
.auth2-in:hover { border-color: var(--ui-border-hover); }
.auth2-in:focus { border-color: var(--brand); box-shadow: 0 0 0 1px var(--brand); }
.auth2-primary { display: flex; align-items: center; justify-content: center; gap: 8px; height: 44px; border: 0; cursor: pointer; background: var(--ui-accent-btn); color: var(--ui-on-accent); font: 600 var(--bkz-text-md)/1 var(--bkz-font-sans); letter-spacing: 0.01em; transition: background var(--bkz-duration-base); }
.auth2-primary:hover { background: var(--ui-accent-btn-hover); }
.auth2-primary:disabled { opacity: .6; cursor: default; }
.auth2-secondary { display: flex; align-items: center; justify-content: center; gap: 9px; height: 44px; margin-top: 20px; border: 1px solid var(--ui-border); background: var(--ui-sunk); color: var(--ui-ink-strong); font-weight: 600; font-size: var(--bkz-text-md); cursor: pointer; text-decoration: none; }
.auth2-secondary:hover { border-color: var(--ui-border-hover); text-decoration: none; color: var(--ui-ink-strong); }
.auth2-rule { display: flex; align-items: center; gap: 12px; margin-top: 16px; font: 500 10.5px/1 var(--bkz-font-mono); text-transform: uppercase; letter-spacing: 0.10em; color: var(--ui-ink-faint); }
.auth2-rule::before, .auth2-rule::after { content: ""; flex: 1; height: 1px; background: var(--ui-border); }
.auth2-foot { margin-top: 18px; text-align: center; font-size: var(--bkz-text-sm); color: var(--ui-ink-muted); }
.auth2-setup { margin-top: 14px; color: var(--ui-ink-strong); }
.auth2 .tag { margin-top: 2px; }
@media (max-width: 880px) { .main-inner { border-left: 0; border-right: 0; } .main-inner::before, .main-inner::after { display: none; } }

/* ---------- pull-request and review rows ----------
   The markup for these shipped without styles, so every row on Open PRs and Reviews
   flowed as inline text: fourteen pull requests rendered as one unreadable paragraph,
   and the totals ran together as "14open5opened by us". Square geometry and the --ui-*
   tokens, to match the rest of the interface. */
.botlist { display: flex; flex-direction: column; border: 1px solid var(--ui-border); background: var(--ui-surface); }
.botlist > * + * { border-top: 1px solid var(--ui-border); }

.botrow {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center;
  gap: 14px; padding: 11px 14px; text-decoration: none; color: var(--ui-ink-body);
  transition: background .12s ease;
}
.botrow:hover { background: var(--ui-row-hover); }
.botrow-tags { display: inline-flex; align-items: center; gap: 6px; flex: none; }
/* The title is the only column allowed to shrink, so a long PR title truncates instead
   of shoving the number off the row. */
.botrow-title { display: flex; flex-direction: column; gap: 2px; min-width: 0; color: var(--ui-ink-strong); }
.botrow-title > span { min-width: 0; }
.botrow-sub { font-size: var(--bkz-text-sm); color: var(--ui-ink-muted); }
.botrow-num { font-size: var(--bkz-text-sm); color: var(--bkz-success-ink); }
.botrow > .mono { flex: none; color: var(--ui-ink-faint); }

/* ---------- headline counts ---------- */
.tot-row { display: flex; flex-wrap: wrap; gap: 28px; margin: 4px 0 20px; }
.tot { display: flex; flex-direction: column; gap: 2px; }
/* The number and its label were rendering as one word — they are separate lines. */
.tot b { font-size: var(--bkz-text-xl, 22px); font-weight: 600; line-height: 1.15; color: var(--ui-ink-strong); }
.tot .muted { font-size: var(--bkz-text-sm); color: var(--ui-ink-muted); }
.lgood { color: var(--bkz-success-ink); }

/* ---------- tag tones ----------
   `.tag` existed; none of its tones did, so "ours", "open" and "draft" were the same
   grey and the badge carried no information at a glance. */
.tag-ok { border-color: var(--bkz-success-border); background: var(--bkz-success-tint); color: var(--bkz-success-ink); }
.tag-live { border-color: var(--ui-brand-border); color: var(--bkz-blue-link); }
.tag-warn { border-color: var(--ui-warn-border); background: var(--bkz-warn-tint); color: var(--bkz-warn-ink); }
.tag-bad { border-color: var(--bkz-danger-border); background: var(--bkz-danger-tint); color: var(--bkz-danger-ink); }

/* ---------------------------------------------- dead-code PRs: filter row and number strip */

/* Right-aligned: these controls narrow what is below them, and a filter that reads before
   the thing it filters invites you to set it before you know what you are setting. */
/* Lives in the repo header beside the tab strip, so one setting governs every tab rather
   than each page keeping its own idea of the range. `margin-left:auto` is what pushes it
   to the right edge of .subnav-row without the row needing to know it is there. */
.cl-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-left: auto; }
.cl-pill { display: inline-flex; align-items: center; gap: 7px; padding: 7px 11px; border-radius: var(--bkz-radius-md);
  border: 1px solid var(--ui-border); background: var(--ui-surface); color: var(--ui-ink-body);
  font-size: var(--bkz-text-base); line-height: 1.2; cursor: pointer; transition: border-color var(--bkz-duration-base) var(--bkz-ease-settle); }
.cl-pill:hover:not(:disabled) { border-color: var(--ui-border-hover); }
.cl-pill:disabled { opacity: .5; cursor: default; }
.cl-pill svg { flex: none; color: var(--ui-ink-faint); }
.cl-pill select { appearance: none; -webkit-appearance: none; background: transparent; border: 0; padding: 0; margin: 0;
  font: inherit; color: inherit; cursor: pointer; outline: none; max-width: 11rem; }

/* One panel, not four cards: the numbers are read across as a sentence about this repo,
   and borders between them break the line the eye is already following. */
.cl-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px;
  padding: 18px 22px; margin: 0 0 16px; border-radius: var(--bkz-radius-2xl);
  border: 1px solid var(--ui-glass-border); background: var(--ui-glass-bg); box-shadow: var(--ui-shadow); }
.cl-metric { min-width: 0; }
.cl-k { display: block; font-size: var(--bkz-text-base); color: var(--ui-ink-muted); margin-bottom: 6px; }
.cl-v { display: block; font-size: var(--bkz-text-5xl); font-weight: 650; letter-spacing: -0.025em; color: var(--ui-ink-strong); line-height: 1.1; }
.cl-hero .cl-v { color: var(--bkz-success-ink); }
.cl-note { display: block; margin-top: 5px; font-size: var(--bkz-text-sm); color: var(--ui-ink-faint); }


@media (max-width: 900px) {
  .cl-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 20px; }
  .subnav-row { flex-wrap: wrap; }
  .cl-toolbar { margin-left: 0; }
}

/* The "/6" on Evidence: a denominator, not a second number — it must not compete with the
   count for attention, or the tile reads as two figures instead of one fraction. */
.stc-of { font-size: 0.5em; font-weight: 500; color: var(--ui-ink-faint); letter-spacing: 0; margin-left: 1px; }

/* Bugs are not a success figure and not a brand figure — they are a caution one. Reuses the
   danger ink the revert copy already uses, so "came back" and "bugs found" read as the same
   register rather than inventing a third. */
.stc-n.warn { color: var(--bkz-danger-ink); }

/* The reviews column: neutral ink, because a pull request being reviewed is neither good
   news nor bad. Only the bugs chart beside it carries a colour that means something. */
.col-b { background: color-mix(in srgb, var(--brand) 45%, transparent); border-radius: 3px 3px 0 0; }
.colbars .col-b:only-child { border-radius: 3px 3px 2px 2px; }
.col-b[style="height:0%"] { display: none; }

/* The per-repository line under a chart. One row today — this is a single-repo view — but it
   keeps the shape the hosted dashboard uses, where the same panel lists several. */
.panel-foot { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--bkz-border-hairline); }
.panel-foot .muted { display: block; font-size: var(--bkz-text-sm); margin-bottom: 8px; }
.panel-foot .hrow { display: flex; align-items: center; justify-content: space-between; gap: 12px; }

/* A row-shaped placeholder while the GitHub feed is in flight. The list keeps its height and
   rhythm, so the page arrives once and fills in, rather than arriving twice. */
.botrow-skel { min-height: 46px; background: linear-gradient(90deg, var(--ui-hover) 25%, var(--ui-trough) 37%, var(--ui-hover) 63%);
  background-size: 400% 100%; animation: botskel 1.4s ease-in-out infinite; border-radius: var(--bkz-radius-md); }
@keyframes botskel { 0% { background-position: 100% 0; } 100% { background-position: -100% 0; } }
@media (prefers-reduced-motion: reduce) { .botrow-skel { animation: none; } }

/* Card-shaped placeholder for a pull request still being fetched. Same purpose as
   .botrow-skel: hold the shape so the page does not assert emptiness it has not verified. */
.pr-skel { min-height: 132px; background: linear-gradient(90deg, var(--ui-hover) 25%, var(--ui-trough) 37%, var(--ui-hover) 63%);
  background-size: 400% 100%; animation: botskel 1.4s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .pr-skel { animation: none; } }