/* ══ 색 토큰 — 프레임플러스 Admin 이 쓰는 색 일곱 ═══════════════════════════════
 *
 * 여기가 한 곳이다. Admin.html 과 pattern.html 이 같은 파일을 읽는다 —
 * 두 곳에 적어 두면 한쪽만 고치는 날이 오고, 그날 미리보기는 거짓말이 된다.
 *
 * 값은 지금까지 쓰던 것 그대로다. 이름만 붙였다.
 * 여기 없는 색은 만들지 않는다.
 * ══════════════════════════════════════════════════════════════════════════════ */
:root{
  --fp-ink:#0E0E0E;        /* 검정 — 헤더 · 테두리 · 본문 · 활성 세그 */
  --fp-red:#E5241D;        /* 레드 — 유일한 강조색. 섹션 라벨 · 주 단추 · 활성 탭 밑줄 */
  --fp-paper:#F4F2EE;      /* 아이보리 — 앱 바탕 (글 상자는 흰색) */
  --fp-line:#E0DBD1;       /* 옅은 구분선 — 입력칸 테두리 · 보조 단추 테두리 */
  --fp-line-2:#EDE9E1;     /* 더 옅은 구분선 */
  --fp-mute:#A39E94;       /* 보조 글자 — 헬퍼 · 빈 상태 문구 */
  --fp-body:#4A4843;       /* 본문 회색 — 보조 단추 글자 */

  /* 2026-09-10 — 화면 안에 손으로 적혀 있던 값 여섯에 이름을 붙였다.
     새 색이 아니다. 쓰던 값 그대로다. 회색은 진한 쪽부터 옅은 쪽으로:
     ink → body → body-2 → mute-2 → mute → line-3 → line → line-2 → wash-2 → paper → wash */
  --fp-body-2:#6E6A64;     /* 본문보다 한 톤 옅은 회색 — 설명글 · 입력칸 라벨 */
  --fp-mute-2:#8A857C;     /* 보조 글자보다 한 톤 진한 회색 — 표의 부제 · 날짜 */
  --fp-line-3:#C9C3B8;     /* 구분선보다 진한 선 — 점선 테두리 · 입력칸 테두리 */
  --fp-wash:#FBFAF8;       /* 가장 옅은 바탕 — 줄에 마우스 올릴 때 · 도구줄 */
  --fp-wash-2:#F2EEE7;     /* 옅은 바탕 — 표 머리 · 눌린 탭 · 진행 막대 바탕 */
  --fp-warn:#B23A31;       /* 경고 · 실패 빨강 — 강조 레드(--fp-red)보다 어둡다.
                              레드는 「여기를 누르세요」, 이 색은 「잘못됐습니다」 */
}

/* ══ 메모장 v2 디자인 토큰 (2026-09-26 · design_handoff_memo_v2/tokens.css 편입) ══════════
 *
 * 메모장부터 쓰고, 이후 모듈도 이 이름을 쓴다. 번들 원본과 다른 곳 두 군데(대표 확정):
 *   ① --red 는 번들 #E0342B 가 아니라 ERP 의 레드(--fp-red #E5241D) — 한 화면에 빨강이 둘이 되지 않게.
 *   ② 번들의 --line(테두리 그림자 값)은 --line-box — 색 이름처럼 읽혀 다른 화면의 var(--line) 과 헷갈린다.
 * body · a 전역 규칙과 글꼴 @import 는 옮기지 않았다(Admin 은 이미 Pretendard 를 싣고, 다른 화면 바탕을 바꾸지 않는다).
 * 색은 아래 12 + 보조 2 뿐이다. 여기 없는 색은 만들지 않는다.
 * ═════════════════════════════════════════════════════════════════════════════════════════ */
