/* OrchestAI — design tokens + components */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=General+Sans:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  /* Colors — light fintech modern */
  --oai-bg:        oklch(0.985 0.003 85);
  --oai-bg-elev:   oklch(1 0 0);
  --oai-bg-sunk:   oklch(0.965 0.004 85);
  --oai-ink:       oklch(0.22 0.015 265);
  --oai-ink-2:     oklch(0.42 0.015 265);
  --oai-ink-3:     oklch(0.62 0.012 265);
  --oai-line:      oklch(0.92 0.006 265);
  --oai-line-2:    oklch(0.88 0.008 265);

  /* Accents — fintech live */
  --oai-accent:     oklch(0.82 0.18 130);  /* electric lime */
  --oai-accent-ink: oklch(0.28 0.10 130);
  --oai-accent-sub: oklch(0.96 0.06 130);

  --oai-coral:     oklch(0.68 0.18 28);
  --oai-coral-sub: oklch(0.96 0.05 28);

  --oai-cobalt:     oklch(0.55 0.18 260);
  --oai-cobalt-sub: oklch(0.96 0.03 260);

  --oai-amber:     oklch(0.78 0.15 75);
  --oai-amber-sub: oklch(0.97 0.04 75);

  --oai-violet:    oklch(0.62 0.16 295);
  --oai-violet-sub:oklch(0.97 0.03 295);

  /* Numbers-up & down */
  --oai-up:   oklch(0.55 0.14 150);
  --oai-down: oklch(0.58 0.19 28);

  /* Type */
  --oai-font-display: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;
  --oai-font-ui:      "General Sans", "Space Grotesk", ui-sans-serif, system-ui, sans-serif;
  --oai-font-mono:    "JetBrains Mono", ui-monospace, monospace;

  /* Radius / spacing */
  --oai-r-sm: 6px;
  --oai-r-md: 10px;
  --oai-r-lg: 16px;
  --oai-r-xl: 22px;

  --oai-shadow-sm: 0 1px 2px oklch(0.2 0.02 265 / 0.04);
  --oai-shadow-md: 0 4px 16px oklch(0.2 0.02 265 / 0.06), 0 1px 2px oklch(0.2 0.02 265 / 0.04);
  --oai-shadow-lg: 0 20px 50px oklch(0.2 0.02 265 / 0.1), 0 2px 6px oklch(0.2 0.02 265 / 0.05);

  --oai-row: 44px;
}

[data-theme="dark"] {
  --oai-bg:        oklch(0.16 0.012 265);
  --oai-bg-elev:   oklch(0.20 0.013 265);
  --oai-bg-sunk:   oklch(0.14 0.011 265);
  --oai-ink:       oklch(0.96 0.005 265);
  --oai-ink-2:     oklch(0.78 0.01 265);
  --oai-ink-3:     oklch(0.58 0.01 265);
  --oai-line:      oklch(0.28 0.012 265);
  --oai-line-2:    oklch(0.34 0.014 265);
  --oai-accent-sub: oklch(0.28 0.08 130);
  --oai-coral-sub:  oklch(0.28 0.08 28);
  --oai-cobalt-sub: oklch(0.28 0.08 260);
  --oai-amber-sub:  oklch(0.28 0.06 75);
  --oai-violet-sub: oklch(0.28 0.06 295);
}

[data-density="compact"] { --oai-row: 36px; }

/* Base */
* { box-sizing: border-box; }
html, body, #root { height: 100%; }
body {
  margin: 0;
  background: var(--oai-bg);
  color: var(--oai-ink);
  font-family: var(--oai-font-ui);
  font-size: 14px;
  line-height: 1.45;
  -webkit-font-smoothing: antialiased;
  letter-spacing: -0.005em;
}
h1,h2,h3,h4 { font-family: var(--oai-font-display); font-weight: 600; letter-spacing: -0.02em; margin: 0; }
h1 { font-size: 30px; line-height: 1.15; }
h2 { font-size: 22px; }
h3 { font-size: 17px; }
h4 { font-size: 14px; }
p  { margin: 0; color: var(--oai-ink-2); }
.mono { font-family: var(--oai-font-mono); font-variant-numeric: tabular-nums; }
.tnum { font-variant-numeric: tabular-nums; }
.muted { color: var(--oai-ink-3); }
.ink-2 { color: var(--oai-ink-2); }
hr.oai-hr { border: 0; border-top: 1px solid var(--oai-line); margin: 12px 0; }

