/* Gofuso Runway - design tokens
   Inherited from Gofuso Zero so the two read as one family.
   Dark is the default; light is an explicit opt-in via [data-theme="light"]. */

:root {
  /* surfaces */
  --bg: #0b0e14;
  --bg2: #10141d;
  --panel: rgba(255, 255, 255, .03);
  --panel2: rgba(255, 255, 255, .055);
  --panel3: rgba(255, 255, 255, .08);
  --border: rgba(255, 255, 255, .08);
  --border2: rgba(255, 255, 255, .14);

  /* type */
  --text: #e8eaf0;
  --text2: #9aa3b5;
  --text3: #5d6679;

  /* brand */
  --acc: #2171B8;
  --acc2: #12A1DD;
  --grad: linear-gradient(135deg, #2171B8, #12A1DD);
  --acc-soft: rgba(33, 113, 184, .16);

  /* semantic */
  --green: #34d399;
  --amber: #fbbf24;
  --red: #f87171;
  --today: #f87171;

  /* lane / stage palette - ordered for categorical use, checked for
     contrast against both --bg and --bg2 in dark and light. */
  --c1: #12A1DD;  /* Define    */
  --c2: #8b7cf6;  /* Design    */
  --c3: #34d399;  /* Do        */
  --c4: #fbbf24;  /* Review    */
  --c5: #f472b6;  /* Train     */
  --c6: #2dd4bf;  /* Maintain  */
  --c7: #94a3b8;  /* On Hold   */
  --c8: #64748b;  /* Archive   */

  --shadow: 0 8px 32px rgba(0, 0, 0, .45);
  --shadow-sm: 0 2px 10px rgba(0, 0, 0, .3);
  --radius: 14px;
  --radius-sm: 9px;
  --bar-radius: 6px;

  /* timeline metrics */
  --lane-w: 288px;
  --row-h: 34px;
  --row-gap: 4px;
  --axis-h: 54px;

  --font: 'Inter', -apple-system, 'Segoe UI', system-ui, Roboto, sans-serif;
  --mono: 'JetBrains Mono', ui-monospace, Menlo, Consolas, monospace;
}

[data-theme="light"] {
  --bg: #f4f5f9;
  --bg2: #ffffff;
  --panel: rgba(15, 20, 40, .03);
  --panel2: rgba(15, 20, 40, .06);
  --panel3: rgba(15, 20, 40, .09);
  --border: rgba(15, 20, 40, .09);
  --border2: rgba(15, 20, 40, .16);

  --text: #171c28;
  --text2: #5a6275;
  --text3: #9aa1b2;

  --acc-soft: rgba(33, 113, 184, .12);
  --green: #059669;
  --amber: #b45309;
  --red: #dc2626;
  --today: #dc2626;

  --c1: #0b7fb0;
  --c2: #6d4fd6;
  --c3: #059669;
  --c4: #b45309;
  --c5: #db2777;
  --c6: #0d9488;
  --c7: #64748b;
  --c8: #475569;

  --shadow: 0 8px 28px rgba(20, 25, 60, .12);
  --shadow-sm: 0 2px 8px rgba(20, 25, 60, .08);
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}