/* ── Global design tokens ───────────────────────────────────────────────── */

/* Base radii / type / spacing — never overridden by tab themes */
:root {
  --r-sm:   8px;
  --r-md:   12px;
  --r-lg:   16px;
  --r-xl:   22px;
  --f-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --f-sans: -apple-system, "SF Pro Text", "SF Pro", system-ui, sans-serif;
  --f-serif: ui-serif, "Iowan Old Style", "Charter", Georgia, serif;
}

/* ── Default theme (Today / CMC dark) — dark-only ──────────────────────── */
:root, [data-theme="dark"] {
  --bg:          oklch(0.155 0.013 252);
  --bg-elev:     oklch(0.185 0.014 252);
  --surface:     oklch(0.205 0.014 252);
  --surface-2:   oklch(0.245 0.013 252);
  --border:      oklch(0.30 0.012 252);
  --border-soft: oklch(0.26 0.012 252);
  --text:        oklch(0.97 0 0);
  --text-2:      oklch(0.78 0.01 252);
  --muted:       oklch(0.55 0.012 252);
  --muted-2:     oklch(0.40 0.012 252);
  --accent:      oklch(0.62 0.20 262);
  --accent-glow: oklch(0.62 0.20 262 / 0.30);
  --accent-dim:  oklch(0.45 0.15 262);
  --good:        oklch(0.78 0.18 145);
  --bad:         oklch(0.66 0.21 25);
  --warn:        oklch(0.82 0.16 78);
  --info:        oklch(0.78 0.10 220);
  --scanline:    rgba(255,255,255,0.018);
  --shadow-card: 0 1px 0 rgba(255,255,255,0.03) inset, 0 1px 4px rgba(0,0,0,0.5);
  color-scheme: dark;
}

/* ── Finances tab — light (cream paper) default, dark via media ─────────── */
.cos-app[data-tab="fin"] {
  --bg:          oklch(0.965 0.013 85);
  --bg-elev:     oklch(0.985 0.010 85);
  --surface:     oklch(0.998 0.005 85);
  --surface-2:   oklch(0.94 0.013 85);
  --border:      oklch(0.86 0.013 85);
  --border-soft: oklch(0.91 0.013 85);
  --text:        oklch(0.20 0.012 60);
  --text-2:      oklch(0.36 0.012 60);
  --muted:       oklch(0.50 0.012 60);
  --muted-2:     oklch(0.62 0.012 60);
  --accent:      oklch(0.42 0.10 155);
  --accent-glow: oklch(0.42 0.10 155 / 0.18);
  --accent-dim:  oklch(0.60 0.08 155);
  --good:        oklch(0.50 0.135 150);
  --warn:        oklch(0.62 0.145 70);
  --bad:         oklch(0.52 0.20 28);
  --info:        oklch(0.50 0.12 220);
  --scanline:    rgba(0,0,0,0.0);
  --shadow-card: 0 1px 0 rgba(255,255,255,0.6) inset, 0 1px 2px rgba(40,30,15,0.06), 0 6px 18px rgba(40,30,15,0.04);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  .cos-app[data-tab="fin"] {
    --bg:          oklch(0.20 0.012 70);
    --bg-elev:     oklch(0.23 0.012 70);
    --surface:     oklch(0.26 0.012 70);
    --surface-2:   oklch(0.30 0.012 70);
    --border:      oklch(0.36 0.012 70);
    --border-soft: oklch(0.32 0.012 70);
    --text:        oklch(0.92 0.012 80);
    --text-2:      oklch(0.76 0.012 80);
    --muted:       oklch(0.56 0.012 80);
    --muted-2:     oklch(0.42 0.012 70);
    --accent:      oklch(0.68 0.10 155);
    --accent-glow: oklch(0.68 0.10 155 / 0.25);
    --shadow-card: 0 1px 0 rgba(255,255,255,0.03) inset, 0 1px 3px rgba(0,0,0,0.4);
    color-scheme: dark;
  }
}

