/* 디자인 토큰 — 09 문서 §7·[디자인 요구] 팔레트/타이포/간격.
   라이트 토큰이 정본(v1은 라이트만 렌더). 다크 벌은 준비만 해 두고 [data-theme="dark"]로 전환한다(후순위).
   외부 폰트·CDN 없음: 시스템 폰트 스택(한글·중문 CJK 폰트는 lang 속성에 따라 OS 기본이 적용). */

:root {
  /* 팔레트 */
  --pp-bg: #f3f4f6;
  --pp-card: #ffffff;
  --pp-fg: #111827;
  --pp-fg-muted: #6b7280;
  --pp-fg-subtle: #9ca3af;
  --pp-line: #e5e7eb;
  --pp-line-strong: #d1d5db;
  --pp-accent: #2563eb;
  --pp-accent-hover: #1d4ed8;
  --pp-accent-soft: #eff6ff;
  --pp-accent-fg: #ffffff;
  --pp-success: #15803d;
  --pp-success-soft: #ecfdf5;
  --pp-warn: #b45309;
  --pp-warn-soft: #fffbeb;
  --pp-danger: #b91c1c;
  --pp-danger-soft: #fef2f2;
  --pp-inferred: #c2410c;        /* 추론인식(inferred) 배지 — 오렌지(확정 초록·부분 호박과 구분, 2026-10-02) */
  --pp-inferred-soft: #fff7ed;
  --pp-info-soft: #f9fafb;
  --pp-code-bg: #f9fafb;
  --pp-hover: #f3f4f6;
  --pp-focus: #93c5fd;
  --pp-overlay: rgba(17, 24, 39, 0.45);

  /* 타이포 스케일 20/16/15/13 */
  --pp-font: system-ui, -apple-system, "Segoe UI", "Malgun Gothic", "Apple SD Gothic Neo", "Noto Sans KR",
    "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", Roboto, "Helvetica Neue", Arial, sans-serif;
  --pp-mono: ui-monospace, "Cascadia Mono", "Consolas", "D2Coding", "Menlo", "SF Mono", monospace;
  --pp-fs-xl: 20px;
  --pp-fs-lg: 16px;
  --pp-fs-md: 15px;
  --pp-fs-sm: 13px;
  --pp-fs-xs: 12px;
  --pp-lh: 1.5;

  /* 반경·그림자·간격(8-pt) */
  --pp-radius: 10px;
  --pp-radius-sm: 8px;
  --pp-radius-xs: 6px;
  --pp-radius-pill: 999px;
  --pp-shadow: 0 1px 2px rgba(17, 24, 39, 0.05), 0 1px 3px rgba(17, 24, 39, 0.06);
  --pp-shadow-lg: 0 10px 30px rgba(17, 24, 39, 0.16);
  --pp-sp-1: 4px;
  --pp-sp-2: 8px;
  --pp-sp-3: 12px;
  --pp-sp-4: 16px;
  --pp-sp-5: 24px;
  --pp-sp-6: 32px;

  /* 컨트롤 */
  --pp-control-h: 40px;
  --pp-control-h-sm: 32px;
  --pp-control-h-lg: 48px;
  --pp-touch-min: 44px;
  --pp-control-radius: 8px;

  /* 레이아웃 */
  --pp-gutter: 12px;
  --pp-gutter-desktop: 24px;
  /* 작업 영역 최대 폭 — 화면에 비례(96vw, 상한 1800 px; 사용자 2026-10-02 "작업영역 너비가 좁아 … 해상도가 충분함에도 가로스크롤" — 종전 고정 1280 px).
     좁은 화면(≤ 768 px)은 종전대로 전체 폭(아래 미디어쿼리) */
  --pp-content-max: min(96vw, 1800px);
  --pp-input-max: 480px;
  --pp-input-image-h: 360px;   /* 입력 이미지 틀 최대 높이(00 §15.1-68) — /test 입력 미리보기 · /logs 원본 이미지, 모바일 260px(아래) */
  --pp-aside-w: 380px;
  --pp-options-w: 340px;
  --pp-header-h: 56px;
  --pp-status-h: 32px;
  --pp-tabs-h: 48px;
  --pp-bottom-nav-h: 60px;
  --pp-action-bar-h: 64px;

  /* 전환 */
  --pp-dur: 150ms;
  --pp-ease: cubic-bezier(0.2, 0, 0, 1);

  color-scheme: light;
}

/* 다크 벌 — 토큰만 준비(09 §7: 다크 모드 후순위). data-theme="dark"를 html에 붙이면 적용된다. */
:root[data-theme="dark"] {
  --pp-bg: #0f1115;
  --pp-card: #171a21;
  --pp-fg: #e5e7eb;
  --pp-fg-muted: #9ca3af;
  --pp-fg-subtle: #6b7280;
  --pp-line: #262b35;
  --pp-line-strong: #363c49;
  --pp-accent: #3b82f6;
  --pp-accent-hover: #60a5fa;
  --pp-accent-soft: #172033;
  --pp-accent-fg: #ffffff;
  --pp-success: #4ade80;
  --pp-success-soft: #0f2419;
  --pp-warn: #fbbf24;
  --pp-warn-soft: #2a1f0a;
  --pp-danger: #f87171;
  --pp-danger-soft: #2b1212;
  --pp-inferred: #fb923c;
  --pp-inferred-soft: #2a1a0a;
  --pp-info-soft: #1c2029;
  --pp-code-bg: #11141a;
  --pp-hover: #1f242e;
  --pp-focus: #2563eb;
  --pp-overlay: rgba(0, 0, 0, 0.6);
  --pp-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
  --pp-shadow-lg: 0 10px 30px rgba(0, 0, 0, 0.6);
  color-scheme: dark;
}

/* 모바일(≤ 720 px): 기본 컨트롤(버튼·입력) 높이를 터치 최소 44 px 로 올린다(09 §7 터치 타깃) */
@media (max-width: 768px) {
  :root {
    --pp-content-max: 100%;      /* 좁은 화면: 작업 영역은 전체 폭(거터만) — 2026-10-02 */
  }
}
@media (max-width: 720px) {
  :root {
    --pp-control-h: 44px;
    --pp-input-image-h: 260px;   /* 입력 이미지 틀(00 §15.1-68) */
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --pp-dur: 0ms;
  }
}
/* 기본 스타일 — 리셋·타이포·폼 컨트롤·표·코드·유틸리티. 컴포넌트 고유 스타일은 각 .vue 파일에 scoped로 둔다.
   모바일 우선: 본문 15 px, 좌우 12 px 거터, 가로 스크롤 없음(표만 .table-wrap). */

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

/* hidden 속성은 어떤 display 규칙보다 우선(관리 탭이 hidden 인데도 보이던 결함의 재발 방지) */
[hidden] { display: none !important; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

html,
body {
  margin: 0;
  padding: 0;
  min-height: 100%;
}

body {
  font-family: var(--pp-font);
  font-size: var(--pp-fs-md);
  line-height: var(--pp-lh);
  color: var(--pp-fg);
  background: var(--pp-bg);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4 {
  margin: 0;
  font-weight: 600;
  line-height: 1.3;
}
h1 { font-size: var(--pp-fs-xl); }
h2 { font-size: var(--pp-fs-lg); }
h3 { font-size: var(--pp-fs-md); }
h4 { font-size: var(--pp-fs-sm); color: var(--pp-fg-muted); }

p { margin: 0 0 var(--pp-sp-2); }
p:last-child { margin-bottom: 0; }

a { color: var(--pp-accent); text-decoration: none; }
a:hover { text-decoration: underline; }

code,
pre,
kbd,
.pp-mono { font-family: var(--pp-mono); }

img,
svg,
video,
canvas { max-width: 100%; height: auto; display: block; }

button,
input,
select,
textarea {
  font: inherit;
  color: inherit;
}

button { cursor: pointer; }
button:disabled { cursor: default; }

/* 포커스 링(키보드 접근) */
:focus-visible {
  outline: 2px solid var(--pp-accent);
  outline-offset: 2px;
}

/* ─── 폼 컨트롤: 높이 40·반경 8 ─── */
.pp-input,
.pp-select,
.pp-textarea,
input[type="text"].pp-field,
input[type="password"].pp-field,
input[type="number"].pp-field,
input[type="url"].pp-field,
input[type="date"].pp-field,
input[type="datetime-local"].pp-field,
select.pp-field,
textarea.pp-field {
  display: block;
  width: 100%;
  min-height: var(--pp-control-h);
  padding: 8px 12px;
  border: 1px solid var(--pp-line-strong);
  border-radius: var(--pp-control-radius);
  background: var(--pp-card);
  color: var(--pp-fg);
  font-size: var(--pp-fs-md);
  line-height: 1.4;
  transition: border-color var(--pp-dur) var(--pp-ease), box-shadow var(--pp-dur) var(--pp-ease);
}
/* 입력 폭 상한(요구 1): 창을 최대화해도 입력줄이 화면 전체 폭으로 늘어나지 않는다. 표 안·시트 안은 컨테이너가 더 좁으니 그대로.
   textarea(레지스트리 JSON 편집기)와 .is-full 은 예외. */
.pp-input,
.pp-select,
input.pp-field,
select.pp-field { max-width: var(--pp-input-max); }
.pp-input.is-full,
.pp-select.is-full,
.pp-field.is-full { max-width: none; }
.pp-input.is-short,
.pp-select.is-short,
.pp-field.is-short { max-width: 8em; }
.pp-input:focus,
.pp-select:focus,
.pp-textarea:focus,
.pp-field:focus {
  outline: none;
  border-color: var(--pp-accent);
  box-shadow: 0 0 0 3px var(--pp-accent-soft);
}
.pp-input:disabled,
.pp-select:disabled,
.pp-field:disabled { opacity: 0.6; background: var(--pp-hover); }
.pp-input::placeholder,
.pp-field::placeholder { color: var(--pp-fg-subtle); }
.pp-textarea,
textarea.pp-field { min-height: 120px; resize: vertical; font-family: var(--pp-mono); font-size: var(--pp-fs-sm); }
select.pp-select,
select.pp-field {
  appearance: none;
  -webkit-appearance: none;
  padding-right: 32px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center;
}
.pp-input.is-sm,
.pp-select.is-sm { min-height: var(--pp-control-h-sm); padding: 4px 10px; font-size: var(--pp-fs-sm); }

/* 라벨: 한글 라벨 + 작은 영문 키 */
.pp-label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  font-size: var(--pp-fs-sm);
  color: var(--pp-fg);
}
.pp-label > .pp-label-text {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  font-weight: 500;
}
.pp-key {
  font-family: var(--pp-mono);
  font-size: var(--pp-fs-xs);
  color: var(--pp-fg-subtle);
  font-weight: 400;
  letter-spacing: 0;
}
.pp-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: var(--pp-touch-min);
  font-size: var(--pp-fs-md);
  cursor: pointer;
}
.pp-check input[type="checkbox"],
.pp-check input[type="radio"] {
  width: 18px;
  height: 18px;
  margin: 0;
  accent-color: var(--pp-accent);
}

