/* ROOTA Design Tokens — Level 1.
   여기 값을 바꾸면 사이트 전체 인상이 바뀐다. 화면(pages/*.css)과 컴포넌트는 이 이름만 쓴다.

   두 경로:
   · :root                → legacy 값(index.html 에 있던 :root 를 그대로 옮김) + 의미 토큰의 legacy 매핑.
                            ?ui=legacy 또는 localStorage.rootaUi="legacy" 일 때 예전 화면이 픽셀 그대로 나온다.
   · html.ui2             → UI2(2026-09) 의미 토큰. legacy 이름(--ink, --leaf …)은 여기서 새 값으로 다시 매핑되어
                            아직 옮기지 않은 옛 화면도 같은 팔레트를 따라온다.
   방향: "농업 Bloomberg 처럼 보이되 토스처럼 쉽게" — off-white 캔버스 · 흰 표면 · 차콜 글자 · 초록은 brand/positive 에만 ·
         파랑은 정보/위성 · 앰버 경고 · 빨강 위험 · Pretendard 탭 숫자(2026-09-16 사용자 지시로 모노 글꼴 제외) · 얇은 선 · 적은 그림자 · 낮은 반경 · 높은 밀도. */

/* ══════════ legacy :root (index.html 54~97줄에서 그대로 옮김 — 값 변경 없음) ══════════ */
:root{
  --ink:#09090b;--ink2:#3f3f46;--ink3:#71717a;--ink4:#a1a1aa;
  --moss:#15803d;--leaf:#16a34a;--mint:#22c55e;--glow:#4ade80;
  --soil:#a16207;--sun:#d97706;--sky:#0284c7;--volt:#7c3aed;--alert:#dc2626;
  --paper:#fafafa;--card:#ffffff;--well:#f4f4f5;--line:#e4e4e7;--line2:#f1f1f3;
  --shadow-xs:0 1px 2px rgba(9,9,11,.04);
  --shadow:0 1px 3px rgba(9,9,11,.06),0 1px 2px rgba(9,9,11,.04);
  --shadow-md:0 4px 12px -2px rgba(9,9,11,.08),0 2px 4px -2px rgba(9,9,11,.05);
  --shadow-lg:0 16px 40px -12px rgba(9,9,11,.16),0 4px 10px -4px rgba(9,9,11,.07);
  --r-xs:6px;--r-sm:10px;--r:14px;--r-lg:18px;--r-pill:999px;
  --tint:#f0fdf4;--tint-2:#f7fef9;--tint-3:#bbf7d0;
  --s1:4px;--s2:8px;--s3:12px;--s4:16px;--s5:20px;--s6:24px;--s7:32px;

  /* ── 의미 토큰의 legacy 매핑 — 컴포넌트(components.css)가 legacy 경로에서도 그려지게 ── */
  --bg:var(--paper); --surface:var(--card); --surface-raised:var(--card); --surface-sunken:var(--well); --surface-inverse:#20211a;
  --text-primary:var(--ink); --text-secondary:var(--ink2); --text-muted:var(--ink3); --text-faint:var(--ink4); --text-inverse:#f3f5f2; --text-on-accent:#fff;
  --accent:var(--leaf); --accent-soft:var(--tint); --brand:var(--leaf);
  --positive:var(--moss); --positive-soft:var(--tint); --warning:var(--sun); --warning-soft:#fffbeb; --danger:var(--alert); --danger-soft:#fef2f2; --info:var(--sky); --info-soft:#eff6ff; --neutral:var(--ink3);
  --up:#b91c1c; --down:#1d4ed8;                  /* 시세 상승/하락 글자색(legacy intel.js 값) */
  --border-soft:var(--line); --border-strong:var(--ink4); --border-faint:var(--line2); --focus:var(--sky);
  --radius-sm:var(--r-xs); --radius-md:var(--r-sm); --radius-lg:var(--r); --radius-xl:var(--r-lg); --radius-pill:var(--r-pill); --radius-card:var(--r);
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-7:32px;--space-8:48px;
  --font-sans:"Pretendard Variable",Pretendard,-apple-system,sans-serif; --font-mono:"Pretendard Variable",Pretendard,-apple-system,sans-serif; --font-display:var(--font-sans);
  --fs-xs:11.5px;--fs-sm:13px;--fs-md:14.5px;--fs-lg:17px;--fs-xl:22px;--fs-display:32px;--fs-hero:40px;
  --lh-tight:1.15;--lh:1.55;--tracking-tight:-.02em;--tracking-eyebrow:.08em;
  --density:1;
  --content-max:1440px; --content-padding:16px; --section-gap:24px; --row-height:44px; --table-row-height:36px; --metric-gap:24px; --nav-item-height:44px;
  --sidebar-width:262px; --topbar-height:0px;
  --dur-fast:150ms;--dur:200ms;--ease:cubic-bezier(.2,.7,.2,1);
  --data-1:var(--leaf);--data-2:var(--sky);--data-3:var(--sun);--data-4:var(--volt);--data-5:var(--ink3);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ink:#e9ecef;--ink2:#c2c8ce;--ink3:#9aa2aa;--ink4:#7b848c;
    --paper:#14161a;--card:#1b1f24;--well:#22272e;--line:#2d333b;--line2:#252b32;
    --moss:#1f8f4d;--leaf:#2fa35f;--mint:#4cc47f;--glow:#7ee2a8;
    --tint:#1c3327;--tint-2:#182420;--tint-3:#244834;
    --shadow-xs:0 1px 2px rgba(0,0,0,.3);
    --shadow:0 1px 2px rgba(0,0,0,.32),0 6px 16px -6px rgba(0,0,0,.5);
    --shadow-md:0 2px 4px rgba(0,0,0,.34),0 14px 30px -12px rgba(0,0,0,.55);
    --shadow-lg:0 4px 10px rgba(0,0,0,.36),0 30px 60px -20px rgba(0,0,0,.62);
    --warning-soft:#3a2a10; --danger-soft:#3a1a1a; --info-soft:#14243a; --up:#ffb4a8; --down:#8fd8ff;
  }
}
:root[data-theme="dark"] {
  --ink:#e9ecef;--ink2:#c2c8ce;--ink3:#9aa2aa;--ink4:#7b848c;
  --paper:#14161a;--card:#1b1f24;--well:#22272e;--line:#2d333b;--line2:#252b32;
  --moss:#1f8f4d;--leaf:#2fa35f;--mint:#4cc47f;--glow:#7ee2a8;
  --tint:#1c3327;--tint-2:#182420;--tint-3:#244834;
  --shadow-xs:0 1px 2px rgba(0,0,0,.3);
  --shadow:0 1px 2px rgba(0,0,0,.32),0 6px 16px -6px rgba(0,0,0,.5);
  --shadow-md:0 2px 4px rgba(0,0,0,.34),0 14px 30px -12px rgba(0,0,0,.55);
  --shadow-lg:0 4px 10px rgba(0,0,0,.36),0 30px 60px -20px rgba(0,0,0,.62);
  --warning-soft:#3a2a10; --danger-soft:#3a1a1a; --info-soft:#14243a; --up:#ffb4a8; --down:#8fd8ff;
}

