/* TrendPulse design tokens. Colors are RGB channels so Tailwind can apply
   opacity (rgb(var(--c-x) / <alpha-value>)). Light is the default; dark applies
   via prefers-color-scheme unless the reader picked a theme (data-theme). */
:root {
  color-scheme: light;
  --c-canvas: 248 250 252;        /* #F8FAFC */
  --c-surface: 255 255 255;       /* #FFFFFF */
  --c-surface-2: 241 245 249;     /* #F1F5F9 subtle fill */
  --c-line: 226 232 240;          /* #E2E8F0 */
  --c-line-strong: 203 213 225;   /* #CBD5E1 */
  --c-ink-strong: 15 23 42;       /* #0F172A */
  --c-ink: 51 65 85;              /* #334155 */
  --c-ink-muted: 100 116 139;     /* #64748B */
  --c-brand: 67 56 202;           /* #4338CA text/link */
  --c-brand-soft: 238 242 255;    /* #EEF2FF */
  --c-brand-fill: 67 56 202;      /* filled buttons */
  --c-brand-fill-hover: 55 48 163;
  --c-on-brand: 255 255 255;
  --c-verified: 4 120 87;         /* #047857 */
  --c-verified-soft: 236 253 245;
  --c-caution: 180 83 9;          /* #B45309 */
  --c-caution-soft: 255 251 235;
  --c-danger: 190 18 60;          /* #BE123C */
  --c-danger-soft: 255 241 242;
  --c-up: 225 29 72;              /* #E11D48 (KR market: rise = red) */
  --c-down: 37 99 235;            /* #2563EB */
  --c-overlay: 15 23 42;

  --font-sans: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", system-ui, Roboto, sans-serif;
  --fs-12: 12px; --fs-13: 13px; --fs-15: 15px; --fs-17: 17px; --fs-20: 20px; --fs-24: 24px; --fs-30: 30px;
  --lh-body: 1.75; --measure: 68ch;
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;
  --r-sm: 8px; --r-md: 12px; --r-lg: 16px; --r-pill: 999px;
  --shadow-1: 0 1px 2px rgb(15 23 42 / .05);
  --shadow-2: 0 8px 24px rgb(15 23 42 / .08);
  --focus: 0 0 0 3px rgb(var(--c-brand) / .35);
  --header-h: 60px; --tabbar-h: 56px;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --c-canvas: 11 17 32;          /* #0B1120 */
    --c-surface: 17 24 39;         /* #111827 */
    --c-surface-2: 23 32 51;       /* #172033 */
    --c-line: 31 41 55;            /* #1F2937 */
    --c-line-strong: 51 65 85;
    --c-ink-strong: 241 245 249;   /* #F1F5F9 */
    --c-ink: 203 213 225;          /* #CBD5E1 */
    --c-ink-muted: 148 163 184;    /* #94A3B8 */
    --c-brand: 129 140 248;        /* #818CF8 */
    --c-brand-soft: 30 27 75;      /* #1E1B4B */
    --c-brand-fill: 99 102 241;
    --c-brand-fill-hover: 129 140 248;
    --c-on-brand: 255 255 255;
    --c-verified: 52 211 153;
    --c-verified-soft: 6 44 34;
    --c-caution: 251 191 36;
    --c-caution-soft: 45 31 6;
    --c-danger: 251 113 133;
    --c-danger-soft: 60 10 24;
    --c-up: 251 113 133;
    --c-down: 96 165 250;
    --c-overlay: 2 6 23;
    --shadow-1: 0 1px 2px rgb(0 0 0 / .4);
    --shadow-2: 0 8px 24px rgb(0 0 0 / .45);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --c-canvas: 11 17 32;
  --c-surface: 17 24 39;
  --c-surface-2: 23 32 51;
  --c-line: 31 41 55;
  --c-line-strong: 51 65 85;
  --c-ink-strong: 241 245 249;
  --c-ink: 203 213 225;
  --c-ink-muted: 148 163 184;
  --c-brand: 129 140 248;
  --c-brand-soft: 30 27 75;
  --c-brand-fill: 99 102 241;
  --c-brand-fill-hover: 129 140 248;
  --c-on-brand: 255 255 255;
  --c-verified: 52 211 153;
  --c-verified-soft: 6 44 34;
  --c-caution: 251 191 36;
  --c-caution-soft: 45 31 6;
  --c-danger: 251 113 133;
  --c-danger-soft: 60 10 24;
  --c-up: 251 113 133;
  --c-down: 96 165 250;
  --c-overlay: 2 6 23;
  --shadow-1: 0 1px 2px rgb(0 0 0 / .4);
  --shadow-2: 0 8px 24px rgb(0 0 0 / .45);
}