/* Mapixa Desk — design tokens v2 (13.10.2026, MAPIXA-DESK-V2-PLAN §2 and §10 P5). The one source of colour, type,
   density, radius and motion; every component in styles.css reads these names (README «Brand» has both tables).
   Art direction «sunrise 3» (14.10., the founder: «teplý atrament je príjemný, premium feel; ale nápis MAPIXA mi príde
   bielo-oranžový fádny; žlté tlačidlá sú veľmi rušivé … nezabudni na light theme; nech to je ako od profi dizajnovej
   firmy»). Two themes, one brand:
   - DARK (default) = the minute before sunrise: a WARM INK ground (aubergine, red bias, oklch hue 333 -> 350); the
     sun lives in the badge (flat stripes, brand/mark.svg), the header's horizon (a 1-px warm line and the dawn rising
     from it), the amber of SOL and the wordmark, whose warm-white letters are lit from below by the pale sun.
   - LIGHT («svitanie na papieri», `#light` -> <html data-theme="light">) = the same dawn on warm paper, designed and
     not inverted: ink letters, warm hairlines, every accent one step darker to read on paper, amber #ffb020 only as a
     fill under ink text, the dawn a soft warm band under the header. The badge never changes.
   Quiet controls: a button is ink (surface-2) with a 1-px line; the solid amber button exists once, on the login wall.
   One light source (the sun below the horizon): light rises from below or glows from behind; no drop shadow from
   above. Colour is meaning: green / red = money direction only (always with a sign or an arrow); data age = pale sun
   (fresh), coral (slow), a hollow magenta ring (stale), always with the word; a refusal is neutral purple-grey; real
   money = a solid tag in the inverse of the ground («naživo»), absent on paper. Contrast: every ink >= 4.5 : 1 on
   every ground of its theme, every chart mark >= 3 : 1 (test_web_static). */
