/* GENERATED by scripts/build-tokens.mjs — do not edit. Source: src/tokens/tokens.json */
:root {
  /* surface */
  --v-surface-canvas: #FFFFFF;
  --v-surface-canvas-deep: #EFEFEB;
  --v-surface-raised: #FFFFFF;
  --v-surface-soft: #F7F7F5;
  --v-surface-active: #EFEFEB;
  --v-surface-scrim: rgba(20, 22, 27, 0.30);

  /* line */
  --v-line-default: #E7E7E3;
  --v-line-strong: #E7E7E3;
  --v-line-divider: #EFEFEB;

  /* text */
  --v-text-ink: #14161B;
  --v-text-ink-soft: #3A3F47;
  --v-text-muted: #596168;
  --v-text-faint: #AEB2B8;
  --v-text-nav-idle: #596168;
  --v-text-on-dark: #FFFFFF;
  --v-text-on-dark-soft: #C8CBCC;

  /* brand */
  --v-brand-blue: #229ED9;
  --v-brand-blue-text: #05618C;
  --v-brand-blue-surface: #EAF6FB;
  --v-brand-lime: #C7F94B;
  --v-brand-lime-ink: #39440F;
  --v-brand-lime-surface: #F4FCE4;
  --v-brand-lime-track: rgba(20, 22, 27, 0.12);

  /* premium */
  --v-premium-graphite-start: #202426;
  --v-premium-graphite-end: #253033;

  /* state */
  --v-state-verified: #C7F94B;
  --v-state-verified-ink: #39440F;
  --v-state-info: #229ED9;
  --v-state-info-ink: #05618C;
  --v-state-danger: #B93F3F;
  --v-state-danger-surface: #FCEAEA;
  --v-state-danger-line: #F0C6C6;

  /* tile */
  --v-tile-accent-surface: #F4FCE4;
  --v-tile-accent-line: #E7E7E3;
  --v-tile-accent-ink: #39440F;
  --v-tile-info-surface: #EAF6FB;
  --v-tile-info-line: #E7E7E3;
  --v-tile-info-ink: #05618C;
  --v-tile-neutral-surface: #F7F7F5;
  --v-tile-neutral-line: #E7E7E3;
  --v-tile-neutral-ink: #3A3F47;
  --v-tile-danger-surface: #FCEAEA;
  --v-tile-danger-line: #F0C6C6;
  --v-tile-danger-ink: #B93F3F;

  /* radius */
  --v-radius-chip: 9px;
  --v-radius-control: 12px;
  --v-radius-tile: 13px;
  --v-radius-card: 16px;
  --v-radius-trigger: 18px;
  --v-radius-sheet: 20px;
  --v-radius-nav: 24px;
  --v-radius-pill: 999px;

  /* space */
  --v-space-1: 4px;
  --v-space-2: 8px;
  --v-space-3: 12px;
  --v-space-4: 16px;
  --v-space-5: 20px;
  --v-space-6: 24px;
  --v-space-8: 32px;
  --v-space-10: 40px;
  --v-space-12: 48px;
  --v-space-16: 64px;

  /* font */
  --v-font-display: 'Space Grotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --v-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  /* type */
  --v-type-eyebrow-size: 10px;
  --v-type-eyebrow-tracking: 0.16em;
  --v-type-meta-size: 11.5px;
  --v-type-body-size: 14px;
  --v-type-row-title-size: 15px;
  --v-type-card-title-size: 17px;
  --v-type-screen-title-size: 25px;
  --v-type-hero-size: 31px;
  --v-type-cta-size: 17px;

  /* control */
  --v-control-touch-min: 44px;
  --v-control-nav-item-min: 58px;
  --v-control-cta-min: 48px;

  /* duration */
  --v-duration-fast: 160ms;
  --v-duration-state: 180ms;
  --v-duration-view: 220ms;
  --v-duration-sheet: 240ms;
  --v-duration-nav: 360ms;

  /* easing */
  --v-easing-standard: cubic-bezier(0.2, 0.8, 0.2, 1);
  --v-easing-nav: cubic-bezier(0.22, 1, 0.36, 1);

  /* shadow */
  --v-shadow-trigger: 0 4px 14px rgba(20, 22, 27, 0.04);
  --v-shadow-soft: 0 12px 36px rgba(20, 22, 27, 0.06);
  --v-shadow-nav: 0 16px 44px rgba(20, 24, 28, 0.10);
  --v-shadow-float: 0 22px 64px rgba(20, 22, 27, 0.16);
  --v-shadow-indicator: 0 9px 20px rgba(20, 24, 28, 0.10), inset 0 1px 0 rgba(255, 255, 255, 0.74);

  /* gradient */
  --v-gradient-nav-indicator: linear-gradient(100deg, rgba(34, 158, 217, 0.14) 0%, rgba(143, 224, 107, 0.13) 60%, rgba(199, 249, 75, 0.13) 100%);
  --v-gradient-premium: linear-gradient(135deg, #202426 0%, #253033 100%);
  --v-gradient-verified: linear-gradient(100deg, #229ED9 0%, #8FE06B 60%, #C7F94B 100%);

  /* z */
  --v-z-nav: 10;
  --v-z-sheet: 20;
  --v-z-modal: 30;
}

/* Global layer: only what cannot live inside a component.
   Everything else is scoped in shadow DOM. */
@layer base, shell;

@layer base {
  *, *::before, *::after { box-sizing: border-box; }

  html, body {
    margin: 0;
    min-width: 320px;
    background: var(--v-surface-canvas);
    color: var(--v-text-ink);
    font-family: var(--v-font-display);
    -webkit-font-smoothing: antialiased;
    font-synthesis: none;
    color-scheme: light;
  }

  body {
    min-height: 100dvh;
    padding-bottom: env(safe-area-inset-bottom);
    overscroll-behavior-y: none;
  }

  a { color: var(--v-brand-blue-text); text-decoration: none; }
  a:hover { color: var(--v-text-ink); }

  :where(button, a) { -webkit-tap-highlight-color: transparent; }

  ::selection { background: var(--v-brand-lime); color: var(--v-brand-lime-ink); }
}

@layer shell {
  /* One shared screen transition. Detail surfaces replace without a page-level entrance. */
  @view-transition { navigation: none; }

  ::view-transition-old(screen), ::view-transition-new(screen) {
    animation-duration: var(--v-duration-view);
    animation-timing-function: var(--v-easing-standard);
  }
}

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