/* Apple 디자인 규칙 — 재질(글라스)이 아닌 기하·타이포·접근성 규칙. 분석 정본은 docs/design/DESIGN-apple-liquid-glass-2026-09-16.md.
 *   글라스 3파일(liquid-glass-*)이 **재질**을 소유하고, 이 파일이 **규칙**을 소유한다. 되돌리기 = index.html 한 줄 삭제.
 *   ⚠️ 이 파일의 일부는 2026-09-16 오너 결정("팔레트·글꼴은 Framer 유지")을 넘어선다 — 사용자 지시로 전역 적용했다.
 *      각 절이 어느 쪽인지 머리에 적었고, 절 단위로 되돌릴 수 있게 나눠 뒀다. */

/* ── ① 동심원(concentricity) — 승인 범위 안(기하) ──
 * "concentric shapes calculate their radius by subtracting padding from the parent's [radius]" — WWDC25 356
 * 부모가 --r-self·--pad-self 를 선언하면 자식이 그 차이를 반경으로 쓴다. 매직넘버를 박지 않는다.
 * ⚠️ **부모 곡률이 자식을 구속할 때만** 의미가 있다(padding < 부모 반경). 그보다 깊이 들어간 자식은
 *    부모 모서리와 무관하므로 적용하지 않는다 — 전수 소급하면 썸네일이 직각이 되어 오히려 나빠진다.
 * 실측(로컬 · 표면 가진 자식 12개): 어긋난 것은 이 한 종류였다 — .hub-card--asset(r15, pad8) 안 썸네일이 r10.
 * ⚠️ --pad-self 는 home.css 의 실제 padding 과 같아야 한다 — 가드(liquidGlassLayer.test.mjs)가 드리프트를 잡는다. */
body.shell-v2 .hub-card--asset {
  --r-self: var(--r-lg);
  --pad-self: 8px;
}
body.shell-v2 .hub-card--asset .hub-card-thumb {
  border-radius: max(0px, calc(var(--r-self) - var(--pad-self)));
}

/* ── ② 히트 영역 — 승인 범위 안(접근성) ──
 * 🔴 **Apple 문서가 두 값을 동시에 말한다. 충돌이 아니라 다른 축이다.**
 *   - 보이는 컨트롤 크기(macOS): 기본 **28×28pt** · 최소 20×20 — [Accessibility] 표
 *   - 눌리는 히트 영역: 최소 **44×44pt** — [Buttons] "a button needs a hit region of at least 44x44 pt"
 *   macOS 의 실제 컨트롤은 44pt 로 그려지지 않는다(실측 래더: Mini 16 ~ XL 36). 즉 44 는 **포인터가 아니라 손가락** 기준이다.
 *
 * 그래서 포인터(fine)에서는 키우지 않는다:
 *   ① macOS 기하가 28×28 이고 우리 알약(32~36px)이 이미 그보다 크다
 *   ② 세로 목록(사이드바 내비)에서 44 로 넓히면 **이웃 버튼 영역을 침범**해 경계 클릭이 엉뚱한 곳으로 간다 —
 *      Apple 은 컨트롤 간격(12/24pt)으로 그 겹침을 피하는데 우리 레일 간격은 그만큼이 아니다.
 *
 * 터치(coarse)에서만 44 를 확보한다. 시각 크기는 안 건드리고 보이지 않는 ::after 로 넓히되,
 * 세로 확장은 **이웃을 넘지 않는 만큼만**(레일 항목 간격의 절반)으로 제한한다. */
@media (pointer: coarse) {
  body.shell-v2 :is(.btn--sm, .btn--chip, .pshell-tab, .cf-nav, .trow-seg-btn) { position: relative; }
  body.shell-v2 :is(.btn--sm, .btn--chip, .pshell-tab, .cf-nav, .trow-seg-btn)::after {
    content: '';
    position: absolute;
    inset: min(0px, calc((44px - 100%) / -2)) -2px; /* 44 에 못 미치는 만큼만 위아래로 · 가로는 2px */
    pointer-events: auto;
  }
  /* ⚠️ .nav-btn 은 제외한다 — 세로 레일이라 확장분이 곧 이웃 침범이다. 레일 항목은 이미 세로 44 이상이거나
   *    그렇지 않으면 간격을 먼저 늘려야 하고, 그건 이 파일이 아니라 레이아웃 결정이다(§19 미점검). */
}