/* --- App shell --- */
.oai-app {
  display: grid;
  grid-template-columns: 260px 1fr;
  grid-template-rows: 1fr;
  height: 100vh;
  background: var(--oai-bg);
}
.oai-main {
  display: flex; flex-direction: column;
  min-width: 0; min-height: 0; overflow: hidden;
}
.oai-topbar {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 24px;
  border-bottom: 1px solid var(--oai-line);
  background: var(--oai-bg-elev);
  z-index: 5;
  height: 56px; flex-shrink: 0;
}
.oai-content {
  flex: 1; overflow-y: auto; min-height: 0;
  padding: 28px 36px 80px;
}
.oai-sidebar {
  border-right: 1px solid var(--oai-line);
  background: var(--oai-bg-elev);
  padding: 14px 12px;
  overflow-y: auto;
  display: flex; flex-direction: column; gap: 4px;
}
.oai-sidebar__brand { display: flex; align-items: center; gap: 10px; padding: 4px 8px 14px; border-bottom: 1px solid var(--oai-line-soft); margin-bottom: 4px; }
.oai-sidebar__brand .oai-logo { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 8px; background: var(--oai-ink); color: white; }
.oai-sidebar__brand .oai-logo svg { width: 18px; height: 18px; }
.oai-sidebar__nav { flex: 1; overflow-y: auto; padding: 4px 0; }
.oai-sidebar__foot { border-top: 1px solid var(--oai-line-soft); padding: 12px 8px 4px; margin-top: 4px; }
.oai-nav-item--accent { background: var(--oai-accent-sub); color: var(--oai-accent-ink); font-weight: 600; }
.oai-nav-item--accent .oai-nav-item__icon { color: var(--oai-accent-ink); }
.oai-nav-item--sub { padding: 6px 10px 6px 16px; font-size: 12.5px; font-weight: 500; color: var(--oai-ink-3); }
.oai-nav-item--sub:hover { color: var(--oai-ink-2); background: var(--oai-bg-sunk); }
.oai-nav-item__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--oai-ink-3); flex-shrink: 0; }
.oai-nav-item__dot.is-running { background: oklch(0.78 0.15 70); animation: oai-pulse 1.6s infinite; }
.oai-nav-item__dot.is-draft { background: var(--oai-ink-3); }
.oai-nav-item__dot.is-review { background: oklch(0.72 0.15 250); }
.oai-nav-item__dot.is-delivered { background: oklch(0.72 0.18 145); }
.oai-nav-item__dot.is-archived { background: var(--oai-line); }
@keyframes oai-pulse { 0%,100% { opacity: 1; } 50% { opacity: 0.4; } }
/* (replaced above) */

/* Topbar */
.oai-logo {
  display: flex; align-items: center; gap: 10px; font-family: var(--oai-font-display); font-weight: 700; font-size: 16px;
  letter-spacing: -0.02em;
}
.oai-logo__mark {
  width: 28px; height: 28px; border-radius: 8px;
  background: linear-gradient(135deg, var(--oai-ink) 0%, var(--oai-ink) 50%, var(--oai-accent) 50%, var(--oai-accent) 100%);
  display: grid; place-items: center; color: white; font-weight: 700; font-size: 13px;
  box-shadow: inset 0 0 0 1px oklch(1 0 0 / 0.1);
}
.oai-logo__mark span { transform: translate(0,0); font-family: var(--oai-font-display); }
.oai-logo__tag { color: var(--oai-ink-3); font-weight: 500; font-size: 12px; letter-spacing: 0.01em; }
.oai-topbar__spacer { flex: 1; }
.oai-topbar__right { display: flex; align-items: center; gap: 10px; }

/* Sidebar */
.oai-nav-section { margin-top: 10px; }
.oai-nav-section__title { font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--oai-ink-3); padding: 6px 10px; font-weight: 600; }
.oai-nav-item {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 10px; border-radius: var(--oai-r-md);
  color: var(--oai-ink-2); cursor: pointer;
  font-size: 13.5px; font-weight: 500;
  border: 1px solid transparent;
  transition: background 120ms;
}
.oai-nav-item:hover { background: var(--oai-bg-sunk); color: var(--oai-ink); }
.oai-nav-item.is-active {
  background: var(--oai-ink);
  color: var(--oai-bg-elev);
  font-weight: 600;
}
.oai-nav-item.is-active .oai-nav-item__icon { color: var(--oai-accent); }
.oai-nav-item__icon { width: 18px; height: 18px; flex-shrink: 0; color: var(--oai-ink-3); }
.oai-nav-item__count {
  margin-left: auto; font-family: var(--oai-font-mono); font-size: 11px;
  color: var(--oai-ink-3); padding: 1px 6px; border-radius: 4px;
  background: var(--oai-bg-sunk);
}
.oai-nav-item.is-active .oai-nav-item__count { background: oklch(1 0 0 / 0.1); color: var(--oai-accent); }

