/* =========================================================
   RETTESNOR — Iversen Web design tokens
   Manual REV 1.0 · build tokens REV 1.0

   Alt måles fra én linje.

   Two families. Two weights. No serif. No bold.
   Colour is either material or notation, never mood.
   Space is named after the scale of the thing it separates.
   ========================================================= */

/* ---------- Type ---------- */

@font-face {
  font-family: "Plex Sans";
  src: url("assets/fonts/plex-sans-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Plex Sans";
  src: url("assets/fonts/plex-sans-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Plex Sans";
  src: url("assets/fonts/plex-sans-400-italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Plex Mono";
  src: url("assets/fonts/plex-mono-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Plex Mono";
  src: url("assets/fonts/plex-mono-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

:root {
  /* -------------------------------------------------------
     MATERIAL — hex baseline, upgraded to OKLCH below
     ------------------------------------------------------- */
  --papir: #f6f4f0;
  --papir-2: #ece9e3;
  --blyant: #d7d3cc;
  --stein: #aea9a2;
  --skifer: #6f7077;
  --grafitt: #26282d;
  --grafitt-dyp: #16181c;

  /* NOTASJON — the only saturated colour in the system */
  --rettelse: #c8401f;

  /* -------------------------------------------------------
     SEMANTIC ROLES
     Components reference these, never the material names.
     ------------------------------------------------------- */
  --flate: var(--papir);
  --flate-2: var(--papir-2);
  --flate-invers: var(--grafitt-dyp);

  --tekst: var(--grafitt);
  --tekst-2: var(--skifer);
  --tekst-invers: var(--papir);
  --tekst-invers-2: #a9adb6;

  --linje: var(--blyant);
  --linje-sterk: var(--grafitt);
  --linje-invers: rgb(255 255 255 / 0.14);

  --notasjon: var(--rettelse);
  --fokus: var(--grafitt);

  /* --stein is permitted for rules, ticks and disabled fills.
     It must never carry text: 2.6:1 against paper fails WCAG. */
  --inaktiv-flate: var(--stein);

  /* -------------------------------------------------------
     TYPOGRAPHY
     Six sizes. Two weights. Hierarchy comes from position.
     No heading exceeds 3.3x body.
     ------------------------------------------------------- */
  --sans: "Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "Plex Mono", ui-monospace, "SF Mono", "Consolas", monospace;

  --type-datum: 0.75rem;   /* 12px — sheet numbers, ticks, revisions */
  --type-note: 0.875rem;   /* 14px — labels, captions, marginalia */
  --type-body: 1.0625rem;  /* 17px — running text */
  --type-lead: 1.3125rem;  /* 21px — one standfirst per view */
  --type-title: 2rem;      /* 32px — room titles */
  --type-plate: 3.5rem;    /* 56px — one per page, no more */

  --vekt: 400;
  --vekt-medium: 500;

  --leding-tett: 1.02;
  --leding-tittel: 1.15;
  --leding-lead: 1.4;
  --leding-brod: 1.55;
  --leding-note: 1.5;
  --leding-datum: 1;

  --spor-datum: 0.1em;
  --spor-note: 0.02em;
  --spor-lead: -0.005em;
  --spor-tittel: -0.015em;
  --spor-plate: -0.025em;

  --mål-brod: 66ch;
  --mål-note: 48ch;

  /* -------------------------------------------------------
     SPACE — named for the scale of what it separates.
     No value off this scale. Ever.
     ------------------------------------------------------- */
  --fuge: 4px;      /* inside a junction */
  --kant: 8px;      /* label to its object */
  --felt: 16px;     /* within a block */
  --rom: 32px;      /* between blocks in a group */
  --sal: 64px;      /* between groups */
  --etasje: 112px;  /* between rooms */
  --tomt: 192px;    /* page head and foot, thresholds */

  /* -------------------------------------------------------
     SHEET & GRID
     Sheet sizes: A4 <=600 · A3 601-900 · A2 901-1280
                  A1 1281-1600 · A0 >1600
     ------------------------------------------------------- */
  --ark: 1360px;           /* sheet maximum width */
  --notasjonsmargin: 120px; /* reserved. content never enters.
                               sized to hold the longest register label
                               in tracked mono without overhang. */
  --kant-margin: clamp(20px, 4vw, 48px);
  --kolonner: 12;
  --renne: var(--rom);

  --hårfin: 1px;
  --datum-hoyde: 38vh;    /* gallery eye-line, A2 and up */

  /* -------------------------------------------------------
     MOTION — three primitives, nothing else.
     ------------------------------------------------------- */
  --tid-tilstand: 120ms;
  --tid-merke: 180ms;
  --tid-sett: 240ms;
  --tid-terskel: 400ms;

  --ease-sett: cubic-bezier(0.32, 0, 0.16, 1);
  --ease-tilstand: cubic-bezier(0.2, 0, 0, 1);
}

/* ---------- OKLCH upgrade (canonical values) ---------- */

@supports (color: oklch(96.5% 0.006 85)) {
  :root {
    --papir: oklch(96.5% 0.006 85);
    --papir-2: oklch(93% 0.008 85);
    --blyant: oklch(86% 0.008 85);
    --stein: oklch(72% 0.008 85);
    --skifer: oklch(52% 0.01 250);
    --grafitt: oklch(23% 0.01 250);
    --grafitt-dyp: oklch(15% 0.012 250);
    --rettelse: oklch(52% 0.185 32);

    --tekst-invers-2: oklch(74% 0.012 250);
    --linje-invers: oklch(100% 0 0 / 0.14);
  }
}

/* ---------- Nattplate ----------
   A true material inversion, used by the system for Snitt
   and thresholds. Not a user toggle.
   --notasjon holds its value across both states: that is what
   makes it read as notation rather than decoration. */

.nattplate {
  --flate: var(--grafitt-dyp);
  --flate-2: var(--grafitt);
  --tekst: var(--papir);
  --tekst-2: var(--tekst-invers-2);
  --linje: var(--linje-invers);
  --linje-sterk: var(--tekst-invers-2);
  --fokus: var(--papir);
}

/* ---------- Sheet A3 ---------- */

/* ---------- Sheet A0 ----------
   The sheet gains one step of display size, not a hero. */

@media (min-width: 1601px) {
  :root {
    --type-plate: 4rem;
  }
}

/* ---------- Sheet A3 ---------- */

@media (max-width: 900px) {
  :root {
    --type-plate: 2.5rem;
    --type-title: 1.625rem;

    --notasjonsmargin: 56px;
    --etasje: 88px;
    --tomt: 128px;
    --datum-hoyde: 300px;
  }
}

/* ---------- Sheet A4 ----------
   Space collapses down the scale, never off it.
   Type holds: 17px body is the floor on every sheet. */

@media (max-width: 600px) {
  :root {
    --type-plate: 2.125rem;
    --type-lead: 1.1875rem;

    --notasjonsmargin: 0px;
    --sal: 48px;
    --etasje: 64px;
    --tomt: 88px;
    --datum-hoyde: 200px;
  }
}