/* Stagada design tokens — generated from 26_Design_Tokens_v3.
   Source of truth: tools/stagada_online_workshop_blueprint_v3_experience_visual.xlsx
   Regenerate: python3 tools/generate_tokens_css.py  (do not edit by hand) */

:root {
  --stagada-color-brand-black: #000000; /* Core ink/background */
  --stagada-color-brand-gray: #7D7D7D; /* Neutral card/secondary */
  --stagada-color-phase-starting: #000000; /* Starting Point */
  --stagada-color-phase-audience: #FFB80E; /* Audience */
  --stagada-color-phase-challenge: #5CC43B; /* Challenge */
  --stagada-color-phase-ideation: #FFFFFF; /* Ideation field */
  --stagada-color-phase-choose: #A33AA6; /* Choose */
  --stagada-color-phase-test: #4C3FD6; /* Test */
  --stagada-color-phase-pitch: #0AA6D8; /* Pitch */
  --stagada-color-phase-inspiration: #F51BA5; /* Inspiration/Trends */
  --stagada-color-result-slate: #36485A; /* Generated/result cards */
  --stagada-color-ink-navy: #10182E; /* Outlines/nav */
  --stagada-color-surface-light: #F7F7F9; /* Light surface */
  --stagada-color-success: #21C76A; /* Success */
  --stagada-color-warning: #FFC43D; /* Warning */
  --stagada-color-error: #FF5A5F; /* Error */
  --stagada-color-phase-audience-tint10: #FFF5DD; /* audience light tint */
  --stagada-color-phase-audience-tint30: #FFE6AB; /* audience medium tint */
  --stagada-color-phase-audience-shade20: #CC930B; /* audience shade */
  --stagada-color-phase-challenge-tint10: #E8F7E4; /* challenge light tint */
  --stagada-color-phase-challenge-tint30: #C6EABA; /* challenge medium tint */
  --stagada-color-phase-challenge-shade20: #4A9D2F; /* challenge shade */
  --stagada-color-phase-choose-tint10: #F2E3F3; /* choose light tint */
  --stagada-color-phase-choose-tint30: #DFBAE0; /* choose medium tint */
  --stagada-color-phase-choose-shade20: #822E85; /* choose shade */
  --stagada-color-phase-test-tint10: #E6E4F9; /* test light tint */
  --stagada-color-phase-test-tint30: #C0BCF1; /* test medium tint */
  --stagada-color-phase-test-shade20: #3D32AB; /* test shade */
  --stagada-color-phase-pitch-tint10: #DDF3FA; /* pitch light tint */
  --stagada-color-phase-pitch-tint30: #A9E0F1; /* pitch medium tint */
  --stagada-color-phase-pitch-shade20: #0885AD; /* pitch shade */
  --stagada-color-phase-inspiration-tint10: #FEDFF2; /* inspiration light tint */
  --stagada-color-phase-inspiration-tint30: #FCAFE0; /* inspiration medium tint */
  --stagada-color-phase-inspiration-shade20: #C41684; /* inspiration shade */
  --stagada-font-display: Fredoka, 'Arial Rounded MT Bold', system-ui; /* Large playful titles */
  --stagada-font-body: Nunito Sans, Inter, system-ui; /* Body/UI */
  --stagada-font-handwritten: Caveat, 'Comic Sans MS', cursive; /* Small result annotations */
  --stagada-font-size-hero: 52px; /* Desktop hero title */
  --stagada-font-size-card-title: 28px; /* Exercise card title */
  --stagada-font-size-body: 17px; /* Body */
  --stagada-font-size-chip: 15px; /* Taxonomy chip */
  --stagada-radius-card: 24px; /* Primary cards */
  --stagada-radius-tile: 18px; /* Tiles */
  --stagada-radius-chip: 999px; /* Pills/chips */
  --stagada-stroke-illustration: 5px; /* SVG outline */
  --stagada-shadow-card: 0 12px 30px rgba(16,24,46,.16); /* Floating card */
  --stagada-shadow-tile: 0 6px 16px rgba(16,24,46,.12); /* Tiles */
  --stagada-space-unit: 8px; /* Spacing base */
  --stagada-motion-fast: 140ms; /* Tap/selection */
  --stagada-motion-standard: 260ms; /* Card enter/flip */
  --stagada-motion-expressive: 520ms; /* Deal/combine/celebrate */
  --stagada-outline-focus: 3px solid #0AA6D8; /* Keyboard focus */
  --stagada-min-tap-target: 44px; /* Accessibility */

  /* Phase contract defaults (overridden per [data-phase]) */
  --phase-color: var(--stagada-color-phase-ideation);
  --phase-tint-10: var(--stagada-color-surface-light);
  --phase-tint-30: var(--stagada-color-surface-light);
  --phase-shade-20: var(--stagada-color-ink-navy);
  --phase-on-color: var(--stagada-color-brand-black);
  --phase-ink: var(--stagada-color-ink-navy);
}