/* Buttons */
.oai-btn {
  display: inline-flex; align-items: center; gap: 8px;
  border: 1px solid transparent; cursor: pointer;
  font-family: var(--oai-font-ui); font-weight: 500;
  border-radius: var(--oai-r-md);
  transition: all 120ms;
  white-space: nowrap;
}
.oai-btn--md { height: 36px; padding: 0 14px; font-size: 13.5px; }
.oai-btn--sm { height: 28px; padding: 0 10px; font-size: 12.5px; border-radius: var(--oai-r-sm); }
.oai-btn--lg { height: 44px; padding: 0 18px; font-size: 14.5px; }
.oai-btn__icon { width: 16px; height: 16px; flex-shrink: 0; }
.oai-btn--primary { background: var(--oai-ink); color: var(--oai-bg-elev); }
.oai-btn--primary:hover { background: oklch(from var(--oai-ink) calc(l + 0.08) c h); }
.oai-btn--accent { background: var(--oai-accent); color: var(--oai-accent-ink); font-weight: 600; }
.oai-btn--accent:hover { filter: brightness(0.97); }
.oai-btn--ghost { background: transparent; color: var(--oai-ink-2); border-color: transparent; }
.oai-btn--ghost:hover { background: var(--oai-bg-sunk); color: var(--oai-ink); }
.oai-btn--outline { background: var(--oai-bg-elev); color: var(--oai-ink); border-color: var(--oai-line-2); }
.oai-btn--outline:hover { border-color: var(--oai-ink); }
.oai-btn--danger { background: transparent; color: var(--oai-down); }
.oai-btn--danger:hover { background: var(--oai-coral-sub); }

/* Pills */
.oai-pill {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 11.5px; font-weight: 600; letter-spacing: 0.005em;
  padding: 3px 9px; border-radius: 999px;
  border: 1px solid var(--oai-line-2);
  color: var(--oai-ink-2); background: var(--oai-bg-elev);
  white-space: nowrap;
}
.oai-pill--lime   { background: var(--oai-accent-sub); border-color: transparent; color: var(--oai-accent-ink); }
.oai-pill--coral  { background: var(--oai-coral-sub); border-color: transparent; color: var(--oai-coral); }
.oai-pill--cobalt { background: var(--oai-cobalt-sub); border-color: transparent; color: var(--oai-cobalt); }
.oai-pill--amber  { background: var(--oai-amber-sub); border-color: transparent; color: var(--oai-amber); }
.oai-pill--violet { background: var(--oai-violet-sub); border-color: transparent; color: var(--oai-violet); }
.oai-pill--ink    { background: var(--oai-ink); border-color: transparent; color: var(--oai-bg-elev); }
.oai-pill__icon   { width: 12px; height: 12px; }

/* Cards */
.oai-card {
  background: var(--oai-bg-elev);
  border: 1px solid var(--oai-line);
  border-radius: var(--oai-r-lg);
}
.oai-card--padded { padding: 20px; }

/* Inputs */
.oai-field { display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.oai-field__label { font-weight: 500; color: var(--oai-ink-2); font-size: 12.5px; }
.oai-field__hint  { color: var(--oai-ink-3); font-size: 11.5px; }
.oai-input, .oai-select, .oai-textarea {
  font-family: inherit; font-size: 13.5px; color: var(--oai-ink);
  background: var(--oai-bg-elev);
  border: 1px solid var(--oai-line-2); border-radius: var(--oai-r-md);
  padding: 9px 12px;
  transition: border-color 120ms, background 120ms;
  width: 100%;
}
.oai-input:focus, .oai-select:focus, .oai-textarea:focus {
  outline: none;
  border-color: var(--oai-ink);
  box-shadow: 0 0 0 3px oklch(from var(--oai-ink) l c h / 0.08);
}
.oai-textarea { min-height: 80px; resize: vertical; }

/* Toggle */
.oai-toggle { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; user-select: none; font-size: 13px; }
.oai-toggle input { display: none; }
.oai-toggle__track {
  width: 34px; height: 20px; border-radius: 999px;
  background: var(--oai-line-2); position: relative; transition: background 150ms;
}
.oai-toggle__thumb {
  position: absolute; top: 2px; left: 2px; width: 16px; height: 16px;
  background: white; border-radius: 50%; transition: transform 150ms;
  box-shadow: 0 1px 3px oklch(0.2 0 0 / 0.2);
}
.oai-toggle input:checked + .oai-toggle__track { background: var(--oai-ink); }
.oai-toggle input:checked + .oai-toggle__track .oai-toggle__thumb { transform: translateX(14px); }

/* Segmented */
.oai-seg {
  display: inline-flex; padding: 3px; gap: 2px;
  background: var(--oai-bg-sunk);
  border-radius: var(--oai-r-md);
  border: 1px solid var(--oai-line);
}
.oai-seg__item {
  display: inline-flex; align-items: center; gap: 6px;
  height: 28px; padding: 0 12px;
  background: transparent; border: 0; border-radius: var(--oai-r-sm);
  font-family: inherit; font-size: 12.5px; font-weight: 500; color: var(--oai-ink-2);
  cursor: pointer; transition: all 120ms;
}
.oai-seg__item:hover { color: var(--oai-ink); }
.oai-seg__item.is-active { background: var(--oai-bg-elev); color: var(--oai-ink); font-weight: 600; box-shadow: var(--oai-shadow-sm); }
.oai-seg__icon { width: 14px; height: 14px; }

/* Avatar */
.oai-avatar {
  border-radius: 50%;
  background: var(--oai-ink); color: var(--oai-accent);
  font-weight: 600; font-family: var(--oai-font-display);
  display: grid; place-items: center;
}

/* Utilities */
.oai-row { display: flex; align-items: center; gap: 12px; }
.oai-col { display: flex; flex-direction: column; gap: 12px; }
.oai-grid { display: grid; gap: 16px; }
.grow { flex: 1; }
.oai-divider { height: 1px; background: var(--oai-line); margin: 20px 0; }

/* Number up/down */
.delta-up { color: var(--oai-up); }
.delta-dn { color: var(--oai-down); }

/* Sparkline */
.oai-spark { display: block; }

/* ===== Page: New Analysis ===== */
.page-header { margin-bottom: 24px; }
.page-header h1 { margin-bottom: 6px; }
.page-header p { font-size: 14px; max-width: 680px; }

.hero-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 20px;
}

