/* =========================================================================
   base.css — 리셋 · 타이포 · 스크롤바 (design-system.md §2, §12)
   ========================================================================= */

@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.css');

*, *::before, *::after { box-sizing: border-box; }

/* ⛔[hidden] 은 언제나 숨김(주인님 2026-08-20 — 같은 함정 5번째: 알림 배지 0(06-17)·표지 img(06-23)·추가요청 파일줄(144차)·
   책사양 SVG(08-13)·CTP 산출 입력칸(08-20)). author 의 display 선언은 UA 의 [hidden]{display:none} 을 이긴다 —
   컴포넌트마다 짝 규칙을 기억해 붙이는 대신 여기서 한 번에 끝낸다. 전수 확인: [hidden] 을 되살리는 규칙은 코드베이스에 없다.
   ★2026-09-18 코드 점검 — 개별 가드 일제 철거로 옮겨 적는 사고 기록(위 다섯 건 말고도 같은 함정이 났던 자리):
   로그인 폼 07-11 · .btn 07-14 · .field 07-26 · picked 08-11 · bse-meta 08-12 · 171차 적대검증 F1. */
[hidden] { display: none !important; }

html {
  background: var(--bg);              /* 셸 max-w 외부 영역(좌우 여백) — 헤더와 동일한 흰색 */
  scrollbar-gutter: stable;
  overflow-y: scroll;                 /* 스크롤바 자리 항상 예약 — 콘텐츠 짧을 때도 트랙 공간 확보로 시프트 완전 차단 (step87, stable 보완) */
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: var(--ff-body);
  font-size: var(--fs-body);
  font-weight: var(--fw-r);
  line-height: 1.5;
  color: var(--ink-800);
  background: var(--bg);              /* 헤더 배경과 동일한 흰색 — 큰 화면에서 좌우 여백으로 노출 */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media (max-width: 767.98px) {
  body { font-size: var(--fs-md); }
}

h1, h2, h3, h4 {
  margin: 0;
  font-weight: var(--fw-sb);
  color: var(--ink-900);
  line-height: 1.3;
}
h1 { font-size: var(--fs-2xl); }
h2 { font-size: var(--fs-xl); }
h3 { font-size: var(--fs-lg); }
h4 { font-size: var(--fs-md); }

p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }

a {
  color: var(--navy-700);
  text-decoration: none;
}
a:hover { text-decoration: underline; }
a:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
  border-radius: var(--r-sm);
}

img { max-width: 100%; height: auto; display: block; }

button { font-family: inherit; }

/* ---------- 모노 유틸 (ID·번호 전용) ---------- */
.mono, .tnum {
  font-family: var(--ff-mono);
  font-variant-numeric: tabular-nums;
}

/* ---------- 스크롤바 (overlay + 페이드 인/아웃, design-system.md §12.2) ---------- */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: rgba(15, 36, 64, 0);
  border-radius: var(--r-sm);
  transition: background 180ms ease;
}
/* 스크롤 중에만 표시 (페이드). 컨테이너 hover로는 노출하지 않음 — "사라지는" 효과 (step67). */
.is-scrolling::-webkit-scrollbar-thumb {
  background: rgba(15, 36, 64, 0.28);
}
.is-scrolling::-webkit-scrollbar-thumb:hover {
  background: rgba(15, 36, 64, 0.45);
}
/* Firefox: scrollbar-width를 항상 thin으로 유지 + 색상으로만 시각 제어 (step95-fix16).
   이전엔 none↔thin 토글로 폭이 변해 스크롤 시작/끝마다 레이아웃 좌측 시프트 발생.
   thin 고정 + scrollbar-color transparent → 시각상 안 보이지만 폭 항상 예약. */
* {
  scrollbar-width: thin;
  scrollbar-color: transparent transparent;
}
.is-scrolling {
  scrollbar-color: rgba(15, 36, 64, 0.28) transparent;
}

/* ---------- 시각적 보조 (스크린 리더 전용) ---------- */
.sr-only {
  position: absolute;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}


/* ---------- 표 칼럼 구분선 (주인님 2026-08-02) ----------
   열이 여러 개인 표는 세로선이 있어야 눈이 칼럼을 따라간다. 가로선은 각 표가 이미 정의하므로
   여기서는 **세로만** 얹고, 마지막 열과 colspan 병합 셀에는 넣지 않는다(테두리 이중선 방지).
   색은 --hairline-v(가로선보다 옅음) 하나로 사이트 전체가 같은 세기를 쓴다. */
/* ★모든 칼럼 가운데 정렬(주인님 2026-08-02) — 세로 구분선과 함께 표 전체가 한 규율로 읽힌다.
   개별 화면의 좌/우 정렬 선언은 같은 날 일괄 center 로 정리했다(견적서 PDF 는 문서 관례상 예외). */
table th, table td { text-align: center; }
table th:not(:last-child),
table td:not(:last-child) { border-right: 1px solid var(--hairline-v); }
table th[colspan]:not(:last-child),
table td[colspan]:not(:last-child) { border-right: 0; }
@media print {
  table th:not(:last-child),
  table td:not(:last-child) { border-right: 1px solid #ccc; }
}