/* ── ③ Labels 계층 — ⚠️ 오너 동결 축(팔레트). 사용자 지시로 전역 적용(2026-09-16) ──
 * Apple 다크 실측: Primary #FFF 85% · Secondary 55% · Tertiary 25% · Quaternary 10% · Quinary 5% · Seximal 3%.
 * 🔴 **순백을 쓰지 않는 것**이 이 계층의 핵심이다 — 다크에서 #ffffff 는 번진다. 우리 --ink 가 정확히 그랬다.
 *
 * ⚠️ **Apple 비율을 그대로 옮기면 안 된다.** Tertiary(25%)·Quaternary(10%)는 우리 캔버스(#090909) 위에서
 *    2.11:1 · 1.25:1 로 본문 텍스트가 못 된다. Apple 에서도 그 둘은 **비활성·구분선** 티어이지 읽는 글자가 아니다
 *    (macOS 창 배경 #1E1E1E 위에서도 2.25:1 이다). 우리 쪽 대응물은 --hairline·--divider-soft 가 이미 맡고 있다.
 *
 * 그래서 쓸 수 있는 단만 가져오고 중간 한 단은 보간했다. 대비 실측(캔버스 9 · surface-1 20 · surface-2 28):
 *   --ink    α.85 (Apple Primary)   → 14.24 · 13.43 · 12.55
 *   --ink-80 α.70 (보간 — Apple 에 없는 단)→ 약 9
 *   --ink-48 α.55 (Apple Secondary) →  6.24 ·  6.15 ·  5.98
 * (AA 하한은 α.46 이지만 여유가 0 이라 안 쓴다 — 표면이 한 단만 밝아져도 깨진다.)
 *
 * ⚠️ **`.hub-head`(그라데이션 스포트라이트 카드)의 `#ffffff` 는 고치지 않는다.** 85% 규칙은 *중성 다크* 표면 위
 *    순백이 번지는 것을 막는 규칙이고, 채도 높은 그라데이션 위는 다른 상황이다 — Apple 실측 표에 그 용도의
 *    전용 토큰이 따로 있다: `Labels/White` = `#FFF` **100%**(Light·Dark 양쪽). 즉 거기 순백은 규칙 위반이 아니라 규칙대로다.
 * 되돌리기: 이 블록 3줄 삭제 → framer.css 의 #ffffff/#cccccc/#999999 로 복귀. */
body.shell-v2 {
  --ink: rgba(255, 255, 255, 0.85);
  --ink-80: rgba(255, 255, 255, 0.70);
  --ink-48: rgba(255, 255, 255, 0.55);
}

/* ── ④ 타입 위계 — ⚠️ 오너 동결 축(타이포). 사용자 지시로 전역 적용(2026-09-16) ──
 * Apple macOS 내장 텍스트 스타일(HIG Typography, 실측):
 *   Large Title 26/32 · Title1 22/26 · Title2 17/22 · Title3 15/20 Semibold
 *   Headline 13/16 **Bold** · Body 13/16 Regular · Callout 12/15 · Subhead 11/14 · Footnote 10/13 · Caption1 10/13
 *
 * 🔴 **이 래더의 핵심은 Headline 과 Body 가 같은 크기라는 것이다**(둘 다 13/16, 굵기만 다르다).
 *    Apple 은 제목을 **키우지 않고 굵힌다** — 데스크탑 밀도를 만드는 핵심 장치다.
 *
 * ⚠️ **절대 크기는 그대로 못 쓴다.** Apple 본문 13px 는 라틴 최적화이고 한글에서는 가독성이 떨어진다.
 *    우리 본문 15px 를 기준으로 Apple 비율(×15/13 ≈ 1.154)을 스케일했다 — 비율만 가져오고 눈금은 우리 것이다.
 * ⚠️ 디스플레이 단(--fs-hero 85 · --fs-display-lg 62)은 **안 건드린다** — Framer 포스터 타이포이고
 *    Apple 래더에 대응물이 없다(Apple 최대가 Large Title 26 이다). §15 대응표의 그 판정 그대로. */
