/**
 * AKAVA design tokens — the single source of truth.
 *
 * RULES
 * 1. Every colour, radius, shadow, font and z-index used by the site chrome
 *    and the internal pages is declared here and nowhere else.
 * 2. Other stylesheets must reference var(--ak-*). No raw hex outside this file
 *    (the exception is documented below).
 * 3. Product landings (botbut, scrolltop, media-finder, leadite) intentionally
 *    look different. They keep their OWN scoped palettes declared at the top of
 *    their own file, e.g. `.botbut-page { --bb-bg: ...; }`. That is deliberate
 *    variety, not a violation — just keep each palette in one block per file.
 *
 * Loaded first, before every other stylesheet.
 */

:root {
  color-scheme: dark;

  /* ---- Surfaces ---- */
  --ak-bg: #0c0e0d;
  --ak-bg-deep: #090b0a;
  --ak-bg-black: #020604;
  --ak-surface: #131715;
  --ak-surface-2: #1b201d;
  --ak-surface-3: #18201b;

  /* ---- Text ---- */
  --ak-text: #edf5ef;
  --ak-text-bright: #ffffff;
  --ak-muted: #9baa9f;
  --ak-soft: #6f7e74;
  --ak-dim: #c9d0ca;

  /* ---- Lines ---- */
  --ak-border: #303a33;
  --ak-border-strong: #4b5a50;
  --ak-border-soft: #344139;

  /* ---- Brand / status ---- */
  --ak-primary: #00f06a;
  --ak-primary-deep: #087443;
  --ak-accent: #ff8a2b;
  --ak-error: #ff5d67;

  /* ---- Terminal palette (console, lab, resume, life) ----
     Deliberately a purer green than --ak-primary: this is the CRT look. */
  --ak-term-green: #00ff00;
  --ak-term-green-soft: #8dffad;
  --ak-term-green-bright: #00ff62;
  --ak-term-amber: #ff8000;
  --ak-term-grey: #3f4b40;
  --ak-term-panel: #282828;

  /* ---- Translucent overlays ---- */
  --ak-glass: rgba(8, 11, 9, 0.88);
  --ak-glass-solid: rgba(7, 10, 8, 0.96);
  --ak-panel-solid: rgba(10, 14, 11, 0.99);
  --ak-veil: rgba(0, 0, 0, 0.7);
  --ak-tint: rgba(0, 240, 106, 0.04);
  --ak-tint-strong: rgba(0, 240, 106, 0.2);

  /* ---- Layout ---- */
  --ak-page: min(1240px, calc(100% - 40px));
  --ak-reading: min(760px, calc(100% - 40px));
  --ak-radius-sm: 6px;
  --ak-radius-md: 14px;
  --ak-shadow-hard: 8px 8px 0 rgba(0, 0, 0, 0.46);
  --ak-shadow-soft: 0 12px 35px rgba(0, 0, 0, 0.25);

  /* ---- Type ---- */
  --ak-font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  --ak-font-sans: Inter, "Noto Sans Hebrew", "Arial Hebrew", Arial, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ak-step--1: clamp(0.82rem, 0.79rem + 0.12vw, 0.9rem);
  --ak-step-0: clamp(1rem, 0.96rem + 0.2vw, 1.12rem);
  --ak-step-1: clamp(1.2rem, 1.08rem + 0.58vw, 1.55rem);
  --ak-step-2: clamp(1.55rem, 1.24rem + 1.5vw, 2.35rem);
  --ak-step-3: clamp(2.1rem, 1.42rem + 3.2vw, 4rem);
  --ak-step-4: clamp(3.15rem, 1.6rem + 7vw, 7.7rem);

  /* ---- Stacking order ----
     Documented so nothing invents a new number. The mobile drawer lives INSIDE
     the nav's stacking context, so its own z-index is local to the nav; the
     veil must stay BELOW --ak-z-nav or it would cover the open drawer. */
  --ak-z-veil: 900;
  --ak-z-nav: 1000;
  --ak-z-drawer: 10;
}

/*
 * Breakpoints — only these three exist. Do not invent new ones, and do not add
 * a second @media block for one that already exists in a file.
 *   900px  tablet / mobile nav
 *   680px  phone
 *   430px  small phone
 */
@media (max-width: 900px) {
  :root {
    --ak-page: min(100% - 28px, 1240px);
    --ak-reading: min(100% - 28px, 760px);
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --ak-motion: none;
  }
}