/* ============================================================
   tokens.css — Fitrip 모든 디자인 토큰 (CSS 변수만, 렌더 규칙 없음)
   shadcn HSL 토큰 + 별칭 + Fitrip v2 페이지 토큰(--ft-*).
   변수만 담으므로 어떤 페이지가 링크해도 라이트 외관 불변.
   ============================================================ */

:root {
    color-scheme: light;

    /* ── 1-1. shadcn 표준 토큰 (HSL 채널값) ──────────────── */
    --background:            42 33% 95%;       /* #f6f2ea */
    --foreground:            220 18% 11%;      /* #171c21 */

    --card:                  0 0% 100%;        /* #ffffff */
    --card-foreground:       220 18% 11%;      /* #171c21 */

    --popover:               0 0% 100%;        /* #ffffff */
    --popover-foreground:    220 18% 11%;      /* #171c21 */

    --primary:               189 100% 43%;     /* #00bbdd */
    --primary-foreground:    196 100% 12%;     /* #003845 */
    --primary-text:          189 100% 29%;     /* #007e94 */
    --primary-hover:         189 100% 36%;     /* #009ab8 */

    --secondary:             42 23% 92%;       /* #eee8dc */
    --secondary-foreground:  220 18% 11%;      /* #171c21 */

    --muted:                 40 18% 88%;       /* #e4ddd0 */
    --muted-foreground:      220 10% 35%;      /* #515862 */

    --accent-hsl:            29 84% 65%;       /* #f0ac5d */
    --accent-foreground:     220 18% 11%;      /* #171c21 */

    --destructive:           354 74% 60%;      /* #e55f6d */
    --destructive-foreground: 0 0% 100%;       /* #ffffff */

    --input:                 36 14% 78%;       /* #cec4b6 */
    --ring:                  189 100% 43%;     /* #00bbdd */
    --radius:                0.625rem;         /* 10px */

    /* ── 1-3. 시맨틱 상태 (HSL 채널값) ──────────────────── */
    --success-hsl:           145 42% 46%;      /* #4aa86d */
    --success-foreground:    0 0% 100%;
    --warning-hsl:           32 83% 63%;       /* #efa45a */
    --warning-foreground:    220 18% 11%;
    --danger-hsl:            354 74% 60%;      /* #e55f6d */
    --danger-foreground:     0 0% 100%;

    /* ── 1-4. 텍스트 단계 (HSL 채널값) ──────────────────── */
    --text-primary-hsl:      220 18% 11%;      /* = foreground */
    --text-secondary-hsl:    220 10% 35%;      /* #515862 */
    --text-muted-hsl:        220 8% 55%;       /* #838993 */

    /* ── 1-5. 표면 단계 (HSL 채널값) ────────────────────── */
    --surface:               0 0% 100%;        /* = card */
    --surface-2:             42 23% 92%;       /* = secondary */
    --surface-3:             40 18% 88%;       /* = muted */

    /* ── 1-6. Radius 스케일 ─────────────────────────────── */
    --radius-sm:             0.625rem;         /* 10px */
    --radius-md:             0.875rem;         /* 14px */
    --radius-lg:             1.25rem;          /* 20px */
    --radius-xl:             var(--radius-lg); /* v2: 10 / 14 / 20 / full */
    --radius-full:           999px;
    --radius-pill:           999px;

    /* ── 1-7. Spacing Scale (4px 기반) ──────────────────── */
    --space-1:               0.25rem;          /* 4px */
    --space-2:               0.5rem;           /* 8px */
    --space-3:               0.75rem;          /* 12px */
    --space-4:               1rem;             /* 16px */
    --space-5:               1.25rem;          /* 20px */
    --space-6:               1.5rem;           /* 24px */
    --space-8:               2rem;             /* 32px */
    --space-10:              2.5rem;           /* 40px */
    --space-12:              3rem;             /* 48px */
    --space-16:              4rem;             /* 64px */

    /* ── 1-8. 레이아웃 ──────────────────────────────────── */
    --navbar-h:              52px;
    --z-toast:               9000;
    --z-modal:               9999;

    /* ── 1-9. 애니메이션 ────────────────────────────────── */
    --duration-fast:         0.15s;
    --duration-normal:       0.30s;
    --duration-slow:         0.50s;

    /* ── 1-10. 타이포그래피 ─────────────────────────────── */
    --font-sans:             'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
    /* serif(Instrument Serif) 제거 — 전 사이트 Pretendard 통일, 숫자/영문 일부만 mono */
    --font-display:          var(--font-sans);
    --font-mono:             'JetBrains Mono', 'Pretendard', 'SFMono-Regular', Consolas, monospace;
    --font-body-weight:      400;
    --line-height-body:      1.6;
    --letter-spacing-heading: -0.02em;
    --letter-spacing-label:  0.06em;

    /* [P2 dead var] --sidebar-*, --chart-* (shadcn 호환 토큰) 제거됨
       — 사용처 0 (grep 검증: 2026-05-29). 사이드바/차트 도입 시 재추가 */

    /* ── 1-15. 하위 호환 별칭 (기존 컴포넌트 대응) ──────── */
    /* shadcn HSL 토큰에서 파생 — 단일 소스로 양쪽 호환 */

    /* 브랜드 */
    --brand:         hsl(var(--primary));
    --brand-hover:   hsl(var(--primary-hover));
    --brand-soft:    hsl(var(--primary) / 0.10);
    /* --brand-text는 브랜드 시안/잉크 배경 위 텍스트 색.
       --primary-foreground(196 100% 12% = #003845)와 달리 흰색이 의도임 — 버튼·뱃지·아이콘용.
       흰색 단일 소스는 --on-brand. --brand-text는 하위 호환 별칭. */
    --on-brand:      #ffffff;
    --brand-text:    var(--on-brand);

    /* 보조 색상 */
    --accent:        hsl(var(--accent-hsl));

    /* 시맨틱 상태 (해석값) */
    --success:         hsl(var(--success-hsl));
    --success-bg:      hsl(var(--success-hsl) / 0.10);
    --success-border:  hsl(var(--success-hsl) / 0.30);
    --warning:         hsl(var(--warning-hsl));
    --warning-bg:      hsl(var(--warning-hsl) / 0.10);
    --warning-border:  hsl(var(--warning-hsl) / 0.30);
    --danger:          hsl(var(--danger-hsl));
    --danger-bg:       hsl(var(--danger-hsl) / 0.06);
    --danger-border:   hsl(var(--danger-hsl) / 0.25);
    --danger-shadow:   hsl(var(--danger-hsl) / 0.28);
    --overlay-scrim:   hsl(var(--foreground) / 0.42);
    --media-scrim:     hsl(var(--foreground) / 0.58);
    --on-brand-soft:   hsl(0 0% 100% / 0.16);
    --on-brand-muted:  hsl(0 0% 100% / 0.84);
    --scrollbar-thumb:        var(--line-2);
    --scrollbar-thumb-hover:  hsl(var(--foreground) / 0.24);
    --scrollbar-thumb-active: hsl(var(--foreground) / 0.32);

    /* 배경 */
    --bg-body:       hsl(var(--background));
    --bg-surface:    hsl(var(--card));
    --bg-surface-2:  hsl(var(--secondary));
    --bg-surface-3:  hsl(var(--muted));
    --bg-navbar:     hsl(var(--background));
    --bg:            var(--bg-surface);
    --bg-soft:       var(--bg-body);
    --bg-tint:       var(--bg-surface-2);

    /* 텍스트 */
    --text-1:        hsl(var(--foreground));
    --text-2:        hsl(var(--text-secondary-hsl));
    --text-3:        hsl(var(--text-muted-hsl));
    --ink:           var(--text-1);
    --ink-2:         var(--text-2);
    --ink-3:         var(--text-3);

    /* 테두리 */
    --border:        hsl(36 16% 82%);
    --border-strong: hsl(var(--input));
    --line:          var(--border);
    --line-2:        var(--border-strong);

    /* 그림자 — soft elevation */
    --shadow-line:    0 0 0 1px var(--line);
    --shadow-sm:      0 1px 2px rgba(20,22,30,0.04), 0 2px 8px -3px rgba(20,22,30,0.06);
    --shadow-md:      0 1px 2px rgba(20,22,30,0.04), 0 8px 24px -12px rgba(20,22,30,0.10);
    --shadow-lg:      0 1px 2px rgba(20,22,30,0.04), 0 24px 48px -20px rgba(20,22,30,0.14);
    --shadow-brand:    var(--shadow-md);
    --shadow-brand-sm: var(--shadow-sm);
    --shadow-brand-lg: var(--shadow-lg);
    --focus-ring:      0 0 0 3px hsl(var(--ring) / 0.16);  /* 입력 포커스 글로우 */

    /* 시맨틱 그림자 */
    --shadow-danger:     0 1px 2px rgba(20, 24, 31, 0.05), 0 12px 24px -18px rgba(229, 95, 109, 0.28);
    --shadow-danger-md:  0 1px 2px rgba(20, 24, 31, 0.05), 0 20px 40px -18px rgba(229, 95, 109, 0.30);
    --shadow-warning:    0 1px 2px rgba(20, 24, 31, 0.05), 0 12px 24px -18px rgba(239, 164, 90, 0.22);
    --shadow-success:    0 1px 2px rgba(20, 24, 31, 0.05), 0 12px 24px -18px rgba(74, 168, 109, 0.22);
    --shadow-success-md: 0 1px 2px rgba(20, 24, 31, 0.05), 0 20px 40px -18px rgba(74, 168, 109, 0.24);

    /* v2 component tokens — 10 / 14 / 20 / full radius system */
    --control-h-sm:       2.5rem;   /* 40px */
    --control-h:          3rem;     /* 48px */
    --control-h-md:       3.25rem;  /* 52px */
    --control-h-lg:       3.5rem;   /* 56px */
    --control-h-xl:       4.25rem;  /* 68px */
    --button-h:           2.625rem; /* 42px */
    --topbar-action-h:    2.25rem;  /* 36px */
    --control-radius:     var(--radius-full);
    --field-h:            3.5rem;   /* 56px */
    --field-radius:       var(--radius-lg);
    --surface-radius:     var(--radius-lg);
    --card-radius:        var(--radius-lg);
    --item-radius:        var(--radius-md);
    --chip-radius:        var(--radius-full);
    --icon-radius:        var(--radius-full);
    --menu-radius:        var(--radius-lg);
    --menu-item-radius:   var(--radius-md);
    --media-bg:           var(--bg-tint);
    --media-fg:           var(--ink);
    /* 카테고리 썸네일 그라데이션 (디자인 방향 v2 Pattern A thumb 컨셉) */
    --grad-warm:          linear-gradient(135deg, #ffeed0 0%, #ffd3a5 100%);
    --grad-cyan:          linear-gradient(135deg, #c9eef5 0%, #00bbdd 100%);
    --grad-pink:          linear-gradient(135deg, #ffd3d8 0%, #ff7e8a 100%);
    --grad-green:         linear-gradient(135deg, #d8e8c8 0%, #7eb88f 100%);
    --grad-amber:         linear-gradient(135deg, #ffeed0 0%, #ffb878 100%);  /* dcard .ph 기본 */
    --grad-gold:          linear-gradient(135deg, #efe2c4 0%, #c9a96b 100%);  /* dcard.e / trip.paris */
    --grad-blue:          linear-gradient(135deg, #c9d6f5 0%, #6f86c4 100%);  /* dcard.f */
    --grad-rose:          linear-gradient(135deg, #ffd3d8 0%, #ff5d6c 100%);  /* 선택목록 thumb.c */
    /* 사진 위 스크림·반투명 칩·별점 — 페이지 로컬 raw 값 중앙화 */
    --scrim-card:         linear-gradient(180deg, transparent 60%, rgba(0,0,0,0.25) 100%);
    --scrim-cover:        linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.32) 100%);
    --glass-light:        rgba(255,255,255,0.92);
    --rating-star:        #f4a261;
    /* 활동 보조 팔레트 (v2 — DESIGN.md: Day/상태/오버레이 색은 보조 팔레트 별도) */
    --act-cafe-hsl:       24 40% 44%;     /* 차분한 모카 — cafe (danger 빨강과 구분) */
    --act-shopping-hsl:   286 26% 52%;    /* 차분한 플럼 — shopping (cafe/danger와 구분) */
    --act-restaurant:     var(--accent);
    --act-cafe:           hsl(var(--act-cafe-hsl));
    --act-cafe-bg:        hsl(var(--act-cafe-hsl) / 0.09);
    --act-cafe-border:    hsl(var(--act-cafe-hsl) / 0.28);
    --act-accommodation:  var(--brand);
    --act-shopping:       hsl(var(--act-shopping-hsl));
    --act-shopping-bg:    hsl(var(--act-shopping-hsl) / 0.09);
    --act-shopping-border: hsl(var(--act-shopping-hsl) / 0.28);

    /* 브랜드 알파 유틸리티 — 실제 사용되는 값만 유지 */
    --brand-10: hsl(var(--primary) / 0.10);
    --brand-20: hsl(var(--primary) / 0.20);
    --brand-25: hsl(var(--primary) / 0.25);
    --brand-50: hsl(var(--primary) / 0.50);

    /* 선택/hover 상태 전용 — 웜 뉴트럴 표면색을 인터랙션 피드백에 쓰지 않음 */
    --selection-surface: hsl(var(--primary) / 0.045);
    --selection-hover-bg: hsl(var(--primary) / 0.08);
    --selection-active-bg: hsl(var(--primary) / 0.14);
    --selection-active-border: hsl(var(--primary) / 0.30);
    --selection-active-text: hsl(var(--primary-text));

    /* ── Fitrip v2 페이지 색 토큰 (--ft-*) ───────────────── */
    --ft-bg:          #ffffff;
    --ft-surface:     #ffffff;
    --ft-surface-2:   #fbfdfe;
    --ft-chip:        #f2f7f9;
    --ft-cyan-soft:   #e6f8fc;
    --ft-glow:        #ecf9fc;
    --ft-ink:         #0d1b22;
    --ft-ink-2:       #4a5860;
    --ft-muted:       #8a97a0;
    --ft-faint:       #c4cdd2;
    --ft-border:      #eef2f4;
    --ft-border-2:    #e3ecef;
    --ft-cyan-text:   #007e94;
    --ft-cyan-border: #9fdfee;
    --ft-path:        #cdeef6;
    --ft-bar:         #d4eef5;
    --ft-map-bg:      #e7eef0;
    --ft-map-grid:    #ffffff;
    --ft-cta-bg:      #0d1b22;
    --ft-header-bg:   rgba(255,255,255,0.86);
    --ft-ok-soft:     #e9f8ee;
    --ft-ok-text:     #2e7d4f;

    /* ── 페이지 하드코딩 제거용 토큰 (per-page 에이전트가 var()로 치환) ──
       시안 #00bbdd 솔리드/알파/그림자, 시안 호버 음영, 잉크 #0d1b22 계열,
       카테고리 팔레트, 위험 적색 — 라이트/다크 양쪽에서 일관 동작. */

    /* 브랜드 시안 솔리드 + 호버 음영 (page #00bbdd / #00a9c8) */
    --brand-cyan:        #00bbdd;
    --brand-cyan-link:   #00a9c8;   /* 텍스트 링크 hover용 살짝 짙은 시안 */
    --on-cyan-ink:       #003845;   /* 시안 배경 위 진한 잉크 텍스트(= --primary-foreground) */

    /* 브랜드 시안 알파 — 페이지가 실제로 쓰는 알파 단계만 (rgba(0,187,221,a)) */
    --brand-a08:  rgba(0,187,221,0.08);
    --brand-a10:  rgba(0,187,221,0.10);
    --brand-a13:  rgba(0,187,221,0.13);
    --brand-a14:  rgba(0,187,221,0.14);
    --brand-a16:  rgba(0,187,221,0.16);
    --brand-a18:  rgba(0,187,221,0.18);
    --brand-a28:  rgba(0,187,221,0.28);
    --brand-a30:  rgba(0,187,221,0.30);
    --brand-a35:  rgba(0,187,221,0.35);
    --brand-a50:  rgba(0,187,221,0.50);
    --brand-a55:  rgba(0,187,221,0.55);
    --brand-a70:  rgba(0,187,221,0.70);

    /* 시안 그림자 음영 (rgba(0,150,180,a)) — 버튼/칩 hover glow */
    --brand-shadow-a25: rgba(0,150,180,0.25);
    --brand-shadow-a28: rgba(0,150,180,0.28);
    --brand-shadow-a30: rgba(0,150,180,0.30);
    --brand-shadow-a45: rgba(0,150,180,0.45);
    /* 입력 포커스 글로우 (page: 0 0 0 4px rgba(0,187,221,0.14)) */
    --brand-focus-glow: 0 0 0 4px var(--brand-a14);
    /* CTA hover 리프트 글로우 (page: 0 10px 24px -10px rgba(0,187,221,0.55)) */
    --brand-cta-glow:   0 10px 24px -10px var(--brand-a55);

    /* 잉크 #0d1b22 솔리드 + 알파 스크림 (rgba(13,27,34,a)) */
    --ink-solid:   #0d1b22;          /* = --ft-ink / --ft-cta-bg */
    --ink-a12:  rgba(13,27,34,0.12);
    --ink-a16:  rgba(13,27,34,0.16);
    --ink-a18:  rgba(13,27,34,0.18);
    --ink-a20:  rgba(13,27,34,0.20);
    --ink-a22:  rgba(13,27,34,0.22);
    --ink-a25:  rgba(13,27,34,0.25);
    --ink-a28:  rgba(13,27,34,0.28);
    --ink-a30:  rgba(13,27,34,0.30);
    --ink-a32:  rgba(13,27,34,0.32);
    --ink-a35:  rgba(13,27,34,0.35);
    --ink-a40:  rgba(13,27,34,0.40);
    --ink-a45:  rgba(13,27,34,0.45);
    --ink-a50:  rgba(13,27,34,0.50);
    --ink-a55:  rgba(13,27,34,0.55);
    --ink-a62:  rgba(13,27,34,0.62);
    --ink-a72:  rgba(13,27,34,0.72);
    --ink-a80:  rgba(13,27,34,0.80);

    /* 위험 적색 (page: #c0392b 텍스트 / #e8b4b4 연한 보더) */
    --ft-danger:        #c0392b;
    --ft-danger-soft:   #e8b4b4;
    /* 잉크 hover 음영 (page: #24333c — next 버튼 hover 등) */
    --ink-hover:        #24333c;

    /* 카테고리 팔레트 (목적지 도트/마커 — destinations RAIL_DOTS 는 8색 순환, day/act 도트는 1~4 사용) */
    --ft-cat-1:  #00bbdd;   /* = brand 시안 */
    --ft-cat-2:  #f0ac5d;   /* 앰버 */
    --ft-cat-3:  #7eb88f;   /* 세이지 그린 */
    --ft-cat-4:  #8b7ec8;   /* 라벤더 */
    --ft-cat-5:  #d98aa6;   /* 로즈 */
    --ft-cat-6:  #5fb0c4;   /* 틸 */
    --ft-cat-7:  #8fae6b;   /* 올리브 */
    --ft-cat-8:  #caa15e;   /* 골드 */
    /* 별점/평점 골드 (page #f0ac5d) — 카테고리 2와 같은 색이나 의미 분리 */
    --ft-rating-gold:  #f0ac5d;
    /* 요일 액센트 (캘린더 일/토 — 의도적 고정값) */
    --ft-weekend-sun:  #d06a5e;
    --ft-weekend-sat:  #4a7fb5;
    /* 영업중 배지 연노랑 (itinerary #fff8ed / #8a6d3b) */
    --ft-open-soft:    #fff8ed;
    --ft-open-text:    #8a6d3b;
}

[data-theme="dark"] {
    color-scheme: dark;

    /* ── shadcn 표준 오버라이드 (v3: 시안 중립 다크 팔레트) ── */
    --background:            240 6% 4%;        /* #0a0a0b */
    --foreground:            240 3% 93%;       /* #ededee */

    --card:                  240 4% 9%;        /* #161618 */
    --card-foreground:       240 3% 93%;       /* #ededee */

    --popover:               240 4% 9%;        /* #161618 */
    --popover-foreground:    240 3% 93%;       /* #ededee */

    --primary-foreground:    222 65% 7%;       /* #080e1d */
    /* 다크에서 브랜드 텍스트/링크는 밝은 시안으로 (다크 배경 가독성) */
    --primary-text:          191 79% 59%;      /* #43cdeb */

    --secondary:             240 4% 13%;       /* #202023 */
    --secondary-foreground:  240 3% 93%;       /* #ededee */

    --muted:                 240 4% 19%;       /* #2e2e32 */
    --muted-foreground:      240 4% 62%;       /* #9b9ba1 */

    --accent-hsl:            32 72% 62%;       /* #e7a964 */
    --accent-foreground:     220 18% 11%;

    --destructive:           354 78% 66%;      /* #eb6877 */
    --destructive-foreground: 0 0% 100%;

    --input:                 240 4% 30%;       /* #494950 */
    --ring:                  189 100% 43%;

    /* ── 시맨틱 상태 — 다크 ─────────────────────────────── */
    --danger-hsl:            354 78% 66%;      /* #eb6877 */

    /* 활동 보조 팔레트 — 다크 (라이트보다 밝게) */
    --act-cafe-hsl:          26 45% 62%;
    --act-shopping-hsl:      286 32% 70%;

    /* ── 텍스트 단계 — 다크 ─────────────────────────────── */
    --text-primary-hsl:      240 3% 93%;
    --text-secondary-hsl:    240 3% 69%;       /* #aeaeb3 */
    --text-muted-hsl:        240 4% 56%;       /* #8c8c93 */

    /* ── 표면 단계 — 다크 ───────────────────────────────── */
    --surface:               240 4% 9%;        /* #161618 */
    --surface-2:             240 4% 13%;       /* #202023 */
    --surface-3:             240 4% 19%;       /* #2e2e32 */

    /* ── 기존 호환 별칭 — 다크 오버라이드 ───────────────── */
    --brand-soft:    hsl(var(--primary) / 0.14);
    /* 라이트와 동일 의도 — 다크에서도 브랜드/잉크 배경 위 흰 텍스트(--on-brand 상속). */

    --success-bg:      hsl(var(--success-hsl) / 0.12);
    --success-border:  hsl(var(--success-hsl) / 0.25);
    --warning-bg:      hsl(var(--warning-hsl) / 0.12);
    --warning-border:  hsl(var(--warning-hsl) / 0.25);
    --danger-bg:       hsl(var(--danger-hsl) / 0.10);
    --danger-border:   hsl(var(--danger-hsl) / 0.30);
    --danger-shadow:   hsl(var(--danger-hsl) / 0.20);
    --overlay-scrim:   hsl(0 0% 0% / 0.46);
    --media-scrim:     hsl(0 0% 0% / 0.62);
    --on-brand-soft:   hsl(0 0% 100% / 0.14);
    --on-brand-muted:  hsl(0 0% 100% / 0.82);
    --scrollbar-thumb:        hsl(var(--foreground) / 0.14);
    --scrollbar-thumb-hover:  hsl(var(--foreground) / 0.26);
    --scrollbar-thumb-active: hsl(var(--foreground) / 0.32);

    --border:        hsl(240 5% 18%);         /* #2b2b30 */

    --shadow-sm:      0 1px 2px rgba(0, 0, 0, 0.28), 0 10px 24px -18px rgba(0, 0, 0, 0.40);
    --shadow-md:      0 1px 2px rgba(0, 0, 0, 0.30), 0 20px 48px -24px rgba(0, 0, 0, 0.46);
    --shadow-lg:      0 1px 2px rgba(0, 0, 0, 0.34), 0 36px 80px -28px rgba(0, 0, 0, 0.54);
    --shadow-brand:    var(--shadow-md);
    --shadow-brand-sm: var(--shadow-sm);
    --shadow-brand-lg: var(--shadow-lg);

    --shadow-danger:     0 1px 2px rgba(0, 0, 0, 0.28), 0 14px 30px -18px rgba(235, 104, 119, 0.24);
    --shadow-danger-md:  0 1px 2px rgba(0, 0, 0, 0.28), 0 22px 44px -18px rgba(235, 104, 119, 0.26);
    --shadow-warning:    0 1px 2px rgba(0, 0, 0, 0.28), 0 14px 30px -18px rgba(231, 169, 100, 0.20);
    --shadow-success:    0 1px 2px rgba(0, 0, 0, 0.28), 0 14px 30px -18px rgba(74, 168, 109, 0.20);
    --shadow-success-md: 0 1px 2px rgba(0, 0, 0, 0.28), 0 22px 44px -18px rgba(74, 168, 109, 0.22);

    --selection-surface: hsl(var(--primary) / 0.10);
    --selection-hover-bg: hsl(var(--primary) / 0.16);
    --selection-active-bg: hsl(var(--primary) / 0.22);
    --selection-active-border: hsl(var(--primary) / 0.38);
    --selection-active-text: hsl(var(--primary));

    /* [P2 dead var] --sidebar-*, --chart-* 다크 오버라이드 제거됨 — 사용처 0 */

    /* ── Fitrip v2 페이지 색 토큰 — 다크 (중립) ──────────── */
    --ft-bg:          #0a0a0b;
    --ft-surface:     #161618;
    --ft-surface-2:   #161618;
    --ft-chip:        #202023;
    --ft-cyan-soft:   rgba(0,187,221,0.14);
    --ft-glow:        rgba(0,187,221,0.10);
    --ft-ink:         #ededee;
    --ft-ink-2:       #aeaeb3;
    --ft-muted:       #9b9ba1;
    --ft-faint:       #3c3c40;
    --ft-border:      #242427;
    --ft-border-2:    #2e2e32;
    --ft-cyan-text:   #43cdeb;
    --ft-cyan-border: #2a5a66;
    --ft-path:        rgba(0,187,221,0.30);
    --ft-bar:         #26262a;
    --ft-map-bg:      #161618;
    --ft-map-grid:    #2e2e32;
    --ft-cta-bg:      #060607;
    --ft-header-bg:   rgba(10,10,11,0.82);
    --ft-ok-soft:     rgba(46,125,79,0.20);
    --ft-ok-text:     #5fc98a;

    /* ── 페이지 하드코딩 제거용 토큰 — 다크 오버라이드 ──
       시안 솔리드/알파/그림자는 동일 시안 위에서 동작하므로 유지.
       잉크·카테고리·위험색만 다크 팔레트에 맞춰 재지정. */

    /* 시안 배경 위 텍스트: 다크 잉크 대신 밝은 시안 잉크(#080e1d = dark primary-foreground) */
    --on-cyan-ink:    #080e1d;

    /* 잉크 솔리드/스크림: 다크에선 밝은 잉크(--ft-ink dark) 기준으로 전환 */
    --ink-solid:      #ededee;
    --ink-a12:  rgba(0,0,0,0.30);
    --ink-a16:  rgba(0,0,0,0.34);
    --ink-a18:  rgba(0,0,0,0.36);
    --ink-a20:  rgba(0,0,0,0.38);
    --ink-a22:  rgba(0,0,0,0.40);
    --ink-a25:  rgba(0,0,0,0.44);
    --ink-a28:  rgba(0,0,0,0.46);
    --ink-a30:  rgba(0,0,0,0.48);
    --ink-a32:  rgba(0,0,0,0.50);
    --ink-a35:  rgba(0,0,0,0.52);
    --ink-a40:  rgba(0,0,0,0.56);
    --ink-a45:  rgba(0,0,0,0.58);
    --ink-a50:  rgba(0,0,0,0.62);
    --ink-a55:  rgba(0,0,0,0.66);
    --ink-a62:  rgba(0,0,0,0.70);
    --ink-a72:  rgba(0,0,0,0.78);
    --ink-a80:  rgba(0,0,0,0.84);
    --ink-hover:      #2e2e32;

    /* 위험 적색: 다크 danger 톤(#eb6877)과 그 연한 보더 */
    --ft-danger:       #eb6877;
    --ft-danger-soft:  rgba(235,104,119,0.40);

    /* 카테고리 팔레트 — 다크 대비 약간 밝게 */
    --ft-cat-1:  #43cdeb;
    --ft-cat-2:  #e7a964;
    --ft-cat-3:  #93c8a3;
    --ft-cat-4:  #a79ad6;
    --ft-cat-5:  #e6a3bb;   /* 로즈(밝게) */
    --ft-cat-6:  #7cc6d8;   /* 틸(밝게) */
    --ft-cat-7:  #a9c587;   /* 올리브(밝게) */
    --ft-cat-8:  #dcb878;   /* 골드(밝게) */
    --ft-rating-gold:  #e7a964;
    --ft-open-soft:    rgba(231,169,100,0.16);
    --ft-open-text:    #e7a964;
}