.quick-templates { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; margin-top: 12px; }
.tpl-card {
  border: 1px solid var(--oai-line); border-radius: var(--oai-r-md);
  padding: 12px 14px; cursor: pointer;
  background: var(--oai-bg-elev);
  display: flex; align-items: start; gap: 10px;
  transition: all 140ms;
}
.tpl-card:hover { border-color: var(--oai-ink); transform: translateY(-1px); box-shadow: var(--oai-shadow-md); }
.tpl-card__icon {
  width: 32px; height: 32px; flex-shrink: 0; border-radius: 8px;
  background: var(--oai-bg-sunk); display: grid; place-items: center; color: var(--oai-ink-2);
}
.tpl-card__title { font-weight: 600; font-size: 13px; }
.tpl-card__sub { font-size: 11.5px; color: var(--oai-ink-3); margin-top: 2px; }

.method-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
.method-chip {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 12px; border-radius: var(--oai-r-md);
  border: 1px solid var(--oai-line-2); cursor: pointer;
  font-size: 12.5px; font-weight: 500;
  transition: all 120ms;
  background: var(--oai-bg-elev);
}
.method-chip:hover { border-color: var(--oai-ink-2); }
.method-chip.is-on {
  border-color: var(--oai-ink); background: var(--oai-ink); color: var(--oai-bg-elev);
}
.method-chip.is-on .method-chip__check { opacity: 1; }
.method-chip__check { width: 14px; height: 14px; opacity: 0.2; color: var(--oai-accent); }

/* Upload / dropzone */
.dropzone {
  border: 1.5px dashed var(--oai-line-2); border-radius: var(--oai-r-lg);
  padding: 28px; text-align: center;
  background: var(--oai-bg-sunk);
  transition: all 150ms; cursor: pointer;
}
.dropzone:hover, .dropzone.is-over {
  border-color: var(--oai-ink); background: var(--oai-accent-sub); border-style: solid;
}
.dropzone__icon {
  width: 44px; height: 44px; color: var(--oai-ink-2); margin: 0 auto 10px;
  background: var(--oai-bg-elev); border-radius: 12px; padding: 10px;
  border: 1px solid var(--oai-line);
}
.sources-row { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 12px; justify-content: center; }
.source-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 10px; border-radius: 999px;
  border: 1px solid var(--oai-line-2); font-size: 12px; font-weight: 500;
  background: var(--oai-bg-elev); cursor: pointer; color: var(--oai-ink-2);
}
.source-chip:hover { border-color: var(--oai-ink); color: var(--oai-ink); }

