/* Gud — design tokens (locked) */
:root {
  --ink: #000000;
  --paper: #FFFFFF;
  --gud-orange: #FF6A00;
  --class-blue: #1D4ED8;
  --move-red: #E63A1F;
  --work-green: #0F8A4F;
  --read-purple: #7B3FE4;

  --ink-90: #1A1A1A;
  --ink-50: #737373;
  --ink-20: #D4D4D4;
  --ink-05: #F5F5F5;

  --font-display: 'Fira Sans Condensed', sans-serif;
  --font-body: 'Source Serif 4', Georgia, serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, monospace;

  --s-1: 8px; --s-2: 16px; --s-3: 24px; --s-4: 32px;
  --s-5: 48px; --s-6: 64px; --s-8: 96px; --s-10: 128px;

  --r-button: 4px; --r-card: 8px; --r-input: 4px; --r-squircle: 18.75%;
  --slash-angle: 24deg;

  --ease: cubic-bezier(0.4, 0, 0.2, 1);
  --dur-fast: 150ms; --dur-base: 300ms;

  --bg: var(--paper);
  --fg: var(--ink);
  --fg-50: var(--ink-50);
  --fg-20: var(--ink-20);
  --fg-05: var(--ink-05);
  color-scheme: light;
}

html[data-theme="dark"] {
  --bg: var(--ink);
  --fg: var(--paper);
  --fg-50: #8a8a8a;
  --fg-20: #2a2a2a;
  --fg-05: var(--ink-90);
  color-scheme: dark;
}

@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) {
    --bg: var(--ink);
    --fg: var(--paper);
    --fg-50: #8a8a8a;
    --fg-20: #2a2a2a;
    --fg-05: var(--ink-90);
    color-scheme: dark;
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    transition-duration: 0.01ms !important;
  }
}

/* ---------- Wordmark (Gud + slash) ---------- */
.wordmark {
  display: inline-flex;
  align-items: flex-start;
  font-family: var(--font-display);
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.02em;
  color: var(--fg);
}
.wordmark .word { color: currentColor; }
.wordmark .slash {
  display: inline-block;
  background: var(--gud-orange);
  width: 0.135em;
  height: 1.04em;
  margin-left: 0.18em;
  margin-top: -0.14em;
  transform: skewX(-24deg);
  border-radius: 1px;
}

/* ---------- Squircle daughter icons ---------- */
.squircle {
  position: relative;
  border-radius: var(--r-squircle);
  overflow: hidden;
  container-type: inline-size;
  font-family: var(--font-display);
  flex-shrink: 0;
  display: inline-block;
}
.squircle.framed-light { background: var(--paper); color: var(--ink); }
.squircle.framed-dark  { background: var(--ink); color: var(--paper); }
.squircle .ic-g, .squircle .ic-x {
  position: absolute;
  line-height: 1;
}
.squircle .ic-g {
  font-weight: 400;
  font-size: 55cqw;
  top: 7%; left: 24%;
  transform: translateX(-50%);
}
.squircle .ic-x {
  font-weight: 700;
  bottom: 7%; left: 76%;
  transform: translateX(-50%);
}
.squircle .ic-x.x-c { font-size: 60cqw; }
.squircle .ic-x.x-m { font-size: 52cqw; }
.squircle .slash-mark {
  position: absolute;
  top: -3%; bottom: -3%; left: 50%;
  width: 2.4cqw;
  transform: translateX(-50%) skewX(-24deg);
  border-radius: 1px;
}
.squircle.solo .ic-g {
  font-weight: 800;
  font-size: 64cqw;
  top: 50%; left: 30%;
  transform: translate(-50%, -50%);
}
.squircle.solo .slash-mark { left: 64%; }
.c-gud   .slash-mark { background: var(--gud-orange); }
.c-class .slash-mark { background: var(--class-blue); }
.c-move  .slash-mark { background: var(--move-red); }
.c-empty .slash-mark { background: var(--ink-20); }