:root{
  /* 색 12 */
  --ink:#111111;          /* 본문 · 활성 단추 바탕 · 벽 · 문 · 창 선 */
  --ink-2:#4A4742;        /* 보조 글자 · 설명 */
  --muted:#6E6A64;        /* 라벨 · 시각 · 메타 · 비활성 탭 — 번들 #8A867F(3.6:1)는 글자로 약해 5.4:1 로(대표 확정 2026-09-26) */
  --faint:#B5B1AA;        /* 3차 글자 · 비활성 되돌리기 */
  --hairline:#E6E4DF;     /* 1px 구분선 · 박스 테두리 */
  --hairline-2:#F0EEEA;   /* 목록 줄 사이 아주 옅은 선 */
  --dash:#D6D2CB;         /* 점선 테두리 */
  --surface:#F5F4F1;      /* 선택된 줄 · 칩 · 폰 바탕 */
  --paper:#FBFAF8;        /* 인용 상자 · 가구 채움 · 문서 바탕 단차 */
  --desk:#E9E8E4;         /* 페이지 바깥 */
  --red:var(--fp-red);    /* 유일한 강조 — ERP 레드와 같은 값 */
  --white:#FFFFFF;
  /* 보조 2 */
  --hl-pen:rgba(245,211,74,0.55);   /* 형광펜 */
  --dim:rgba(17,17,17,0.28);        /* 시트 뒤 딤 */

  /* 글자 */
  --font:Pretendard,-apple-system,"Apple SD Gothic Neo","Noto Sans KR","Malgun Gothic",sans-serif;
  --fs-title:26px;   /* 800 / -0.03em */
  --fs-h1:16px;      /* 800 / -0.02em */
  --fs-h2:13.5px;    /* 800 */
  --fs-label:10.5px; /* 700 / 0.08em / --muted */
  --fs-chip:10px;    /* 700 */

  /* 밀도 프로필 — pc(기본). 폰은 [data-density="field"] 가 덮는다 */
  --fs-body:13px;
  --fs-value:13px;   /* 체크 값 · 치수 · 면적 */
  --fs-sub:12px;
  --h-touch:32px;
  --h-primary:32px;

  /* 모서리 */
  --r-chip:3px; --r-sm:4px; --r-md:6px; --r-card:8px; --r-lg:10px; --r-xl:12px; --r-sheet:20px; --r-phone:28px;

  /* 컨트롤 높이 */
  --h-xs:26px; --h-sm:30px; --h-md:32px;

  /* 선 · 그림자 — border 대신 box-shadow(레이아웃이 밀리지 않게) */
  --line-box:inset 0 0 0 1px var(--hairline);
  --line-active:inset 0 0 0 1.5px var(--ink);
  --row-selected:inset 2px 0 0 var(--red);
  --float:0 0 0 1px var(--hairline),0 8px 24px -12px rgba(0,0,0,0.3);
  --modal:0 0 0 1px var(--hairline),0 24px 64px -16px rgba(0,0,0,0.4);
  --tab-active:inset 0 -2px 0 var(--ink);

  /* 움직임 */
  --ease:cubic-bezier(0.4,0,0.2,1);
  --dur:200ms;
  --dur-sheet:250ms;

  /* 배치 */
  --pc-list:300px; --pc-panel:288px; --doc-max:760px; --doc-pad:28px 40px 40px;

  /* 도면 */
  --grid-mm:500; --wall-mm:150; --stroke-pen-mm:30; --stroke-hl-mm:250;

  /* 되돌리기 — 지운 뒤 8초(번들 6초 → 대표 확정 8초) */
  --undo-sec:8;
}
/* 밀도 프로필 field — 현장 폰. 본문 16 · 값 18 · 누르는 칸 48 · 주 단추 52 */
[data-density="field"]{
  --fs-body:16px;
  --fs-value:18px;
  --fs-sub:14px;
  --h-touch:48px;
  --h-primary:52px;
}
/* 메모장 폰(1024 미만)은 field 프로필 — 값은 위 [data-density="field"] 와 같다(한 벌만 고칠 것) */
@media (max-width:1023px){
  .mm-wrap{--fs-body:16px;--fs-value:18px;--fs-sub:14px;--h-touch:48px;--h-primary:52px;}
}