/* Uploaded file rows */
.file-row {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 12px; border-radius: var(--oai-r-md);
  border: 1px solid var(--oai-line);
  background: var(--oai-bg-elev);
  margin-top: 8px;
}
.file-row__ext {
  width: 34px; height: 34px; flex-shrink: 0; border-radius: 8px;
  display: grid; place-items: center;
  font-family: var(--oai-font-mono); font-size: 10.5px; font-weight: 600; letter-spacing: 0.02em;
  background: var(--oai-bg-sunk); color: var(--oai-ink-2); border: 1px solid var(--oai-line);
  text-transform: uppercase;
}
.file-row__ext[data-ext="pdf"]   { color: var(--oai-coral); background: var(--oai-coral-sub); border-color: transparent; }
.file-row__ext[data-ext="xlsx"]  { color: var(--oai-up);    background: oklch(0.96 0.04 150); border-color: transparent; }
.file-row__ext[data-ext="docx"]  { color: var(--oai-cobalt);background: var(--oai-cobalt-sub); border-color: transparent; }
.file-row__ext[data-ext="pptx"]  { color: var(--oai-amber); background: var(--oai-amber-sub); border-color: transparent; }
.file-row__ext[data-ext="csv"]   { color: var(--oai-violet); background: var(--oai-violet-sub); border-color: transparent; }
.file-row__ext[data-ext="audio"] { color: var(--oai-ink); background: oklch(0.94 0.005 265); border-color: transparent; }
.file-row__name { font-size: 13px; font-weight: 500; }
.file-row__meta { font-size: 11.5px; color: var(--oai-ink-3); font-family: var(--oai-font-mono); }
.file-row__progress { width: 80px; height: 4px; background: var(--oai-bg-sunk); border-radius: 999px; overflow: hidden; }
.file-row__progress > div { height: 100%; background: var(--oai-ink); }

/* ===== Workspace / valuation ===== */
.ws-header { display: flex; align-items: start; gap: 20px; justify-content: space-between; }
.ws-title-block h1 { font-size: 26px; }
.ws-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 20px; }
.kpi {
  background: var(--oai-bg-elev);
  border: 1px solid var(--oai-line);
  border-radius: var(--oai-r-lg);
  padding: 16px 18px;
  position: relative; overflow: hidden;
}
.kpi__label { font-size: 11.5px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--oai-ink-3); font-weight: 600; }
.kpi__value { font-family: var(--oai-font-display); font-size: 28px; font-weight: 600; letter-spacing: -0.02em; margin-top: 6px; font-variant-numeric: tabular-nums; }
.kpi__sub { font-size: 12px; color: var(--oai-ink-3); margin-top: 4px; font-family: var(--oai-font-mono); }
.kpi--accent { background: var(--oai-ink); color: var(--oai-bg-elev); border-color: transparent; }
.kpi--accent .kpi__label { color: var(--oai-accent); }
.kpi--accent .kpi__value { color: var(--oai-accent); }
.kpi--accent .kpi__sub { color: oklch(0.85 0.01 265); }

/* Charts */
.chart-box { padding: 20px; }
.chart-title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.chart-title h3 { font-size: 14px; }

/* Tornado */
.tornado { display: flex; flex-direction: column; gap: 6px; }
.tornado__row { display: grid; grid-template-columns: 180px 1fr 60px; align-items: center; gap: 12px; font-size: 12.5px; }
.tornado__label { color: var(--oai-ink-2); font-weight: 500; }
.tornado__bar { position: relative; height: 24px; background: var(--oai-bg-sunk); border-radius: 4px; overflow: hidden; }
.tornado__bar .neg, .tornado__bar .pos {
  position: absolute; top: 0; bottom: 0; display: flex; align-items: center;
  padding: 0 6px; font-family: var(--oai-font-mono); font-size: 11px; font-weight: 600;
}
.tornado__bar .neg { right: 50%; background: var(--oai-coral-sub); color: var(--oai-down); justify-content: flex-end; border-radius: 3px 0 0 3px; }
.tornado__bar .pos { left: 50%; background: var(--oai-accent-sub); color: var(--oai-accent-ink); border-radius: 0 3px 3px 0; }
.tornado__bar::before { content: ""; position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; background: var(--oai-ink); z-index: 2; }
.tornado__impact { font-family: var(--oai-font-mono); font-size: 11.5px; color: var(--oai-ink-3); text-align: right; }

/* Football field */
.football { display: flex; flex-direction: column; gap: 10px; }
.football__row { display: grid; grid-template-columns: 140px 1fr 120px; align-items: center; gap: 14px; font-size: 12.5px; }
.football__method { font-weight: 500; color: var(--oai-ink); }
.football__track { position: relative; height: 28px; background: var(--oai-bg-sunk); border-radius: 6px; }
.football__bar { position: absolute; top: 4px; bottom: 4px; background: var(--oai-ink); border-radius: 3px; }
.football__base { position: absolute; top: -4px; bottom: -4px; width: 2px; background: var(--oai-accent); }
.football__num { font-family: var(--oai-font-mono); font-size: 11.5px; color: var(--oai-ink-2); text-align: right; }

