/* CULT ROYALE brand skin for Vocs — single mode (dark), machine tokens.
   This vocs version themes through --vocs-color-gray2..14 (dark arm uses the
   LOW numbers for surfaces, HIGH numbers for text); the runtime inlines
   defaults, so the brand lands with !important. */

@font-face {
  font-family: "Proto Mono";
  src: url("/fonts/ProtoMono-Regular.otf") format("opentype");
  font-weight: 400 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Proto Mono";
  src: url("/fonts/ProtoMono-Bold.otf") format("opentype");
  font-weight: 600 800;
  font-style: normal;
  font-display: swap;
}

:root {
  color-scheme: dark !important;

  /* Accent: good-boy-points acid green. */
  --vocs-color-accent: oklch(0.87 0.23 130) !important;

  /* Type: the full Proto Mono cut (true lowercase) is the brand voice. */
  --vocs-font-family: "Proto Mono", ui-monospace, monospace !important;
  --vocs-font-family-mono: "Proto Mono", ui-monospace, monospace !important;

  /* Surfaces: the purple-night ladder (hue 305), dark→light. */
  --vocs-color-gray2: oklch(0.17 0.055 305) !important;  /* page bg */
  --vocs-color-gray4: oklch(0.21 0.062 305) !important;  /* surface */
  --vocs-color-gray5: oklch(0.24 0.068 305) !important;  /* surface tint */
  --vocs-color-gray6: oklch(0.3 0.075 305) !important;   /* lines */
  --vocs-color-gray7: oklch(0.36 0.08 305) !important;
  --vocs-color-gray8: oklch(0.44 0.07 303) !important;

  /* Text: the lavender-ink ladder (hue ~300), muted→bright. */
  --vocs-color-gray9: oklch(0.62 0.06 302) !important;   /* muted */
  --vocs-color-gray10: oklch(0.7 0.05 302) !important;
  --vocs-color-gray11: oklch(0.8 0.035 301) !important;  /* secondary */
  --vocs-color-gray12: oklch(0.93 0.02 300) !important;  /* primary ink */
  --vocs-color-gray13: oklch(0.95 0.015 300) !important;
  --vocs-color-gray14: oklch(0.97 0.01 300) !important;
}

/* The wordmark logo renders larger than vocs' default max-h-7 box. */
img[data-v-logo-image] {
  height: 40px !important;
  max-height: 40px !important;
  width: auto !important;
  margin-top: 10px;
}

/* Titles + chrome carry the all-caps arcade register; body copy stays
   sentence case. */
h1, h2, h3, h4,
aside, header nav {
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

/* Bold means bold: force the Bold cut and lift it to full ink. */
strong, b {
  font-weight: 700 !important;
  color: oklch(0.97 0.01 300);
}

/* Links glow green like the machine's CTAs. */
a {
  text-decoration-color: oklch(0.87 0.23 130 / 0.5);
}
