/* Design tokens -- CatalogLens / desktop Spacious / near-ink accent.
   Color tokens and design rules are copied verbatim; density values below
   are the desktop "Spacious" scale from DESIGN_PORTABLE.md (content padding
   32px, section gap 28px, tile gap 18px). Shippori Mincho is substituted
   with Literata (Cyrillic support). */

:root {
  /* Color tokens -- RGB triples, verbatim from DESIGN_PORTABLE.md
     (enables rgb(var(--x) / <alpha>) opacity trick). */
  --c-bg:          244 241 234;   /* paper background */
  --c-surface:     251 249 243;   /* card/panel surface */
  --c-surface-2:   233 228 216;   /* secondary surface, e.g. stripe */
  --c-border:      216 209 192;
  --c-fg:           38  36  31;   /* ink text */
  --c-muted:        92  87  76;
  --c-faint:       146 139 122;
  --c-accent-fg:   255 255 255;   /* text on accent fill */
  --c-ok:          107 138  90;
  --c-warn:        182 130  47;
  --c-danger:      178  58  44;
  --c-info:         91 110 140;

  /* Accent -- sumi slate (#3c5466), case 1 accent. Cool blue-grey ink:
     reads as a deliberate accent against warm paper (near-ink #3f3a33 read
     as plain dark text, not an accent), stays restrained per Sumi-e. Shared
     with the case-1 cover so site and portfolio card match. */
  --c-accent:       60  84 102;

  /* Typography -- Literata (JP-serif slot) + JetBrains Mono (tabular data). */
  --font-serif: 'Literata', Georgia, serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;

  /* Density -- desktop "Spacious" scale from DESIGN_PORTABLE.md. */
  --d-content:      32px;  /* screen content padding */
  --d-gap-section:  28px;  /* gap between major sections */
  --d-gap-tiles:    18px;  /* gap between tiles/cards */
  --d-card-y:       17px;  /* card vertical padding -- verbatim */
  --d-row-y:        18px;  /* list/table row vertical padding -- verbatim */
  --d-qrow-y:       14px;  /* dense row vertical padding -- verbatim */

  /* Radius / borders -- rule 6: flat surfaces, 1px borders, restrained radius. */
  --radius:    8px;
  --radius-sm: 6px;
  --border-w:  1px;
}

/* Literata -- self-hosted, latin+cyrillic+cyrillic-ext merged per weight
   (Ukrainian i/yi/ye/g verified present in the cmap, see T2 verification). */
@font-face {
  font-family: 'Literata';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/literata-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Literata';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/literata-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Literata';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/literata-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Literata';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/literata-700.woff2') format('woff2');
}

/* JetBrains Mono -- same subset merge, weights 400/500/600. */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-400.woff2') format('woff2');
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-500.woff2') format('woff2');
}
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/fonts/jetbrains-mono-600.woff2') format('woff2');
}