/* Table */
.oai-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.oai-table th, .oai-table td { padding: 10px 12px; text-align: left; }
.oai-table th {
  font-weight: 600; color: var(--oai-ink-3); font-size: 11.5px;
  text-transform: uppercase; letter-spacing: 0.06em;
  border-bottom: 1px solid var(--oai-line);
}
.oai-table td { border-bottom: 1px solid var(--oai-line); font-variant-numeric: tabular-nums; }
.oai-table tr:last-child td { border-bottom: 0; }
.oai-table tr:hover td { background: var(--oai-bg-sunk); }
.oai-table td.num, .oai-table th.num { text-align: right; font-family: var(--oai-font-mono); }

/* DCF table editable */
.dcf-table input {
  background: transparent; border: 0; text-align: right;
  font-family: var(--oai-font-mono); font-size: 13px; color: var(--oai-ink);
  width: 70px; padding: 4px 6px; border-radius: 4px;
}
.dcf-table input:hover { background: var(--oai-bg-sunk); }
.dcf-table input:focus { background: var(--oai-accent-sub); outline: none; }
.dcf-table .is-proj { color: var(--oai-ink); }
.dcf-table .is-term { color: var(--oai-accent-ink); background: var(--oai-accent-sub); }

/* ===== Agents panel ===== */
.agents-panel { display: flex; flex-direction: column; gap: 8px; }
.agent-row { display: grid; grid-template-columns: 20px 1fr auto; align-items: center; gap: 10px; padding: 8px 0; font-size: 12.5px; }
.agent-status { width: 8px; height: 8px; border-radius: 50%; }
.agent-status.done    { background: var(--oai-up); }
.agent-status.running { background: var(--oai-accent); animation: pulse 1.4s ease-in-out infinite; }
.agent-status.queued  { background: var(--oai-ink-3); }
@keyframes pulse { 50% { box-shadow: 0 0 0 4px oklch(from var(--oai-accent) l c h / 0.2); } }
.agent-bar { width: 100%; height: 3px; background: var(--oai-bg-sunk); border-radius: 2px; overflow: hidden; margin-top: 3px; }
.agent-bar > div { height: 100%; background: var(--oai-ink); border-radius: 2px; transition: width 500ms; }