/* ─── 표(.table-wrap만 가로 스크롤) ─── */
.table-wrap {
  overflow-x: auto;
  max-width: 100%;
  border: 1px solid var(--pp-line);
  border-radius: var(--pp-radius-sm);
  background: var(--pp-card);
  -webkit-overflow-scrolling: touch;
}
.pp-table {
  border-collapse: collapse;
  width: 100%;
  font-size: var(--pp-fs-sm);
}
.pp-table th,
.pp-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--pp-line);
  text-align: left;
  vertical-align: top;
  white-space: nowrap;
}
.pp-table thead th {
  position: sticky;
  top: 0;
  background: var(--pp-code-bg);
  color: var(--pp-fg-muted);
  font-weight: 600;
  font-size: var(--pp-fs-xs);
  letter-spacing: 0.02em;
  z-index: 1;
}
.pp-table tbody tr:last-child td { border-bottom: 0; }
/* 넓은 화면(≥ 1280 px): 셀 여백을 줄여 열이 많은 표(배치 결과 15열·기록 19열)가 가로 스크롤 없이 들어가게(2026-10-02) — 폭이 모자랄 때만 .table-wrap 이 스크롤 */
@media (min-width: 1280px) {
  .pp-table th,
  .pp-table td { padding: 7px 8px; }
}
.pp-table tbody tr:hover { background: var(--pp-hover); }
.pp-table tr.is-clickable { cursor: pointer; }
.pp-table td.is-num { text-align: right; font-family: var(--pp-mono); font-variant-numeric: tabular-nums; }
.pp-table td.is-wrap { white-space: normal; word-break: break-word; }

/* ─── 코드·트리·MRZ ─── */
.pp-code {
  margin: 0;
  padding: 12px;
  background: var(--pp-code-bg);
  border: 1px solid var(--pp-line);
  border-radius: var(--pp-radius-sm);
  font-size: var(--pp-fs-xs);
  line-height: 1.55;
  white-space: pre-wrap;
  word-break: break-all;
  overflow: auto;
  max-height: 60vh;
}
.pp-mrz {
  font-family: var(--pp-mono);
  font-size: 14px;
  letter-spacing: 1px;
  white-space: pre;
  overflow-x: auto;
  padding: 8px 10px;
  background: var(--pp-code-bg);
  border-radius: var(--pp-radius-xs);
}
.pp-tree {
  font-family: var(--pp-mono);
  font-size: var(--pp-fs-xs);
  line-height: 1.6;
  max-height: 60vh;
  overflow: auto;
  background: var(--pp-code-bg);
  border: 1px solid var(--pp-line);
  border-radius: var(--pp-radius-sm);
  padding: 10px;
}
.pp-tree details { margin: 0; }
.pp-tree summary { cursor: pointer; list-style: none; }
.pp-tree summary::-webkit-details-marker { display: none; }
.pp-tree summary::before { content: "▸ "; color: var(--pp-fg-subtle); }
.pp-tree details[open] > summary::before { content: "▾ "; }
.pp-tree .tree-kids { margin-left: 14px; border-left: 1px dotted var(--pp-line-strong); padding-left: 8px; }
.pp-tree .leaf { white-space: pre-wrap; word-break: break-all; }
.pp-tree .k { color: var(--pp-accent); }
.pp-tree .m { color: var(--pp-fg-subtle); }
.pp-tree .v.string { color: var(--pp-success); }
.pp-tree .v.number { color: var(--pp-warn); }
.pp-tree .v.boolean { color: var(--pp-danger); }
.pp-tree .v.object { color: var(--pp-fg-subtle); }

/* ─── 안내 박스 ─── */
.pp-note {
  border-left: 4px solid var(--pp-warn);
  background: var(--pp-warn-soft);
  padding: 10px 12px;
  border-radius: var(--pp-radius-xs);
  font-size: var(--pp-fs-sm);
}
.pp-note.is-error { border-left-color: var(--pp-danger); background: var(--pp-danger-soft); }
.pp-note.is-info { border-left-color: var(--pp-accent); background: var(--pp-accent-soft); }
.pp-note ul { margin: 4px 0 0; padding-left: 18px; }

/* ─── 유틸리티 ─── */
.pp-muted { color: var(--pp-fg-muted); }
.pp-subtle { color: var(--pp-fg-subtle); }
.pp-small { font-size: var(--pp-fs-sm); }
.pp-xs { font-size: var(--pp-fs-xs); }
.pp-strong { font-weight: 600; }
.pp-ok { color: var(--pp-success); }
.pp-warn { color: var(--pp-warn); }
.pp-err { color: var(--pp-danger); }
.pp-break { word-break: break-all; }
.pp-truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* 끌어서 스크롤(util/dragScroll.ts — v-drag-scroll): 끄는 동안 쥔 손 커서, 글자·이미지 선택 막기 */
.pp-drag-scroll.is-drag-scrolling, .pp-drag-scroll.is-drag-scrolling * { cursor: grabbing !important; user-select: none; }
.pp-row { display: flex; align-items: center; gap: var(--pp-sp-2); flex-wrap: wrap; min-width: 0; }
.pp-row.is-between { justify-content: space-between; }
.pp-row.is-end { justify-content: flex-end; }
.pp-stack { display: flex; flex-direction: column; gap: var(--pp-sp-3); min-width: 0; }
.pp-grid-2 { display: grid; grid-template-columns: 1fr; gap: var(--pp-sp-3); }
.pp-grid-auto { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: var(--pp-sp-2) var(--pp-sp-3); }
.pp-subtitle { font-size: var(--pp-fs-sm); font-weight: 600; margin: var(--pp-sp-3) 0 var(--pp-sp-1); color: var(--pp-fg); }
.pp-subtitle:first-child { margin-top: 0; }
.pp-divider { border: 0; border-top: 1px solid var(--pp-line); margin: var(--pp-sp-3) 0; }
.pp-hidden { display: none !important; }
.pp-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;
}
.pp-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 10px;
  border: 1px solid var(--pp-line);
  border-radius: var(--pp-radius-pill);
  background: var(--pp-code-bg);
  font-size: var(--pp-fs-xs);
  white-space: nowrap;
}
.pp-chip b { font-family: var(--pp-mono); font-weight: 600; }
.pp-spinner {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid currentColor;
  border-right-color: transparent;
  animation: pp-spin 0.8s linear infinite;
  vertical-align: -2px;
}
@keyframes pp-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .pp-spinner { animation-duration: 1.6s; }
  *,
  *::before,
  *::after { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
  .pp-spinner { animation-duration: 0.8s !important; }
}

