/* Aednoa 디자인 시스템 v2 "숲과 크림"(카드 297 브랜드 가이드 brand/brand.html의 값). 이후 모든 시안·페이지는 이 변수만 쓴다.
   기준: _refs/kit/tokens-v2.css. 대표 1순위 참고 ref-01·02·03·05·07에서 색 관계·글자 위계·간격·구성 패턴만 뽑았다(로고·문구·사진·배치는 옮기지 않음).
   참고 자료(ui-ux-pro-max) 비교 결과(표는 brand/brand.html "참고 자료 비교"):
   - 스타일: 후보(Bitcoin DeFi · Data-Dense Dashboard · Executive Dashboard) 중 맞는 것 없음 → 대표 보드 기준 "숲과 크림 편집형(넉넉한 여백·명조 제목·알약 버튼)"
   - 색 조합: 후보(Marketplace (P2P) · Forum / Discussion Board · Financial Dashboard) 중 맞는 것 없음 → 보드의 세이지·올리브 + 크림 + 숲 초록(선택 테라코타 한 곳)
   - 글꼴 짝: Korean Modern(한글 우선 원칙)을 고르고, 실제 글꼴은 사이트 안 Noto Serif KR(제목) + Pretendard(본문)
   카드 298(첫 화면 방향 3안) 비교: 스타일 Inclusive Design(접근성 원칙만 얹음, 바탕은 숲과 크림 편집형 그대로) ·
   색 조합 Marketplace (P2P)·Design System·Creator Economy 모두 보라/분홍이라 버림 → v2 유지 · 글꼴 짝 Korean Modern(실제는 Noto Serif KR + Pretendard). 표는 design/moodboard.html
   예전 변수 이름(--color-primary, --space-4 …)은 하나도 지우지 않는다(머리말 로그인·마이페이지·회원 화면이 쓴다). 값만 v2. */
