/* ============ Bid Manager — Design tokens & base styles ============ */
:root {
  /* Color: light theme defaults */
  --bg: #F7F8FA;
  --bg-elev: #FFFFFF;
  --bg-sunken: #EEF1F4;
  --bg-hover: #F1F3F6;
  --bg-active: #E6EAF0;
  --border: #E3E7EC;
  --border-strong: #D2D8DF;
  --fg: #0E1116;
  --fg-muted: #4B5563;
  --fg-subtle: #6B7280;
  --fg-faint: #9AA1AB;
  --fg-inverse: #FFFFFF;

  /* Brand accent — cyan family */
  --accent: #06B6D4;
  --accent-hover: #0891B2;
  --accent-soft: #CFFAFE;
  --accent-fg: #0E7490;
  --accent-contrast: #FFFFFF;

  /* Status */
  --status-not-started-bg: #EEF1F4;
  --status-not-started-fg: #4B5563;
  --status-not-started-dot: #9AA1AB;

  --status-in-progress-bg: #FEF3C7;
  --status-in-progress-fg: #92400E;
  --status-in-progress-dot: #F59E0B;

  --status-complete-bg: #D1FAE5;
  --status-complete-fg: #065F46;
  --status-complete-dot: #10B981;

  --status-blocked-bg: #FEE2E2;
  --status-blocked-fg: #991B1B;
  --status-blocked-dot: #EF4444;

  --status-overdue-bg: #FFE4E6;
  --status-overdue-fg: #9F1239;
  --status-overdue-dot: #F43F5E;

  /* Priority */
  --prio-normal: #6B7280;
  --prio-high: #D97706;
  --prio-critical: #DC2626;

  /* Phase chip colors */
  --phase-1: #6366F1; /* kick-off — indigo */
  --phase-2: #06B6D4; /* doc review — cyan */
  --phase-3: #8B5CF6; /* parallel — violet */
  --phase-4: #F59E0B; /* convergence — amber */
  --phase-5: #EC4899; /* internal review — pink */
  --phase-6: #10B981; /* submission — emerald */

  /* Type */
  --font-sans: 'Inter', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', monospace;
  --font-display: 'Inter', system-ui, sans-serif;

  /* Spacing scale */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 20px;
  --sp-6: 24px;
  --sp-7: 32px;
  --sp-8: 40px;
  --sp-9: 48px;
  --sp-10: 64px;

  /* Radius */
  --r-1: 4px;
  --r-2: 6px;
  --r-3: 8px;
  --r-4: 10px;
  --r-5: 14px;
  --r-pill: 999px;

  /* Shadow */
  --sh-1: 0 1px 2px rgba(15, 23, 42, 0.04), 0 0 0 1px rgba(15, 23, 42, 0.04);
  --sh-2: 0 1px 3px rgba(15, 23, 42, 0.06), 0 4px 8px rgba(15, 23, 42, 0.04);
  --sh-3: 0 10px 30px rgba(15, 23, 42, 0.08), 0 4px 12px rgba(15, 23, 42, 0.06);
  --sh-pop: 0 20px 50px rgba(15, 23, 42, 0.18), 0 8px 16px rgba(15, 23, 42, 0.10);

  /* Density */
  --row-h: 40px;
  --row-pad-y: 10px;
  --row-pad-x: 14px;
  --field-h: 36px;

  /* Layout */
  --rail-w: 224px;
  --rail-collapsed-w: 60px;
  --topbar-h: 56px;
  --workspace-tabs-h: 44px;
}

[data-theme="dark"] {
  --bg: #0B0E13;
  --bg-elev: #11151C;
  --bg-sunken: #0A0D12;
  --bg-hover: #161B23;
  --bg-active: #1E242E;
  --border: #1E242E;
  --border-strong: #2A323E;
  --fg: #ECEEF2;
  --fg-muted: #B5BBC5;
  --fg-subtle: #8B92A0;
  --fg-faint: #6B7282;
  --fg-inverse: #0B0E13;

  --accent-soft: #082F3E;
  --accent-fg: #67E8F9;

  --status-not-started-bg: #1E242E;
  --status-not-started-fg: #B5BBC5;
  --status-in-progress-bg: #3B2F0E;
  --status-in-progress-fg: #FCD34D;
  --status-complete-bg: #0F2E22;
  --status-complete-fg: #6EE7B7;
  --status-blocked-bg: #3B1818;
  --status-blocked-fg: #FCA5A5;
  --status-overdue-bg: #3B1820;
  --status-overdue-fg: #FDA4AF;

  --sh-1: 0 1px 2px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(255, 255, 255, 0.04);
  --sh-2: 0 2px 8px rgba(0, 0, 0, 0.4);
  --sh-3: 0 12px 32px rgba(0, 0, 0, 0.5);
  --sh-pop: 0 24px 60px rgba(0, 0, 0, 0.6);
}

[data-density="compact"] {
  --row-h: 32px;
  --row-pad-y: 6px;
  --row-pad-x: 10px;
  --field-h: 30px;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; overflow: hidden; }
body {
  font-family: var(--font-sans);
  background: var(--bg);
  color: var(--fg);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
#root { height: 100%; }

button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; padding: 0; }
input, textarea, select { font-family: inherit; font-size: inherit; color: inherit; }
a { color: inherit; text-decoration: none; }

/* Scrollbars */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: var(--r-pill); border: 2px solid var(--bg); }
::-webkit-scrollbar-thumb:hover { background: var(--fg-faint); }

/* Reusable utility */
.mono { font-family: var(--font-mono); font-feature-settings: 'tnum'; }
.tnum { font-variant-numeric: tabular-nums; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.flex { display: flex; }
.col { flex-direction: column; }
.center { display: flex; align-items: center; justify-content: center; }
.gap-1 { gap: 4px; } .gap-2 { gap: 8px; } .gap-3 { gap: 12px; } .gap-4 { gap: 16px; } .gap-6 { gap: 24px; }
.items-center { align-items: center; }
.justify-between { justify-content: space-between; }
.grow { flex: 1 1 auto; min-width: 0; }
.shrink-0 { flex-shrink: 0; }
.relative { position: relative; }
.hidden { display: none !important; }
@media (max-width: 768px) {
  .md-hidden { display: none !important; }
}
@media (min-width: 769px) {
  .md-only { display: none !important; }
}