/* ===== Chat ===== */
.chat-container { display: flex; flex-direction: column; height: 100%; }
.chat-msgs { flex: 1; overflow-y: auto; padding: 16px 0; display: flex; flex-direction: column; gap: 14px; }
.msg-user { align-self: flex-end; max-width: 78%; background: var(--oai-ink); color: var(--oai-bg-elev); padding: 10px 14px; border-radius: 14px 14px 2px 14px; font-size: 13.5px; }
.msg-bot  { align-self: flex-start; max-width: 88%; background: var(--oai-bg-sunk); padding: 12px 14px; border-radius: 14px 14px 14px 2px; font-size: 13.5px; white-space: pre-wrap; line-height: 1.55; border: 1px solid var(--oai-line); }
.msg-bot__sources { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.source-ref { font-family: var(--oai-font-mono); font-size: 10.5px; padding: 2px 7px; border-radius: 4px; background: var(--oai-bg-elev); color: var(--oai-cobalt); border: 1px solid var(--oai-line); }

.chat-input { display: flex; gap: 8px; padding: 12px 0 4px; }
.chat-input .oai-input { padding-right: 44px; }
.chat-input__wrap { position: relative; flex: 1; }
.chat-input__send {
  position: absolute; right: 4px; top: 50%; transform: translateY(-50%);
  width: 30px; height: 30px; border: 0; border-radius: 8px; background: var(--oai-ink); color: var(--oai-accent);
  display: grid; place-items: center; cursor: pointer;
}

/* ===== Projects list ===== */
.project-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.project-card {
  background: var(--oai-bg-elev); border: 1px solid var(--oai-line);
  border-radius: var(--oai-r-lg); padding: 18px; cursor: pointer;
  transition: all 160ms;
  display: flex; flex-direction: column; gap: 14px;
  position: relative; overflow: hidden;
}
.project-card:hover { border-color: var(--oai-ink); transform: translateY(-2px); box-shadow: var(--oai-shadow-lg); }
.project-card__code { font-family: var(--oai-font-mono); font-size: 11px; color: var(--oai-ink-3); }
.project-card__name { font-family: var(--oai-font-display); font-size: 17px; font-weight: 600; letter-spacing: -0.015em; line-height: 1.2; }
.project-card__meta { display: flex; gap: 6px; flex-wrap: wrap; }
.project-card__row { display: flex; justify-content: space-between; align-items: end; margin-top: auto; padding-top: 10px; border-top: 1px solid var(--oai-line); }
.project-card__ev { font-family: var(--oai-font-mono); font-size: 14px; font-weight: 500; letter-spacing: -0.01em; }
.project-card__ev-label { font-size: 10.5px; color: var(--oai-ink-3); text-transform: uppercase; letter-spacing: 0.08em; font-weight: 600; }
.project-card__progress { width: 100%; height: 3px; background: var(--oai-bg-sunk); border-radius: 2px; overflow: hidden; }
.project-card__progress > div { height: 100%; background: var(--oai-ink); }

/* ===== Wiki ===== */
.wiki-layout { display: grid; grid-template-columns: 240px 1fr 280px; gap: 20px; }
.wiki-filters { display: flex; flex-direction: column; gap: 4px; }
.wiki-filter-item {
  display: flex; align-items: center; gap: 10px;
  padding: 7px 10px; border-radius: var(--oai-r-sm); cursor: pointer;
  font-size: 13px; color: var(--oai-ink-2);
}
.wiki-filter-item:hover { background: var(--oai-bg-sunk); }
.wiki-filter-item.is-on { background: var(--oai-ink); color: var(--oai-bg-elev); font-weight: 500; }
.wiki-filter-item__count { margin-left: auto; font-family: var(--oai-font-mono); font-size: 11px; color: var(--oai-ink-3); }
.wiki-filter-item.is-on .wiki-filter-item__count { color: var(--oai-accent); }

.wiki-entry {
  padding: 16px 0;
  border-bottom: 1px solid var(--oai-line);
  cursor: pointer; transition: background 120ms;
  display: grid; grid-template-columns: 96px 1fr auto; gap: 16px; align-items: start;
}
.wiki-entry:hover { background: var(--oai-bg-sunk); }
.wiki-entry__type {
  font-family: var(--oai-font-mono); font-size: 10.5px; font-weight: 600;
  padding: 3px 8px; border-radius: 4px; text-transform: uppercase; letter-spacing: 0.05em;
  text-align: center; align-self: start; margin-top: 2px;
  background: var(--oai-bg-sunk); color: var(--oai-ink-2);
}
.wiki-entry__type[data-t="method"]     { background: var(--oai-accent-sub); color: var(--oai-accent-ink); }
.wiki-entry__type[data-t="case"]       { background: var(--oai-cobalt-sub); color: var(--oai-cobalt); }
.wiki-entry__type[data-t="comparable"] { background: var(--oai-violet-sub); color: var(--oai-violet); }
.wiki-entry__type[data-t="assumption"] { background: var(--oai-amber-sub); color: var(--oai-amber); }
.wiki-entry__type[data-t="lesson"]     { background: var(--oai-coral-sub); color: var(--oai-coral); }
.wiki-entry__type[data-t="source"]     { background: oklch(0.94 0.005 265); color: var(--oai-ink-2); }
.wiki-entry__type[data-t="glossary"]   { background: var(--oai-bg-sunk); color: var(--oai-ink-2); }

.wiki-entry__title { font-family: var(--oai-font-display); font-size: 15.5px; font-weight: 600; letter-spacing: -0.01em; }
.wiki-entry__summary { font-size: 12.5px; color: var(--oai-ink-2); margin-top: 4px; line-height: 1.5; }
.wiki-entry__tags { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 8px; }
.wiki-tag {
  font-size: 10.5px; font-family: var(--oai-font-mono); padding: 2px 7px; border-radius: 4px;
  background: var(--oai-bg-sunk); color: var(--oai-ink-3); border: 1px solid var(--oai-line);
}
.wiki-entry__right { text-align: right; }
.wiki-entry__meta { font-size: 11px; color: var(--oai-ink-3); font-family: var(--oai-font-mono); }

.suggestions-list { display: flex; flex-direction: column; gap: 10px; }
.suggestion-card {
  background: var(--oai-bg-elev); border: 1px solid var(--oai-line);
  border-left: 3px solid var(--oai-accent);
  border-radius: var(--oai-r-md); padding: 12px 14px;
}
.suggestion-card__title { font-size: 13px; font-weight: 600; }
.suggestion-card__reason { font-size: 11.5px; color: var(--oai-ink-2); line-height: 1.5; margin-top: 4px; }
.suggestion-card__actions { display: flex; gap: 4px; margin-top: 10px; }

/* Graph SVG */
.graph-svg { background: var(--oai-bg-sunk); border-radius: var(--oai-r-lg); border: 1px solid var(--oai-line); width: 100%; }
.graph-svg .node circle { fill: var(--oai-bg-elev); stroke: var(--oai-ink); stroke-width: 1.5; cursor: pointer; transition: all 160ms; }
.graph-svg .node:hover circle { fill: var(--oai-accent); stroke-width: 2; }
.graph-svg .node text { font-family: var(--oai-font-ui); font-size: 10px; fill: var(--oai-ink); text-anchor: middle; pointer-events: none; }
.graph-svg .edge { stroke: var(--oai-line-2); stroke-width: 1; fill: none; }

/* Data room */
.dr-layout { display: grid; grid-template-columns: 220px 1fr; gap: 20px; }
.dr-cat-list { display: flex; flex-direction: column; gap: 2px; }
.dr-cat {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 10px; border-radius: var(--oai-r-sm);
  cursor: pointer; font-size: 13px; color: var(--oai-ink-2);
}
.dr-cat:hover { background: var(--oai-bg-sunk); }
.dr-cat.is-on { background: var(--oai-ink); color: var(--oai-bg-elev); font-weight: 500; }
.dr-cat__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--oai-ink-3); }
.dr-cat__count { margin-left: auto; font-family: var(--oai-font-mono); font-size: 11px; color: var(--oai-ink-3); }
.dr-cat.is-on .dr-cat__count { color: var(--oai-accent); }

