/* gociux.com shared base: fonts, colour tokens (light + dark), and modern defaults.
   Page styles stay in each page (unlayered), so they always win over these layers. */
@layer tokens, base;

@font-face{font-family:'Bricolage Grotesque';src:url('/fonts/bricolage-grotesque-latin-wght-normal.woff2') format('woff2-variations');font-weight:200 800;font-display:swap}
@font-face{font-family:'Figtree';src:url('/fonts/figtree-latin-wght-normal.woff2') format('woff2-variations');font-weight:300 900;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('/fonts/jetbrains-mono-latin-wght-normal.woff2') format('woff2-variations');font-weight:100 800;font-display:swap}
@font-face{font-family:'Bricolage Grotesque';src:url('/fonts/bricolage-grotesque-latin-ext-wght-normal.woff2') format('woff2-variations');font-weight:200 800;font-display:swap;unicode-range:U+0100-02BA,U+1E00-1E9F,U+2020,U+20A0-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Figtree';src:url('/fonts/figtree-latin-ext-wght-normal.woff2') format('woff2-variations');font-weight:300 900;font-display:swap;unicode-range:U+0100-02BA,U+1E00-1E9F,U+2020,U+20A0-20C0,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'JetBrains Mono';src:url('/fonts/jetbrains-mono-latin-ext-wght-normal.woff2') format('woff2-variations');font-weight:100 800;font-display:swap;unicode-range:U+0100-02BA,U+1E00-1E9F,U+2020,U+20A0-20C0,U+2C60-2C7F,U+A720-A7FF}

@layer tokens{
  :root{
    color-scheme:light;
    --gx-bg:oklch(95.2% 0.011 89.7);--gx-bg-2:oklch(92.5% 0.017 91.6);--gx-card:oklch(98.4% 0.007 97.3);--gx-paper:oklch(100% 0 0);
    --gx-line:oklch(87% 0.023 89.8);--gx-line-2:oklch(92.5% 0.017 91.6);--gx-grid:oklch(91% 0.02 90.6);
    --gx-ink:oklch(19.6% 0.012 91.8);--gx-ink-2:oklch(35.3% 0.014 89.9);--gx-dim:oklch(44.3% 0.015 86.9);--gx-faint:oklch(48.7% 0.024 88.8);
    --gx-green:oklch(47% 0.094 166.5);--gx-red:oklch(56.1% 0.165 32.9);--gx-amber:oklch(58.9% 0.129 59.2);
    --gx-tint-red:oklch(96.9% 0.01 48.6);--gx-tint-amber:oklch(91.2% 0.044 77.2);
    /* filled buttons and chips: the same deep green in both themes, with light text */
    --gx-accent-bg:oklch(47% 0.094 166.5);--gx-on-accent:oklch(95.2% 0.011 89.7);
    /* always-dark panels (callouts, stat blocks): stay dark, lift slightly off the page in dark mode */
    --gx-panel:oklch(18.9% 0.013 160.5);
    /* derived shades from one variable (oklch keeps them perceptually even) */
    --gx-green-soft:oklch(from var(--gx-green) l c h / .1);
    --gx-red-soft:oklch(from var(--gx-red) l c h / .12);
  }
  @media (prefers-color-scheme:dark){
    :root:not([data-theme=light]){
      color-scheme:dark;
      --gx-bg:oklch(19% 0.009 153.1);--gx-bg-2:oklch(22% 0.011 151.2);--gx-card:oklch(22.3% 0.012 156.1);--gx-paper:oklch(24.8% 0.013 160.3);
      --gx-line:oklch(31.4% 0.016 156.2);--gx-line-2:oklch(27.6% 0.013 154.4);--gx-grid:oklch(24.8% 0.013 160.3);
      --gx-ink:oklch(93.4% 0.012 91.5);--gx-ink-2:oklch(85.2% 0.016 90.3);--gx-dim:oklch(72.5% 0.021 90.6);--gx-faint:oklch(65.4% 0.02 89.4);
      --gx-green:oklch(75.1% 0.13 165.1);--gx-red:oklch(75.6% 0.148 33.6);--gx-amber:oklch(77.2% 0.121 67.4);
      --gx-tint-red:oklch(23.7% 0.027 34.6);--gx-tint-amber:oklch(26.7% 0.031 78.6);
      --gx-accent-bg:oklch(52% 0.11 166.5);--gx-on-accent:oklch(97% 0.01 90);--gx-panel:oklch(25.5% 0.018 160);
    }
  }
  :root[data-theme=dark]{
    color-scheme:dark;
    --gx-bg:oklch(19% 0.009 153.1);--gx-bg-2:oklch(22% 0.011 151.2);--gx-card:oklch(22.3% 0.012 156.1);--gx-paper:oklch(24.8% 0.013 160.3);
    --gx-line:oklch(31.4% 0.016 156.2);--gx-line-2:oklch(27.6% 0.013 154.4);--gx-grid:oklch(24.8% 0.013 160.3);
    --gx-ink:oklch(93.4% 0.012 91.5);--gx-ink-2:oklch(85.2% 0.016 90.3);--gx-dim:oklch(72.5% 0.021 90.6);--gx-faint:oklch(65.4% 0.02 89.4);
    --gx-green:oklch(75.1% 0.13 165.1);--gx-red:oklch(75.6% 0.148 33.6);--gx-amber:oklch(77.2% 0.121 67.4);
    --gx-tint-red:oklch(23.7% 0.027 34.6);--gx-tint-amber:oklch(26.7% 0.031 78.6);
    --gx-accent-bg:oklch(52% 0.11 166.5);--gx-on-accent:oklch(97% 0.01 90);--gx-panel:oklch(25.5% 0.018 160);
  }
}

@layer base{
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body{background:var(--gx-bg);color:var(--gx-ink)}
  h1,h2,h3,h4{text-wrap:balance}
  p,li,dd,figcaption,blockquote{text-wrap:pretty}
  :focus-visible{outline:2px solid var(--gx-green);outline-offset:3px;border-radius:4px}
  ::selection{background:var(--gx-accent-bg);color:var(--gx-on-accent)}
  img,svg,video{max-width:100%}
  /* long generated lists render only when near the viewport */
  .list .item,.list a.row{content-visibility:auto;contain-intrinsic-size:auto 120px}
}

/* smooth cross-page navigation (same origin); ignored by browsers without support */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.22s}

@media (prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* theme toggle (added by /theme.js) */
.gx-theme{position:fixed;right:16px;bottom:16px;z-index:60;width:42px;height:42px;border-radius:50%;border:1px solid var(--gx-line);background:var(--gx-card);color:var(--gx-ink);display:grid;place-items:center;cursor:pointer;box-shadow:0 4px 18px oklch(0% 0 0 / .12);padding:0}
.gx-theme svg{width:18px;height:18px}
.gx-theme:hover{border-color:var(--gx-green)}
@media print{.gx-theme{display:none}}