:root {
  color-scheme: dark;

  /* ground and surfaces: the warm ink (oklch L 15.5 -> 38 %, chroma .026 -> .05, hue 333 -> 350); each step up is
     lighter and a little warmer, the lines lean to magenta */
  --bg: #130811;           /* oklch(15.5% .026 333): the page */
  --bg-2: #170b14;         /* wells: inputs, the DexScreener frame */
  --surface: #1d101a;      /* cards (1.07 : 1 over the page) */
  --surface-2: #291823;    /* raised: buttons, popovers, source rows, chips */
  --line: #3c2431;         /* card borders, row rules (1 px, always) */
  --line-2: #573746;       /* secondary chrome: outlines of tags, fields, chips, kbd, tracks */

  /* ink: a warm white and two mauve greys; fg 16.1, muted 9.3, faint 5.9 : 1 on a card (>= 5.4 on every ground) */
  --fg: #f4efeb;
  --muted: #c3b4bd;
  --faint: #a08d99;

  /* the sunrise (the logo's stripes; the badge itself is brand/mark.svg) */
  --brand-a: #e84a8a;      /* magenta stripe: our own events (fills on charts, ticks on sparks), the hot row */
  --brand-b: #ffb020;      /* amber stripe: THE accent as text and line (active, focus, links, LIVE) and SOL in / SOL now */
  --brand-a-2: #f48fb8;    /* magenta tint: the coach's word (8.3 : 1) */
  --brand-a-3: #b8336f;    /* deep magenta */
  --brand-b-2: #ffd36a;    /* pale sun: hover text, the «skúšame» tag */
  --coral: #ff7a4a;        /* coral stripe: the selection bar, a fall, the slow age */
  --sun: #ffb020;          /* amber as a FILL, always under ink text (--on-sun): the wall's button, the chart's now-tag */
  --sun-2: #ff7a4a;        /* the fill's hover (coral) */
  --on-sun: #170913;       /* ink on --sun / --sun-2 / pale sun (10.6 / 7.5 / 13.6 : 1) */
  --sol: var(--brand-b);   /* SOL in and SOL now: the only numbers set in the sun's amber (net keeps the money colour) */
  --chart: #ffb020;        /* chart and spark lines, the now dot (a mark: >= 3 : 1 on every ground) */
  --area: .07;             /* the flat area under a spark / book path (the coin chart fades --area-top -> 0) */
  --area-top: .1;
  --score: #ffd36a;        /* the rank panel's score bars */

  /* the wordmark: the logo's lowercase «mapixa», the x in the logo's coral; on the ink its warm-white letters are lit
     from below (35 % pale sun at the baseline -> warm white at the cap height, in oklab; the stops are in em of a
     line box exactly as tall as Hanken Grotesk's content area: baseline .3 em above its bottom, cap height .7 em) */
  --wm-x: #ff7a4a;
  --wm-lit: color-mix(in oklab, var(--brand-b-2) 35%, var(--fg));
  --wordmark: linear-gradient(to top in oklab, var(--wm-lit) .3em, var(--fg) 1em);

  /* the horizon: a 1-px warm line under the header (and the coin card's top edge), brightest at the middle where the
     sun comes up. The dawn: that sun's light in the header's sky, rising from the horizon (a bloom of 20 % amber
     hugging the line + a wide haze of 6 %); on a phone the bloom is wide and flat, so it still reads as a horizon.
     It never falls on a card or a number */
  --horizon: linear-gradient(90deg in oklab, var(--line) 2%, color-mix(in oklab, var(--brand-b) 62%, var(--line)) 50%, var(--line) 98%);
  --dawn: radial-gradient(26% 2.9rem at 50% 100%, color-mix(in oklab, var(--sun) 20%, transparent), transparent),
          radial-gradient(52% 6rem at 50% 100%, color-mix(in oklab, var(--sun) 6%, transparent), transparent 80%);
  --dawn-wide: radial-gradient(64% 1.7rem at 50% 100%, color-mix(in oklab, var(--sun) 18%, transparent), transparent),
               radial-gradient(110% 3.4rem at 50% 100%, color-mix(in oklab, var(--sun) 6%, transparent), transparent 80%);
  --glow: radial-gradient(closest-side, color-mix(in oklab, var(--sun) 12%, transparent), color-mix(in oklab, var(--sun) 4%, transparent) 55%, transparent);
  --scrim: rgb(8 3 7 / .76);   /* the backdrop behind the coin card */

  /* money direction: text and marks, always with a sign or an arrow; nothing else is ever green or red */
  --pos: #3ddc97;
  --neg: #ff5a6e;
  /* REAL money only (the header's solid «naživo» tag, its text --bg); never on a paper screen */
  --live: #ffffff;
  /* a refusal (the NIE chip, the × of a refused call, a failed shield): neutral purple-grey, never the money red */
  --nie: #8d819e;

  /* data age (the one-second rule): fresh / slow / stale = the sun going down; stale is a hollow ring */
  --fresh: #ffd36a;
  --slow: #ff7a4a;
  --stale: #ee5794;        /* the badge magenta lifted to read on every surface (5.1 : 1 on --surface-2) */

  /* identity: one hue per book, drawn as an outline next to the word «papier» */
  --book-runner: #ffb020;              /* amber */
  --book-trend: #ff7a4a;               /* coral */
  --book-trending_small: var(--book-trend);   /* the API's book id */
  --book-twin: #a4979f;                /* a warm grey (6.6 : 1 on a card) */

  /* verdict ramp (ordinal, one hue: A strongest) */
  --v-a: #f4efeb;
  --v-b: #c3b4bd;
  --v-c: #7a6773;
  --v-nie: #4f3945;

  /* interaction: amber is active and focus, coral is selection */
  --focus: #ffb020;
  --select: #ff7a4a;
  --ring: 0 0 0 2px var(--bg), 0 0 0 4px var(--focus);
  --tick-up: #ffd36a;      /* a live number that just rose flashes pale sun ... */
  --tick-down: #ff7a4a;    /* ... one that fell flashes coral (300 ms) */

  /* buttons: quiet ink. primary = a 1-px amber line that brightens on hover (amber text only for the one primary
     action of a card: .btn.lead); secondary = the plain line; destructive = a magenta line; never a glow. Heights by
     density tier: 32 (in a table), 36 (default), 40 (a phone, a form) */
  --btn-bg: var(--surface-2);
  --btn-bg-down: var(--surface);
  --btn-line: var(--line-2);
  --btn-line-primary: color-mix(in oklab, var(--brand-b) 55%, var(--line-2));
  --btn-line-hover: var(--brand-b);
  --btn-line-danger: color-mix(in oklab, var(--brand-a) 70%, var(--line-2));
  --btn-h-sm: 32px;
  --btn-h: 36px;
  --btn-h-lg: 40px;

  /* type (self-hosted, fonts/fonts.css) */
  --display: "Big Shoulders Display", "Arial Narrow", "Roboto Condensed", sans-serif;   /* display numbers, card titles */
  --body: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;   /* text and the wordmark */
  --mono: "Martian Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;          /* times, mints, table figures */
  --lh: 1.25;                                           /* line height everywhere (SDS P0-1) */
  /* type scale in rem; the root is fluid (styles.css): 15 px phone, ~15.5 px desktop, 16 px on the 4K wall
     (3840 px = 240 rem: about 0.6x of the v1 wall's body, SDS P0-1) */
  --fs-hero: 3.1rem;
  --fs-big: 2.15rem;
  --fs-xl: 1.5rem;
  --fs-lg: 1.08rem;
  --fs-md: .9rem;          /* body */
  --fs-sm: .8rem;
  --fs-xs: .7rem;
  --fs-2xs: .62rem;

  /* density (SDS P0-1): card padding 16 px and gap 12 px at the 16-px root of the 4K wall */
  --pad: 1rem;
  --gap: .75rem;
  --row: .42rem;           /* vertical padding of a list row */
  /* three radii, no others: 2 px for marks, tags and chips (crisp, an instrument's labels) / 8 px for cards, buttons,
     fields, tiles and popovers / a pill for the LIVE pill, the book chips, the selects and the SOL chip */
  --r-xs: 2px;
  --r: .5rem;
  --r-pill: 999px;
  --r-btn: var(--r);
  --hair: 1px;             /* every line and outline; a 2-px ring is the focus alone */
  --dot: .5rem;            /* the LIVE dot, the data-age dot and the book dot: one size */
  --logo-row: 1.5rem;      /* coin logos: 20-28 px in rows ... */
  --logo-card: 2.75rem;    /* ... 44 px on cards */
  /* motion: short and ease-out; prefers-reduced-motion turns it off (styles.css) */
  --t-fast: 120ms;
  --t: 160ms;
  --ease: cubic-bezier(.22, .61, .36, 1);
  /* one light source (the sun below the horizon): a raised layer is lifted by an even, unoffset shade, never by a
     drop shadow cast from above */
  --shadow: 0 0 2.2rem rgba(4, 1, 3, .62);
}