/* ── Health tab — LCARS dark ────────────────────────────────────────────── */
.cos-app[data-tab="health"] {
  --bg:           #000;
  --bg-elev:      oklch(0.12 0.025 245);
  --surface:      oklch(0.18 0.04 245);
  --surface-2:    oklch(0.24 0.05 245);
  --border:       oklch(0.40 0.10 245);
  --border-soft:  oklch(0.32 0.08 245);
  --text:         #e8f4ff;
  --text-2:       oklch(0.78 0.06 245);
  --muted:        oklch(0.58 0.06 245);
  --muted-2:      oklch(0.42 0.06 245);
  --accent:       #5599FF;
  --accent-glow:  rgba(85,153,255,0.35);
  --accent-dim:   rgba(85,153,255,0.55);
  --lcars-orange: #FF9966;
  --lcars-amber:  #FFCC66;
  --lcars-violet: #CC99CC;
  --lcars-red:    #FF6961;
  --good:         #9CFF9C;
  --warn:         #FFCC66;
  --bad:          #FF6961;
  --info:         #66ccff;
  --scanline:     rgba(85,153,255,0.025);
  --shadow-card:  none;
  color-scheme: dark;
}

/* ── Life tab — parchment brief, light default ──────────────────────────── */
.cos-app[data-tab="life"] {
  --bg:          oklch(0.94 0.014 80);
  --bg-elev:     oklch(0.97 0.012 80);
  --surface:     oklch(0.995 0.008 80);
  --surface-2:   oklch(0.92 0.014 80);
  --border:      oklch(0.78 0.014 80);
  --border-soft: oklch(0.85 0.012 80);
  --text:        oklch(0.18 0.014 60);
  --text-2:      oklch(0.34 0.012 60);
  --muted:       oklch(0.48 0.012 60);
  --muted-2:     oklch(0.60 0.012 60);
  --accent:      oklch(0.50 0.18 25);
  --accent-glow: oklch(0.50 0.18 25 / 0.18);
  --accent-dim:  oklch(0.65 0.12 30);
  --good:        oklch(0.45 0.13 150);
  --warn:        oklch(0.58 0.15 70);
  --bad:         oklch(0.50 0.20 25);
  --info:        oklch(0.48 0.10 220);
  --scanline:    rgba(0,0,0,0.0);
  --shadow-card: 0 1px 0 rgba(255,255,255,0.6) inset, 0 1px 2px rgba(40,30,15,0.05), 0 4px 12px rgba(40,30,15,0.04);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  .cos-app[data-tab="life"] {
    --bg:          oklch(0.20 0.014 65);
    --bg-elev:     oklch(0.23 0.014 65);
    --surface:     oklch(0.26 0.014 65);
    --surface-2:   oklch(0.30 0.012 65);
    --border:      oklch(0.38 0.012 65);
    --border-soft: oklch(0.33 0.012 65);
    --text:        oklch(0.91 0.014 80);
    --text-2:      oklch(0.75 0.012 80);
    --muted:       oklch(0.56 0.012 75);
    --muted-2:     oklch(0.42 0.012 70);
    --accent:      oklch(0.68 0.18 25);
    --accent-glow: oklch(0.68 0.18 25 / 0.22);
    --shadow-card: 0 1px 0 rgba(255,255,255,0.03) inset, 0 1px 3px rgba(0,0,0,0.4);
    color-scheme: dark;
  }
}

/* ── Systems tab — Apple ][ / WarGames CRT ──────────────────────────────── */
.cos-app[data-tab="systems"] {
  --bg:          #000;
  --bg-elev:     #000;
  --surface:     #020a04;
  --surface-2:   #04140a;
  --border:      #0c5526;
  --border-soft: #083d1a;
  --text:        #38ff7a;
  --text-2:      #2ee06b;
  --muted:       #1f9a4a;
  --muted-2:     #0d5c2c;
  --accent:      #66ff8d;
  --accent-glow: rgba(102,255,141,0.55);
  --good:        #66ff8d;
  --warn:        #b8ff66;
  --bad:         #ff8a66;
  --info:        #66ffd9;
  --scanline:    rgba(102,255,141,0.05);
  --shadow-card: none;
  color-scheme: dark;
}

/* scanline overlay — global app */
.cos-app::before {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 999;
  background: repeating-linear-gradient(
    to bottom,
    transparent 0 2px,
    var(--scanline) 2px 3px
  );
  mix-blend-mode: overlay;
  opacity: 0.55;
}
.cos-app[data-tab="systems"]::before {
  background: repeating-linear-gradient(to bottom, transparent 0 2px, rgba(0,0,0,0.32) 2px 3px),
              repeating-linear-gradient(to bottom, transparent 0 1px, rgba(102,255,141,0.04) 1px 2px);
  opacity: 1;
  mix-blend-mode: normal;
}
.cos-app[data-tab="fin"]::before,
.cos-app[data-tab="life"]::before { display: none; }