/* ─── 페이지 컨테이너·폼 격자(요구 1) ─── */
/* 모든 화면 폭에서 내용은 1280 px 안에 중앙 정렬. 헤더 안쪽도 같은 컨테이너를 쓴다. */
.pp-page {
  width: 100%;
  max-width: var(--pp-content-max);
  margin: 0 auto;
  padding-left: max(var(--pp-gutter), env(safe-area-inset-left, 0px));
  padding-right: max(var(--pp-gutter), env(safe-area-inset-right, 0px));
  min-width: 0;
}
/* 폼 격자: 폭이 늘어나면 열 수만 늘어난다(각 칸은 최소 200 px, 최대 1fr) — 입력 자체는 --pp-input-max 상한 */
.pp-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: var(--pp-sp-3) var(--pp-sp-4);
  min-width: 0;
}
.pp-form-grid.is-wide { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.pp-form-grid > .is-span2 { grid-column: span 2; }
/* 필터 줄: 라벨+입력이 가로로 흐르고, 좁으면 세로로 쌓인다 */
.pp-filter-row { display: flex; flex-wrap: wrap; gap: var(--pp-sp-2) var(--pp-sp-3); align-items: flex-end; min-width: 0; }
.pp-filter-row > .pp-label { flex: 1 1 160px; max-width: var(--pp-input-max); }
.pp-filter-row > .pp-label.is-short { flex: 0 1 8em; }
/* 빈 상태 */
.pp-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--pp-sp-2);
  padding: var(--pp-sp-6) var(--pp-sp-4);
  text-align: center;
  color: var(--pp-fg-muted);
  font-size: var(--pp-fs-sm);
  border: 1px dashed var(--pp-line);
  border-radius: var(--pp-radius-sm);
  background: var(--pp-info-soft);
}
.pp-empty-title { font-size: var(--pp-fs-md); font-weight: 600; color: var(--pp-fg); }
/* 옵션 패널 한 그룹 = 한 줄(요구 4): 라벨(한글 + 작은 영문 키) 위, 컨트롤 아래 */
.pp-opt-group { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pp-opt-group + .pp-opt-group { margin-top: var(--pp-sp-4); padding-top: var(--pp-sp-4); border-top: 1px solid var(--pp-line); }
.pp-opt-group > .pp-label-text { display: inline-flex; align-items: baseline; gap: 6px; font-size: var(--pp-fs-sm); font-weight: 600; }
.pp-opt-group .pp-check { min-height: 36px; }

/* ─── 반응형 ─── */
@media (min-width: 720px) {
  .pp-grid-2 { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 720px) {
  /* 데스크톱 거터 24 px(토큰 --pp-gutter-desktop) */
  .pp-page {
    padding-left: max(var(--pp-gutter-desktop), env(safe-area-inset-left, 0px));
    padding-right: max(var(--pp-gutter-desktop), env(safe-area-inset-right, 0px));
  }
}
@media (max-width: 720px) {
  .pp-form-grid { grid-template-columns: 1fr; }
  .pp-form-grid > .is-span2 { grid-column: auto; }
  /* 필터 줄: 라벨·입력·버튼이 한 줄씩 세로로 쌓인다(flex 단축 속성으로 확실히 — flex-basis 만 바꾸면 grow 값이 남아 폭이 흔들린다) */
  .pp-filter-row > .pp-label,
  .pp-filter-row > .pp-label.is-short { flex: 0 0 100%; max-width: none; }
  .pp-filter-row > .pp-btn { width: 100%; }
  .pp-input, .pp-select, input.pp-field, select.pp-field { max-width: none; }
}

.pp-icon[data-v-6ad3b8c3] { flex: 0 0 auto; display: inline-block; vertical-align: -0.2em;
}

.pp-btn[data-v-64250001] {
  position: relative;          /* 아이콘 전용 버튼의 화면 읽기용 글자(.pp-sr-only, absolute)를 버튼 안에 가둔다 */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: var(--pp-control-h);
  padding: 0 14px;
  border: 1px solid var(--pp-line-strong);
  border-radius: var(--pp-control-radius);
  background: var(--pp-card);
  color: var(--pp-fg);
  font-size: var(--pp-fs-md);
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  user-select: none;
  max-width: 100%;
  transition: background var(--pp-dur) var(--pp-ease), border-color var(--pp-dur) var(--pp-ease), color var(--pp-dur) var(--pp-ease), box-shadow var(--pp-dur) var(--pp-ease);
}
.pp-btn-label[data-v-64250001] { overflow: hidden; text-overflow: ellipsis;
}
.pp-btn[data-v-64250001]:hover:not(:disabled):not([aria-disabled="true"]) { background: var(--pp-hover);
}
.pp-btn[data-v-64250001]:active:not(:disabled) { transform: translateY(0.5px);
}
.pp-btn[data-v-64250001]:disabled, .pp-btn[aria-disabled="true"][data-v-64250001] { opacity: 0.55; cursor: default;
}
.is-primary[data-v-64250001] { background: var(--pp-accent); border-color: var(--pp-accent); color: var(--pp-accent-fg);
}
.is-primary[data-v-64250001]:hover:not(:disabled) { background: var(--pp-accent-hover); border-color: var(--pp-accent-hover);
}
.is-ghost[data-v-64250001] { background: transparent; border-color: transparent; color: var(--pp-fg);
}
.is-ghost[data-v-64250001]:hover:not(:disabled) { background: var(--pp-hover);
}
.is-danger[data-v-64250001] { background: transparent; border-color: var(--pp-danger); color: var(--pp-danger);
}
.is-danger[data-v-64250001]:hover:not(:disabled) { background: var(--pp-danger-soft);
}
.is-active[data-v-64250001] { border-color: var(--pp-accent); color: var(--pp-accent); background: var(--pp-accent-soft);
}
.is-primary.is-active[data-v-64250001] { background: var(--pp-accent-hover); color: var(--pp-accent-fg);
}
.is-sm[data-v-64250001] { min-height: var(--pp-control-h-sm); padding: 0 10px; font-size: var(--pp-fs-sm); border-radius: var(--pp-radius-xs);
}
.is-lg[data-v-64250001] { min-height: var(--pp-control-h-lg); padding: 0 20px; font-size: var(--pp-fs-lg); font-weight: 600;
}
.is-block[data-v-64250001] { display: flex; width: 100%;
}
.is-icon[data-v-64250001] { padding: 0; width: var(--pp-control-h);
}
.is-icon.is-sm[data-v-64250001] { width: var(--pp-control-h-sm);
}
.is-icon.is-lg[data-v-64250001] { width: var(--pp-control-h-lg);
}
.is-loading[data-v-64250001] { pointer-events: none;
}

.ag[data-v-dbc73be6] { min-height: 40vh; justify-content: center; text-align: center; gap: var(--pp-sp-2);
}
.ag-desc[data-v-dbc73be6] { max-width: 36em; line-height: 1.6; overflow-wrap: anywhere;
}
.ag-actions[data-v-dbc73be6] { display: flex; gap: var(--pp-sp-3); align-items: center; justify-content: center; flex-wrap: wrap; margin-top: var(--pp-sp-2);
}
.ag-link[data-v-dbc73be6] { color: var(--pp-accent); font-weight: 500;
}

.pp-table-empty[data-v-3705dbe2] { padding: var(--pp-sp-2) 0;
}
.pp-table-actions[data-v-3705dbe2] { white-space: nowrap;
}
.pp-table-actions[data-v-3705dbe2] .pp-btn + .pp-btn { margin-left: 4px;
}

.pp-badge[data-v-616a35fe] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 10px;
  border-radius: 6px;                      /* 알약 금지 — 일반 모서리(2026-10-02) */
  border: 1px solid var(--pp-line);
  background: var(--pp-info-soft);
  color: var(--pp-fg-muted);
  font-size: var(--pp-fs-md);              /* md(기본): 필드 값과 같은 글자 크기 */
  font-weight: 600;
  line-height: 1.5;
  white-space: nowrap;
  vertical-align: middle;
}
.pp-badge-dot[data-v-616a35fe] { width: 7px; height: 7px; border-radius: 50%; background: currentColor;
}
.is-success[data-v-616a35fe] { color: var(--pp-success); border-color: color-mix(in srgb, var(--pp-success) 35%, transparent); background: var(--pp-success-soft);
}
.is-inferred[data-v-616a35fe] { color: var(--pp-inferred); border-color: color-mix(in srgb, var(--pp-inferred) 40%, transparent); background: var(--pp-inferred-soft);
}
.is-warn[data-v-616a35fe] { color: var(--pp-warn); border-color: color-mix(in srgb, var(--pp-warn) 35%, transparent); background: var(--pp-warn-soft);
}
.is-danger[data-v-616a35fe] { color: var(--pp-danger); border-color: color-mix(in srgb, var(--pp-danger) 35%, transparent); background: var(--pp-danger-soft);
}
.is-info[data-v-616a35fe] { color: var(--pp-accent); border-color: color-mix(in srgb, var(--pp-accent) 35%, transparent); background: var(--pp-accent-soft);
}
.is-sm[data-v-616a35fe] { padding: 0 7px; font-size: 11px; line-height: 1.6; border-radius: 4px;
}
.is-lg[data-v-616a35fe] { padding: 4px 14px; font-size: var(--pp-fs-lg); font-weight: 700;
}

.pp-kv-wrap[data-v-40108ee4] { min-width: 0; max-width: 100%; container-type: inline-size;
}
.pp-kv[data-v-40108ee4] {
  margin: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0 var(--pp-sp-4);
  border: 1px solid var(--pp-line);
  border-radius: var(--pp-radius-sm);
  background: var(--pp-card);
  overflow: hidden;
  min-width: 0;
}
.pp-kv-row[data-v-40108ee4] {
  display: grid;
  grid-template-columns: minmax(96px, var(--kv-key-w)) minmax(0, 1fr);
  gap: var(--pp-sp-2);
  padding: 8px 12px;
  border-bottom: 1px solid var(--pp-line);
  min-width: 0;
  align-items: baseline;
}
.pp-kv-row[data-v-40108ee4]:last-child { border-bottom: 0;
}
/* 라벨은 자기 열 안에서 줄바꿈한다 — `verification.cell_residual_mm` 처럼 공백 없는 긴 키가 값 위로 번지지 않게(사용자 지적 2026-09-30 밤) */
.pp-kv-k[data-v-40108ee4] { display: flex; flex-direction: column; gap: 1px; font-size: var(--pp-fs-sm); color: var(--pp-fg-muted); min-width: 0; overflow-wrap: anywhere; word-break: break-word;
}
.pp-kv-v.is-single[data-v-40108ee4] { text-align: right; padding-right: 12px;
}   /* 한 줄 값: 오른쪽 맞춤 + 오른쪽 여백 */
.pp-kv-v[data-v-40108ee4] { margin: 0; font-size: var(--pp-fs-md); color: var(--pp-fg); min-width: 0; overflow-wrap: anywhere;
}
.pp-kv-v.is-wrap[data-v-40108ee4] { white-space: pre-wrap;
}
.is-dense .pp-kv-row[data-v-40108ee4] { padding: 5px 10px;
}
.is-cols-2[data-v-40108ee4] { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.is-cols-2 .pp-kv-row[data-v-40108ee4]:nth-child(odd) { border-right: 1px solid var(--pp-line);
}
.is-cols-2 .pp-kv-row[data-v-40108ee4]:nth-last-child(2):nth-child(odd) { border-bottom: 0;
}
@container (min-width: 560px) {
.is-cols-auto[data-v-40108ee4] { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.is-cols-auto .pp-kv-row[data-v-40108ee4]:nth-child(odd) { border-right: 1px solid var(--pp-line);
}
.is-cols-auto .pp-kv-row[data-v-40108ee4]:nth-last-child(2):nth-child(odd) { border-bottom: 0;
}
}

/* KvGrid 가 자체 컨테이너(.pp-kv-wrap)로 2열↔1열을 결정한다 */
.ks[data-v-50401bbd] { min-width: 0;
}
.ks-list[data-v-50401bbd] { margin: 0; padding-left: 18px;
}
.ks-list li + li[data-v-50401bbd] { margin-top: 2px;
}

.bs[data-v-7211c769] { min-width: 0;
}
.bs-grid[data-v-7211c769] {
  margin: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  border: 1px solid var(--pp-line);
  border-radius: var(--pp-radius-sm);
  background: var(--pp-card);
  overflow: hidden;
  min-width: 0;
}
.bs-row[data-v-7211c769] {
  display: grid;
  grid-template-columns: minmax(96px, 34%) minmax(0, 1fr);
  gap: var(--pp-sp-2);
  padding: 8px 12px;
  border-top: 1px solid var(--pp-line);
  min-width: 0;
  align-items: baseline;
}
/* 상태 줄(사용자 2026-10-02 "상태 표시되는 위치를 상태 (STATUS) 에서 구역 10% 사이를 두고 표기한다", "원인을 상태란에 오른쪽 정렬로 간단하게 표시한다"):
   라벨(내용 폭) · 줄 폭의 10% 간격 · 배지 · 남는 폭에 원인 메모(오른쪽 맞춤) */
.bs-row.is-status[data-v-7211c769] { border-top: 0; grid-template-columns: auto auto minmax(0, 1fr); column-gap: 10%; align-items: center;
}
.bs-status[data-v-7211c769] { display: flex; align-items: center;
}
.bs-note[data-v-7211c769] { text-align: right; padding-right: 12px; color: var(--pp-inferred); font-weight: 500; min-width: 0; overflow-wrap: anywhere;
}
.bs-note.is-partial[data-v-7211c769] { color: var(--pp-warn);
}
.bs-k[data-v-7211c769] { display: flex; flex-direction: column; gap: 1px; font-size: var(--pp-fs-sm); color: var(--pp-fg-muted); min-width: 0; overflow-wrap: anywhere; word-break: break-word;
}
.bs-v[data-v-7211c769] { margin: 0; font-size: var(--pp-fs-md); color: var(--pp-fg); min-width: 0; overflow-wrap: anywhere;
}
.bs-v.is-single[data-v-7211c769] { text-align: right; padding-right: 12px;
}   /* 한 줄 값: 오른쪽 맞춤 + 오른쪽 여백(KvGrid 와 같다) */
.bs-v.is-inferred[data-v-7211c769] { color: var(--pp-inferred); font-weight: 600;
}   /* 확정되지 않은 값 = 추론인식 배지 색(Badge .is-inferred) */
/* 값 뒤 작은 표지(tags — APK 'NFC 칩 값으로 고침'): 값 글꼴과 무관하게 작은 일반 글꼴·확인 색 */
.bs-tag[data-v-7211c769] { display: inline-block; margin-left: 6px; padding: 0 6px; border-radius: 4px; font-family: var(--pp-font); font-size: 11px; font-weight: 600; line-height: 1.6;
  vertical-align: 1px; color: var(--pp-success); background: var(--pp-success-soft); border: 1px solid color-mix(in srgb, var(--pp-success) 35%, transparent); white-space: nowrap;
}
/* ≥ 720 px: 두 열 — 상태는 1행 전체, 왼쪽 열 = 2~5행 1열, 오른쪽 열 = 2~5행 2열(같은 행 = 같은 높이) */
@media (min-width: 720px) {
.bs-grid[data-v-7211c769] { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}
.bs-row.is-status[data-v-7211c769] { grid-column: 1 / -1; grid-row: 1;
}
.bs-row.is-col-1[data-v-7211c769] { grid-column: 1; grid-row: var(--bs-row); border-right: 1px solid var(--pp-line);
}
.bs-row.is-col-2[data-v-7211c769] { grid-column: 2; grid-row: var(--bs-row);
}
}

/* 카메라 화면은 밝기와 무관하게 어두운 틀(프리뷰 대비) — 색은 토큰 중 상태색(success·warn·danger·accent·focus)만 빌린다 */
.pp-cam-root[data-v-74378d4f] {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(16px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) max(16px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
}
.pp-cam-backdrop[data-v-74378d4f] { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.72);
}
.pp-cam[data-v-74378d4f] {
  position: relative;
  width: min(960px, 100%);
  max-height: 100%;
  display: flex;
  flex-direction: column;
  background: #0b0d12;
  color: #f3f4f6;
  border-radius: 14px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6);
  overflow: hidden;
  outline: none;
  min-width: 0;
}
.pp-cam-head[data-v-74378d4f] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: var(--pp-sp-2);
  min-height: 52px;
  padding: 0 var(--pp-sp-2) 0 var(--pp-sp-4);
}
.pp-cam-title[data-v-74378d4f] { flex: 1 1 auto; min-width: 0; margin: 0; font-size: var(--pp-fs-lg); font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pp-cam-x[data-v-74378d4f] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--pp-touch-min);
  height: var(--pp-touch-min);
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #e5e7eb;
  cursor: pointer;
}
.pp-cam-x[data-v-74378d4f]:hover { background: rgba(255, 255, 255, 0.12);
}
.pp-cam-stage[data-v-74378d4f] {
  position: relative;
  flex: 0 0 auto;
  height: min(62vh, 600px);
  background: #000;
  overflow: hidden;
}
.pp-cam-video[data-v-74378d4f], .pp-cam-result[data-v-74378d4f] { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain;
}
.pp-cam-overlay[data-v-74378d4f] { position: absolute; inset: 0; pointer-events: none;
}
.pp-cam-mask[data-v-74378d4f] { fill: rgba(0, 0, 0, 0.5);
}
.pp-cam-guide[data-v-74378d4f] { fill: none; stroke: rgba(255, 255, 255, 0.9); stroke-width: 1.5;
}
.pp-cam-corners[data-v-74378d4f] { fill: none; stroke: #fff; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round;
}
/* MRZ 띠: 어두운 밑줄(밝은 여권 면 위) + 흰 점선(어두운 배경 위) — 어느 바탕에서도 보이게 */
.pp-cam-mrz-under[data-v-74378d4f] { fill: rgba(37, 99, 235, 0.08); stroke: rgba(0, 0, 0, 0.55); stroke-width: 3;
}
.pp-cam-mrz[data-v-74378d4f] { fill: none; stroke: #fff; stroke-width: 1.5; stroke-dasharray: 6 4;
}
/* 'MRZ' 글자는 띠 바로 위 — 밝은 여권 면 위에서도 읽히게 어두운 외곽선을 먼저 칠한다 */
/* 확인 화면 점선(결과 위 안내 사각형) — MRZ 띠와 같은 두 겹(어두운 밑줄 + 흰 점선) */
.pp-cam-review-under[data-v-74378d4f] { fill: none; stroke: rgba(0, 0, 0, 0.55); stroke-width: 3;
}
.pp-cam-review-guide[data-v-74378d4f] { fill: none; stroke: #fff; stroke-width: 1.5; stroke-dasharray: 8 5;
}
.pp-cam-mrz-label[data-v-74378d4f] { fill: #fff; stroke: rgba(0, 0, 0, 0.8); stroke-width: 3px; paint-order: stroke; font-size: 12px; font-weight: 700; letter-spacing: 0.08em; font-family: var(--pp-mono);
}
.pp-cam-top[data-v-74378d4f] { position: absolute; top: var(--pp-sp-3); left: 0; right: 0; display: flex; justify-content: center; pointer-events: none; padding: 0 var(--pp-sp-3);
}
.pp-cam-dpi[data-v-74378d4f] {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  max-width: 100%;
  padding: 4px 12px;
  border-radius: var(--pp-radius-pill);
  font-size: var(--pp-fs-sm);
  font-weight: 700;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pp-cam-dpi small[data-v-74378d4f] { font-weight: 500; opacity: 0.9;
}
.pp-cam-dpi.is-ok[data-v-74378d4f] { background: var(--pp-success);
}
.pp-cam-dpi.is-caution[data-v-74378d4f] { background: var(--pp-warn);
}
.pp-cam-dpi.is-low[data-v-74378d4f], .pp-cam-dpi.is-reject[data-v-74378d4f] { background: var(--pp-danger);
}
.pp-cam-hint[data-v-74378d4f] {
  position: absolute;
  left: 0;
  right: 0;
  bottom: var(--pp-sp-3);
  margin: 0;
  padding: 0 var(--pp-sp-4);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  text-align: center;
  font-size: var(--pp-fs-md);
  font-weight: 600;
  color: #fff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9);
  pointer-events: none;
}
.pp-cam-hint-sub[data-v-74378d4f] { font-size: var(--pp-fs-sm); font-weight: 500;
}
.pp-cam-status[data-v-74378d4f] {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--pp-sp-2);
  background: rgba(0, 0, 0, 0.35);
  color: #fff;
  font-size: var(--pp-fs-md);
}
.pp-cam-error[data-v-74378d4f] {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--pp-sp-3);
  padding: var(--pp-sp-5);
  text-align: center;
  color: #fecaca;
}
.pp-cam-error p[data-v-74378d4f] { margin: 0; max-width: 520px; color: #f3f4f6; line-height: 1.6;
}
.pp-cam-info[data-v-74378d4f] { flex: 0 0 auto; padding: var(--pp-sp-3) var(--pp-sp-4) 0; font-size: var(--pp-fs-sm); line-height: 1.5;
}
.pp-cam-info-main[data-v-74378d4f] { font-weight: 700; font-size: var(--pp-fs-md);
}
.pp-cam-info-sub[data-v-74378d4f] { color: #d1d5db;
}
.pp-cam-warn[data-v-74378d4f] { margin: var(--pp-sp-2) 0 0; padding: var(--pp-sp-2) var(--pp-sp-3); border-radius: var(--pp-radius-xs); color: #fff;
}
.pp-cam-warn.is-caution[data-v-74378d4f] { background: rgba(180, 83, 9, 0.85);
}
.pp-cam-warn.is-low[data-v-74378d4f], .pp-cam-warn.is-reject[data-v-74378d4f] { background: rgba(185, 28, 28, 0.9);
}
.pp-cam-bar[data-v-74378d4f] {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: var(--pp-sp-3);
  padding: var(--pp-sp-3) var(--pp-sp-4) calc(var(--pp-sp-3) + env(safe-area-inset-bottom, 0px));
}
.pp-cam-bar.is-actions[data-v-74378d4f] { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: var(--pp-sp-2);
}
.pp-cam-side[data-v-74378d4f] { display: flex; align-items: center; gap: var(--pp-sp-2); min-width: 0;
}
.pp-cam-side.is-end[data-v-74378d4f] { justify-content: flex-end;
}
/* 어두운 틀 위의 ghost 버튼(COMM Button 의 루트에 붙는 클래스 — 틀 클래스를 앞에 붙여 Button 자체 스타일보다 우선) */
.pp-cam-bar .pp-cam-ghost[data-v-74378d4f] { color: #f3f4f6;
}
.pp-cam-bar .pp-cam-ghost[data-v-74378d4f]:hover:not(:disabled) { background: rgba(255, 255, 255, 0.12);
}
.pp-cam-bar .pp-cam-ghost.is-active[data-v-74378d4f] { color: #fde68a; background: rgba(253, 230, 138, 0.16); border-color: transparent;
}
.pp-cam-shutter[data-v-74378d4f] {
  width: 72px;
  height: 72px;
  padding: 0;
  border: 4px solid #fff;
  border-radius: 50%;
  background: transparent;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.pp-cam-shutter > span[data-v-74378d4f] { width: 54px; height: 54px; border-radius: 50%; background: #fff; transition: transform var(--pp-dur) var(--pp-ease);
}
.pp-cam-shutter:active:not(:disabled) > span[data-v-74378d4f] { transform: scale(0.9);
}
.pp-cam-shutter[data-v-74378d4f]:disabled { opacity: 0.4; cursor: default;
}
.pp-cam-shutter[data-v-74378d4f]:focus-visible, .pp-cam-x[data-v-74378d4f]:focus-visible { outline: 3px solid var(--pp-focus); outline-offset: 2px;
}
/* 촬영 보조(00 §15.1-63): 멈춤 대기 중 셔터 = 다시 누르면 바로 찍기 — 테두리가 숨 쉬듯 */
.pp-cam-shutter.is-steady[data-v-74378d4f] { border-color: var(--pp-warn); animation: pp-cam-breathe-74378d4f 1.1s ease-in-out infinite;
}
.pp-cam-shutter.is-steady > span[data-v-74378d4f] { transform: scale(0.82); background: rgba(255, 255, 255, 0.85);
}
@keyframes pp-cam-breathe-74378d4f {
50% { box-shadow: 0 0 0 6px rgba(255, 255, 255, 0.18);
}
}
.pp-cam-steady[data-v-74378d4f] {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: 100%;
  padding: 6px 14px;
  border-radius: var(--pp-radius-pill);
  background: rgba(17, 24, 39, 0.82);
  color: #fff;
  font-size: var(--pp-fs-sm);
  font-weight: 700;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}
.pp-cam-steady.is-burst[data-v-74378d4f] { background: var(--pp-accent, #2563eb);
}
.pp-cam-steady .pp-spinner[data-v-74378d4f] { width: 14px; height: 14px;
}
/* 초점 고리 — 누른 점(또는 MRZ 초점점)에서 줄어들며 사라진다 */
.pp-cam-focus[data-v-74378d4f] {
  position: absolute;
  width: 64px;
  height: 64px;
  margin: -32px 0 0 -32px;
  border: 2px solid #fde68a;
  border-radius: 50%;
  pointer-events: none;
  animation: pp-cam-focus-74378d4f 0.9s ease-out forwards;
}
@keyframes pp-cam-focus-74378d4f {
0% { transform: scale(1.4); opacity: 0;
}
25% { transform: scale(1); opacity: 1;
}
100% { transform: scale(0.85); opacity: 0;
}
}
/* 카메라 기능 표 — 무대 위에 겹친 어두운 패널(스크롤) */
.pp-cam-caps[data-v-74378d4f] {
  position: absolute;
  inset: var(--pp-sp-2);
  overflow: auto;
  padding: var(--pp-sp-3);
  border-radius: 10px;
  background: rgba(10, 12, 18, 0.92);
  color: #e5e7eb;
  font-size: var(--pp-fs-sm);
  line-height: 1.45;
  z-index: 2;
}
.pp-cam-caps-head[data-v-74378d4f] { display: flex; align-items: center; gap: var(--pp-sp-2); margin-bottom: var(--pp-sp-2);
}
.pp-cam-caps-head strong[data-v-74378d4f] { flex: 1 1 auto; min-width: 0; font-size: var(--pp-fs-md);
}
.pp-cam-caps-btn[data-v-74378d4f] {
  flex: 0 0 auto;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: var(--pp-radius-xs);
  background: transparent;
  color: #f3f4f6;
  cursor: pointer;
}
.pp-cam-caps-btn[data-v-74378d4f]:hover { background: rgba(255, 255, 255, 0.12);
}
.pp-cam-caps-btn[data-v-74378d4f]:focus-visible { outline: 3px solid var(--pp-focus); outline-offset: 2px;
}
.pp-cam-caps-table[data-v-74378d4f] { width: 100%; border-collapse: collapse; table-layout: fixed;
}
.pp-cam-caps-table th[data-v-74378d4f], .pp-cam-caps-table td[data-v-74378d4f] { padding: 4px 6px; border-bottom: 1px solid rgba(255, 255, 255, 0.1); text-align: left; vertical-align: top; overflow-wrap: anywhere;
}
.pp-cam-caps-table thead th[data-v-74378d4f] { color: #9ca3af; font-weight: 600;
}
.pp-cam-caps-table tbody th[data-v-74378d4f] { width: 34%; color: #d1d5db; font-weight: 600;
}
.pp-cam-caps-note[data-v-74378d4f] { margin: var(--pp-sp-2) 0 0; color: #9ca3af;
}
.pp-cam-caps-note.is-ok[data-v-74378d4f] { color: #86efac;
}
.pp-cam-caps-json[data-v-74378d4f] { margin: var(--pp-sp-2) 0 0; padding: var(--pp-sp-2); max-height: 40vh; overflow: auto; background: rgba(255, 255, 255, 0.06); border-radius: var(--pp-radius-xs); font-size: 11px; white-space: pre-wrap; word-break: break-all; user-select: text;
}

/* 모바일: 전체 화면(무대가 남는 높이를 모두 쓴다) */
@media (max-width: 720px) {
.pp-cam-root[data-v-74378d4f] { padding: 0;
}
.pp-cam[data-v-74378d4f] { width: 100%; height: 100%; max-height: none; border-radius: 0;
}
.pp-cam-head[data-v-74378d4f] { padding-top: env(safe-area-inset-top, 0px);
}
.pp-cam-stage[data-v-74378d4f] { flex: 1 1 auto; height: auto; min-height: 0;
}
.pp-cam-bar.is-actions[data-v-74378d4f] { justify-content: stretch;
}
.pp-cam-bar.is-actions[data-v-74378d4f] > * { flex: 1 1 0;
}
}

.pp-card[data-v-30488162] {
  background: var(--pp-card);
  border: 1px solid var(--pp-line);
  border-radius: var(--pp-radius);
  box-shadow: var(--pp-shadow);
  min-width: 0;
  max-width: 100%;
}
.pp-card-head[data-v-30488162] {
  display: flex;
  align-items: center;
  gap: var(--pp-sp-2);
  min-height: 52px;
  padding: 0 var(--pp-sp-3) 0 var(--pp-sp-2);
  border-bottom: 1px solid transparent;
  transition: border-color var(--pp-dur) var(--pp-ease);
}
/* 열림 상태는 자기 뿌리(.pp-card.is-open)의 직계에만 건다 — 조상의 is-open(열린 카드·접기 막대 안에 든 카드)에 끌려 펼쳐지지 않게 */
.pp-card.is-open > .pp-card-head[data-v-30488162] { border-bottom-color: var(--pp-line);
}
.pp-card-toggle[data-v-30488162] {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: var(--pp-sp-2);
  min-width: 0;
  min-height: 52px;
  padding: 0 var(--pp-sp-2);
  border: 0;
  background: transparent;
  color: inherit;
  text-align: left;
  border-radius: var(--pp-radius-sm);
}
button.pp-card-toggle[data-v-30488162] { cursor: pointer;
}
button.pp-card-toggle[data-v-30488162]:hover { background: var(--pp-hover);
}
.pp-card-chev[data-v-30488162] { color: var(--pp-fg-subtle); transition: transform var(--pp-dur) var(--pp-ease); transform: rotate(-90deg);
}
.pp-card.is-open > .pp-card-head .pp-card-chev[data-v-30488162] { transform: rotate(0deg);
}
/* 제목·부제는 한 줄: 긴 부제(API 경로)는 줄바꿈하지 않고 말줄임(모바일에서 부제가 아래 줄로 떨어져 화살표와 제목이 어긋나던 결함, 2026-09-30 밤) */
.pp-card-title[data-v-30488162] { display: flex; align-items: baseline; gap: var(--pp-sp-2); min-width: 0; flex-wrap: nowrap; overflow: hidden;
}
.pp-card-title h2[data-v-30488162] { font-size: var(--pp-fs-lg); font-weight: 600; white-space: nowrap;
}
.pp-card-sub[data-v-30488162] { font-size: var(--pp-fs-sm); color: var(--pp-fg-muted); min-width: 0; flex: 1 1 auto; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pp-card-extra[data-v-30488162] { flex: 0 0 auto; display: flex; align-items: center; gap: var(--pp-sp-2);
}

/* 접기 전환: grid-template-rows 0fr ↔ 1fr(높이 측정 없이 150 ms).
   열은 minmax(0, 1fr) + 항목 min-width: 0 — 암시적 auto 열이면 넓은 내용(19열 표·MRZ·탭 칩 줄)의 min-content 가
   카드·페이지를 표 폭(4 000 px+)으로 밀어 가로 스크롤을 만든다(요구 1 위반). 넓은 것은 각자(.table-wrap 등)의 가로 스크롤로 처리된다. */
.pp-card-fold[data-v-30488162] {
  display: grid;
  grid-template-rows: 0fr;
  grid-template-columns: minmax(0, 1fr);
  transition: grid-template-rows var(--pp-dur) var(--pp-ease);
}
.pp-card.is-open > .pp-card-fold[data-v-30488162] { grid-template-rows: 1fr;
}
.pp-card-fold-in[data-v-30488162] { min-height: 0; min-width: 0; overflow: hidden;
}
.pp-card.is-open > .pp-card-fold > .pp-card-fold-in[data-v-30488162] { overflow: visible;
}
.pp-card-body[data-v-30488162] { padding: var(--pp-sp-4); min-width: 0;
}
.pp-card-body.is-flush[data-v-30488162] { padding: 0;
}
.is-dense .pp-card-body[data-v-30488162] { padding: var(--pp-sp-3);
}
.pp-card-foot[data-v-30488162] {
  display: flex;
  align-items: center;
  gap: var(--pp-sp-2);
  flex-wrap: wrap;
  padding: var(--pp-sp-3) var(--pp-sp-4);
  border-top: 1px solid var(--pp-line);
  background: var(--pp-info-soft);
  border-radius: 0 0 var(--pp-radius) var(--pp-radius);
}
@media (max-width: 720px) {
.pp-card-body[data-v-30488162] { padding: var(--pp-sp-3);
}
.pp-card-foot[data-v-30488162] { padding: var(--pp-sp-3);
}
}

.pp-collapse[data-v-0072da20] {
  background: var(--pp-card);
  border: 1px solid var(--pp-line);
  border-radius: var(--pp-radius);
  box-shadow: var(--pp-shadow);
  min-width: 0;
}
.pp-collapse-bar[data-v-0072da20] { display: flex; align-items: center; gap: var(--pp-sp-2); padding-right: var(--pp-sp-2);
}
.pp-collapse-btn[data-v-0072da20] {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  gap: var(--pp-sp-2);
  min-height: 48px;
  min-width: 0;
  padding: 0 var(--pp-sp-3) 0 var(--pp-sp-4);
  border: 0;
  background: transparent;
  color: inherit;
  font-size: var(--pp-fs-md);
  font-weight: 600;
  text-align: left;
  border-radius: var(--pp-radius);
  cursor: pointer;
}
.pp-collapse-btn[data-v-0072da20]:hover { background: var(--pp-hover);
}
.pp-collapse-label[data-v-0072da20] { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}   /* 좁은 폭: 막대 오른쪽 버튼에 밀려도 한 줄 유지(말줄임) */
.pp-collapse-extra[data-v-0072da20] { flex: 0 0 auto; display: flex; align-items: center; gap: 6px;
}
.pp-collapse-summary[data-v-0072da20] { flex: 1 1 auto; min-width: 0; font-weight: 400; font-size: var(--pp-fs-sm); color: var(--pp-fg-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pp-collapse-chev[data-v-0072da20] { margin-left: auto; color: var(--pp-fg-subtle); transition: transform var(--pp-dur) var(--pp-ease);
}
/* 열림 상태는 자기 뿌리(.pp-collapse.is-open)의 직계에만 건다 — '.is-open .pp-collapse-fold' 처럼 조상 아무 곳의 is-open 에 걸면
   열린 카드(.pp-card.is-open)·열린 접기 막대 안에 든 막대는 닫아도 계속 펼쳐져 보인다(2026-10-02 기록 상세 그룹이 접히지 않던 원인) */
.pp-collapse.is-open > .pp-collapse-bar .pp-collapse-chev[data-v-0072da20] { transform: rotate(180deg);
}
/* 열은 minmax(0, 1fr) + min-width: 0 — 넓은 내용의 min-content 가 막대·페이지를 밀어 넓히지 않게(Card 와 같은 이유) */
.pp-collapse-fold[data-v-0072da20] { display: grid; grid-template-rows: 0fr; grid-template-columns: minmax(0, 1fr); transition: grid-template-rows var(--pp-dur) var(--pp-ease);
}
.pp-collapse.is-open > .pp-collapse-fold[data-v-0072da20] { grid-template-rows: 1fr;
}
.pp-collapse-in[data-v-0072da20] { min-height: 0; min-width: 0; overflow: hidden;
}
.pp-collapse-body[data-v-0072da20] { padding: var(--pp-sp-3) var(--pp-sp-4) var(--pp-sp-4); border-top: 1px solid var(--pp-line);
}

.iv[data-v-fa545278] { position: fixed; inset: 0; z-index: 1200; display: flex; flex-direction: column; background: rgba(10, 12, 16, 0.94); color: #f3f4f6; animation: iv-in-fa545278 150ms var(--pp-ease);
}
@keyframes iv-in-fa545278 {
from { opacity: 0;
}
to { opacity: 1;
}
}
.iv-bar[data-v-fa545278] {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: var(--pp-sp-2);
  min-height: 52px;
  padding: max(6px, env(safe-area-inset-top, 0px)) max(12px, env(safe-area-inset-right, 0px)) 6px max(16px, env(safe-area-inset-left, 0px));
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
.iv-title[data-v-fa545278] { flex: 1 1 auto; min-width: 0; font-size: var(--pp-fs-sm); font-weight: 600;
}
.iv-zoom[data-v-fa545278] { flex: 0 0 auto; font-size: var(--pp-fs-xs); color: #9ca3af; font-variant-numeric: tabular-nums;
}
.iv-btn[data-v-fa545278] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 40px;
  min-width: 40px;
  justify-content: center;
  padding: 0 10px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.06);
  color: inherit;
  font-size: var(--pp-fs-sm);
}
.iv-btn[data-v-fa545278]:hover { background: rgba(255, 255, 255, 0.14);
}
.iv-btn.is-on[data-v-fa545278] { border-color: #60a5fa; color: #bfdbfe;
}
.iv-close[data-v-fa545278] { border-color: transparent; background: transparent;
}
.iv-stage[data-v-fa545278] {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  display: flex;
  padding: var(--pp-sp-4);
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
/* margin:auto 로 가운데 — 원본 크기에서 넘쳐도 왼쪽·위쪽이 잘리지 않고 스크롤된다 */
.iv-frame[data-v-fa545278] { position: relative; margin: auto; flex: 0 0 auto; cursor: zoom-in;
}
.is-actual .iv-frame[data-v-fa545278] { cursor: zoom-out;
}
.iv-frame img[data-v-fa545278] { position: absolute; left: 50%; top: 50%; max-width: none; transform-origin: center center; user-select: none; background: #fff;
}
@media (max-width: 720px) {
.iv-btn-label[data-v-fa545278] { display: none;
}
.iv-stage[data-v-fa545278] { padding: var(--pp-sp-2);
}
}

.pp-drop[data-v-c643f830] {
  position: relative;
  min-height: 200px;
  border: 2px dashed var(--pp-line-strong);
  border-radius: var(--pp-radius);
  background: var(--pp-info-soft);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--pp-sp-4);
  transition: border-color var(--pp-dur) var(--pp-ease), background var(--pp-dur) var(--pp-ease);
  min-width: 0;
  overflow: hidden;
}
.pp-drop[data-v-c643f830]:hover:not(.is-disabled), .pp-drop.is-over[data-v-c643f830] { border-color: var(--pp-accent); background: var(--pp-accent-soft);
}
.pp-drop.is-disabled[data-v-c643f830] { cursor: default; opacity: 0.6;
}
.pp-drop.is-preview[data-v-c643f830] { padding: var(--pp-sp-2); border-style: solid; background: var(--pp-code-bg);
}
.pp-drop-empty[data-v-c643f830] { display: flex; flex-direction: column; align-items: center; gap: 6px; max-width: 420px;
}
.pp-drop-icon[data-v-c643f830] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--pp-card);
  color: var(--pp-accent);
  box-shadow: var(--pp-shadow);
  margin-bottom: 4px;
}
.pp-drop-hint[data-v-c643f830] { margin: 0; font-weight: 600; font-size: var(--pp-fs-md);
}
.pp-drop-formats[data-v-c643f830] { margin: 0; font-size: var(--pp-fs-xs); color: var(--pp-fg-subtle);
}
/* 미리보기 틀(00 §15.1-68): 높이 = --pp-input-image-h(고정, /logs 원본 이미지 틀과 같은 높이). 이미지는 틀 폭에 맞춰 확대·축소(비율 유지)하고
 * 넘치는 세로는 틀 안에서 스크롤, 폭 맞춤 높이가 틀보다 낮으면(.is-fit-h) 높이에 맞추고 넘치는 가로를 스크롤. 막대는 숨김(휠·터치 스크롤은 그대로) */
.pp-drop-frame[data-v-c643f830] {
  width: 100%;
  height: var(--pp-input-image-h);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: none;
  border-radius: var(--pp-radius-xs);
}
.pp-drop-frame[data-v-c643f830]::-webkit-scrollbar { display: none;
}
.pp-drop-img[data-v-c643f830] { display: block; width: 100%; height: auto;
}
.pp-drop-frame.is-fit-h[data-v-c643f830] { overflow-x: auto; overflow-y: hidden;
}
.pp-drop-frame.is-fit-h .pp-drop-img[data-v-c643f830] { width: auto; max-width: none; height: 100%;
}
/* [원본 크기] 버튼은 스크롤 틀 밖(.pp-drop-stage 기준)에 고정 — /logs 이미지 틀의 확대 버튼과 같은 모양 */
.pp-drop-stage[data-v-c643f830] { position: relative; width: 100%;
}
.pp-drop-zoom[data-v-c643f830] {
  position: absolute;
  right: 8px;
  bottom: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 8px;
  background: rgba(17, 24, 39, 0.6);
  color: #fff;
  cursor: zoom-in;
  opacity: 0.85;
  transition: opacity var(--pp-dur) var(--pp-ease);
}
.pp-drop-zoom[data-v-c643f830]:hover, .pp-drop-zoom[data-v-c643f830]:focus-visible { opacity: 1;
}
.pp-drop-zoom[data-v-c643f830]:focus-visible { outline: 3px solid var(--pp-focus); outline-offset: 2px;
}
.pp-drop-meta[data-v-c643f830] {
  display: flex;
  align-items: center;
  gap: var(--pp-sp-2);
  width: 100%;
  margin-top: var(--pp-sp-2);
  padding: 0 var(--pp-sp-1);
  font-size: var(--pp-fs-xs);
  color: var(--pp-fg-muted);
  min-width: 0;
}
.pp-drop-meta > span[data-v-c643f830] { flex: 1 1 auto; min-width: 0; text-align: left;
}
.pp-drop-clear[data-v-c643f830] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: 1px solid var(--pp-line);
  border-radius: 50%;
  background: var(--pp-card);
  color: var(--pp-fg-muted);
}
.pp-drop-clear[data-v-c643f830]:hover { color: var(--pp-danger); border-color: var(--pp-danger);
}
@media (max-width: 720px) {
.pp-drop[data-v-c643f830] { min-height: 160px;
}
}

.pp-modal-root[data-v-a73e6443] {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(16px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) max(16px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
}
.pp-modal-backdrop[data-v-a73e6443] { position: absolute; inset: 0; background: var(--pp-overlay); animation: pp-modal-fade-a73e6443 150ms var(--pp-ease);
}
.pp-modal[data-v-a73e6443] {
  position: relative;
  width: min(var(--modal-w), 100%);
  max-height: 100%;
  display: flex;
  flex-direction: column;
  background: var(--pp-card);
  border: 1px solid var(--pp-line);
  border-radius: 14px;
  box-shadow: var(--pp-shadow-lg);
  outline: none;
  min-width: 0;
  animation: pp-modal-in-a73e6443 180ms var(--pp-ease);
}
.pp-modal-head[data-v-a73e6443] {
  display: flex;
  align-items: center;
  gap: var(--pp-sp-2);
  min-height: 56px;
  padding: 0 var(--pp-sp-2) 0 var(--pp-sp-5);
  border-bottom: 1px solid var(--pp-line);
  flex: 0 0 auto;
}
.pp-modal-title[data-v-a73e6443] { flex: 1 1 auto; font-size: var(--pp-fs-lg); font-weight: 700; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pp-modal-extra[data-v-a73e6443] { flex: 0 0 auto; display: flex; align-items: center; gap: var(--pp-sp-2); padding-right: var(--pp-sp-3);
}
.pp-modal-close[data-v-a73e6443] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--pp-touch-min);
  height: var(--pp-touch-min);
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--pp-fg-muted);
}
.pp-modal-close[data-v-a73e6443]:hover { background: var(--pp-hover); color: var(--pp-fg);
}
.pp-modal-body[data-v-a73e6443] { flex: 1 1 auto; overflow: auto; padding: var(--pp-sp-4) var(--pp-sp-5) var(--pp-sp-5); min-height: 0; -webkit-overflow-scrolling: touch;
}
.pp-modal-foot[data-v-a73e6443] { flex: 0 0 auto; padding: var(--pp-sp-3) var(--pp-sp-5); border-top: 1px solid var(--pp-line); display: flex; gap: var(--pp-sp-2); flex-wrap: wrap; justify-content: flex-end;
}
@keyframes pp-modal-fade-a73e6443 {
from { opacity: 0;
}
to { opacity: 1;
}
}
@keyframes pp-modal-in-a73e6443 {
from { opacity: 0; transform: translateY(8px) scale(0.98);
}
to { opacity: 1; transform: none;
}
}
@media (max-width: 720px) {
.pp-modal-head[data-v-a73e6443] { padding-left: var(--pp-sp-4); min-height: 52px;
}
.pp-modal-body[data-v-a73e6443] { padding: var(--pp-sp-3) var(--pp-sp-4) var(--pp-sp-4);
}
.pp-modal-foot[data-v-a73e6443] { padding: var(--pp-sp-3) var(--pp-sp-4);
}
}

