/* Jack · Spiral Hill — tokens (PIEL)
   Paleta maestra .kc/pixel/palette.json, muestreada del plate pintado 108x234.
   Contraste medido (WCAG 2, sRGB): moon-pale/night-1 13.9:1 · bone-shade/night-1 8.8:1 · pumpkin-2/night-1 7.9:1 ·
   pumpkin-2/plum-0 6.4:1 · flame/night-2 9.6:1 · ink/moon-pale 14.7:1 · ink/pumpkin-2 8.4:1. */

:root {
  /* Primitivos de la noche */
  --c-ink: #040D13;
  --c-night-1: #081427;
  --c-night-2: #0E1E36;
  --c-night-3: #192437;
  --c-night-4: #1E3D64;
  --c-hill: #38517B;
  --c-hill-rim: #5E7FAF;
  --c-mist: #8E8693;
  --c-bone-shade: #B1B3B6;
  --c-bone: #E4DADD;
  --c-moon-pale: #ECDEC3;
  --c-moon: #EDDFA2;
  --c-plum-0: #2D223A;
  --c-plum-1: #361833;
  --c-plum-2: #4A213C;
  --c-plum-3: #64475A;
  --c-pumpkin-0: #C36229;
  --c-pumpkin-1: #DD7B30;
  --c-pumpkin-2: #E89841;
  --c-flame: #F2BC37;
  --c-heart: #A8323E;

  /* Semánticos KC */
  --kc-canvas: var(--c-night-1);
  --kc-canvas-alt: var(--c-night-2);
  --kc-surface: var(--c-night-2);
  --kc-ink: var(--c-moon-pale);
  --kc-ink-muted: var(--c-bone-shade);
  --kc-accent: var(--c-pumpkin-2);
  --kc-on-accent: var(--c-ink);
  --kc-line: var(--c-night-4);
  --kc-field-line: var(--c-hill-rim);
  --kc-error: #F08A7E;
  --kc-focus: var(--c-flame);
  --kc-footer-bg: var(--c-ink);
  --kc-footer-ink: var(--c-moon-pale);
  --kc-footer-muted: var(--c-bone-shade);

  --kc-ring-size: 52px;
  --kc-ring-color: var(--c-pumpkin-2);
  --kc-ring-dot: var(--c-flame);
  --kc-ring-ink: var(--c-moon-pale);

  /* Tipografía: KiwiSoda para nombres y títulos, pixel humanista para leer */
  --kc-font-display: 'KiwiSoda', 'Pixelify Sans', Georgia, serif;
  --kc-font-body: 'Pixelify Sans', ui-monospace, system-ui, sans-serif;
  --kc-font-label: 'Silkscreen', 'Pixelify Sans', ui-monospace, monospace;
  --kc-text-base: 1.0625rem;
  --kc-text-eyebrow: 0.875rem;
  /* KiwiSoda vive en una rejilla de 16 unidades por em: el JS fija tamaños en 16·n px de dispositivo. */
  --kc-text-title: var(--kiwi-title, 2rem);
  --kc-text-hero: var(--kiwi-hero, 3.5rem);
  --kc-text-count: clamp(1.75rem, 1.4rem + 1.8vw, 2.5rem);
  --kc-leading-body: 1.55;
  --kc-tracking-eyebrow: 0.06em;

  /* Espaciado */
  --kc-space-1: 0.25rem;
  --kc-space-2: 0.5rem;
  --kc-space-3: 0.75rem;
  --kc-space-4: 1rem;
  --kc-space-5: 1.5rem;
  --kc-space-6: 2rem;
  --kc-space-7: 3rem;
  --kc-space-8: 4rem;
  --kc-section-pad: clamp(3.5rem, 2.4rem + 5vw, 6rem);
  --kc-measure: 36rem;

  --kc-radius-sm: 0;
  --kc-radius-md: 0;
  --kc-radius-pill: 0;
  --kc-shadow-soft: none;

  /* Retícula pixel: 1 px lógico del mundo. El JS del escenario la ajusta a píxeles de dispositivo enteros. */
  --px: min(calc(100vw / 108), calc(100svh / 230));
  --stage-left: calc((100vw - var(--px) * 108) / 2);
  --stage-w: calc(var(--px) * 108);
  --stage-h: calc(var(--px) * 314);

  /* Movimiento */
  --kc-gate-duration: 3600ms;
  --kc-stack-duration: 360ms;
  --kc-reveal-duration: 560ms;
  --kc-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --jack-steps: steps(4, end);
}