/* Skulpo — tokeny kolorów 1:1 z apki: apps/skulpo-app/src/ui/theme/themes/dark.ts @ origin/main 9bd35eb4
   (docs/design-spec.md §2.1; różnica vs spec: text.secondary 0.55→0.72 i text.muted 0.35→0.62 — apka
   podniosła kontrast po audycie, repo > docs). Nazwy = tokens.ts (kropka → myślnik). JEDYNE miejsce
   z literałami hex/rgba w repo strony — scripts/check-hex.mjs czerwieni każdy inny plik. Motyw jasny = P2. */
:root {
  color-scheme: dark;

  --bg-deep: #0E0E0E;
  --bg-primary: #121212;
  --bg-body: #232326;
  --bg-card: #2C2C2E;
  --bg-modal: rgba(0, 0, 0, 0.70);
  --bg-rowSelected: #274363;
  --bg-subtle: rgba(255, 255, 255, 0.04);

  --text-primary: #D9D6CD;
  --text-secondary: rgba(217, 214, 205, 0.72);
  --text-muted: rgba(217, 214, 205, 0.62);
  --text-onAccent: #FFFFFF;

  --state-overworked: #FF453A;
  --state-recovering: #FFCC00;
  --state-ready: #34D399;
  --state-readyLate: #34D399;
  --state-peak: #4C7DFF;
  --state-recovered: #7DD3FC;
  --state-active: #E5C38B;
  --state-noData: #8E8E93;

  --stateOpacity-overworked: 0.9;
  --stateOpacity-recovering: 0.8;
  --stateOpacity-ready: 0.65;
  --stateOpacity-readyLate: 0.55;
  --stateOpacity-peak: 1;
  --stateOpacity-recovered: 0.85;
  --stateOpacity-active: 1;
  --stateOpacity-noData: 0.25;

  --glow-color: #4C7DFF;
  --glow-opacity: 0.35;
  --glow-radius: 24px;
  --glow-shadow: 0 0 var(--glow-radius) rgba(76, 125, 255, 0.35);

  --accent-primary: #4A9EFF;
  --accent-danger: #FF453A;
  --accent-success: #34D399;
  --accent-gold: #C8A97E;
  --accent-negative: #F2C41F;

  --border-default: #2E2E2E;
  --border-divider: #252525;
  --border-subtle: rgba(217, 214, 205, 0.10);

  --chart-fatigueLine: #4A9EFF;
  --chart-scrubLine: #C8A97E;
  --chart-gridLine: #2E2E2E;
}

html, body { margin: 0; min-height: 100%; background: var(--bg-primary); color: var(--text-primary); }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  display: grid; place-items: center; min-height: 100vh; padding: 16px; box-sizing: border-box;
}
main { max-width: 32rem; text-align: center; }
.brand { font-size: 2rem; font-weight: 700; letter-spacing: 0.02em; margin: 0 0 2rem; color: var(--accent-gold); }
section + section { margin-top: 2rem; padding-top: 2rem; border-top: 1px solid var(--border-subtle); }
h1, h2 { font-size: 1.25rem; font-weight: 600; margin: 0 0 0.5rem; }
p { margin: 0; color: var(--text-secondary); line-height: 1.5; }
