/* heft — 디자인 시스템 정본 (Tailwind 4 @theme 이름공간, 선언은 :root — 브라우저는 @theme 블록을 읽지 않는다 #73)
   렌즈: industrial-brutalist-ui · Swiss Industrial Print 갈래 하나만. 둥근 모서리 0, 흐린 그림자 0, 그라데이션 0, 사선 띠 0. */

:root {
  /* ── 색 — 바탕은 콘크리트, 주황은 "힘이 걸린 곳" 에만(한 화면 최대 2곳) ── */
  --color-bg: #bdbfba;            /* 콘크리트 바탕 — 무대·페이지 */
  --color-surface: #e8e7e0;       /* 덩어리 앞면 — 갓 친 콘크리트 면, 바탕보다 밝아 덩어리가 떠 보인다 */
  --color-plate: #121311;         /* 강철 단추 덩어리 면 · 눌린 토글 면 */
  --color-ink: #121311;           /* 카본 잉크 — 글자·테두리·강철 단추 면 */
  --color-ink-soft: #3d403c;      /* 보조 글자 — 단위·설명 (바탕 위 5.67:1) */
  --color-line: #9a9d97;          /* 장식 선 — 격자·눈금 (글자에 쓰지 않는다) */
  --color-accent: #e2551e;        /* 신호 주황 OKLCH h39 — 선·바늘로 쓸 때(바탕 위 2.04 — 글자 금지, 잉크 테두리와 같이) */
  --color-accent-plate: #e2551e;  /* 같은 주황을 면으로 — 테이프·충돌 무게표, 위 글자는 on-accent */
  --color-on-accent: #121311;     /* 주황 위 글자 (4.93:1) */
  --color-on-ink: #e8e7e0;        /* 강철 단추·잉크 면 위 글자 (15.03:1) */

  /* ── 서체 ── */
  --font-display: "Black Han Sans", "IBM Plex Sans KR", sans-serif;   /* 덩어리 글자 — 4자 이하만 */
  --font-body: "IBM Plex Sans KR", "Pretendard Variable", sans-serif;  /* 실험 노트 본문·단추 */
  --font-mono: "JetBrains Mono", ui-monospace, monospace;              /* 숫자·단위·라벨 — 라틴·숫자만(한글·→·● 없음) */

  /* ── 글자 크기 — 덩어리는 em 이 곧 물리 단위(1u = 덩어리 글자 1em = "1 m") ── */
  --text-block: clamp(5.75rem, 2.5rem + 13vw, 13.5rem);  /* 홈 더미 제목 덩어리 — 390 92px(하한) · 1440 216px(상한) */
  --text-exp: clamp(3.5rem, 2rem + 6vw, 7rem);           /* 실험 번호 제목 "기울기" */
  --text-word: clamp(1.75rem, 1rem + 2.4vw, 3rem);       /* 저울 단어·실험 무대 단어 덩어리 */
  --text-lede: clamp(1.125rem, 1rem + 0.5vw, 1.375rem);  /* 더미 속 문단 덩어리 */
  --text-body: 1.0625rem;                                /* 실험 노트 본문 17px */
  --text-small: 0.875rem;                                /* 조작판 단추·표 */
  --text-meta: 0.75rem;                                  /* 귀퉁이 계기판·라벨(mono, 대문자, 자간 0.08em) */
  --text-tag: 0.6875rem;                                 /* 무게표 11px(mono, 굵게) */

  --leading-block: 0.92;
  --leading-tight: 1.2;
  --leading-body: 1.7;
  --tracking-block: -0.02em;
  --tracking-meta: 0.08em;

  /* ── 간격 — 8 기반, 귀퉁이·격자는 리터럴 단계, fluid 는 margin·gap 에만(#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-32: 8rem;
  --spacing-edge: clamp(1.5rem, 1rem + 1.4vw, 2.5rem);    /* 페이지 가장자리 — 390 24px · 1440 40px */
  --spacing-section: clamp(4rem, 2rem + 7vw, 9rem);       /* 구간 사이 */
  --spacing-block-pad: 0.14em;                            /* 덩어리 안쪽 여백(em — 글자와 같이 자란다) */
  --spacing-strip: 4rem;                                  /* 모바일 아래 띠 높이(safe-area 별도) */

  /* ── 모서리 — 0 이 원칙, 원은 원 덩어리(고무 공)에만 ── */
  --radius-none: 0;
  --radius-full: 9999px;

  /* ── 그림자 — 흐림 0. 들어 올린 덩어리만 아래로 딱딱한 그림자 ── */
  --shadow-none: none;
  --shadow-lift: 0 0.375rem 0 0 rgb(18 19 17 / 0.28);

  /* ── 테두리 ── */
  --spacing-border: 2px;     /* 덩어리·단추 */
  --spacing-border-heavy: 3px;     /* 포커스 링·잡힌 덩어리 */
  --spacing-hair: 1px;      /* 격자·눈금 */

  /* ── 이징 — UI 만. 덩어리 움직임은 엔진이 정한다(이징 없음) ── */
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);      /* 단추 누름·틀 기울기 */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);   /* 실험 전환 */
  --ease-time-press: 120ms;
  --ease-time-tilt: 240ms;
  --ease-time-switch: 180ms;
}
