/* Luna design tokens. One set: every colour token carries its light and its
   dark value in one light-dark() pair, so a theme is a colour-scheme, not a
   second list (D-1). Dark is the default (the packet of 2026-11-09);
   `data-theme` on <html> or on any subtree overrides it: "light", "dark",
   or "auto" (follow the OS). Values are the design packet's, changed only
   where the contrast check failed (DECISIONS.md D2-6; `contrast.py`).
   Nothing here names a user, an area or a product. Area hues are slots
   (0-7) for an area with no emoji. */

:root { color-scheme: dark; }
[data-theme="dark"] { color-scheme: dark; }
[data-theme="light"] { color-scheme: light; }
[data-theme="auto"] { color-scheme: light dark; }

@font-face {
  font-family: "Inter";
  src: url("fonts/Inter.woff2") format("woff2"),
       url("../luna/clients/web/fonts/Inter.woff2") format("woff2");   /* the design pages, opened from disk */
  font-weight: 100 900; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Space Grotesk";
  src: url("fonts/SpaceGrotesk.woff2") format("woff2"),
       url("../luna/clients/web/fonts/SpaceGrotesk.woff2") format("woff2");   /* the design pages, opened from disk */
  font-weight: 300 700; font-style: normal; font-display: swap;
}

:root {
  /* ------------------------------------------------------------ colour: light, dark */
  --bg:            light-dark(#f5f6f8, #0e1014);
  --surface:       light-dark(#ffffff, #161920);
  --surface-2:     light-dark(#eceef2, #1f232d);   /* sunken: chips, menus, skeleton, current tab */
  --line:          light-dark(#dcdfe6, #2b303c);   /* hairlines between rows */
  --line-strong:   light-dark(#c3c8d2, #3a4050);   /* frames: tables, folds, menus, dashed empties */
  --line-control:  light-dark(#828997, #6b7386);   /* control edges (tick ring, input, chip, switch): 3:1 */
  --scrim:         light-dark(rgb(20 23 29 / 0.32), rgb(0 0 0 / 0.5));

  --text:          light-dark(#14171d, #eceef3);
  --text-2:        light-dark(#454c5a, #b1b8c6);   /* secondary */
  --text-3:        light-dark(#5e6676, #8f97a8);   /* muted: counts, labels, placeholders */

  --accent:        light-dark(#3346c2, #aebbff);   /* Luna's one colour: links, primary, focus, running */
  --accent-ink:    light-dark(#ffffff, #0e1014);   /* text on --accent */
  --accent-soft:   light-dark(rgb(51 70 194 / 0.10), rgb(174 187 255 / 0.14));
  --warn:          light-dark(#8a5300, #f2b766);   /* waiting on the owner; due soon */
  --warn-ink:      light-dark(#ffffff, #1a1206);
  --warn-soft:     light-dark(rgb(190 120 0 / 0.14), rgb(242 183 102 / 0.14));
  --danger:        light-dark(#b3261e, #ff9388);
  --danger-ink:    light-dark(#ffffff, #1c0a08);
  --danger-soft:   light-dark(rgb(179 38 30 / 0.10), rgb(255 147 136 / 0.14));
  --ok:            light-dark(#1b6e4f, #7fd4a8);   /* done */
  --ok-soft:       light-dark(rgb(27 110 79 / 0.10), rgb(127 212 168 / 0.14));
  --info:          var(--accent);                  /* Engine Room metrics only: ok, warn, danger, info */
  --info-soft:     var(--accent-soft);

  /* area hue slots: the dot of an area whose owner.md carries no emoji */
  --hue-0: light-dark(#3346c2, #aebbff);
  --hue-1: light-dark(#1b6e4f, #7fd4a8);
  --hue-2: light-dark(#a35a00, #f2b766);
  --hue-3: light-dark(#7a3fb4, #c9a6f2);
  --hue-4: light-dark(#b3261e, #ff9388);
  --hue-5: light-dark(#0b6f7a, #6fd0da);
  --hue-6: light-dark(#5e6676, #b1b8c6);
  --hue-7: light-dark(#a8326a, #f59ac4);

  /* ------------------------------------------------------------ type */
  --font-text: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-head: "Space Grotesk", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --font-emoji: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif;
  --fs-xs:  0.75rem;    /* 12: pills, counts, table heads */
  --fs-sm:  0.8125rem;  /* 13: secondary, section titles */
  --fs-md:  0.9375rem;  /* 15: rows, cards, body */
  --fs-lg:  1.0625rem;  /* 17: card titles, the dump box */
  --fs-xl:  1.375rem;   /* 22: the brand, prose headings */
  --fs-2xl: 1.75rem;    /* 28: page titles */
  --fs-num: 2.25rem;    /* 36: tile numbers */
  --lh-tight: 1.2;
  --lh-text: 1.45;

  /* ------------------------------------------------------------ space (4 px steps) */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;

  /* ------------------------------------------------------------ size */
  --tap: 44px;          /* the smallest thing a thumb is asked to hit (56 on floor) */
  --rail-w: 264px;      /* the tab column */
  --rail-mini: 60px;    /* the mini column */
  --dump-w: 300px;      /* the dump right rail, on every wide page of the owner's app */
  --dump-fold: 44px;    /* the dump rail folded to its edge */
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-top: env(safe-area-inset-top, 0px);         /* the notch or the status bar */
  --safe-left: env(safe-area-inset-left, 0px);       /* landscape: the notch side, a rounded corner */
  --safe-right: env(safe-area-inset-right, 0px);

  /* ------------------------------------------------------------ radius */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 16px;
  --r-pill: 999px;

  /* ------------------------------------------------------------ elevation: row, menu and composer, toast and sheet */
  --e-1: 0 1px 0 light-dark(rgb(20 23 29 / 0.06), rgb(0 0 0 / 0.4));
  --e-2: 0 8px 24px light-dark(rgb(20 23 29 / 0.10), rgb(0 0 0 / 0.45));
  --e-3: 0 16px 48px light-dark(rgb(20 23 29 / 0.16), rgb(0 0 0 / 0.55));

  /* ------------------------------------------------------------ motion */
  --t-fast: 120ms;
  --t-med: 220ms;
  --t-slow: 420ms;
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --pulse: 1.6s;        /* the running glyph and the status line; the only loop besides the companion */
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: 0ms; --t-med: 0ms; --t-slow: 0ms; }
}

/* Floor density: team pages on a warehouse floor (gloves, glare, a glance). */
[data-density="floor"] {
  --tap: 56px;
  --fs-md: 1.0625rem;
  --fs-lg: 1.1875rem;
  --text-3: var(--text-2);
}

/* cards */
/* The hues a card kind may name (cards.yaml `hue`): the chip's ink and edge, and its soft ground. */
:root {
  --kind-red:         light-dark(#b3261e, #ff9388);
  --kind-red-soft:    light-dark(rgb(179 38 30 / 0.10), rgb(255 147 136 / 0.14));
  --kind-amber:       light-dark(#8a5300, #f2b766);
  --kind-amber-soft:  light-dark(rgb(190 120 0 / 0.14), rgb(242 183 102 / 0.14));
  --kind-green:       light-dark(#1b6e4f, #7fd4a8);
  --kind-green-soft:  light-dark(rgb(27 110 79 / 0.10), rgb(127 212 168 / 0.14));
  --kind-blue:        light-dark(#3346c2, #aebbff);
  --kind-blue-soft:   light-dark(rgb(51 70 194 / 0.10), rgb(174 187 255 / 0.14));
  --kind-violet:      light-dark(#7a3fb4, #c9a6f2);
  --kind-violet-soft: light-dark(rgb(122 63 180 / 0.10), rgb(201 166 242 / 0.14));
  --kind-grey:        light-dark(#5e6676, #b1b8c6);
  --kind-grey-soft:   light-dark(rgb(94 102 118 / 0.12), rgb(177 184 198 / 0.14));
}