/* ============================================================================
   SKIN · CONSOLE
   ----------------------------------------------------------------------------
   Inspired by the flat panel consoles of late-90s Star Trek -- Voyager and DS9
   era, and the films. What is borrowed here is a VOCABULARY, the way any
   designer borrows from work they studied: solid unmodulated colour, no
   gradient and no emboss, condensed capitals for labels, an asymmetric elbow
   corner, and a colour rail down the side of a panel.

   What is NOT borrowed: no LCARS font, no LCARS CSS framework, no screen
   captures, no trademark, no layout copied panel-for-panel. Every value below
   was chosen here. The typefaces are Antonio and IBM Plex, both open-licensed
   (SIL OFL), so this skin is free to run on a commercial site.

   Fonts required in the host page, and SELF-HOSTED since 2026-09-09:
     Antonio 400/600/700, IBM Plex Sans 400/500/600, IBM Plex Mono 400/500/600.
     Link ../fonts/fonts.css, or ds/fonts/fonts.css from a domain folder that
     took the copy. It was fonts.googleapis.com until that date; the faces are
     unchanged, and fonts/SOURCE.txt records the URL each file came from.
   ========================================================================== */

:root[data-skin="console"]{
  --ds-ground:#E7E4DC;
  --ds-surface:#FFFFFF;
  --ds-surface-2:#F1EEE6;

  --ds-ink:#16151A;
  --ds-ink-2:#4A4754;
  --ds-ink-3:#656275;

  --ds-line:#CFC9BC;
  --ds-line-2:#E2DDD2;

  /* identity is the mauve, not the amber -- amber is reserved for "warn", so
     changing the identity colour never changes what a warning looks like */
  --ds-accent:#6B4FB8;
  --ds-accent-ink:#FFFFFF;
  --ds-accent-soft:#EAE3F8;

  --ds-ok:#2C714F;   --ds-ok-soft:#DFF0E7;
  --ds-warn:#8C5918; --ds-warn-soft:#F7EBD8;
  --ds-crit:#A82F2F; --ds-crit-soft:#F8E2E2;
  --ds-idle:#2B5C93; --ds-idle-soft:#E0EAF5;

  /* categorical: OKLCH, even hue steps, anchored on this skin's accent */
  --ds-d1:oklch(0.50 0.115 300);   /* #6E529A */
  --ds-d2:oklch(0.50 0.115 345);   /* #904572 */
  --ds-d3:oklch(0.50 0.115 30);   /* #9A463A */
  --ds-d4:oklch(0.50 0.115 75);   /* #895700 */
  --ds-d5:oklch(0.50 0.115 120);   /* #5B6C09 */
  --ds-d6:oklch(0.50 0.115 165);   /* #007752 */
  --ds-d7:oklch(0.50 0.115 210);   /* #007387 */
  --ds-d8:oklch(0.50 0.115 255);   /* #3164A3 */

  --ds-font-display:"Antonio",var(--ds-font-body);
  --ds-display-weight:600;
  --ds-display-spacing:.005em;
  --ds-display-transform:uppercase;

  --ds-label-transform:uppercase;
  --ds-label-spacing:.16em;
  --ds-label-weight:700;
  --ds-label-size:11px;

  /* the elbow: one big corner, three sharp ones */
  --ds-elbow:26px;
  --ds-radius:3px;
  --ds-radius-sm:3px;
  --ds-rail:5px;

  --ds-pad:18px;
  --ds-pad-tight:12px;

  /* flat: the research is explicit that the look has no gradient or emboss */
  --ds-shadow:none;

  --ds-motion:120ms;
}

:root[data-skin="console"]:not([data-theme="light"]){
  @media (prefers-color-scheme: dark){
    --ds-ground:#0A0A0D;
    --ds-surface:#141319;
    --ds-surface-2:#1C1A23;
    --ds-ink:#F0EDF6; --ds-ink-2:#B6B0C6; --ds-ink-3:#8A83A0;
    --ds-line:#2B2836; --ds-line-2:#221F2B;
    --ds-accent:#9B8CE0; --ds-accent-ink:#0A0A0D; --ds-accent-soft:#241E3A;
    --ds-ok:#5FC48A;   --ds-ok-soft:#12291D;
    --ds-warn:#E8A33D; --ds-warn-soft:#2E2210;
    --ds-crit:#E06A6A; --ds-crit-soft:#2E1616;
    --ds-idle:#6FA8DC; --ds-idle-soft:#131F2C;
    --ds-d1:oklch(0.80 0.125 300);   /* #CAABFF */
    --ds-d2:oklch(0.80 0.125 345);   /* #F79CD0 */
    --ds-d3:oklch(0.80 0.125 30);   /* #FF9E8D */
    --ds-d4:oklch(0.80 0.125 75);   /* #EDB25A */
    --ds-d5:oklch(0.80 0.125 120);   /* #B3CA69 */
    --ds-d6:oklch(0.80 0.125 165);   /* #64D7AA */
    --ds-d7:oklch(0.80 0.125 210);   /* #3DD3EA */
    --ds-d8:oklch(0.80 0.125 255);   /* #85C1FF */
    --ds-shadow:none;
  }
}
:root[data-skin="console"][data-theme="dark"]{
  --ds-ground:#0A0A0D;
  --ds-surface:#141319;
  --ds-surface-2:#1C1A23;
  --ds-ink:#F0EDF6; --ds-ink-2:#B6B0C6; --ds-ink-3:#8A83A0;
  --ds-line:#2B2836; --ds-line-2:#221F2B;
  --ds-accent:#9B8CE0; --ds-accent-ink:#0A0A0D; --ds-accent-soft:#241E3A;
  --ds-ok:#5FC48A;   --ds-ok-soft:#12291D;
  --ds-warn:#E8A33D; --ds-warn-soft:#2E2210;
  --ds-crit:#E06A6A; --ds-crit-soft:#2E1616;
  --ds-idle:#6FA8DC; --ds-idle-soft:#131F2C;
  --ds-d1:oklch(0.80 0.125 300);   /* #CAABFF */
  --ds-d2:oklch(0.80 0.125 345);   /* #F79CD0 */
  --ds-d3:oklch(0.80 0.125 30);   /* #FF9E8D */
  --ds-d4:oklch(0.80 0.125 75);   /* #EDB25A */
  --ds-d5:oklch(0.80 0.125 120);   /* #B3CA69 */
  --ds-d6:oklch(0.80 0.125 165);   /* #64D7AA */
  --ds-d7:oklch(0.80 0.125 210);   /* #3DD3EA */
  --ds-d8:oklch(0.80 0.125 255);   /* #85C1FF */
  --ds-shadow:none;
}