/* Copied from brand/tokens.css (embed cannot reach outside this package). Keep in sync. */
/* upkeeper design tokens · v2 "terminal" (dark-first)
 * Fonts (Google Fonts):
 * <link rel="preconnect" href="https://fonts.googleapis.com">
 * <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
 * <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;700&family=Schibsted+Grotesk:wght@400;500;600;700&display=swap" rel="stylesheet">
 *
 * Dark is the default and the hero. Light applies under prefers-color-scheme: light.
 * Every text/background pair listed in BRAND.md passes WCAG 2.2 AA (4.5:1) in both modes.
 */

:root {
  color-scheme: dark light;

  /* ---- Colour: dark (default) ---- */
  --uk-bg: #0A0D0C;            /* graphite, page background */
  --uk-surface: #111614;       /* cards, panels, terminal windows */
  --uk-sunk: #060807;          /* log wells, code */
  --uk-line: #1F2824;          /* hairlines (decorative) */
  --uk-line-strong: #5B6862;   /* input borders, UI outlines (3:1+) */

  --uk-ink: #E8EDE9;           /* text 16.5:1 on bg */
  --uk-muted: #95A19B;         /* secondary text 7.3:1 */

  --uk-signal: #B4FF3C;        /* signature neon lime: brand, links, "all good"  16.1:1 */
  --uk-signal-tint: #101C0A;
  --uk-flare: #FFB547;         /* secondary neon amber: rolled back, waiting for you  11.1:1 */
  --uk-flare-tint: #2A1E0A;
  --uk-fault: #FF7A6B;         /* failed, needs you  7.7:1 */
  --uk-fault-tint: #2C1411;

  --uk-btn-bg: #B4FF3C;        /* primary button */
  --uk-btn-fg: #0A0D0C;        /* 16.1:1 */
  --uk-focus: #B4FF3C;

  /* Glow: only on the loop's active step, status dots, focus rings and the mark */
  --uk-glow-signal: 0 0 0 1px rgba(180, 255, 60, 0.55), 0 0 24px -4px rgba(180, 255, 60, 0.45);
  --uk-glow-flare: 0 0 0 1px rgba(255, 181, 71, 0.55), 0 0 24px -4px rgba(255, 181, 71, 0.45);
  --uk-glow-dot: 0 0 8px rgba(180, 255, 60, 0.8);
  --uk-shadow: 0 1px 0 rgba(0, 0, 0, 0.4), 0 16px 40px -16px rgba(0, 0, 0, 0.8);

  /* ---- Type ---- */
  --uk-font-sans: "Schibsted Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --uk-font-mono: "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;

  --uk-text-xs: 0.8125rem;
  --uk-text-sm: 0.9375rem;
  --uk-text-md: 1.0625rem;
  --uk-text-lg: 1.25rem;
  --uk-text-xl: 1.625rem;
  --uk-text-2xl: clamp(1.75rem, 1.2rem + 2.4vw, 2.5rem);
  --uk-text-3xl: clamp(2.375rem, 1.4rem + 4.6vw, 4.25rem);

  --uk-leading-tight: 1.05;
  --uk-leading-body: 1.55;
  --uk-tracking-tight: -0.03em;
  --uk-tracking-label: 0.08em;

  /* ---- Space (4px base) ---- */
  --uk-space-1: 0.25rem;
  --uk-space-2: 0.5rem;
  --uk-space-3: 0.75rem;
  --uk-space-4: 1rem;
  --uk-space-5: 1.5rem;
  --uk-space-6: 2rem;
  --uk-space-7: 3rem;
  --uk-space-8: 4.5rem;
  --uk-space-9: 7rem;
  --uk-gutter: 1rem;
  --uk-container: 72rem;

  /* ---- Radii ---- */
  --uk-radius-sm: 4px;
  --uk-radius-md: 8px;
  --uk-radius-lg: 12px;
  --uk-radius-pill: 999px;

  /* ---- Motion ---- */
  --uk-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --uk-dur-fast: 120ms;
  --uk-dur: 240ms;
  --uk-loop-step: 1.6s;
}

@media (prefers-color-scheme: light) {
  :root {
    --uk-bg: #F3F5F1;
    --uk-surface: #FFFFFF;
    --uk-sunk: #E7EBE5;
    --uk-line: #D6DBD4;
    --uk-line-strong: #848F89;

    --uk-ink: #0D1210;         /* 17.2:1 */
    --uk-muted: #4C5751;       /* 6.9:1 */

    --uk-signal: #2F6E00;      /* lime darkened for text on light  5.7:1 */
    --uk-signal-tint: #E6F6D2;
    --uk-flare: #8A4F00;       /* 6.0:1 */
    --uk-flare-tint: #F8E8CB;
    --uk-fault: #B0321E;       /* 5.8:1 */
    --uk-fault-tint: #F8E0DA;

    --uk-btn-bg: #0D1210;      /* light mode keeps the terminal: ink button, neon label */
    --uk-btn-fg: #B4FF3C;      /* 15.6:1 */
    --uk-focus: #2F6E00;

    /* No glows on light: solid outlines instead */
    --uk-glow-signal: 0 0 0 1.5px #2F6E00;
    --uk-glow-flare: 0 0 0 1.5px #8A4F00;
    --uk-glow-dot: none;
    --uk-shadow: 0 1px 0 rgba(13, 18, 16, 0.04), 0 10px 30px -14px rgba(13, 18, 16, 0.22);
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --uk-dur-fast: 0ms;
    --uk-dur: 0ms;
  }
}
