/* ================================================================
   DESIGN TOKENS — Theme 1.13.28

   Single source of truth for color, spacing, radius, elevation and
   base design-system values. Component files should consume these
   variables instead of redefining them.
   ================================================================ */

:root {
  /* Brand / primary */
  --tsk-primary-50: #F2FBF5;
  --tsk-primary-100: #DDF5E6;
  --tsk-primary-200: #BFECCD;
  --tsk-primary-300: #97DFAD;
  --tsk-primary-400: #74D596;
  --tsk-primary-500: #57C88A;
  --tsk-primary-600: #3CAE70;
  --tsk-primary-700: #2F8757;
  --tsk-primary-800: #246845;
  --tsk-primary-900: #184833;

  /* Accent */
  --tsk-accent-50: #FEF5EC;
  --tsk-accent-100: #FBE4CD;
  --tsk-accent-200: #F6C895;
  --tsk-accent-300: #F2A861;
  --tsk-accent-500: #ED8A33;
  --tsk-accent-700: #B25E14;

  /* Neutral / ink */
  --tsk-ink-900: #1E2828;
  --tsk-ink-800: #2D3A3A;
  --tsk-ink-700: #3F4D4D;
  --tsk-ink-600: #556262;
  --tsk-ink-500: #6E7B7B;
  --tsk-ink-400: #8E9999;
  --tsk-ink-300: #B2BCBC;
  --tsk-ink-200: #D4DCDB;
  --tsk-ink-100: #E7ECEB;
  --tsk-ink-50: #F3F6F5;
  --tsk-bg: #FFFFFF;
  --tsk-bg-cream: #FAF7F1;
  --tsk-bg-tint: #F3FCF6;

  /* Semantic status */
  --tsk-success-bg: #E5F4EB;
  --tsk-success-500: #3D9B66;
  --tsk-success-700: #226E45;
  --tsk-warning-bg: #FDF3DA;
  --tsk-warning-500: #D69921;
  --tsk-warning-700: #8E6210;
  --tsk-danger-bg: #FBE6E4;
  --tsk-danger-500: #CC4D49;
  --tsk-danger-700: #8E2A26;
  --tsk-info-bg: #E5F0FB;
  --tsk-info-500: #3F7CC2;
  --tsk-info-700: #244D7E;

  /* Typography families */
  --tsk-font-sans: "LINE Seed JP", "Hiragino Sans", "Yu Gothic UI", system-ui, sans-serif;
  --tsk-font-display: "LINE Seed JP", "Hiragino Sans", "Yu Gothic UI", system-ui, sans-serif;
  --tsk-font-latin: "Google Sans Flex", system-ui, sans-serif;
  --tsk-font-mono: var(--tsk-font-latin);

  /* Legacy type scale */
  --tsk-fs-xs: 12px;
  --tsk-fs-sm: 14px;
  --tsk-fs-base: 16px;
  --tsk-fs-md: 18px;
  --tsk-fs-lg: 20px;
  --tsk-fs-xl: 24px;
  --tsk-fs-2xl: 32px;
  --tsk-fs-3xl: 38px;
  --tsk-fs-4xl: 48px;
  --tsk-fs-5xl: 60px;
  --tsk-fw-reg: 400;
  --tsk-fw-med: 500;
  --tsk-fw-bold: 700;
  --tsk-lh-tight: 1.35;
  --tsk-lh-snug: 1.55;
  --tsk-lh-body: 1.85;
  --tsk-lh-loose: 2.0;

  /* Semantic reading scale (standard mode) */
  --tsk-type-caption: 12px;
  --tsk-type-small: 14px;
  --tsk-type-body: 16px;
  --tsk-type-subheading: 18px;
  --tsk-type-section: 24px;
  --tsk-type-page: clamp(28px, 3.5vw, 40px);
  --tsk-type-line-body: 1.85;
  --tsk-type-line-heading: 1.45;

  /* Spacing */
  --tsk-sp-1: 4px;
  --tsk-sp-2: 8px;
  --tsk-sp-3: 12px;
  --tsk-sp-4: 16px;
  --tsk-sp-5: 20px;
  --tsk-sp-6: 24px;
  --tsk-sp-8: 32px;
  --tsk-sp-10: 40px;
  --tsk-sp-12: 48px;
  --tsk-sp-16: 64px;
  --tsk-sp-20: 80px;
  --tsk-sp-24: 96px;

  /* Radius */
  --tsk-r-xs: 4px;
  --tsk-r-sm: 8px;
  --tsk-r-md: 12px;
  --tsk-r-lg: 18px;
  --tsk-r-xl: 24px;
  --tsk-r-2xl: 32px;
  --tsk-r-pill: 9999px;

  /* Elevation / motion */
  --tsk-sh-0: 0 0 0 1px var(--tsk-ink-100);
  --tsk-sh-1: 0 1px 2px rgba(28,32,32,.05), 0 1px 1px rgba(28,32,32,.04);
  --tsk-sh-2: 0 2px 6px rgba(28,32,32,.06), 0 4px 12px rgba(28,32,32,.05);
  --tsk-sh-3: 0 4px 10px rgba(28,32,32,.07), 0 10px 24px rgba(28,32,32,.08);
  --tsk-sh-4: 0 8px 16px rgba(20,40,40,.08), 0 20px 40px rgba(20,40,40,.10);
  --tsk-sh-focus: 0 0 0 3px var(--tsk-focus-ring);
  --tsk-ease: cubic-bezier(.2,.7,.2,1);
  --tsk-dur-fast: 120ms;
  --tsk-dur-med: 220ms;
  --tsk-dur-slow: 360ms;

  /* Semantic surfaces / text / borders / actions / focus */
  --tsk-surface-page: #FAF7F1;
  --tsk-surface-card: #FFFFFF;
  --tsk-surface-tint: #F3FCF6;
  --tsk-surface-brand: #3CAE70;
  --tsk-text-primary: #1E2828;
  --tsk-text-secondary: #556262;
  --tsk-text-muted: #64706F;
  --tsk-text-on-brand: #FFFFFF;
  --tsk-text-on-brand-muted: #DDF5E6;
  --tsk-border-subtle: #C8D0CE;
  --tsk-border-default: #AEB8B6;
  --tsk-border-strong: #82908E;
  --tsk-action-primary: #57C88A;
  --tsk-action-primary-hover: #2F8757;
  --tsk-action-accent: #ED8A33;
  --tsk-action-accent-text: #FFFFFF;
  --tsk-focus: #57C88A;
  --tsk-focus-ring: rgba(87,200,138,.22);

}