[data-phase='starting'] {
  --phase-color: var(--stagada-color-phase-starting);
  --phase-tint-10: var(--stagada-color-surface-light);
  --phase-tint-30: var(--stagada-color-surface-light);
  --phase-shade-20: var(--stagada-color-ink-navy);
  --phase-on-color: #FFFFFF;
  --phase-ink: #FFFFFF;
}
[data-phase='audience'] {
  --phase-color: var(--stagada-color-phase-audience);
  --phase-tint-10: var(--stagada-color-phase-audience-tint10);
  --phase-tint-30: var(--stagada-color-phase-audience-tint30);
  --phase-shade-20: var(--stagada-color-phase-audience-shade20);
  --phase-on-color: #000000;
  --phase-ink: #10182E;
}
[data-phase='challenge'] {
  --phase-color: var(--stagada-color-phase-challenge);
  --phase-tint-10: var(--stagada-color-phase-challenge-tint10);
  --phase-tint-30: var(--stagada-color-phase-challenge-tint30);
  --phase-shade-20: var(--stagada-color-phase-challenge-shade20);
  --phase-on-color: #000000;
  --phase-ink: #10182E;
}
[data-phase='ideation'] {
  --phase-color: var(--stagada-color-phase-ideation);
  --phase-tint-10: var(--stagada-color-surface-light);
  --phase-tint-30: var(--stagada-color-surface-light);
  --phase-shade-20: var(--stagada-color-ink-navy);
  --phase-on-color: #000000;
  --phase-ink: #10182E;
}
[data-phase='choose'] {
  --phase-color: var(--stagada-color-phase-choose);
  --phase-tint-10: var(--stagada-color-phase-choose-tint10);
  --phase-tint-30: var(--stagada-color-phase-choose-tint30);
  --phase-shade-20: var(--stagada-color-phase-choose-shade20);
  --phase-on-color: #FFFFFF;
  --phase-ink: #FFFFFF;
}
[data-phase='test'] {
  --phase-color: var(--stagada-color-phase-test);
  --phase-tint-10: var(--stagada-color-phase-test-tint10);
  --phase-tint-30: var(--stagada-color-phase-test-tint30);
  --phase-shade-20: var(--stagada-color-phase-test-shade20);
  --phase-on-color: #FFFFFF;
  --phase-ink: #FFFFFF;
}
[data-phase='pitch'] {
  --phase-color: var(--stagada-color-phase-pitch);
  --phase-tint-10: var(--stagada-color-phase-pitch-tint10);
  --phase-tint-30: var(--stagada-color-phase-pitch-tint30);
  --phase-shade-20: var(--stagada-color-phase-pitch-shade20);
  --phase-on-color: #FFFFFF;
  --phase-ink: #10182E;
}
[data-phase='inspiration'] {
  --phase-color: var(--stagada-color-phase-inspiration);
  --phase-tint-10: var(--stagada-color-phase-inspiration-tint10);
  --phase-tint-30: var(--stagada-color-phase-inspiration-tint30);
  --phase-shade-20: var(--stagada-color-phase-inspiration-shade20);
  --phase-on-color: #FFFFFF;
  --phase-ink: #10182E;
}

/* Base primitives shipped with the handoff pack. */
.stagada-card {
  border: 5px solid var(--stagada-color-ink-navy);
  border-radius: var(--stagada-radius-card);
  box-shadow: var(--stagada-shadow-card);
}
.stagada-result-slate {
  background: var(--stagada-color-result-slate);
  color: #fff;
  border-radius: var(--stagada-radius-card);
}
.stagada-chip {
  min-height: var(--stagada-min-tap-target);
  border: 3px solid var(--stagada-color-ink-navy);
  border-radius: var(--stagada-radius-chip);
  font-family: var(--stagada-font-body);
  font-weight: 700;
}

/* A01 in 36_Adaptive_Rules: replace flips/fans/springs with fades/instant states. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --stagada-motion-fast: 1ms;
    --stagada-motion-standard: 1ms;
    --stagada-motion-expressive: 1ms;
  }
  *, *::before, *::after {
    animation-duration: 1ms !important;
    transition-duration: 1ms !important;
  }
}

[data-motion='reduced'], [data-motion='reduced'] * {
  --stagada-motion-fast: 1ms;
  --stagada-motion-standard: 1ms;
  --stagada-motion-expressive: 1ms;
  animation-duration: 1ms !important;
  transition-duration: 1ms !important;
}