/* =============================================================================
   CAPTAIN CARE Ver.02 — tokens.css   (I2 · 2026-07-31)
   브랜드 토큰. 색·간격·타이포의 **정본은 여기 하나**다.

   값의 출처 = 추측이 아니라 실측이다.
     라임   #DFFF5A  — 캡틴다이어트 전자책(41p 브랜드북) 표지 전면
     먹색   #231916  — 설명한의원 로고 원색(순수 검정 아님)
     분류 라임        — 캡틴 설명서(의료용) 분류 칩. 원래 파스텔 5색이었는데
                       색 헌법(2026-08-06 대표님 확정)이 파랑·보라·민트·주황 칩을
                       금지해 라임 한 색만 남았다. 나머지 칩은 무채(먹) 또는
                       상태 3색(ok/warn/stop) 기반이다.
   ⚠ 화면에서 이 값을 직접 쓰지 않는다. 토큰명으로만 참조한다 —
     톤이 바뀔 때 갈아끼울 곳이 한 곳이어야 한다(바이블 5-1 하드코딩 금지와 같은 이유).
============================================================================= */

:root {
  /* ── 브랜드 ── */
  --lime:        #DFFF5A;   /* 표지·강조 전용. 넓은 면에 깔지 않는다 */
  --lime-deep:   #D1E854;
  /* 🔴 **2.48 → 4.57** (2026-08-08 · 27차 대비 실측). 이 토큰은 **포커스 링 8자리**와
     체중 추이 선·점, 체크박스 accent 를 든다 — 전부 «글자가 아닌 것»이라 WCAG SC 1.4.11 의
     **3:1** 을 지켜야 하는데 `#9CAD41` 은 종이 위 **2.48**, 행 hover(paper-dim) 위 **2.36**
     이었다. 즉 **키보드로 어디에 있는지 보이지 않았고**, 추이 선도 흐렸다.
     ⚠ 라임(`--lime`)은 안 건드렸다 — 표지·강조의 밝은 라임은 브랜드 그 자체이고,
       여기는 **그 위·옆에 서는 어두운 짝**이다(토큰 이름이 원래 그 뜻이다). */
  --lime-shade:  #6F7C2C;   /* 라임 위 텍스트/보더 · 포커스 링 (종이 위 4.57:1) */
  --lime-wash:   #F7FFE0;   /* 아주 옅은 배경(선택 상태·강조 블록) */
  --lime-ink:    #3E4A10;   /* 라임 소프트 위에 얹는 글자 */

  --ink:         #231916;   /* 본문·로고 원색 */
  --ink-70:      #5C5348;
  --ink-45:      #8C8378;
  --ink-20:      #DDD7CE;
  --ink-08:      #EDE9E2;
  --paper:       #FFFFFF;
  --paper-dim:   #FAF9F6;
  --ground:      #F6F4F1;   /* 앱 바탕 — 카드가 뜨는 웜 그레이 */

  /* ── 사이드바 (2026-08-07 · vNext 결단 ① — 밝은 판으로 개정) ──
     왜 바꿨나: 화면이 어둡다는 지적의 주범은 색상이 아니라 **먹 면의 총량**이었다.
     사이드바 236px 가 세로 전체를 덮고 있었고, 그 한 면이 앱 전체의 인상을 정했다.
     밝은 판으로 바꾸면 라임이 「어두운 데서 빛나는 색」이 아니라 **종이 위의 포인트**가 된다.
     ⚠ 토큰 이름은 그대로 둔다 — 값만 갈아끼우면 되도록 만들어 둔 자리다(정본 1개 원칙).
        되돌리려면 이 다섯 줄만 옛 값으로 바꾸면 된다. */
  --nav-bg:      #FFFFFF;
  --nav-dim:     #5C5348;   /* 비활성 항목 — ink-70(대비 7.4:1) */
  --nav-lit:     #231916;   /* 활성 항목 글자 — 먹색 원색 */
  --nav-hover:   #FAF9F6;
  --nav-active:  #F7FFE0;   /* lime-wash — 활성 판 */

  /* ── 분류 (설명서 칩) ──
     🔴 색 헌법(2026-08-06): 화면 안 색 = 먹·라임·웜 그라운드 + 상태 3색뿐이다.
        파스텔 4색(민트·하늘·라벤더·핑크)은 이날 토큰째 제거됐다 — 되살리지 말 것.
     ⚠ 소비자 = `.chip-lime` 기본형(회원 통짜)뿐이다(2026-08-10 결단 3) — 직원 콘솔은
       `.shell .chip-lime` 이 목업 판(wash+실선)으로 덮는다. **회원만 통짜인 이유**:
       회원 홈 「완료」 칩의 신호가 「채운 라임 ↔ 테두리만」의 대비이고, 흰 카드 위에서
       wash(#F7FFE0)는 흰색과 사실상 구분이 안 돼 표지가 속삭임이 된다(블록 11 위험). */
  --cat-lime:     #E0EE7B;

  /* ── 상태 ── */
  --ok:    #2E7D5B;
  /* 🔴 **4.34 → 5.47** (2026-08-08 · 27차). 흰 글자를 얹는 `.toast-warn` 이 14px/600 인데
     4.34 라 미달이었고, 저장 실패·거부 사유 토스트 **59호출**이 전부 그 길을 지난다.
     글자색으로 쓰는 직원 6자리(카드 위)도 같은 값이었다 — 어둡게 하면 **양쪽이 함께** 낫는다. */
  --warn:  #A0561A;
  --stop:  #B3261E;   /* 정체·미납 등 '직원이 오늘 처리해야 할 것' */

  /* ── 타이포 ──
     브랜드북은 둥근 고딕이다. 웹 표준 대체로 Pretendard 를 쓰고 시스템 폰트로 폴백한다. */
  --font: "Noto Sans KR", "Apple SD Gothic Neo", -apple-system, BlinkMacSystemFont,
          system-ui, sans-serif;
  /* 🔴 큰 숫자 전용 서체 (2026-08-07 · 결단 ⑥). 체중·금액·잔여처럼 **읽는 게 아니라
     보는** 숫자에만 쓴다(본문 숫자는 --font 그대로 — 한글과 섞이면 두 서체가 싸운다).
     브랜드북의 둥근 고딕에 가장 가까운 웹폰트이고, CSP 는 이미 Google Fonts 두 호스트를
     열어 뒀다(_headers · 2026-08-06) — 이 도입에 CSP 변경 0. */
  --font-num: "Baloo 2", "Noto Sans KR", "Apple SD Gothic Neo", system-ui, sans-serif;
  --fs-display: 2.25rem;   /* 섹션 큰 숫자 */
  --fs-h1:      1.5rem;
  --fs-h2:      1.185rem;
  --fs-body:    1rem;
  --fs-sm:      0.875rem;
  --fs-xs:      0.8125rem;
  --lh-body:    1.65;      /* 브랜드북 본문이 넉넉하다 */

  /* ── 간격 (4의 배수) ── */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px;

  /* ── 터치 ──
     🔴 태블릿 우선(2026-07-31 대표님 결정). 44px 는 최소값이지 목표값이 아니다.
        데스크탑에서 줄이지 않는다 — 같은 코드가 세 기기를 덮는다. */
  --touch: 44px;
  --touch-lg: 52px;

  /* ── 모양 ── */
  --r-sm: 6px; --r-md: 10px; --r-lg: 16px; --r-full: 999px;
  --shadow-1: 0 1px 2px rgba(35,25,22,.05), 0 2px 10px rgba(35,25,22,.04);
  --shadow-2: 0 2px 6px rgba(35,25,22,.08), 0 8px 24px rgba(35,25,22,.06);

  /* ── 레이아웃 ── */
  --nav-w: 236px;          /* 직원 콘솔 사이드 네비(데스크탑) */
  --tabbar-h: 60px;        /* 회원 PWA 하단 탭 */
  --content-max: 1180px;
  --m-max: 560px;          /* 회원 PWA 최대 폭 — 폰 레이아웃이 데스크탑에서 늘어나지 않게 */
  --read-max: 68ch;        /* 콘텐츠 카드 본문 — 브랜드북처럼 한 줄이 길지 않게 */
}

/* 다크는 1차 스코프 밖이다. 회원 화면이 야간에 열리는 일이 많아 후속으로 남긴다.
   지금 반쪽만 넣으면 색이 두 곳에서 관리된다(정본 1개 원칙 위반). */