/* ══════════ UI2 — 2026-09 "Agricultural Intelligence & Distribution OS" ══════════
   Intelligence = Bloomberg 50 / Stripe 30 / Toss 20 · Farm = Toss 60 · Distribution = Linear 40 / Bloomberg 40 */
html.ui2{
  /* 캔버스·표면 */
  --bg:#f5f6f5; --surface:#ffffff; --surface-raised:#ffffff; --surface-sunken:#eef0ee; --surface-inverse:#111514;
  /* 글자 */
  --text-primary:#161a18; --text-secondary:#454c49; --text-muted:#737b77; --text-faint:#a3aaa6; --text-inverse:#eef1ef; --text-on-accent:#ffffff;
  /* 강조 — 딥 네이비/잉크. 초록은 brand 표식과 positive 상태에만 */
  --accent:#1c2f45; --accent-soft:#e8edf3; --brand:#1f6b47;
  --positive:#237a4e; --positive-soft:#e6f2ea; --warning:#a86a12; --warning-soft:#fbf3e3; --danger:#b23a34; --danger-soft:#f9e9e7; --info:#245f9e; --info-soft:#e7eff8; --neutral:#737b77;
  --up:#b23a34; --down:#245f9e;                  /* 시세: 상승 빨강 · 하락 파랑(국내 관행) */
  /* 선 — 얇고 또렷 */
  --border-soft:#e3e6e4; --border-strong:#c6cbc8; --border-faint:#eef0ee; --focus:#245f9e;
  /* 반경 — 낮게 */
  --radius-sm:3px; --radius-md:6px; --radius-lg:8px; --radius-xl:12px; --radius-pill:999px; --radius-card:var(--radius-lg);
  /* 간격 4px 격자 · 밀도 계수 — "더 촘촘하게" = --density 0.85 하나 */
  --density:1;
  --space-1:calc(4px*var(--density));--space-2:calc(8px*var(--density));--space-3:calc(12px*var(--density));--space-4:calc(16px*var(--density));
  --space-5:calc(20px*var(--density));--space-6:calc(24px*var(--density));--space-7:calc(32px*var(--density));--space-8:calc(48px*var(--density));
  --content-padding:calc(24px*var(--density)); --section-gap:calc(28px*var(--density)); --row-height:calc(40px*var(--density)); --table-row-height:calc(34px*var(--density));
  --metric-gap:calc(28px*var(--density)); --nav-item-height:calc(34px*var(--density));
  /* 그림자 — 거의 없음 */
  --shadow-xs:0 1px 1px rgba(22,26,24,.04); --shadow-sm:0 1px 2px rgba(22,26,24,.06); --shadow:var(--shadow-sm);
  --shadow-md:0 3px 10px rgba(22,26,24,.07); --shadow-lg:0 12px 30px rgba(22,26,24,.10);
  /* 타이포 — 큰 숫자는 Mono, 제목은 tight */
  --font-sans:"Pretendard Variable",Pretendard,-apple-system,"Apple SD Gothic Neo",sans-serif; --font-mono:"Pretendard Variable",Pretendard,-apple-system,"Apple SD Gothic Neo",sans-serif; --font-display:var(--font-sans);
  --fs-xs:11.5px;--fs-sm:12.5px;--fs-md:14px;--fs-lg:16px;--fs-xl:20px;--fs-display:30px;--fs-hero:42px;
  --lh-tight:1.1;--lh:1.5;--tracking-tight:-.02em;--tracking-eyebrow:.1em;
  /* 셸 */
  --sidebar-width:236px; --topbar-height:0px; --content-max:1360px;
  /* 데이터 계열 */
  --data-1:#1c2f45;--data-2:#245f9e;--data-3:#a86a12;--data-4:#237a4e;--data-5:#8a918d;
  --dur-fast:150ms;--dur:200ms;--ease:cubic-bezier(.2,.7,.2,1);

  /* legacy alias → 옛 화면도 새 팔레트를 따라온다(초록 브랜드 → 잉크). 초록은 --moss(positive) 로만 남긴다. */
  --ink:var(--text-primary);--ink2:var(--text-secondary);--ink3:var(--text-muted);--ink4:var(--text-faint);
  --paper:var(--bg);--card:var(--surface);--well:var(--surface-sunken);--line:var(--border-soft);--line2:var(--border-faint);
  --leaf:var(--accent);--moss:var(--positive);--mint:#3a5878;--glow:#6f8fb3;--tint:var(--accent-soft);--tint-2:#f2f5f8;--tint-3:#cfd9e4;
  --sun:var(--warning);--alert:var(--danger);--sky:var(--info);--volt:#5b5f9e;--soil:#8a6a2b;
  --r-xs:var(--radius-sm);--r-sm:var(--radius-md);--r:var(--radius-lg);--r-lg:var(--radius-xl);--r-pill:var(--radius-pill);
  --s1:var(--space-1);--s2:var(--space-2);--s3:var(--space-3);--s4:var(--space-4);--s5:var(--space-5);--s6:var(--space-6);--s7:var(--space-7);
}
@media (prefers-color-scheme: dark) {
  html.ui2:not([data-theme="light"]) {
    --bg:#0f1312; --surface:#161b19; --surface-raised:#1b2120; --surface-sunken:#1d2321; --surface-inverse:#0a0d0c;
    --text-primary:#e8ebe9; --text-secondary:#bfc5c2; --text-muted:#8e9692; --text-faint:#646b68; --text-inverse:#eef1ef; --text-on-accent:#0f1312;
    --accent:#9db4cf; --accent-soft:#1c2733; --brand:#3f9a6c;
    --positive:#4fae7d; --positive-soft:#16302a; --warning:#d39a3c; --warning-soft:#302614; --danger:#e07a73; --danger-soft:#3a1d1c; --info:#6ea4e6; --info-soft:#16253a;
    --up:#ffb4a8; --down:#8fd8ff;
    --border-soft:#262d2a; --border-strong:#3b433f; --border-faint:#1e2523;
    --shadow-xs:0 1px 2px rgba(0,0,0,.3); --shadow-sm:0 1px 2px rgba(0,0,0,.35); --shadow-md:0 4px 12px rgba(0,0,0,.45); --shadow-lg:0 12px 30px rgba(0,0,0,.55);
    --mint:#6f8fb3;--glow:#9db4cf;--tint-2:#151c22;--tint-3:#2b3a48;
  }
}
html.ui2[data-theme="dark"] {
  --bg:#0f1312; --surface:#161b19; --surface-raised:#1b2120; --surface-sunken:#1d2321; --surface-inverse:#0a0d0c;
  --text-primary:#e8ebe9; --text-secondary:#bfc5c2; --text-muted:#8e9692; --text-faint:#646b68; --text-inverse:#eef1ef; --text-on-accent:#0f1312;
  --accent:#9db4cf; --accent-soft:#1c2733; --brand:#3f9a6c;
  --positive:#4fae7d; --positive-soft:#16302a; --warning:#d39a3c; --warning-soft:#302614; --danger:#e07a73; --danger-soft:#3a1d1c; --info:#6ea4e6; --info-soft:#16253a;
  --up:#ffb4a8; --down:#8fd8ff;
  --border-soft:#262d2a; --border-strong:#3b433f; --border-faint:#1e2523;
  --shadow-xs:0 1px 2px rgba(0,0,0,.3); --shadow-sm:0 1px 2px rgba(0,0,0,.35); --shadow-md:0 4px 12px rgba(0,0,0,.45); --shadow-lg:0 12px 30px rgba(0,0,0,.55);
  --mint:#6f8fb3;--glow:#9db4cf;--tint-2:#151c22;--tint-3:#2b3a48;
}