.hc-msg[data-v-41a63ca0] { margin: 0 0 var(--pp-sp-2); line-height: 1.6;
}
.hc-checks[data-v-41a63ca0] { display: flex; flex-direction: column; gap: 2px; margin: 0 0 var(--pp-sp-2);
}
.hc-check[data-v-41a63ca0] { align-items: flex-start; padding: 8px 0;
}
.hc-check input[data-v-41a63ca0] { margin-top: 2px; flex: 0 0 auto;
}
.hc-check-text[data-v-41a63ca0] { display: flex; flex-direction: column; gap: 2px; min-width: 0;
}
.hc-check-name[data-v-41a63ca0] { font-weight: 600;
}
.hc-all[data-v-41a63ca0] { margin-top: var(--pp-sp-1); padding-top: var(--pp-sp-3); border-top: 1px solid var(--pp-line);
}
.hc-note[data-v-41a63ca0] { margin: 0;
}
.hc-list[data-v-41a63ca0] { margin: 0 0 var(--pp-sp-2); padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px;
}
.hc-list li[data-v-41a63ca0] {
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px var(--pp-sp-2);
  padding: 8px var(--pp-sp-3); border: 1px solid var(--pp-line); border-radius: var(--pp-control-radius);
}
.hc-warn[data-v-41a63ca0] { margin: 0; color: var(--pp-danger); font-weight: 600; line-height: 1.6;
}
.hc-err[data-v-41a63ca0] { color: var(--pp-danger);
}
p.hc-err[data-v-41a63ca0] { margin: 0 0 var(--pp-sp-2); line-height: 1.6; overflow-wrap: anywhere;
}