:root {
  --brand-version: 2;

  /* ---- 색: 바탕 하나(크림) · 먹색 하나 · 주색 하나(숲 초록). 글자 대비 4.5:1 이상(숫자는 brand.html 색 칸) ---- */
  --color-forest: #1b3a3d;          /* 주색. 크림 위 10.98:1 */
  --color-forest-deep: #11292c;     /* 눌림·짙은 띠 */
  --color-cream: #eef1f1;           /* 바탕 1단 */
  --color-sage: #d4e6e8;            /* 바탕 2단(섹션 번갈아) */
  --color-sage-deep: #bad6d9;       /* 세이지 위 칸 */
  --color-paper: #f6fbfb;           /* 카드 면(크림보다 한 단계 밝게) */
  --color-ink: #1b1f1f;             /* 본문 글자 */
  --color-ink-soft: #4a524b;        /* 보조 글자(크림 위 7.23:1, 세이지 위 6.36:1) */
  --color-line: #cbd0d1;            /* 꼭 필요한 선(표·입력칸)만 */
  /* 테라코타 포인트(대표 1순위 추가 11/05): 선택, 한 화면에 한 곳만. 쓰는 곳 = 광고주 첫 화면 아래 조건 막대의 "의뢰 시작" 버튼(.ad-btn--accent). 크림 글자 대비 5.13:1 */
  --color-terracotta: #1d7c7c;
  --color-terracotta-deep: #166767;

  --color-primary: var(--color-forest);
  --color-primary-dark: var(--color-forest-deep);
  --color-primary-soft: #dfebec;
  --color-accent: var(--color-sage);
  --color-accent-dark: #2d494c;
  --color-accent-soft: #e6f2f3;
  --color-bg: var(--color-cream);
  --color-surface: var(--color-paper);
  --color-surface-alt: var(--color-sage);
  --color-text: var(--color-ink);
  --color-text-muted: var(--color-ink-soft);
  --color-border: var(--color-line);
  --color-border-strong: var(--color-ink);
  --color-on-primary: #eef1f1;      /* 숲 초록 위 10.98:1 */
  --color-on-primary-muted: #bad6d9;/* 숲 초록 위 보조 글자 8.14:1 */
  --color-overlay: rgba(17, 41, 44, 0.55);
  --color-scrim: rgba(17, 41, 44, 0.78);   /* 사진 위 작은 글자 받침(업종·길이). 크림 글자 대비 4.5:1 이상 */
  --color-success: #1a5c64;
  --color-success-soft: #e1eef0;
  --color-warning: #7a4a10;
  --color-warning-soft: #e3f2f1;
  --color-error: #127a7a;
  --color-error-soft: #e8f0f0;
  --color-focus: #1b3a3d;
  --color-highlight: #dfebec;
  --color-notice-bg: #dfe4e5;
  --color-notice-text: #333337;
  --color-status-wait: #1b3a3d;     --color-status-wait-soft: #dfebec;
  --color-status-ok: #1a5c64;       --color-status-ok-soft: #e1eef0;
  --color-status-off: #4a524b;      --color-status-off-soft: #e3e7e7;
  --thumb-navy-from: #1b3a3d;  --thumb-navy-to: #2c585d;   /* 예전 이름 호환: 썸네일 색 바탕도 숲 계열 */
  --thumb-slate-from: #3a4344; --thumb-slate-to: #566057;
  --thumb-pine-from: #29494c;  --thumb-pine-to: #3c686d;

  /* ---- 글자: 제목 명조(Noto Serif KR, 사이트 안 woff2), 본문 Pretendard. 강조는 제목 안 한 단어만(굵기 + 주색, 이탤릭 금지) ---- */
  --font-brand-sans: "Pretendard", "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", sans-serif; /* 11/08 대표 재디자인 2차: 사이트 글꼴 Pretendard 하나로(SIL OFL) */
  --font-serif: "Pretendard", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif; /* 제목도 Pretendard */
  --font-logo: "Noto Serif KR Sub", "Gowun Batang", "AppleMyungjo", "Batang", serif;
  --font-base: var(--font-brand-sans);
  --font-heading: var(--font-serif);
  --font-size-display: clamp(2.25rem, 1.2rem + 4.4vw, 4rem);  /* 첫 화면 제목 36 → 64px */
  --font-size-h1: clamp(2rem, 1.3rem + 2.8vw, 3rem);          /* 32 → 48px */
  --font-size-h1-wide: 3rem;
  --font-size-h2: clamp(1.625rem, 1.2rem + 1.6vw, 2.25rem);   /* 26 → 36px */
  --font-size-h3: 1.25rem;
  --font-size-h4: 1.125rem;
  --font-size-lead: 1.125rem;
  --font-size-body: 1.0625rem;      /* 17px */
  --font-size-small: 1rem;
  --font-size-caption: 0.875rem;    /* 14px: 라벨·썸네일 표기만 */
  --font-size-label: 0.8125rem;     /* 13px: 섹션 머리말 라벨(자간 넓히기 금지) */
  --font-size-code: 0.75rem;        /* 12px: 권장 코드 상자(pre)만, 본문에 쓰지 않음 */
  --font-size-stat: 3rem;           /* 48px: 요약 숫자(명조) */
  --font-mono: ui-monospace, "Cascadia Mono", "Consolas", "D2Coding", monospace; /* 파일·코드 이름 표시(시스템 글꼴) */
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-heavy: 800;
  --line-height: 1.7;
  --line-height-body: 1.7;
  --line-height-title: 1.22;
  --letter-spacing-title: -0.02em;
  --measure: 40em;                  /* 본문 한 줄 34~40자 */

  /* ---- 간격: 4/8 배수. 섹션 사이 데스크톱 96 · 태블릿 64 · 휴대폰 48 ---- */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --section-gap: var(--space-7);
  --section-gap-tablet: var(--space-8);
  --section-gap-wide: var(--space-9);
  --page-gutter: var(--space-4);
  --card-padding: var(--space-6);
  --content-width: 1120px;

  /* ---- 둥근 정도: 칸 12 · 카드 16 · 큰 면 24 · 알약 999 ---- */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-pill: 999px;
  --radius-thumb: 16px;

  /* ---- 그림자: 떠 있는 것(메뉴·창)에만. 쉬는 카드는 바탕 단계로 나눈다 ---- */
  --shadow-sm: 0 1px 2px rgba(27, 31, 31, 0.06);
  --shadow-md: 0 12px 32px rgba(27, 31, 31, 0.12);
  --border-width: 1px;
  --border-width-strong: 2px;

  /* ---- 움직임(Emil): 눌림 120ms · 마우스 올림 160ms · 팝업 180ms · 창 300ms, ease-in 금지 ---- */
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);
  --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
  --ease-standard: var(--ease-out);
  --duration-press: 120ms;
  --duration-fast: 160ms;
  --duration-base: 240ms;
  --duration-slow: 360ms;
  --press-scale: 0.97;

  /* ---- 누르기·초점 ---- */
  --tap-size: 48px;
  --focus-ring: 2px solid var(--color-focus);
  --focus-offset: 3px;

  /* ---- 예전 화면 호환 값(회원·제작자 화면이 쓴다) ---- */
  --bp-tablet: 768px;
  --header-height: 64px;
  --step-number-width: 40px;
  --check-size: 24px;
  --skeleton-height: 12px;
  --spinner-size: 16px;
  --cover-ratio: 16 / 9;
  --entry-min-height: 64px;
  --status-mark-size: 10px;
  --tabbar-height: 64px;
  --z-header: 10;
  --z-modal: 20;
  --z-tabbar: 10;
}

:where(a, button, input, select, textarea, summary):focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
}
:where(.num, .price) { font-variant-numeric: tabular-nums; }
@media (prefers-reduced-motion: reduce) {
  :root { --duration-press: 0s; --duration-fast: 0s; --duration-base: 0s; --duration-slow: 0s; --press-scale: 1; }
}
