/*
 * tokens.css — 값만 둔다(규칙서 §8-1). 부품과 화면은 이 이름만 쓴다.
 * 리디자인 1차(2026-10-30): 다크 에디토리얼이 기본. 근거는 design/mockup/NOTES.md(팔레트·서체·모양 규칙).
 * 관리자 틀(.shell-admin)은 아래 맨 끝에서 밝은 값으로 되돌린다 — 관리자 화면은 이번 리디자인 대상이 아니다.
 */
:root {
  color-scheme: dark;

  /* ── 바탕·면 ───────────────────────────────────── */
  --color-bg: #0b0a12;             /* 페이지 바탕 */
  --color-raise: #13121b;          /* 한 단 올린 구역(큐레이션·HOT NEWS) */
  --color-raise-2: #1b1926;        /* 사진 자리·입력 칸 */
  /* 브랜드 남색(받은 명함·3D 로고 렌더 — design/brand-raw). 명함 카드·브랜드 띠에만 쓴다 */
  --color-brand-navy: #1b2336;      /* 종이 명함 바탕 */
  --color-brand-navy-2: #141b2c;    /* 명함 그늘 쪽 */
  --color-brand-navy-deep: #0b1936; /* 3D 로고 렌더 바탕 — 그림 가장자리와 이어지게 */
  --color-brand-ice: #d6def5;       /* 로고 링 은빛 */
  --color-surface: #0b0a12;        /* (옛 이름) 부품 바탕 = 페이지 바탕 */
  --color-surface-alt: #13121b;    /* (옛 이름) 회색 구역 → 올린 면 */
  --color-dark: #08070e;           /* 전체 메뉴판 */
  --color-dark-sub: #b9b6c6;
  --color-overlay: rgba(11, 10, 18, .72);

  /* ── 글자(바탕 #0b0a12 대비) ───────────────────── */
  --color-text: #f3f2f7;           /* 17:1 */
  --color-text-body: #b9b6c6;      /* 9.6:1 */
  --color-text-muted: #8d8a9c;     /* 5.6:1 — 보조 글자 최저선 */
  --color-line: rgba(255, 255, 255, .09);
  --color-line-strong: rgba(255, 255, 255, .18);

  /* ── 포인트 보라(하나뿐) ───────────────────────── */
  --color-primary: #5b38d7;        /* 채움 전용 — 흰 글자 6.6:1 */
  --color-primary-hover: #6a48e4;
  --color-primary-text: #a693f6;   /* 어두운 바탕 위 보라 글자 7.4:1 */
  --color-primary-ink: #a693f6;    /* (옛 이름) 작은 보라 글자 */
  --color-primary-soft: rgba(91, 56, 215, .16);
  --color-primary-line: rgba(166, 147, 246, .32);
  --color-on-primary: #fff;

  /* 서브 화면 강조(주황) — 2차에서 정리. 어두운 바탕 위 글자는 -ink(6.2:1) */
  --color-accent: #f04e28;
  --color-accent-ink: #ff7a52;
  --color-accent-fill: #c8381a;    /* 흰 글자를 올리는 주황 채움(5.0:1) */
  --color-accent-tab: #fe6c00;
  --color-value-1: #e95f00;
  --color-value-2: #fdb304;
  --color-value-3: #363c58;
  --color-value-4: #6f7a90;
  --color-danger: #e5484d;
  --color-success: #12805c;
  --color-success-ink: #5fd3a5;    /* 어두운 바탕 위 「완료」 글자(상담 위젯 배지) 8.9:1 */
  --color-success-soft: rgba(18, 128, 92, .18);
  --color-verified: #4cb3ff;

  /* ── 서체 ───────────────────────────────────────── */
  /* 한글 글리프가 있는 Pretendard 한 가족. 영문 머리글도 같은 가족을 800·대문자·좁은 자간으로 쓴다(섞지 않음). */
  --font-sans: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic", sans-serif;

  --text-xs: 12px;
  --text-sm: 14px;
  --text-base: 16px;
  --text-md: 18px;
  --text-lg: 20px;
  --text-xl: 24px;
  --text-2xl: 28px;
  --text-3xl: 33px;
  --display-md: 44px;
  --display-lg: 60px;
  /* 디스플레이 단계(화면 폭 따라) */
  --display-s: clamp(28px, 3.2vw, 44px);
  --display-m: clamp(34px, 4.6vw, 64px);
  --display-l: clamp(40px, 6.4vw, 92px);
  --display-numeral: clamp(120px, 17vw, 260px);

  --leading-tight: 1.25;
  --leading-normal: 1.6;
  --tracking-ko: -0.02em;
  --tracking-display: -0.035em;
  --tracking-caps: .12em;          /* 작은 대문자 라벨(MONTHLY·VIEW MORE) */

  --weight-light: 300;
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-black: 800;

  /* ── 간격 ───────────────────────────────────────── */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-7: 32px;
  --space-8: 48px;
  --space-9: 64px;
  --space-10: 96px;
  --space-11: 144px;

  /* ── 큰 틀 ──────────────────────────────────────── */
  --container: 1180px;        /* 내부 화면 본문 폭(원본 .mwid) */
  --container-home: 1320px;   /* 새 홈 본문 폭 */
  --container-wide: 1820px;
  --gutter: 16px;
  --section-y: 56px;
  --section-y-lg: 100px;
  --section-y-xl: clamp(80px, 11vw, 160px); /* 새 홈 구역 위아래 */
  --header-h: 64px;

  /* ── 모서리·그림자 ──────────────────────────────── */
  /* 모양 규칙: 사진·블록은 각지게, 누르는 것(단추·검색·탭)은 알약형 */
  --r-none: 0;
  --r-sm: 8px;
  --r: 12px;
  --r-lg: 20px;
  --r-full: 999px;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, .4);
  --shadow: 0 8px 24px rgba(0, 0, 0, .45);
  --shadow-lg: 0 20px 48px rgba(0, 0, 0, .55);
  --ring: 0 0 0 4px var(--color-primary-soft);

  --control-h-sm: 40px;
  --control-h-md: 48px;
  --control-h-lg: 60px;

  --ease: cubic-bezier(.16, 1, .3, 1);
  --dur: .3s;

  --z-header: 100;
  --z-dropdown: 200;
  --z-fullmenu: 300;
  --z-toast: 400;
  --z-tooltip: 500;
}

