/* ============================================================
   crowny-tokens.css — 크라우니 φ(황금비) 표준 디자인 토큰 v1.0
   황금비 φ = 1.618033988749895  황금각 Δ = 137.5°
   출처: /Users/ef/crowny-studio/엔진/황금비.한선 수식과 1:1 일치
   모든 Crowny 서비스 공통 :root 표준. 덮어쓰기 금지.
   ============================================================ */

:root {

  /* ── φ 상수 ─────────────────────────────────────────────── */
  --phi: 1.618;                        /* φ = 황금비 */
  --phi-inv: 0.618;                    /* 1/φ = φ-1 */
  --golden-ratio: 1.618;               /* alias (레이아웃 계산용) */
  --golden-angle: 137.5deg;            /* 해바라기 나선 최대분산각 */

  /* ── 타입스케일 — 16px × φ^k (황금비.한선 황금타입스케일 일치) ─ */
  /* k=-2 */ --fs-xs:   6.11px;        /* 16 ÷ φ² */
  /* k=-1 */ --fs-sm:   9.89px;        /* 16 ÷ φ  */
  /* k= 0 */ --fs-base: 16px;          /* 기준 */
  /* k=+1 */ --fs-md:   25.89px;       /* 16 × φ  */
  /* k=+2 */ --fs-lg:   41.89px;       /* 16 × φ² */
  /* k=+3 */ --fs-xl:   67.78px;       /* 16 × φ³ */
  /* k=+4 */ --fs-2xl:  109.67px;      /* 16 × φ⁴ */
  /* k=+5 */ --fs-3xl:  177.44px;      /* 16 × φ⁵ */

  /* ── 피보나치 간격 — 재귀 수열(a₀=8,a₁=13,aₙ=aₙ₋₁+aₙ₋₂) ─ */
  /* --sp-1..8 는 단조증가 피보나치. φ 비율로 수렴: aₙ₊₁/aₙ → φ */
  --sp-1:    8px;    /* F(6)  */
  --sp-2:   13px;    /* F(7)  */
  --sp-3:   21px;    /* F(8)  */
  --sp-4:   34px;    /* F(9)  */
  --sp-5:   55px;    /* F(10) */
  --sp-6:   89px;    /* F(11) */
  --sp-7:  144px;    /* F(12) */
  --sp-8:  233px;    /* F(13) */

  /* ── 나폴리 천상 팔레트 (Crowny 고유 — 최우선) ─────────── */
  --c-cream:    #FBE9C7;   /* 크림 — 기본 배경 */
  --c-gold-lt:  #FFF3DC;   /* 연금 — 밝은 배경 강조 */
  --c-gold:     #C9A961;   /* 금   — 브랜드 기본색 */
  --c-gold-warm:#E6CC8A;   /* 연금빛 — 호버·보조 강조 */
  --c-terra:    #8B3A2F;   /* 테라코타 — 경고·포인트 */
  --c-ink:      #241830;   /* 심야남보라 — 기본 텍스트/다크 배경 */

  /* 알파 변형 */
  --c-gold-a20:    rgba(201,169,97,.20);
  --c-gold-a40:    rgba(201,169,97,.40);
  --c-ink-a60:     rgba(36,24,48,.60);
  --c-cream-a80:   rgba(251,233,199,.80);

  /* ── 황금각 보조색 — 137.5° 나선 분산 (hsl, φ 기반 채도/명도) */
  /* 시작각: 35° (나폴리 금빛 근처). 각 +137.5° 최대조화 분산     */
  --hue-0: hsl(  35.0, 60%, 55%);   /* 황금 주황 */
  --hue-1: hsl( 172.5, 60%, 42%);   /* 청록     */
  --hue-2: hsl( 310.0, 60%, 52%);   /* 자홍     */
  --hue-3: hsl(  87.5, 60%, 45%);   /* 연초록   */
  --hue-4: hsl( 225.0, 60%, 55%);   /* 코발트블루 */
  --hue-5: hsl(   2.5, 60%, 50%);   /* 산호레드  */
  --hue-6: hsl( 140.0, 60%, 42%);   /* 에메랄드  */
  --hue-7: hsl( 277.5, 60%, 52%);   /* 라벤더    */

  /* ── 황금분할 레이아웃 비율 1 : φ ─────────────────────── */
  --col-main:  61.803%;   /* φ/(1+φ) = 큰 칸 */
  --col-aside: 38.197%;   /* 1/(1+φ) = 작은 칸 */
  --col-main-fr:  1.618fr;
  --col-aside-fr: 1fr;

  /* 2열 그리드 헬퍼 */
  --grid-golden: var(--col-main) var(--col-aside);
  --grid-golden-rev: var(--col-aside) var(--col-main);

  /* ── 반경 (피보나치 서브셋) ───────────────────────────── */
  --r-sm:  var(--sp-1);    /*  8px */
  --r-md:  var(--sp-2);    /* 13px */
  --r-lg:  var(--sp-3);    /* 21px */
  --r-xl:  var(--sp-4);    /* 34px */
  --r-pill: 9999px;

  /* ── 그림자 (φ 배수 blur/spread) ───────────────────────── */
  --shadow-sm:
    0 var(--sp-1) var(--sp-3)  var(--c-gold-a20);
  --shadow-md:
    0 var(--sp-2) var(--sp-4)  var(--c-gold-a20),
    0 var(--sp-1) var(--sp-2)  rgba(36,24,48,.12);
  --shadow-lg:
    0 var(--sp-3) var(--sp-5)  var(--c-gold-a40),
    0 var(--sp-2) var(--sp-3)  rgba(36,24,48,.18);
  --shadow-ink:
    0 var(--sp-2) var(--sp-4)  rgba(36,24,48,.40);

  /* ── 이징 (황금비 cubic-bezier) ────────────────────────── */
  --ease-phi:   cubic-bezier(.16, 1, .3, 1);       /* 메인 ease */
  --ease-in:    cubic-bezier(.618, 0, 1, 1);        /* 1/φ 진입 */
  --ease-out:   cubic-bezier(0, 0, .382, 1);        /* φ-1 이탈 */
  --dur-fast:   161ms;    /* φ × 100 ≈ 162 */
  --dur-base:   261ms;    /* φ² × 100 ≈ 262 */
  --dur-slow:   423ms;    /* φ³ × 100 ≈ 424 */
  --dur-xslow:  684ms;    /* φ⁴ × 100 ≈ 685 */

  /* ── 타이포 보조 ─────────────────────────────────────────── */
  --lh-tight:  1.272;   /* 1/φ + 1 ≈ 1.272 */
  --lh-base:   1.618;   /* φ */
  --lh-loose:  2.000;   /* φ+φ-1 */
  --ls-wide:   0.04em;
  --ls-xwide:  0.16em;
  --fw-regular: 400;
  --fw-medium:  500;
  --fw-bold:    700;
  --fw-heavy:   800;

  /* ── z-index 피보나치 레이어 ─────────────────────────────── */
  --z-base:    8;
  --z-float:  13;
  --z-sticky: 21;
  --z-drawer: 34;
  --z-modal:  55;
  --z-toast:  89;
  --z-tip:   144;
}