.pp-mk[data-v-6427b6bb] { margin: 0; min-width: 0; display: flex; flex-direction: column; gap: var(--pp-sp-2);
}
.pp-mk-bar[data-v-6427b6bb] { display: flex; flex-wrap: wrap; gap: var(--pp-sp-2); justify-content: flex-end;
}
.pp-mk-fields[data-v-6427b6bb] { display: flex; flex-wrap: wrap; align-items: center; gap: var(--pp-sp-2); padding: var(--pp-sp-2); border: 1px dashed var(--pp-line); border-radius: var(--pp-radius-sm);
}
.pp-mk-field[data-v-6427b6bb] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--pp-line);
  border-radius: var(--pp-radius-pill);
  background: var(--pp-card);
  color: inherit;
  font: inherit;
  font-size: var(--pp-fs-sm);
  cursor: pointer;
}
.pp-mk-field.is-on[data-v-6427b6bb] { border-color: var(--mk-color); box-shadow: 0 0 0 2px var(--mk-color) inset; font-weight: 700;
}
.pp-mk-field[data-v-6427b6bb]:focus-visible { outline: 3px solid var(--pp-focus); outline-offset: 2px;
}
.pp-mk-swatch[data-v-6427b6bb] { width: 12px; height: 12px; border-radius: 3px; border: 2px solid var(--mk-color);
}
.pp-mk-field.is-done .pp-mk-swatch[data-v-6427b6bb] { background: var(--mk-color);
}
.pp-mk-hint[data-v-6427b6bb] { margin: 0; text-align: right;
}
.pp-mk-stage[data-v-6427b6bb] { position: relative; min-width: 0; line-height: 0; user-select: none; -webkit-user-select: none; scroll-margin-top: 72px;
}
.pp-mk-stage.is-drawing[data-v-6427b6bb] { cursor: crosshair; touch-action: none;
}
.pp-mk-img[data-v-6427b6bb] { width: 100%; height: auto; display: block; border: 1px solid var(--pp-line); border-radius: var(--pp-radius-sm); background: var(--pp-code-bg); pointer-events: none;
}
.pp-mk-stage.is-drawing .pp-mk-img[data-v-6427b6bb] { outline: 2px dashed var(--pp-warn); outline-offset: -2px;
}
.pp-mk-box[data-v-6427b6bb] { position: absolute; border: 3px solid; box-sizing: border-box; pointer-events: none; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35);
}
.pp-mk-box.is-draft[data-v-6427b6bb] { border-style: dashed;
}
.pp-mk-box.is-mark[data-v-6427b6bb] { border-width: 2px;
}