/* 日本語(/ja): Pretendard 에 가나·일본 한자가 없어, 라틴은 Pretendard 그대로 두고 일본어 시스템 서체를 앞세운다. */
:root:lang(ja) {
  --font-sans: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", "Yu Gothic", Meiryo, "Noto Sans JP", sans-serif;
}

@media (min-width: 600px) {
  :root { --gutter: 24px; }
}

@media (min-width: 960px) {
  :root {
    --gutter: clamp(24px, 4vw, 48px);
    --section-y: 80px;
    --section-y-lg: 120px;
    --header-h: 72px;
  }
}

/* ── 관리자 틀: 밝은 값으로 되돌림(관리자는 리디자인 대상이 아님 — 글자가 읽히게 최소 보정) ── */
.shell-admin {
  color-scheme: light;
  --color-bg: #fff;
  --color-raise: #f5f5f5;
  --color-raise-2: #f0f0f3;
  --color-surface: #fff;
  --color-surface-alt: #f5f5f5;
  --color-dark: #151515;
  --color-dark-sub: #c1c1c1;
  --color-overlay: rgba(0, 0, 0, .6);
  --color-text: #000;
  --color-text-body: #454545;
  --color-text-muted: #6c6b6d;
  --color-line: #dfdfdf;
  --color-line-strong: #333;
  --color-primary-hover: #4f29d4;
  --color-primary-text: #5b38d7;
  --color-primary-ink: #4f29d4;
  --color-primary-soft: #f9f7ff;
  --color-primary-line: #e6e0fb;
  --color-accent-ink: #c8381a;
  --color-danger: #d92d20;
  --color-success-ink: #106a43;
  --color-success-soft: #e7f6ed;
  --color-verified: #1a9bf0;
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, .08);
  --shadow: 0 4px 16px rgba(17, 12, 46, .08);
  --shadow-lg: 0 12px 32px rgba(17, 12, 46, .16);
  --ring: 0 0 0 3px rgba(91, 56, 215, .2);
  --r: 15px;
}