/* ── 다크 테마 오버라이드 ─────────────────────────────────── */
@media (prefers-color-scheme: dark) {
  :root {
    --c-cream:    #1A1020;   /* 다크 배경 */
    --c-gold-lt:  #2A1E30;   /* 다크 카드 면 */
    --c-ink:      #F5E8D0;   /* 다크 기본 텍스트 (크림→반전) */
    --c-gold-a20: rgba(201,169,97,.25);
    --c-cream-a80:rgba(26,16,32,.85);
    --shadow-sm:
      0 var(--sp-1) var(--sp-3)  rgba(0,0,0,.40);
    --shadow-md:
      0 var(--sp-2) var(--sp-4)  rgba(0,0,0,.55),
      0 var(--sp-1) var(--sp-2)  rgba(0,0,0,.28);
    --shadow-lg:
      0 var(--sp-3) var(--sp-5)  rgba(0,0,0,.65),
      0 var(--sp-2) var(--sp-3)  rgba(0,0,0,.40);
  }
}

/* ── [data-theme="dark"] 클래스 강제 다크 ─────────────────── */
[data-theme="dark"] {
  --c-cream:    #1A1020;
  --c-gold-lt:  #2A1E30;
  --c-ink:      #F5E8D0;
  --c-gold-a20: rgba(201,169,97,.25);
  --c-cream-a80:rgba(26,16,32,.85);
}

/* ── [data-theme="light"] 강제 라이트 ─────────────────────── */
[data-theme="light"] {
  --c-cream:    #FBE9C7;
  --c-gold-lt:  #FFF3DC;
  --c-ink:      #241830;
  --c-gold-a20: rgba(201,169,97,.20);
  --c-cream-a80:rgba(251,233,199,.80);
}

/* ── prefers-reduced-motion 전역 가드 ───────────────────────
   토큰을 쓰는 모든 transition/animation은 이 가드 아래 0으로.   */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration:        0.01ms !important;
    animation-iteration-count: 1      !important;
    transition-duration:       0.01ms !important;
  }
}

/* ── 황금분할 2열 유틸리티 클래스 ───────────────────────────
   .golden-split > :first-child { flex: 1.618 }
   .golden-split > :last-child  { flex: 1     }               */
.golden-split {
  display: flex;
  gap: var(--sp-4);
}
.golden-split > :first-child { flex: var(--phi); }
.golden-split > :last-child  { flex: 1; }