/* LIGHT «svitanie na papieri»: warm paper, ink letters, the same meanings one step darker. Every ink >= 4.5 : 1 on
   all four grounds, chart marks >= 3 : 1; amber as text is the burnt amber #9a5704, #ffb020 only fills under ink. */
:root[data-theme="light"] {
  color-scheme: light;

  --bg: #f6f0ea;           /* oklch(95.8% .010 68): warm paper */
  --bg-2: #f0e8e1;         /* wells: inputs, frames (a step into the paper) */
  --surface: #fbf7f3;      /* cards */
  --surface-2: #ffffff;    /* raised: buttons, popovers, chips */
  --line: #e7dcd3;         /* warm hairlines */
  --line-2: #d0c0b5;       /* outlines of tags, fields, chips, tracks */

  --fg: #1d101a;           /* ink: 17.3 : 1 on a card */
  --muted: #5e4e58;        /* 6.4 : 1 at worst */
  --faint: #74636e;        /* 4.6 : 1 at worst */

  --brand-a: #b23c6e;      /* magenta, one step darker */
  --brand-b: #9a5704;      /* burnt amber: the accent as text and line (4.6 : 1 at worst) */
  --brand-a-2: #993664;
  --brand-a-3: #832151;
  --brand-b-2: #834701;    /* hover text: a step deeper into the amber */
  --coral: #b1461b;
  --sun: #ffb020;
  --sun-2: #ff7a4a;
  --on-sun: #170913;
  --chart: #b97005;        /* the amber line on paper (3.2 : 1 at worst) */
  --area: .1;
  --area-top: .1;
  --score: #b97005;

  --wm-x: #ff7a4a;         /* the logo on white: ink letters, the coral x */
  --wm-lit: var(--fg);     /* no light from below on paper: the letters are flat ink */

  --horizon: linear-gradient(90deg in oklab, var(--line) 2%, color-mix(in oklab, var(--sun) 80%, var(--line)) 50%, var(--line) 98%);
  /* the dawn on paper: a soft warm band under the header, warmest at the middle */
  --dawn: radial-gradient(48% 2.4rem at 50% 100%, color-mix(in oklab, var(--sun) 16%, transparent), transparent),
          linear-gradient(to top, color-mix(in oklab, var(--sun) 8%, transparent), transparent 2.6rem);
  --dawn-wide: radial-gradient(80% 1.6rem at 50% 100%, color-mix(in oklab, var(--sun) 15%, transparent), transparent),
               linear-gradient(to top, color-mix(in oklab, var(--sun) 7%, transparent), transparent 2.2rem);
  --glow: radial-gradient(closest-side, color-mix(in oklab, var(--sun) 10%, transparent), color-mix(in oklab, var(--sun) 3%, transparent) 55%, transparent);
  --scrim: rgb(52 30 42 / .34);

  --pos: #057749;
  --neg: #c02f44;
  --live: #1d101a;         /* real money on paper: the solid ink tag */
  --nie: #71637a;

  --fresh: #816403;        /* the sun on paper: gold */
  --slow: #b1461b;         /* coral, darker */
  --stale: #b0306f;        /* magenta, darker, a hollow ring */

  --book-runner: #ba7001;
  --book-trend: #ce6038;
  --book-twin: #8a7d85;

  --v-a: #1d101a;
  --v-b: #6f5f69;
  --v-c: #a99aa3;
  --v-nie: #ddd1c9;

  --focus: #9a5704;
  --select: #b1461b;
  --tick-up: #816403;
  --tick-down: #b1461b;

  --btn-line-primary: color-mix(in oklab, var(--brand-b) 60%, var(--line-2));

  --shadow: 0 0 1.8rem rgba(84, 52, 60, .16);
}
