/*
 * Deadeye theme tokens: the single source of truth for every colour, font,
 * size, spacing, radius, shadow and motion value in the web app.
 * Ported from design/system/tokens.css ("Cursed Apple"). Values marked (m) are
 * measured from Deadlock's client CSS (design/research/visual-style.md §3).
 * Components, charts (CSS vars in SVG) and canvas renderers (theme/read-theme.js)
 * all read these, so changing a value here re-skins the whole site.
 * Fonts are self-hosted in theme/fonts.css (SIL OFL).
 */
:root {
  color-scheme: dark;

  /* ---------- Surfaces ---------- */
  --dl-bg-void: #050604;              /* page edge, behind everything (m: #000 dashboard, lifted) */
  --dl-bg: #0c0e0a;                   /* app background */
  --dl-bg-ink: #10130d;               /* (m) offBlack — ink / sunken wells */
  --dl-surface-1: #181716;            /* (m) tooltip #Contents — default panel */
  --dl-surface-2: #201e1b;            /* raised panel / table header */
  --dl-surface-3: #2e2c27;            /* (m) colorCommonDarkGray — hover, selected rows */
  --dl-surface-4: #3a372f;            /* pressed / strongest raised */
  --dl-surface-sunken: #0a0b08;       /* inputs, tracks, chart plots */
  --dl-scrim: rgba(5, 6, 4, 0.72);    /* modal / overlay backdrop */

  /* ---------- Lines ---------- */
  --dl-line-faint: rgba(255, 239, 215, 0.05);
  --dl-line: rgba(255, 239, 215, 0.10);         /* hairline default */
  --dl-line-strong: rgba(255, 239, 215, 0.18);
  --dl-line-neutral: #444444;                   /* (m) baseBorder */
  --dl-line-brass: rgba(195, 151, 81, 0.45);    /* ornamental hairline */

  /* ---------- Brass / accent ---------- */
  --dl-brass-light: #f1d9a4;
  --dl-brass-bright: #e2bd74;
  --dl-brass: #c39751;                /* (m) rank10Color — gilded trim */
  --dl-brass-dim: #8c6a37;
  --dl-brass-deep: #3f2f18;
  --dl-gold: #ffdb79;                 /* (m) colorModsShop */
  --dl-accent: var(--dl-brass-bright);
  --dl-focus: #f1d9a4;

  /* ---------- Text tiers (on dark surfaces) ---------- */
  --dl-text: #ffefd7;                 /* (m) offWhite/baseText — primary */
  --dl-text-2: #e3d5bf;               /* secondary body */
  --dl-text-muted: #a99c88;           /* captions, labels (≥6:1 on surface-1) */
  --dl-text-faint: #7d7362;           /* decorative / disabled only (≈3.7:1) */
  --dl-text-silver: #c6c6c6;          /* (m) silvered */
  --dl-text-ink: #10130d;             /* on brass / light fills */

  /* ---------- Teams (m) ---------- */
  --dl-amber: #d4860b;
  --dl-amber-bright: #fbdca0;
  --dl-amber-dark: #937600;
  --dl-amber-darker: #6f3806;
  --dl-amber-ink: #201500;
  --dl-amber-neutral: #55503e;
  --dl-sapphire: #4d75c3;
  --dl-sapphire-bright: #bdcbff;
  --dl-sapphire-dark: #4156a0;
  --dl-sapphire-darker: #243265;
  --dl-sapphire-alt: #03667b;
  --dl-sapphire-ink: #ffffff;
  --dl-sapphire-neutral: #54596c;
  --dl-friendly: #ffefd7;
  --dl-enemy: #d73232;

  /* ---------- Currency (m) ---------- */
  --dl-souls: #70f8c1;
  --dl-souls-bright: #99ffd6;         /* shardColor */
  --dl-souls-dim: #2f8a66;
  --dl-ability-point: #d8b8ff;

  /* ---------- Item categories (m) — reserve for their meaning ---------- */
  --dl-weapon-light: #ffd18d;
  --dl-weapon: #ec9719;
  --dl-weapon-base: #9d620b;
  --dl-weapon-dark: #7f540e;
  --dl-weapon-darker: #302306;
  --dl-vitality-light: #d3fc96;
  --dl-vitality: #7bba1d;
  --dl-vitality-base: #649717;
  --dl-vitality-dark: #4c7113;
  --dl-vitality-darker: #1f3400;
  --dl-spirit-light: #e7c8ff;
  --dl-spirit: #ce90ff;
  --dl-spirit-base: #8a55b3;
  --dl-spirit-dark: #613484;
  --dl-spirit-darker: #362147;

  /* ---------- Deltas / status ---------- */
  --dl-pos: #9ef29d;                  /* (m) ping-defend — text-safe positive */
  --dl-pos-fill: #7bba1d;
  --dl-neg: #ee5945;                  /* (m) warningRed — text-safe negative */
  --dl-neg-strong: #ff410d;           /* (m) colorEnemy */
  --dl-neutral: #c6c6c6;
  --dl-warn: #ffb803;                 /* (m) ping-watch */
  --dl-info: #749bff;                 /* (m) ping-going */
  --dl-ping-attack: #ff5353;
  --dl-ping-going: #749bff;
  --dl-ping-defend: #9ef29d;
  --dl-ping-watch: #ffb803;

  /* ---------- Provenance (product rule: every value shows where it came from) ---------- */
  --dl-prov-provider: #e2bd74;
  --dl-prov-native: #ffefd7;
  --dl-prov-derived: #c6c6c6;
  --dl-prov-sampled: #9fb6e8;
  --dl-prov-reconciled: #c9b98f;
  --dl-prov-unavailable: #7d7362;

  /*
   * ---------- Rank tiers ----------
   * Hex values are measured rank0Color..rank11Color (citadel_base_styles.css).
   * Names follow deadeye/ranks.py TIERS by ordinal (badge // 10). The hex<->name
   * pairing is APPROXIMATE (ordinal only, not confirmed against official art);
   * newer seasons may rename tiers. UI copy should lead with the recorded label.
   */
  --dl-rank-0: #333333;   --dl-rank-obscurus: var(--dl-rank-0);
  --dl-rank-1: #6a3e1e;   --dl-rank-initiate: var(--dl-rank-1);
  --dl-rank-2: #882355;   --dl-rank-seeker: var(--dl-rank-2);
  --dl-rank-3: #5c6dab;   --dl-rank-alchemist: var(--dl-rank-3);
  --dl-rank-4: #719c47;   --dl-rank-arcanist: var(--dl-rank-4);
  --dl-rank-5: #dda326;   --dl-rank-ritualist: var(--dl-rank-5);
  --dl-rank-6: #ee4f57;   --dl-rank-emissary: var(--dl-rank-6);
  --dl-rank-7: #b47feb;   --dl-rank-archon: var(--dl-rank-7);
  --dl-rank-8: #955138;   --dl-rank-oracle: var(--dl-rank-8);
  --dl-rank-9: #7c7c7c;   --dl-rank-phantom: var(--dl-rank-9);
  --dl-rank-10: #c39751;  --dl-rank-ascendant: var(--dl-rank-10);
  --dl-rank-11: #5ce9a9;  --dl-rank-eternus: var(--dl-rank-11);

  /* ---------- Chart series (ordered, colour-blind-aware, avoids category hues) ---------- */
  --dl-series-1: #e2bd74;
  --dl-series-2: #9fb6e8;
  --dl-series-3: #ffefd7;
  --dl-series-4: #e98b6d;
  --dl-series-5: #8fd3c7;
  --dl-series-6: #b9a6d9;
  --dl-series-7: #9fd36b;
  --dl-series-8: #f093b8;

  /* ---------- Typography ---------- */
  --dl-font-display: "Cinzel", "Cormorant", "Trajan Pro", Georgia, serif;
  --dl-font-heading: "Oswald", "Bebas Neue", "Arial Narrow", "Segoe UI", sans-serif;
  --dl-font-label: "Barlow Condensed", "Oswald", "Arial Narrow", "Segoe UI", sans-serif;
  --dl-font-body: "Jost", "Inter", "Segoe UI", system-ui, sans-serif;
  --dl-font-numeric: "Inter", "Jost", "Segoe UI", system-ui, sans-serif;
  --dl-font-mono: "Cascadia Mono", "Consolas", ui-monospace, monospace;
  --dl-numeric: tabular-nums lining-nums;

  --dl-text-2xs: 0.6875rem;  /* 11 */
  --dl-text-xs: 0.75rem;     /* 12 */
  --dl-text-sm: 0.8125rem;   /* 13 */
  --dl-text-md: 0.875rem;    /* 14 — dense data default */
  --dl-text-base: 1rem;      /* 16 — prose */
  --dl-text-lg: 1.125rem;    /* 18 */
  --dl-text-xl: 1.375rem;    /* 22 — heading */
  --dl-text-2xl: 1.75rem;    /* 28 — stat value */
  --dl-text-3xl: 2.25rem;    /* 36 */
  --dl-text-4xl: 3rem;       /* 48 — display */
  --dl-text-5xl: 4rem;       /* 64 — hero display */

  --dl-leading-tight: 1.1;
  --dl-leading-snug: 1.3;
  --dl-leading-normal: 1.5;

  --dl-track-display: 0.04em;
  --dl-track-heading: 0.04em;
  --dl-track-label: 0.1em;
  --dl-track-label-wide: 0.16em;

  --dl-weight-regular: 400;
  --dl-weight-medium: 500;
  --dl-weight-semibold: 600;
  --dl-weight-bold: 700;

  /* ---------- Spacing (4px base) ---------- */
  --dl-space-0: 0;
  --dl-space-px: 1px;
  --dl-space-half: 2px;
  --dl-space-1: 4px;
  --dl-space-2: 8px;
  --dl-space-3: 12px;
  --dl-space-4: 16px;
  --dl-space-5: 20px;
  --dl-space-6: 24px;
  --dl-space-8: 32px;
  --dl-space-10: 40px;
  --dl-space-12: 48px;
  --dl-space-16: 64px;

  /* ---------- Radii (Deadlock panels are near-square) ---------- */
  --dl-radius-0: 0;
  --dl-radius-xs: 2px;
  --dl-radius-sm: 4px;
  --dl-radius-md: 6px;
  --dl-radius-lg: 8px;          /* (m) tooltip radius */
  --dl-radius-pill: 999px;

  /* ---------- Elevation ---------- */
  --dl-shadow-1: 0 1px 0 rgba(255, 239, 215, 0.04) inset, 0 1px 2px rgba(0, 0, 0, 0.5);
  --dl-shadow-2: 0 1px 0 rgba(255, 239, 215, 0.05) inset, 0 6px 18px rgba(0, 0, 0, 0.45);
  --dl-shadow-3: 0 2px 16px 2px rgba(0, 0, 0, 0.35), 0 18px 48px rgba(0, 0, 0, 0.55); /* (m) paper tooltip */
  --dl-shadow-text: 2px 2px 0 #10130d;       /* (m) hero-card name plate */
  --dl-glow-brass: 0 0 0 1px rgba(226, 189, 116, 0.35), 0 0 18px rgba(195, 151, 81, 0.25);
  --dl-glow-souls: 0 0 14px rgba(112, 248, 193, 0.35);
  --dl-glow-focus: 0 0 0 2px var(--dl-bg), 0 0 0 4px var(--dl-focus);
  --dl-inset-hairline: inset 0 0 0 1px var(--dl-line);

  /* ---------- Z layers ---------- */
  --dl-z-base: 0;
  --dl-z-raised: 10;
  --dl-z-sticky: 100;
  --dl-z-nav: 200;
  --dl-z-dropdown: 300;
  --dl-z-overlay: 400;
  --dl-z-modal: 500;
  --dl-z-toast: 600;
  --dl-z-tooltip: 700;

  /* ---------- Motion (m: 0.08–0.2s, ease-in-out; brightness/opacity/scale > hue) ---------- */
  --dl-dur-instant: 80ms;
  --dl-dur-fast: 120ms;
  --dl-dur-base: 180ms;
  --dl-dur-slow: 250ms;
  --dl-dur-pulse: 2000ms;
  --dl-ease: cubic-bezier(0.45, 0, 0.55, 1);        /* ease-in-out */
  --dl-ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --dl-ease-in: cubic-bezier(0.5, 0, 0.75, 0);

  /* ---------- Layout ---------- */
  --dl-nav-height: 56px;
  --dl-sidebar-width: 240px;
  --dl-content-max: 1440px;

  /* ---------- Textures (original; no game assets) ---------- */
  --dl-tex-grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 .94 0 0 0 0 .84 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --dl-tex-smoke:
    radial-gradient(120% 70% at 15% -10%, rgba(195, 151, 81, 0.10), transparent 60%),
    radial-gradient(90% 60% at 100% 0%, rgba(77, 117, 195, 0.07), transparent 55%),
    radial-gradient(140% 90% at 50% 120%, rgba(0, 0, 0, 0.6), transparent 60%);
  --dl-tex-sunburst: repeating-conic-gradient(from 0deg at 50% 100%, rgba(226, 189, 116, 0.07) 0deg 3deg, transparent 3deg 9deg);
  --dl-tex-paper: linear-gradient(180deg, #2a251d, #1f1b15);

  /* ---------- Neutral anchors and chrome (used by component tints) ---------- */
  --dl-black: #000000;
  --dl-white: #ffffff;
  --dl-nav-top: #14130f;
  --dl-nav-bottom: #0d0e0b;
  --dl-brass-edge: #6d5128;
  --dl-rank-0-trim: #5a5a5a;

  /* ---------- Semantic aliases (prefer these in components and charts) ---------- */
  --dl-team-0: var(--dl-amber);               /* team 0 = Amber Hand */
  --dl-team-0-bright: var(--dl-amber-bright);
  --dl-team-1: var(--dl-sapphire);            /* team 1 = Sapphire Flame */
  --dl-team-1-bright: var(--dl-sapphire-bright);
  --dl-self: var(--dl-brass-bright);

  --dl-grade-a: var(--dl-pos);
  --dl-grade-b: var(--dl-vitality-light);
  --dl-grade-c: var(--dl-text);
  --dl-grade-d: var(--dl-warn);
  --dl-grade-f: var(--dl-neg);

  --dl-score-high: var(--dl-pos);             /* category score >= 60 */
  --dl-score-mid: var(--dl-text);
  --dl-score-low: var(--dl-neg);              /* category score < 45 */

  /* ---------- Charts (SVG reads these directly; canvas via read-theme.js) ---------- */
  --dl-chart-bg: var(--dl-surface-sunken);
  --dl-chart-grid: var(--dl-line);
  --dl-chart-grid-strong: var(--dl-line-strong);
  --dl-chart-axis: var(--dl-text-faint);
  --dl-chart-label: var(--dl-text-muted);
  --dl-chart-you: var(--dl-souls);
  --dl-chart-benchmark: var(--dl-brass-bright);
  --dl-chart-band: color-mix(in srgb, var(--dl-brass) 28%, transparent);
  --dl-chart-band-edge: var(--dl-brass-dim);
  --dl-chart-rank-band-mix: 16%;              /* opacity of rank-tier bands behind lines */
  --dl-chart-hatch: color-mix(in srgb, var(--dl-text) 16%, transparent);
  --dl-chart-line-width: 2px;
  --dl-chart-font-size: 10px;

  /* ---------- Minimap / replay canvas ---------- */
  --dl-map-bg: var(--dl-bg-ink);
  --dl-map-ally: var(--dl-sapphire-bright);
  --dl-map-enemy: var(--dl-amber);
  --dl-map-self: var(--dl-brass-bright);
  --dl-map-memory: var(--dl-text-silver);
  --dl-map-objective: var(--dl-gold);
  --dl-map-death: var(--dl-neg);
}