.pp-seg[data-v-6d5d1ee5] {
  display: inline-flex;
  gap: 2px;
  padding: 3px;
  border-radius: var(--pp-control-radius);
  background: var(--pp-bg);
  border: 1px solid var(--pp-line);
  max-width: 100%;
  min-width: 0;
}
.is-block[data-v-6d5d1ee5] { display: flex; width: 100%;
}
.pp-seg-item[data-v-6d5d1ee5] {
  flex: 1 1 0;
  min-width: 0;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  min-height: calc(var(--pp-control-h) - 8px);
  padding: 4px 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--pp-fg-muted);
  font-size: var(--pp-fs-sm);
  font-weight: 500;
  line-height: 1.2;
  cursor: pointer;
  transition: background var(--pp-dur) var(--pp-ease), color var(--pp-dur) var(--pp-ease), box-shadow var(--pp-dur) var(--pp-ease);
}
.pp-seg-item[data-v-6d5d1ee5]:hover:not(:disabled) { color: var(--pp-fg);
}
.pp-seg-item.is-on[data-v-6d5d1ee5] { background: var(--pp-card); color: var(--pp-fg); box-shadow: var(--pp-shadow); font-weight: 600;
}
.pp-seg-item[data-v-6d5d1ee5]:disabled { opacity: 0.5; cursor: default;
}
.pp-seg-label[data-v-6d5d1ee5] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;
}
.pp-seg-key[data-v-6d5d1ee5] { font-family: var(--pp-mono); font-size: 10px; color: var(--pp-fg-subtle); line-height: 1;
}
.is-on .pp-seg-key[data-v-6d5d1ee5] { color: var(--pp-accent);
}
.is-sm .pp-seg-item[data-v-6d5d1ee5] { min-height: calc(var(--pp-control-h-sm) - 8px); padding: 2px 8px; font-size: var(--pp-fs-xs);
}
.is-disabled[data-v-6d5d1ee5] { opacity: 0.6;
}

