/* aerlume — 디자인 시스템 정본 (Tailwind 4 @theme 이름공간, 선언은 :root — 브라우저는 @theme 를 읽지 않는다)
 * 렌즈 minimalist-ui · 톤 light(새벽 하늘) · 강조 잉크 블루 227°
 * 서체: <link rel="stylesheet" href="/_shared/fonts/syne/font.css"> · /_shared/fonts/manrope/font.css
 */
:root {
  /* 색 — 강조색은 글자·1px 선·작은 점에만. 큰 면은 bg·surface·sky 뿐 */
  --color-bg: #eef2f6;          /* 바탕 — 차가운 새벽 흰 */
  --color-surface: #fbfcfd;     /* 시트·펼친 줄 바탕 */
  --color-sky: #dde7f1;         /* 프레임 오기 전 무대 면 · 자리표시자 바탕 */
  --color-ink: #0f1b2a;         /* 본문·제목·주 버튼 면 */
  --color-ink-2: #22324a;       /* 주 버튼 hover */
  --color-mute: #526175;        /* 보조 글자 */
  --color-line: #d3dce6;        /* 1px 나눔선 */
  --color-accent: #2443b5;      /* 잉크 블루 — 링크·진행선·항속 점·출발 시각 */
  --color-accent-soft: #dfe6f7; /* 선택된 칩 바탕(작은 면) */
  --color-on-ink: #fbfcfd;      /* 주 버튼 글자 */
  --color-scrim: rgb(238 242 246 / 0.72); /* 프레임 대비 부족 시 글자 뒤 판 · 시트 뒤판 */

  /* 서체 */
  --font-display: "Syne", "Manrope", ui-sans-serif, system-ui, sans-serif;
  --font-body: "Manrope", ui-sans-serif, system-ui, sans-serif;

  /* 글자 크기 — 폭 표(wireframe 7절) 실측 기준 */
  --text-xs: 0.75rem;
  --text-xs--line-height: 1.4;
  --text-sm: 0.875rem;
  --text-sm--line-height: 1.5;
  --text-base: 1.0625rem;
  --text-base--line-height: 1.65;
  --text-lg: 1.25rem;
  --text-lg--line-height: 1.5;
  --text-xl: clamp(1.25rem, 1rem + 0.8vw, 1.625rem);
  --text-xl--line-height: 1.35;
  --text-h2: clamp(1.75rem, 1rem + 2.6vw, 3.25rem);
  --text-h2--line-height: 1.08;
  --text-display: clamp(2.5rem, 5.8vw, 5.5rem);
  --text-display--line-height: 1;
  --text-numeral: clamp(6rem, 12vw, 12rem);
  --text-numeral--line-height: 0.9;
  --text-mask: clamp(2.25rem, 10.2vw, 13rem);
  --text-mask--line-height: 0.85;

  /* 간격 — 4px 척도 + 유동 2개(margin·gap 에만, lessons #50) */
  --spacing-1: 0.25rem;
  --spacing-2: 0.5rem;
  --spacing-3: 0.75rem;
  --spacing-4: 1rem;
  --spacing-6: 1.5rem;
  --spacing-8: 2rem;
  --spacing-12: 3rem;
  --spacing-16: 4rem;
  --spacing-24: 6rem;
  --spacing-gutter: clamp(1.25rem, 4.4vw, 4rem);
  --spacing-section: clamp(6rem, 4rem + 8vw, 12rem);
  --spacing-header: 4.5rem;     /* 데스크톱 머리 72 — 모바일 56 은 3.5rem */
  --spacing-header-m: 3.5rem;

  /* 모서리 — 큰 면도 12 이하. 알약·원형 버튼 0(회차 3 — 칩도 직사각형, 머리 탑승권은 둥글림 0) */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;

  /* 그림자 — 사실상 없음 */
  --shadow-none: none;
  --shadow-hairline: 0 0 0 1px var(--color-line);
  --shadow-sheet: 0 24px 64px rgb(15 27 42 / 0.06);

  /* 이징 — 길이는 DESIGN.md 모션 규칙 */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-linear: linear;
}