.dr-list { display: flex; flex-direction: column; gap: 6px; }

/* AR risk mini board */
.risk-board { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.risk-cell {
  padding: 12px 14px; border-radius: var(--oai-r-md);
  border: 1px solid var(--oai-line); background: var(--oai-bg-elev);
}
.risk-cell__label { font-size: 11px; color: var(--oai-ink-3); text-transform: uppercase; letter-spacing: 0.06em; font-weight: 600; }
.risk-cell__value { font-family: var(--oai-font-display); font-size: 20px; font-weight: 600; margin-top: 4px; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
.risk-cell__delta { font-family: var(--oai-font-mono); font-size: 11px; margin-top: 2px; }

/* Tabs */
.oai-tabs { display: flex; gap: 0; border-bottom: 1px solid var(--oai-line); margin-bottom: 20px; }
.oai-tab {
  padding: 10px 16px; border: 0; background: transparent;
  font-family: inherit; font-size: 13.5px; font-weight: 500; color: var(--oai-ink-3);
  cursor: pointer; border-bottom: 2px solid transparent;
  transition: all 120ms; margin-bottom: -1px;
}
.oai-tab:hover { color: var(--oai-ink); }
.oai-tab.is-active { color: var(--oai-ink); border-bottom-color: var(--oai-ink); font-weight: 600; }

/* Research / agent loop */
.research-step {
  display: flex; align-items: start; gap: 12px;
  padding: 10px 14px; border-radius: var(--oai-r-md);
  background: var(--oai-bg-sunk); border: 1px solid var(--oai-line);
  font-size: 12.5px;
}
.research-step__num {
  width: 22px; height: 22px; flex-shrink: 0; border-radius: 50%;
  background: var(--oai-ink); color: var(--oai-accent); display: grid; place-items: center;
  font-family: var(--oai-font-mono); font-size: 11px; font-weight: 600;
}

/* Tweaks panel */
.tweaks-panel {
  position: fixed; right: 18px; bottom: 18px; width: 300px;
  background: var(--oai-bg-elev); border: 1px solid var(--oai-line);
  border-radius: var(--oai-r-lg); box-shadow: var(--oai-shadow-lg);
  padding: 16px; z-index: 100;
  display: flex; flex-direction: column; gap: 14px;
}
.tweaks-panel__title { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }
.tweaks-panel__title h3 { display: flex; align-items: center; gap: 6px; font-size: 14px; }
.color-swatches { display: flex; gap: 6px; }
.swatch { width: 26px; height: 26px; border-radius: 8px; border: 2px solid var(--oai-line-2); cursor: pointer; }
.swatch.is-on { border-color: var(--oai-ink); }

/* Empty */
.empty-state { text-align: center; padding: 40px 20px; color: var(--oai-ink-3); }
.empty-state svg { width: 40px; height: 40px; margin: 0 auto 10px; opacity: 0.5; }

/* Scrollbars */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--oai-line-2); border-radius: 10px; border: 2px solid var(--oai-bg); }
::-webkit-scrollbar-thumb:hover { background: var(--oai-ink-3); }

/* Focus visible */
:focus-visible { outline: 2px solid var(--oai-ink); outline-offset: 2px; }

/* Responsive */
@media (max-width: 820px) {
  .oai-app { grid-template-columns: 72px 1fr; }
  .hero-grid, .wiki-layout, .dr-layout { grid-template-columns: 1fr; }
  .ws-summary { grid-template-columns: 1fr 1fr; }
  .method-grid { grid-template-columns: 1fr 1fr; }
  .oai-nav-item__text { display: none; }
  .oai-nav-item__count { display: none; }
  .oai-nav-section__title { display: none; }
  .oai-nav-item { justify-content: center; }
  .oai-sidebar__brand > div:last-child,
  .oai-sidebar__foot > .oai-row > div:not(.oai-avatar) { display: none; }
  .oai-logo__tag { display: none; }
}