.lf[data-v-0a6ce42e] { gap: var(--pp-sp-4);
}
.lf-form[data-v-0a6ce42e] { gap: var(--pp-sp-3);
}
.lf-form .pp-label-text[data-v-0a6ce42e] { flex-wrap: wrap; row-gap: 0;
}     /* 긴 안내(영문)는 라벨 아래 줄로 — 라벨 자체는 줄바꿈하지 않는다 */
.lf-nowrap[data-v-0a6ce42e] { white-space: nowrap;
}
.lf-keyrow[data-v-0a6ce42e] { display: flex; gap: var(--pp-sp-2); min-width: 0;
}
.lf-keyrow > input[data-v-0a6ce42e] { flex: 1 1 auto; min-width: 0;
}
.lf-error[data-v-0a6ce42e] { margin: 0; overflow-wrap: anywhere;
}
.lf-note[data-v-0a6ce42e] { margin: 0; line-height: 1.5; overflow-wrap: anywhere; border-left-color: var(--pp-warn); background: var(--pp-warn-soft);
}
.lf-device[data-v-0a6ce42e] { margin: 0; line-height: 1.5;
}
.lf-privacy[data-v-0a6ce42e] { margin: 0; line-height: 1.5;
}

.pp-mdrop[data-v-65019eeb] {
  position: relative;
  /* 높이 고정(/test 입력 Dropzone 의 빈 상태 200 px 과 같다 — 모바일 160 px): 안내 문구 ↔ 축소본 전환·이미지 로드 중에도 레이아웃이 바뀌지 않아
     아래 파일 목록이 밀리지 않는다(사용자 실측 2026-10-02: 높이가 변해 마우스 아래 행이 바뀌며 축소본이 떨렸다) */
  height: 200px;
  border: 2px dashed var(--pp-line-strong);
  border-radius: var(--pp-radius);
  background: var(--pp-info-soft);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: var(--pp-sp-4);
  transition: border-color var(--pp-dur) var(--pp-ease), background var(--pp-dur) var(--pp-ease);
  min-width: 0;
  overflow: hidden;
}
.pp-mdrop[data-v-65019eeb]:hover:not(.is-disabled), .pp-mdrop.is-over[data-v-65019eeb] { border-color: var(--pp-accent); background: var(--pp-accent-soft);
}
.pp-mdrop.is-disabled[data-v-65019eeb] { cursor: default; opacity: 0.6;
}
.pp-mdrop-empty[data-v-65019eeb] { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; max-width: 420px; height: 100%; min-height: 0; overflow: hidden;
}
.pp-mdrop-icon[data-v-65019eeb] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--pp-card);
  color: var(--pp-accent);
  box-shadow: var(--pp-shadow);
  margin-bottom: 4px;
}
.pp-mdrop-hint[data-v-65019eeb] { margin: 0; font-weight: 600; font-size: var(--pp-fs-md);
}
.pp-mdrop-formats[data-v-65019eeb] { margin: 0; font-size: var(--pp-fs-xs); color: var(--pp-fg-subtle);
}
/* 미리보기 슬롯 틀 — 드롭존 안쪽 전체(고정 높이). 내용(가로 띠)은 호출자가 그린다 */
.pp-mdrop-strip[data-v-65019eeb] { width: 100%; height: 100%; min-width: 0; min-height: 0; cursor: default; text-align: left;
}
.pp-mdrop.is-strip[data-v-65019eeb] { padding: var(--pp-sp-2);
}
@media (max-width: 720px) {
.pp-mdrop[data-v-65019eeb] { height: 160px;
}
}

