/* ════════════════════════════════════════════════════════════
   ARTUR'S LAB. TOKENS

   The palette comes from how a board is actually made: solder
   mask green, ENIG gold pads, fibreglass substrate. Nothing
   here was picked because it looked nice in isolation.

   Load order: tokens.css → base.css → app.css
   ════════════════════════════════════════════════════════════ */

:root{

  /* ── Surface ──────────────────────────────────────────────── */
  --paper:   #F5F6F3;   /* page. Cool paper with a faint green cast */
  --card:    #FFFFFF;   /* panels, cards, sheets                     */
  --sunk:    #EDEEE9;   /* inset wells, code gutters, empty states   */

  /* ── Ink ──────────────────────────────────────────────────── */
  --ink:     #10130F;   /* primary text                              */
  --ink-2:   #5B6159;   /* secondary + metadata: 5.87:1, AA         */
  --rule:    #DCDFD7;   /* hairlines                                 */
  --rule-2:  #C6CABF;   /* stronger dividers, input borders          */

  /* ── Brand ────────────────────────────────────────────────── */
  --mask:    #0D6B45;   /* solder mask green, the brand, 6.04:1    */
  --mask-2:  #0A5637;   /* pressed / hover                           */
  --mask-lo: #E6F0EA;   /* tint for fills behind mask-coloured text  */
  --on-mask: #FFFFFF;   /* text that sits on top of mask green       */

  /* ── Signal ───────────────────────────────────────────────────
     Three states, three colours, used for nothing else ever.
     --pad marks an approved project and a used GPIO pin.
     --flag marks anything waiting on Artur or sent back.
     ─────────────────────────────────────────────────────────────── */
  --pad:     #8A6114;   /* ENIG gold, text-safe: 5.09:1             */
  --pad-lit: #D9A62B;   /* bright gold. FILLS ONLY, never text      */
  --pad-lo:  #FAF1DC;   /* gold tint                                 */
  --flag:    #A8321E;   /* pending / changes requested: 6.17:1      */
  --flag-2:  #8E2818;   /* pressed / hover                           */
  --flag-lo: #FBEAE6;   /* flag tint                                 */
  --on-flag: #FFFFFF;   /* text that sits on top of flag red         */

  /* ── Console ──────────────────────────────────────────────────
     The one dark surface on the site: code and serial output.
     A terminal is dark because a terminal is dark.
     ─────────────────────────────────────────────────────────────── */
  --term:    #12151A;
  --term-2:  #1B1F26;
  --term-ink:#DDE3DC;
  --term-dim:#79837A;

  /* ── Typefaces ────────────────────────────────────────────────
     Archivo:        headings. Industrial grotesque, tight and plain.
     Public Sans:    body. Built for dense public-service UI.
     JetBrains Mono: code, part numbers, pin labels, and every
                     piece of hardware metadata. The font people
                     actually set their editor to.
     ─────────────────────────────────────────────────────────────── */
  --display: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --body:    "Public Sans", "Helvetica Neue", Arial, sans-serif;
  --mono:    "JetBrains Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  /* ── Type scale ───────────────────────────────────────────── */
  --t-hero:  clamp(2.25rem, 1.4rem + 3.6vw, 4rem);
  --t-h2:    clamp(1.375rem, 1.2rem + 0.8vw, 1.875rem);
  --t-h3:    clamp(1.0625rem, 1rem + 0.35vw, 1.25rem);
  --t-body:  0.9375rem;
  --t-sm:    0.875rem;
  --t-mono:  0.6875rem;   /* 11px: labels, tags, designators */
  --t-code:  0.8125rem;   /* 13px: code blocks               */

  /* ── Space ────────────────────────────────────────────────── */
  --gutter:  clamp(1rem, 3vw, 2rem);
  --gap:     1.25rem;
  --rail:    216px;   /* left nav width, desktop  */
  --index:   248px;   /* right index width, wide  */
  --bar:     56px;    /* top bar height           */
  --tabbar:  60px;    /* mobile bottom nav height */

  --feed:    600px;   /* the reading column, one post wide */

  /* ── Form ─────────────────────────────────────────────────── */
  --r:       3px;     /* corner radius. Boards are square. Stay near 0. */
  --r-card:  10px;    /* the one exception: post and sheet corners  */
  --ease:    cubic-bezier(.2, .8, .3, 1);

  /* ── Avatar ring ──────────────────────────────────────────────
     A gradient ring around every avatar, borrowed from the
     stories row it sits above. The gradient is not decoration
     picked from a swatch. It runs ENIG gold to solder mask,
     the two colours already doing work everywhere else.
     ─────────────────────────────────────────────────────────────── */
  --ring:    linear-gradient(135deg, #D9A62B, #8A6114 45%, #0D6B45);
  --ring-off: linear-gradient(135deg, var(--rule-2), var(--rule));

  /* Scrims and hairlines that sit on top of artwork rather than
     on a surface, so they are defined as ink rather than as a
     colour and have to flip with the theme. */
  --grid:    rgba(16, 19, 15, .05);   /* the plate's fibreglass weave */
  --scrim:   rgba(16, 19, 15, .55);   /* overlay on a photo           */
  --scrim-2: rgba(16, 19, 15, .50);   /* behind a modal               */

  color-scheme: light;
}


/* ════════════════════════════════════════════════════════════
   DARK

   Not the light theme with the lightness inverted. Light is the
   paper a schematic gets printed on. Dark is the board itself,
   FR4 under the mask, which is why the background keeps the
   green bias instead of going neutral grey.

   Mask green and ENIG gold both get lifted. The values that read
   as AA on paper turn to mud on a dark surface, so every pair
   below was checked again rather than reused.
   ════════════════════════════════════════════════════════════ */

[data-theme="dark"]{
  --paper:   #0E110D;   /* substrate                                */
  --card:    #161A15;   /* panels, cards, sheets                    */
  --sunk:    #1C201B;   /* wells, gutters, empty states             */

  --ink:     #E9ECE6;   /* primary text: 15.9:1 on paper           */
  --ink-2:   #A2A99D;   /* secondary: 7.3:1 on card, 7.9 on paper  */
  --rule:    #282D26;
  --rule-2:  #3C4239;

  --mask:    #45C88C;   /* lifted solder mask: 8.3:1 on card       */
  --mask-2:  #63D9A2;
  --mask-lo: #13251C;
  /* Bright green needs dark text on it, not white. White on
     #45C88C is 2.4:1 and unreadable. */
  --on-mask: #08120D;

  --pad:     #E3B851;   /* lifted ENIG: 9.4:1 on card              */
  --pad-lit: #F5CB60;   /* fills only, never text                   */
  --pad-lo:  #2A2214;
  --flag:    #FF8570;   /* lifted: 7.4:1 on card                   */
  --flag-2:  #FF9E8D;
  --flag-lo: #2E1913;
  --on-flag: #2A0D07;

  /* The terminal was already the dark surface. It is the one
     thing that barely moves. */
  --term:    #0A0C10;
  --term-2:  #14181E;

  --ring-off: linear-gradient(135deg, #3C4239, #282D26);
  --grid:    rgba(233, 236, 230, .06);
  --scrim:   rgba(5, 7, 5, .62);
  --scrim-2: rgba(5, 7, 5, .66);
  color-scheme: dark;
}