body.shell-v2 {
  --fs-title-1: 25px;   --lh-title-1: 30px;   /* Apple Title 1  22/26 */
  --fs-title-2: 20px;   --lh-title-2: 25px;   /* Apple Title 2  17/22 */
  --fs-title-3: 17px;   --lh-title-3: 23px;   /* Apple Title 3  15/20 */
  --fs-headline: var(--fs-body); --lh-headline: 18px;  /* 🔴 Apple Headline = Body 크기 · 굵기만 다르다 */
  /* Callout(14) · Subhead(13) 은 **세우지 않는다** — Framer 정본의 --fs-caption(14) · --fs-fine(13) 과 값이 같다.
   *   2026-09-16 에 둘을 따로 세웠더니 같은 눈금에 이름이 둘이 됐고, 1년 뒤 어느 쪽을 쓸지 아무도 모른다.
   *   (2026-09-18 감사: 그 둘은 세운 뒤 소비자가 0이었다. 중복 이름은 지우는 것이 옮기는 것보다 낫다.) */
  --fs-footnote: 12px;  --lh-footnote: 15px;  /* Apple Footnote 10/13 — 이건 Framer 에 없는 단이라 남긴다 */
}

/* 섹션 제목 = Apple Headline — 크기를 키우지 않고 굵힌다(22px/700 → 본문 크기/700). */
body.shell-v2 .hub-section-title,
body.shell-v2 .home-section-title,
body.shell-v2 .lib-ins-title {
  font-size: var(--fs-headline);
  line-height: var(--lh-headline);
  font-weight: 700;
}

/* 페이지 제목 = Apple Title 1 */
body.shell-v2 .hub-title { font-size: var(--fs-title-1); line-height: var(--lh-title-1); }

/* ── ⑤ 트래킹 — ⚠️ 오너 동결 축(타이포). 사용자 지시로 전역 적용(2026-09-16) ──
 * Apple macOS tracking values(HIG Typography, 실측 · points):
 *   6 +0.24 · 8 +0.21 · 10 +0.12 · 11 +0.06 · **12 0.0** · 13 −0.08 · 14 −0.15 · 15 −0.23 ·
 *   16 −0.31 · **17 −0.43(최저)** · 18 −0.44 · 20 −0.45 · 22 −0.26 · **24 +0.07(부호 반전)** · 28 +0.38 · 36 +0.37
 *
 * 🔴 **단조가 아니라 U 커브다.** 작은 글자는 벌리고, 중간(17~20pt)에서 가장 조이고, 큰 제목은 **다시 벌린다.**
 * ⚠️ **Framer 와 부호가 반대다** — Framer 는 110px 에서 −5.5px, 85px 에서 −4.25px 로 클수록 더 조인다.
 *    그래서 **17px 이하 본문·캡션에만** 적용하고 디스플레이 단은 Framer 정본 그대로 둔다(§15 대응표 17행).
 *    이 경계를 지우면 포스터 타이포가 무너진다. */
body.shell-v2 {
  --ls-body: -0.23px;     /* 15px — Apple 15pt −0.23 */
  --ls-caption: -0.15px;  /* 14px — Apple 14pt −0.15 */
  --ls-fine: -0.08px;     /* 13px — Apple 13pt −0.08 */
  --ls-footnote: 0px;     /* 12px — Apple 12pt 가 U 커브의 0 지점이다 */
}
body.shell-v2 .hub-section-title,
body.shell-v2 .home-section-title,
body.shell-v2 .lib-ins-title { letter-spacing: var(--ls-body); }