.pp-plink[data-v-23ff1f9b] {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: var(--pp-control-h-sm);
  padding: 0 10px;
  border: 1px solid var(--pp-line);
  border-radius: var(--pp-radius-xs);
  color: var(--pp-fg-muted);
  font-size: var(--pp-fs-sm);
  font-weight: 500;
  white-space: nowrap;
  text-decoration: none;
  flex: 0 0 auto;
  transition: background var(--pp-dur) var(--pp-ease), color var(--pp-dur) var(--pp-ease), border-color var(--pp-dur) var(--pp-ease);
}
.pp-plink[data-v-23ff1f9b]:hover { background: var(--pp-hover); color: var(--pp-fg); border-color: var(--pp-line-strong); text-decoration: none;
}
@media (max-width: 1100px) {
.pp-plink[data-v-23ff1f9b] { position: relative; width: var(--pp-control-h-sm); padding: 0; justify-content: center;
}
.pp-plink-label[data-v-23ff1f9b] { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}
}

.pp-plinks[data-v-489338ea] { display: inline-flex; gap: var(--pp-sp-2); flex: 0 0 auto;
}
/* 폰(≤ 480 px): 링크 3개(아이콘)가 머리 줄 제목 폭을 먹지 않게 간격을 줄인다(375 px 실측 — 관리자 콘솔 제목이 '관…'으로 잘렸다) */
@media (max-width: 480px) {
.pp-plinks[data-v-489338ea] { gap: 4px;
}
}

.gp-legend[data-v-f71e89a2] { margin-top: var(--pp-sp-2);
}
.gp-legend summary[data-v-f71e89a2] { cursor: pointer;
}
.gp-legend-list[data-v-f71e89a2] { margin: 4px 0 0; padding-left: 18px; line-height: 1.5;
}
.gp-legend-list b[data-v-f71e89a2] { font-weight: 600; margin-right: 2px; color: var(--pp-fg);
}

.rrt[data-v-7de01bf3] { min-width: 0;
}
.rrt-fig[data-v-7de01bf3] { margin: 0; min-width: 0;
}
.rrt-fig img[data-v-7de01bf3] { width: 100%; height: auto; display: block; border: 1px solid var(--pp-line); border-radius: var(--pp-radius-sm); background: var(--pp-code-bg);
}
.rrt-fig figcaption[data-v-7de01bf3] { margin-top: 6px;
}

/* 일반 영역(2026-10-01 사용자 "변두리를 일반 영역으로 수정"): 둥근 알약 테두리·회색 바탕 대신 다른 버튼과 같은 모서리·카드 바탕.
 * 폭은 드롭존 등 다른 그룹과 같은 전체 폭(사용자 "다른 그룹과 길이를 같으게 한다") — 이름표 왼쪽, 번호 버튼 오른쪽 끝 */
.pp-sp[data-v-d3e07789] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--pp-sp-2);
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 4px 6px 4px 12px;
  border: 1px solid var(--pp-line);
  border-radius: var(--pp-control-radius);
  background: var(--pp-card);
}
.pp-sp-label[data-v-d3e07789] { flex: 0 0 auto; font-size: var(--pp-fs-sm); color: var(--pp-fg-muted); white-space: nowrap;
}
.pp-sp-btns[data-v-d3e07789] { display: flex; flex-wrap: nowrap; gap: 6px; min-width: 0; overflow-x: auto; scrollbar-width: none;
}
.pp-sp-btns[data-v-d3e07789]::-webkit-scrollbar { display: none;
}
.pp-sp-btn[data-v-d3e07789] {
  flex: 0 0 auto;
  min-height: 36px;
  padding: 4px 12px;
  border: 1px solid var(--pp-line);
  border-radius: var(--pp-control-radius);
  background: var(--pp-card);
  color: inherit;
  font: inherit;
  font-size: var(--pp-fs-sm);
  font-weight: 600;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  transition: background var(--pp-dur, 0.15s) var(--pp-ease, ease), border-color var(--pp-dur, 0.15s) var(--pp-ease, ease);
}
.pp-sp-btn[data-v-d3e07789]:hover:not(:disabled) { border-color: var(--pp-accent);
}
.pp-sp-btn.is-active[data-v-d3e07789] { background: var(--pp-accent); border-color: var(--pp-accent); color: var(--pp-accent-fg, #fff);
}
.pp-sp-btn[data-v-d3e07789]:focus-visible { outline: 3px solid var(--pp-focus); outline-offset: 2px;
}
.pp-sp-btn[data-v-d3e07789]:disabled { opacity: 0.5; cursor: default;
}

.pp-tabs[data-v-68e16850] {
  display: flex;
  flex-wrap: wrap;             /* 폭이 모자라면 다음 줄로 — 잘림(overflow hidden)·숨은 스크롤 금지(2026-10-02) */
  gap: 2px;
  max-width: 100%;
  min-width: 0;
  overflow: visible;
}
.is-line[data-v-68e16850] { border-bottom: 1px solid var(--pp-line);
}
.pp-tab[data-v-68e16850] {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  padding: 0 14px;
  border: 0;
  background: transparent;
  color: var(--pp-fg-muted);
  font-size: var(--pp-fs-md);
  font-weight: 500;
  white-space: nowrap;
  cursor: pointer;
  transition: color var(--pp-dur) var(--pp-ease), background var(--pp-dur) var(--pp-ease);
}
.pp-tab[data-v-68e16850]:hover:not(:disabled) { color: var(--pp-fg);
}
.pp-tab[data-v-68e16850]:disabled { opacity: 0.5; cursor: default;
}
.is-line .pp-tab[data-v-68e16850] { border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.is-line .pp-tab.is-on[data-v-68e16850] { color: var(--pp-accent); border-bottom-color: var(--pp-accent); font-weight: 600;
}
/* chips 변형 = 일반 버튼 모양(사용자 2026-10-02 "요약 등 버튼 radius 를 일반 버튼으로 … 알약·둥근 모양 지양"): 반경 6 px, 테두리 1 px 회색,
   활성 = 연한 primary 바탕 + primary 글자·테두리, 비활성 hover 는 바탕만 살짝. 높이·간격·줄바꿈은 그대로 — /logs 인식 결과 탭·/test 결과 탭·기록 상세 공통 */
.is-chips[data-v-68e16850] { gap: 6px; padding: 2px 0;
}
.is-chips .pp-tab[data-v-68e16850] { min-height: var(--pp-control-h-sm); padding: 0 12px; border: 1px solid var(--pp-line-strong); border-radius: 6px; font-size: var(--pp-fs-sm); background: var(--pp-card); color: var(--pp-fg);
}
.is-chips .pp-tab[data-v-68e16850]:hover:not(:disabled):not(.is-on) { background: var(--pp-hover); color: var(--pp-fg);
}
.is-chips .pp-tab.is-on[data-v-68e16850] { background: var(--pp-accent-soft); border-color: var(--pp-accent); color: var(--pp-accent); font-weight: 600;
}
.is-sm .pp-tab[data-v-68e16850] { min-height: 36px; padding: 0 10px; font-size: var(--pp-fs-sm);
}
.is-chips.is-sm .pp-tab[data-v-68e16850] { min-height: var(--pp-control-h-sm);
}
/* 카운트 배지: 작은 사각(같은 반경 계열) */
.pp-tab-badge[data-v-68e16850] {
  display: inline-flex;
  align-items: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 4px;
  background: var(--pp-bg);
  color: var(--pp-fg-muted);
  font-size: 11px;
  font-weight: 600;
  justify-content: center;
}
.pp-tab.is-on .pp-tab-badge[data-v-68e16850] { background: var(--pp-accent); color: var(--pp-accent-fg);
}

.pp-toasts[data-v-e96db5fb] {
  position: fixed;
  left: 50%;
  bottom: calc(var(--pp-toast-bottom, 24px) + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
  z-index: 1100;
  width: max-content;
  max-width: min(92vw, 560px);
  pointer-events: none;
}
.pp-toast[data-v-e96db5fb] {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: var(--pp-radius);
  background: var(--pp-fg);
  color: var(--pp-card);
  font-size: var(--pp-fs-sm);
  box-shadow: var(--pp-shadow-lg);
  max-width: 100%;
  pointer-events: auto;
  cursor: pointer;
}
.pp-toast-msg[data-v-e96db5fb] { min-width: 0; overflow-wrap: anywhere;
}
.pp-toast.is-error[data-v-e96db5fb] { background: var(--pp-danger); color: #fff;
}
.pp-toast.is-success[data-v-e96db5fb] { background: var(--pp-success); color: #fff;
}
.pp-toast-enter-from[data-v-e96db5fb], .pp-toast-leave-to[data-v-e96db5fb] { opacity: 0; transform: translateY(8px);
}
.pp-toast-enter-active[data-v-e96db5fb], .pp-toast-leave-active[data-v-e96db5fb] { transition: opacity var(--pp-dur) var(--pp-ease), transform var(--pp-dur) var(--pp-ease);
}