/* H:drive(별칭 ARGOS) 디자인 시스템 "Terminal Calm" + "Cargo Tag"(v1.48) — 페트롤 레일 · 틸 포인트 · 시그널 앰버 · 뉴트럴 바탕.
   화물 태그 문법(크림 종이 · 앰버 띠 · 절취선 · 페트롤 잉크)은 지원 카드 · 공통 패널 · 선택 상태 · 배지에만 쓴다.
   구조: 레일(허브) + 허브 패널 + 상단바 + 본문 / 모바일: 앱바 + 하단 탭 + 메뉴 시트 */
:root {
  --fs-min: .86rem;   /* 가장 작은 글자(화면 12px) — font-size: max(var(--fs-min), …). 인쇄는 0 이라 원래 크기 */
  --bg: #f2f4f3;
  --surface: #ffffff;
  --surface-2: #f7f9f8;
  --border: #dfe5e3;
  --border-strong: #c9d2cf;
  --text: #0e1a1f;
  --text-2: #43535a;
  --text-3: #5b6b71;
  --primary: #0f766e;
  --primary-dark: #0b5550;
  --primary-soft: #e1f1ee;
  --accent: #f59e0b;
  --accent-dark: #b45309;
  --accent-soft: #fef3dc;
  --danger: #b42318;
  --danger-soft: #fdecea;
  --success: #177245;
  --success-soft: #e5f4ec;
  --warning: #b45309;
  --info: #1d4f91;
  --info-soft: #e8f1fd;
  --sidebar-bg: #0b1f26;          /* 레일 */
  --ticket-bg: #0f2a33;
  --rail-text: #a7bcc1;
  --rail-active: #1b4755;
  --panel-bg: #f8faf9;
  --tag: #f4f1e8;                 /* 화물 태그 종이 */
  --tag-2: #fbfaf6;
  --tag-line: #e3dbc4;
  --tag-perf: #cfc4a5;            /* 절취선 */
  --tag-ink: #0f2a33;             /* 태그 위 선택 · 강조 칠 */
  --radius: 14px;
  --radius-sm: 10px;
  --radius-xs: 6px;
  --shadow: 0 1px 2px rgba(14,26,31,.05);
  --shadow-md: 0 4px 16px rgba(14,26,31,.08);
  --shadow-lg: 0 16px 40px rgba(11,31,38,.22);
  --header-h: 64px;
  --rail-w: 80px;
  --panel-w: 256px;
  --tabbar-h: 68px;
  --ease-out: cubic-bezier(.23,1,.32,1);
  --ease-drawer: cubic-bezier(.32,.72,0,1);
  --font: "IBM Plex Sans KR", "Pretendard Variable", "Pretendard", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "Segoe UI", sans-serif;
  --mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { font-size: 14px; }
body { font-family: var(--font); background: var(--bg); color: var(--text); line-height: 1.6; -webkit-font-smoothing: antialiased; font-variant-numeric: tabular-nums;
  word-break: keep-all; overflow-wrap: break-word; } /* 한글은 어절 단위로만 줄바꿈(keep-all), 넘치는 긴 단어만 overflow-wrap */
h1, h2, h3, .page-title, .dc-head h2 { text-wrap: balance; }
a { color: var(--primary); text-decoration: none; text-underline-offset: 3px; }
button { font-family: inherit; cursor: pointer; color: inherit; }
input, select, textarea { font-family: inherit; font-size: .95rem; color: var(--text); }
kbd { font-family: var(--mono); font-size: max(var(--fs-min), .74rem); padding: 1px 6px; border: 1px solid var(--border-strong); border-radius: 5px; color: var(--text-3); background: var(--surface); }
.mono { font-family: var(--mono); letter-spacing: -.01em; }
.hidden { display: none !important; }
.ico { display: block; flex: none; }
::selection { background: #cdebe5; color: var(--text); }
:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { transition-duration: 0ms !important; animation-duration: 0ms !important; } }

/* ── 로그인 ── */
.login-overlay { position: fixed; inset: 0; z-index: 1000; background: var(--bg); overflow-y: auto; }
.login-shell { min-height: 100%; display: grid; grid-template-columns: minmax(420px, 44%) 1fr; }
.login-brand {
  background: var(--sidebar-bg); color: #fff; padding: 52px 60px;
  display: flex; flex-direction: column; justify-content: space-between; gap: 40px;
}
.lb-brand { display: flex; align-items: center; gap: 14px; font-size: 1.3rem; font-weight: 700; letter-spacing: .02em; }
.lb-brand b { color: #5eead4; font-weight: 700; }
.lb-body { display: flex; flex-direction: column; gap: 30px; }
.lb-title { font-size: 2.55rem; font-weight: 700; line-height: 1.25; letter-spacing: -.025em; text-wrap: balance; }
.lb-tag { width: min(420px, 100%); background: #f4f1e8; color: var(--text); border-radius: 6px; overflow: hidden; }
.lb-tag-top { display: flex; justify-content: space-between; align-items: center; padding: 12px 20px; background: var(--accent); font-weight: 700; font-size: max(var(--fs-min), .84rem); }
.lb-tag-top .mono { font-weight: 600; letter-spacing: .06em; }
.lb-tag-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 20px; padding: 16px 20px 16px; }
.lb-tag-grid small { display: block; font-size: max(var(--fs-min), .78rem); color: var(--text-3); }
.lb-tag-grid b { font-size: .9rem; font-weight: 600; }
.lb-tag-foot { margin: 0 20px; padding: 11px 0 13px; border-top: 2px dashed #cfc8b4; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.lb-foot { font-size: max(var(--fs-min), .8rem); color: #8fa6ac; }
.login-main { display: flex; align-items: center; justify-content: center; padding: 40px 24px; }
.login-card { width: 100%; max-width: 400px; display: flex; flex-direction: column; }
.login-mhead { display: none; align-items: center; gap: 12px; font-size: 1.15rem; font-weight: 700; margin-bottom: 28px; }
.login-mhead b { color: var(--primary); font-weight: 700; }
.login-title { font-size: 1.8rem; font-weight: 700; letter-spacing: -.02em; margin-bottom: 22px; }
.login-label { font-size: max(var(--fs-min), .84rem); font-weight: 600; color: var(--text-2); margin-bottom: 7px; }
.login-input-wrap { position: relative; margin-bottom: 14px; }
.login-input-wrap input {
  width: 100%; height: 54px; padding: 0 52px 0 16px; font-size: 1.05rem; letter-spacing: .06em;
  border: 1.5px solid var(--border-strong); border-radius: 6px; outline: none; background: var(--surface);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.login-input-wrap input:focus { border-color: var(--primary); box-shadow: 0 0 0 4px #d5eeea; }
.pw-toggle {
  position: absolute; right: 5px; top: 50%; transform: translateY(-50%);
  width: 44px; height: 44px; display: flex; align-items: center; justify-content: center;
  background: none; border: none; color: var(--text-3); border-radius: 6px;
}
.pw-toggle:hover { background: var(--surface-2); }
.login-btn { width: 100%; height: 54px; font-size: 1rem; border-radius: 6px; }
.login-error { color: var(--danger); font-size: max(var(--fs-min), .84rem); min-height: 1.4em; margin-top: 10px; }
.login-foot { display: flex; align-items: center; gap: 7px; margin-top: 8px; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
@media (max-width: 860px) {
  .login-shell { grid-template-columns: 1fr; }
  .login-brand { display: none; }
  .login-mhead { display: flex; }
  .login-main { align-items: flex-start; padding-top: 12vh; }
}

/* ── 앱 셸 ── */
.app { min-height: 100vh; }

/* ── 레일 (허브) ── */
.rail {
  position: fixed; top: 0; bottom: 0; left: 0; width: var(--rail-w); z-index: 180;
  background: var(--sidebar-bg); display: flex; flex-direction: column; align-items: center;
  padding: 12px 0 16px; gap: 6px; overflow-y: auto; scrollbar-width: none;
}
.rail::-webkit-scrollbar { display: none; }
.rail-logo { height: 52px; display: flex; align-items: center; justify-content: center; margin-bottom: 10px; flex: none; }
.rail-logo img { display: block; }
.rail-hubs, .rail-util { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.rail-spacer { flex: 1; min-height: 12px; }
.rail-btn {
  width: 64px; min-height: 62px; border: 0; border-radius: 6px; background: transparent; color: var(--rail-text);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px;
  font-size: max(var(--fs-min), .76rem); font-weight: 500; line-height: 1.15; text-align: center; padding: 6px 2px;
  transition: background-color .15s ease, color .15s ease, transform .16s var(--ease-out);
}
.rail-btn span { max-width: 60px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rail-btn:active { transform: scale(.97); }
.rail-btn.on { background: var(--rail-active); color: #fff; }
.rail-btn.cur:not(.on)::after { content: ""; width: 4px; height: 4px; border-radius: 50%; background: var(--accent); margin-top: -1px; }
.rail-btn.util { width: 48px; min-height: 44px; border-radius: 6px; }
.rail-btn.util.active { background: var(--rail-active); color: #fff; }
@media (hover: hover) and (pointer: fine) {
  .rail-btn:hover:not(.on) { background: #132f38; color: #e3edef; }
}

/* ── 허브 패널 ── */
.sidebar.panel {
  position: fixed; top: 0; bottom: 0; left: var(--rail-w); width: var(--panel-w); z-index: 150;
  background: var(--panel-bg); border-right: 1px solid var(--border);
  display: flex; flex-direction: column;
  transition: transform .18s var(--ease-out), box-shadow .18s ease;
}
.panel-brand {
  height: var(--header-h); flex: none; padding: 0 12px 0 20px; display: flex; align-items: center; gap: 8px;
  border-bottom: 1px solid var(--border);
}
.pb-text { display: flex; flex-direction: column; gap: 1px; min-width: 0; flex: 1; }
.pb-name { font-size: 1.08rem; font-weight: 700; letter-spacing: .02em; white-space: nowrap; }
.pb-name b { color: var(--primary); font-weight: 700; }
.pb-sub { font-size: max(var(--fs-min), .78rem); color: var(--text-3); white-space: nowrap; }
/* 지원 카드 — 핵심 3종(검색 · 접수 카운터 · 아르고). 화물 태그(앰버 띠 · 펀치 구멍 · 절취선)로 일반 메뉴와 구분, 한 줄에 하나씩 크게 */
.sup-card {
  flex: none; position: relative; margin: 14px 14px 6px; padding-top: 10px; display: flex; flex-direction: column;
  background: var(--tag); border-radius: 6px; overflow: hidden; box-shadow: inset 0 0 0 1px var(--tag-line), 0 1px 0 var(--tag-line);
}
.sup-card::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 10px; background: var(--accent); }
.sup-card::after { content: ""; position: absolute; top: 2px; left: 50%; width: 6px; height: 6px; margin-left: -3px; border-radius: 50%; background: var(--panel-bg); box-shadow: inset 0 0 0 1.5px var(--accent-dark); }
.sup-cell {
  position: relative; min-width: 0; min-height: 54px; padding: 8px 12px; border: 0; background: none; color: var(--text);
  display: flex; align-items: center; gap: 11px; text-align: left; line-height: 1.25;
  transition: background-color .12s ease, transform .16s var(--ease-out);
}
.sup-cell[hidden] { display: none; }
.sup-cell + .sup-cell { background-image: linear-gradient(90deg, var(--tag-perf) 55%, transparent 0); background-size: 7px 1.5px; background-repeat: repeat-x; background-position: 0 0; }
.sup-cell:active { transform: scale(.985); }
.sup-cell:focus-visible { outline: 2px solid var(--primary); outline-offset: -3px; border-radius: 6px; }
.sup-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.sup-l { font-size: .95rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sup-d { font-size: max(var(--fs-min), .8rem); color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sup-ico, .sup-owl { flex: none; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 6px; }
.sup-ico { background: var(--tag-ink); color: var(--accent); }
.sup-n {
  flex: none; min-width: 22px; height: 22px; padding: 0 6px; border-radius: 6px;
  background: var(--accent); color: #1f1300; font-family: var(--mono); font-size: max(var(--fs-min), .8rem); font-weight: 700; display: inline-flex; align-items: center; justify-content: center;
}
.sup-n[hidden] { display: none; }
@media (hover: hover) and (pointer: fine) { .sup-cell:hover { background-color: rgba(255,255,255,.6); } }
.nav-menu { flex: 1; overflow-y: auto; padding: 4px 0 18px; }
.nav-menu::-webkit-scrollbar { width: 4px; }
.nav-menu::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 2px; }
.hub { display: none; }
.hub.on { display: block; }
.hub-head { display: flex; align-items: center; gap: 10px; padding: 14px 20px 10px; }
.hub-ico { display: none; color: var(--primary); }
.hub-title { font-size: 1.16rem; font-weight: 700; letter-spacing: -.01em; flex: 1; min-width: 0; }
.hub-items { padding: 0 12px; display: flex; flex-direction: column; gap: 2px; }
.nav-item {
  position: relative; display: flex; align-items: center; gap: 10px; width: 100%; min-height: 40px;
  padding: 7px 12px; border: 0; border-radius: 6px; background: none; text-align: left;
  color: #26363c; font-size: .88rem; font-weight: 500; line-height: 1.35;
  transition: background-color .12s ease, color .12s ease;
}
.nav-lbl { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav-meta { flex: none; font-family: var(--mono); font-size: max(var(--fs-min), .76rem); color: var(--text-3); }
.nav-item .ext-mark { flex: none; color: var(--text-3); display: flex; }
.nav-item.active { background: var(--tag); color: var(--text); font-weight: 600; box-shadow: inset 0 0 0 1px var(--tag-line); }
.nav-item.active .nav-meta { color: var(--accent-dark); }
@media (hover: hover) and (pointer: fine) {
  .nav-item:hover:not(.active) { background: #edf2f0; }
  .nav-pin:hover { background: #edf2f0; }
}
.nav-item:active { transform: scale(.985); }
.hub-block { margin: 12px 20px 0; padding-top: 12px; border-top: 1px dashed var(--border-strong); }
.hub-block .nav-item, .hub-block .nav-pin { margin: 0 -8px; width: calc(100% + 16px); }
.hub-block-t { display: flex; align-items: center; gap: 6px; font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-2); margin-bottom: 4px; }
.hub-toggle { width: 100%; border: 0; background: none; padding: 2px 0; text-align: left; }
.hub-toggle span:first-child { flex: 1; }
.soon-n { font-family: var(--mono); font-size: max(var(--fs-min), .76rem); font-weight: 600; padding: 1px 7px; border-radius: 5px; background: var(--accent-soft); color: #8a4b06; }
.hub-toggle .chev { display: flex; color: var(--text-3); transition: transform .15s var(--ease-out); }
.hub-planned.open .chev { transform: rotate(180deg); }
.planned-list { display: none; }
.hub-planned.open .planned-list { display: block; }
.nav-item.planned { color: var(--text-3); min-height: 36px; font-size: max(var(--fs-min), .85rem); }
.pl-dot { width: 7px; height: 7px; flex: none; border-radius: 50%; border: 1.5px dashed #8c9a9e; }
.nav-item.planned .nav-tag { display: none; }
.nav-item.planned.active .nav-tag { display: inline; }
.nav-tag { flex: none; font-size: max(var(--fs-min), .74rem); font-weight: 600; padding: 1px 6px; border-radius: 5px; background: var(--accent-soft); color: #8a4b06; }
.nav-tag.is-opt { background: transparent; color: var(--text-3); border: 1px solid var(--border-strong); font-weight: 500; }
.nav-item.is-opt { margin-top: 6px; border-top: 1px dashed var(--border); border-top-left-radius: 0; border-top-right-radius: 0; }
.nav-item.is-opt .nav-lbl { color: var(--text-2); }
.sc-opt { flex: none; align-self: center; font-size: max(var(--fs-min), .76rem); font-weight: 500; color: inherit; opacity: .78; border: 1px solid currentColor; border-radius: 999px; padding: 1px 9px; white-space: nowrap; }
.nav-pin {
  display: flex; align-items: center; gap: 10px; width: 100%; min-height: 38px; padding: 6px 12px;
  border: 0; border-radius: 6px; background: none; text-align: left; color: #26363c; font-size: max(var(--fs-min), .85rem);
}
.nav-pin span:last-child { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pin-ico { display: flex; color: var(--accent-dark); }
.panel-foot {
  flex: none; padding: 12px 20px; border-top: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: max(var(--fs-min), .78rem); color: var(--text-3);
}
.sheet-only { display: none !important; }
.sidebar-backdrop { display: none; }
.sidebar-backdrop.show { display: block; position: fixed; inset: 0; background: rgba(11,31,38,.42); z-index: 140; }

/* ── 상단바 ── */
.header {
  position: fixed; top: 0; right: 0; left: calc(var(--rail-w) + var(--panel-w)); height: var(--header-h); z-index: 130;
  display: flex; align-items: center; gap: 12px; padding: 0 28px 0 16px;
  background: rgba(255,255,255,.94); border-bottom: 1px solid var(--border);
  -webkit-backdrop-filter: saturate(1.4) blur(10px); backdrop-filter: saturate(1.4) blur(10px);
  transition: left .18s var(--ease-out);
}
.icon-btn {
  width: 40px; height: 40px; flex: none; display: inline-flex; align-items: center; justify-content: center;
  border: 0; border-radius: 6px; background: none; color: var(--text-2);
  transition: background-color .12s ease, transform .16s var(--ease-out);
}
.icon-btn:active { transform: scale(.96); }
@media (hover: hover) and (pointer: fine) { .icon-btn:hover { background: var(--surface-2); color: var(--text); } }
.brand { display: none; align-items: center; gap: 10px; color: var(--text); }
.brand img { display: block; }
.brand-text { font-size: 1.02rem; font-weight: 700; letter-spacing: .02em; white-space: nowrap; }
.brand-text b { color: var(--primary); font-weight: 700; }
.crumbs { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: .86rem; color: var(--text-3); }
.crumbs .ico { color: var(--border-strong); }
.cr-hub { white-space: nowrap; }
.cr-leaf { color: var(--text); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.header-right { margin-left: auto; display: flex; align-items: center; gap: 8px; min-width: 0; }
/* 상단바 검색 — 입력칸처럼 보이는 단추(누르면 검색 패널). 어느 화면에서나 같은 자리 */
.hdr-find {
  flex: 0 1 300px; min-width: 0; height: 40px; display: inline-flex; align-items: center; gap: 8px; padding: 0 8px 0 12px;
  border: 1.5px solid var(--border-strong); border-radius: 6px; background: var(--surface); color: var(--text-2); text-align: left;
  transition: border-color .12s ease, box-shadow .12s ease;
}
.hdr-find > svg { flex: none; color: var(--primary); }
.hf-l { flex: none; font-size: .92rem; font-weight: 700; color: var(--text); }
.hf-ph { flex: 1; min-width: 0; font-size: .86rem; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hf-k { flex: none; font-size: max(var(--fs-min), .74rem); }
@media (hover: hover) and (pointer: fine) { .hdr-find:hover { border-color: var(--primary); } }
.hdr-find:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.hdr-sup { display: flex; align-items: center; gap: 4px; }
.hdr-sb {
  position: relative; flex: none; height: 40px; display: inline-flex; align-items: center; gap: 6px; padding: 0 10px; border: 0; border-radius: 6px;
  background: none; color: var(--text-2); font-size: .86rem; font-weight: 600; white-space: nowrap; transition: background-color .12s ease, transform .16s var(--ease-out);
}
.hdr-sb[hidden] { display: none; }
.hdr-sb:active { transform: scale(.97); }
@media (hover: hover) and (pointer: fine) { .hdr-sb:hover { background: var(--surface-2); color: var(--text); } }
.hdr-sb .sup-owl { width: 24px; height: 24px; }
.hdr-sb .owl-svg { display: block; }
.hdr-sb .sup-n { min-width: 19px; height: 19px; padding: 0 5px; font-size: max(var(--fs-min), .74rem); }
@media screen and (min-width: 1100px) { .app:not(.panel-collapsed) .hdr-sup { display: none; } }
.hdr-find { min-width: 150px; }
.crumbs { flex: 1 1 auto; overflow: hidden; }
@media screen and (max-width: 1359px) { .hdr-help .hdr-l { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; } .hdr-help { padding: 0 9px; } }
@media screen and (max-width: 1279px) {
  .hf-ph { display: none; }
  .hdr-find { flex: none; min-width: 0; }
  .uc-txt { display: none; }
  .user-chip { padding: 0 6px; }
  .sec-badge .sb-l { display: none; }
}
@media screen and (max-width: 1099px) { .hf-k { display: none; } }
/* 글자 크기 — 가 · 가 · 가(계정별, 화면에서만) */
.hdr-fs[hidden] { display: none; }
.fs-seg { display: inline-flex; align-items: stretch; height: 36px; border: 1px solid var(--border); border-radius: 6px; overflow: hidden; background: var(--surface); }
.fs-b { width: 34px; border: 0; background: none; color: var(--text-2); font-weight: 700; line-height: 1; display: inline-flex; align-items: center; justify-content: center; }
.fs-b + .fs-b { border-left: 1px solid var(--border); }
.fs-b0 { font-size: 12px; } .fs-b1 { font-size: 15px; } .fs-b2 { font-size: 18px; }
.fs-b[aria-pressed="true"] { background: var(--tag-ink); color: #fff; }
@media (hover: hover) and (pointer: fine) { .fs-b[aria-pressed="false"]:hover { background: var(--surface-2); color: var(--text); } }
@media screen { html.fs-1 { font-size: 16px; } html.fs-2 { font-size: 18px; } }
.user-chip {
  display: inline-flex; align-items: center; gap: 9px; height: 40px; padding: 0 14px 0 6px;
  border: 1px solid var(--border); border-radius: 6px; background: var(--surface); font-size: max(var(--fs-min), .82rem); white-space: nowrap;
}
.uc-av { width: 28px; height: 28px; border-radius: 8px; background: var(--sidebar-bg); color: #fff; display: flex; align-items: center; justify-content: center; font-size: max(var(--fs-min), .76rem); font-weight: 600; }
.sec-badge {
  display: inline-flex; align-items: center; gap: 7px; height: 34px; padding: 0 12px; border-radius: 8px;
  font-size: max(var(--fs-min), .8rem); font-weight: 600; white-space: nowrap; cursor: default;
  background: var(--info-soft); color: var(--info);
}
.sec-badge i { width: 8px; height: 8px; border-radius: 50%; background: currentColor; flex: none; }
.sec-badge[data-level="평시"] { background: var(--success-soft); color: var(--success); }
.sec-badge[data-level="관심"] { background: var(--info-soft); color: var(--info); }
.sec-badge[data-level="주의"] { background: #fdf6d8; color: #7a5a00; }
.sec-badge[data-level="경계"] { background: #fdebdd; color: #9a3a0a; }
.sec-badge[data-level="심각"] { background: var(--danger-soft); color: var(--danger); }

/* ── 본문 ── */
.main { margin-left: calc(var(--rail-w) + var(--panel-w)); padding-top: var(--header-h); min-height: 100vh; transition: margin-left .18s var(--ease-out); }
.view { padding: 28px 36px 40px; max-width: 1240px; margin: 0 auto; }
/* 라우트별 콘텐츠 폭 (app.js VIEW_WIDTH) — wide = 캘린더·대시보드 / mid = 목록 / 기본 = 문서·폼 */
.view.view-wide { max-width: 2100px; }
.view.view-mid  { max-width: 1560px; }
/* 가독성 보호: 넓은 화면에서도 서식 본문·긴 문단은 읽기 폭 유지 */
.view.view-wide .nb-editor, .view.view-mid .nb-editor,
.view.view-wide .notice-html, .view.view-mid .notice-html { max-width: 1040px; }
.view.view-wide .page-desc, .view.view-mid .page-desc { max-width: 900px; }

/* ── 모바일 하단 탭 ── */
.tabbar { display: none; }

/* ── 패널 접힘 (데스크톱 선택) · 태블릿 — 레일만 두고 패널은 떠서 열림 ── */
.app.panel-collapsed .sidebar.panel { transform: translateX(calc(-100% - var(--rail-w))); }
.app.panel-collapsed .header { left: var(--rail-w); }
.app.panel-collapsed .main { margin-left: var(--rail-w); }
.app.panel-collapsed.panel-open .sidebar.panel { transform: none; box-shadow: var(--shadow-lg); }
@media (min-width: 768px) and (max-width: 1099px) {
  .sidebar.panel { transform: translateX(calc(-100% - var(--rail-w))); }
  .header { left: var(--rail-w); }
  .main { margin-left: var(--rail-w); }
  .app.panel-open .sidebar.panel { transform: none; box-shadow: var(--shadow-lg); }
  .view { padding: 24px 24px 36px; }
}

/* ── 협력업체·서명 세션 — 레일 없이 패널만 ── */
.app.nav-lite .rail-hubs { display: none; }
.app.nav-signer .rail, .app.nav-signer .tabbar, .app.nav-signer .sup-card { display: none !important; }


/* ── 공통 컴포넌트 (모듈 화면 키트) ──
   .page-head(.page-title · .page-meta · .spacer · 버튼 · .page-desc) → .stat-row(.stat) → .toolbar/.search-field → .card(.tbl). 마크업은 SeMIS.ui.head / stats / search / empty 로 만든다. */
@keyframes rise { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.page-head { display: flex; align-items: center; gap: 10px; margin-bottom: 22px; flex-wrap: wrap; row-gap: 8px; }
.page-title { font-size: 1.76rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.25; }
.page-meta { font-size: max(var(--fs-min), .84rem); color: var(--text-3); align-self: flex-end; padding-bottom: 5px; }
.page-desc { color: var(--text-2); font-size: .9rem; width: 100%; margin-top: -2px; }
.page-head .spacer { flex: 1; }
.head-acts { display: flex; gap: 8px; flex-wrap: wrap; }

.card {
  background: var(--surface); border: 1px solid var(--border);
  border-radius: var(--radius); box-shadow: none;
  padding: 20px 22px; margin-bottom: 18px;
}
.card-title { font-size: 1rem; font-weight: 700; margin-bottom: 14px; display: flex; align-items: center; gap: 8px; }
.card-title .spacer { flex: 1; }
.card-title .hub-ico { display: flex; }

.btn {
  display: inline-flex; align-items: center; gap: 7px; justify-content: center;
  min-height: 40px; padding: 0 16px; border-radius: var(--radius-sm); border: 1px solid transparent;
  font-size: .86rem; font-weight: 600; white-space: nowrap;
  transition: background-color .12s ease, border-color .12s ease, transform .16s var(--ease-out);
}
.btn:active { transform: scale(.97); }
.btn:disabled { opacity: .5; cursor: not-allowed; transform: none; }
.btn-primary { background: var(--primary); color: #fff; }
.btn-ghost { background: var(--surface); border-color: var(--border-strong); color: var(--text); }
.btn-soft { background: var(--primary-soft); color: var(--primary-dark); }
.btn-danger { background: var(--danger-soft); color: var(--danger); border-color: #f5c6c0; }
.btn-accent { background: var(--accent); color: #1f1300; border-color: var(--accent); }
@media (hover: hover) and (pointer: fine) {
  .btn-primary:hover { background: var(--primary-dark); }
  .btn-ghost:hover { background: var(--surface-2); }
  .btn-soft:hover { background: #d3ebe6; }
  .btn-danger:hover { background: #fbdcd8; }
  .btn-accent:hover { background: #e8930a; border-color: #e8930a; }
}
.btn-sm { min-height: 32px; padding: 0 11px; font-size: max(var(--fs-min), .8rem); border-radius: 8px; }
.link-btn { border: 0; background: none; padding: 4px 2px; font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--primary); }
.link-btn:hover { text-decoration: underline; }
[data-print-btn] .ico { color: var(--text-2); }

.form-row { margin-bottom: 14px; }
.form-row label { display: block; font-size: .86rem; font-weight: 700; color: var(--text-2); margin-bottom: 5px; }
.form-row input, .form-row select, .form-row textarea {
  width: 100%; padding: 9px 12px; border: 1.5px solid var(--border-strong);
  border-radius: var(--radius-sm); outline: none; background: var(--surface);
  transition: border-color .15s;
}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(15,118,110,.12); }
.form-row textarea { resize: vertical; min-height: 90px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.form-hint { font-size: max(var(--fs-min), .81rem); color: var(--text-3); margin-top: 5px; line-height: 1.6; }

.table-wrap { overflow-x: auto; }
table.tbl { width: 100%; border-collapse: collapse; font-size: .93rem; }
.tbl th { text-align: left; padding: 11px 12px; background: var(--tag-2); color: var(--text-2); font-size: max(var(--fs-min), .81rem); font-weight: 600; border-bottom: 1.5px dashed var(--tag-perf); white-space: nowrap; }
.tbl td { padding: 12px 12px; border-bottom: 1px solid #edf1f0; vertical-align: middle; }
.tbl tr:last-child td { border-bottom: none; }
.tbl tr:hover td { background: var(--surface-2); }

/* 넓은 화면에서 열이 과도하게 벌어지는 목록 표 — 자연 폭(--cap)까지만 확장 */
.tbl-cap { max-width: var(--cap, 1200px); }

/* 확장 열 — .col-ext 는 1500px 이상에서만 보이는 열, .col-sub 는 좁은 화면용 보조줄(확장 시 중복이라 숨김) */
.col-ext { display: none; }
@media (min-width: 1560px) {
  th.col-ext, td.col-ext { display: table-cell; }
  span.col-ext, div.col-ext { display: inline; }
  .col-sub { display: none; }
}
.tbl-cap tbody tr:nth-child(even) td { background: rgba(107,127,133,.07); }
.tbl-cap tbody tr:hover td { background: var(--primary-soft); }

/* 목록의 제목 = 열람(문서 열기) 동작 — 수정은 행 클릭/✏️ 버튼 */
.tbl-open {
  display: inline; padding: 0; margin: 0; border: 0; background: none; text-align: left;
  font: inherit; font-weight: 700; color: var(--primary); cursor: pointer;
  text-decoration: none; border-bottom: 1px solid transparent;
}
.tbl-open:hover, .tbl-open:focus-visible { border-bottom-color: currentColor; }
.th-hint { font-weight: 500; color: var(--text-3); font-size: max(var(--fs-min), .76rem); }

/* 목록 내 그룹 구분행 (본부별 · 지역별) */
.tbl .grp-row td {
  background: var(--surface-2); font-size: max(var(--fs-min), .82rem); padding: 6px 12px;
  border-top: 1.5px solid var(--border); border-bottom: 1px solid var(--border);
}
.tbl .grp-row:hover td { background: var(--surface-2); }
.tbl-cap tbody tr.grp-row td, .tbl-cap tbody tr.grp-row:hover td { background: var(--surface-2); }

.badge { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 4px; font-size: max(var(--fs-min), .78rem); font-weight: 600; white-space: nowrap; line-height: 1.5;
  box-shadow: inset 0 0 0 1px rgba(14,26,31,.07); }   /* 라벨 스티커 */
.badge-blue { background: var(--primary-soft); color: var(--primary-dark); }
.badge-gray { background: #eef2f1; color: var(--text-2); }
.badge-red { background: var(--danger-soft); color: var(--danger); }
.badge-green { background: var(--success-soft); color: var(--success); }
.badge-amber { background: var(--accent-soft); color: #8a4b06; }
.badge-orange { background: #fdebdd; color: #9a3a0a; }
/* CARES 고장 원인 분류(기계적 결함)와 동일 색상 */
.badge-purple { background: #f3e8ff; color: #9333ea; }

.empty { text-align: center; color: var(--text-3); padding: 28px 10px; font-size: .88rem; }
.empty-state { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 40px 16px; color: var(--text-3); text-align: center; font-size: .9rem; }
.empty-state .ico { color: var(--border-strong); }
/* 검색 입력 (모듈 공통) */
.search-field {
  display: flex; align-items: center; gap: 9px; height: 42px; padding: 0 14px; min-width: 0;
  border: 1px solid #d6dedb; border-radius: 6px; background: var(--surface-2); color: var(--text-3);
}
.search-field:focus-within { border-color: var(--primary); background: var(--surface); }
.search-field input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; font-size: .9rem; }
.toolbar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }

/* 요약 수치 띠 — 하나의 흰 띠를 칸막이로 나눈다 (모듈 공통) */
.stat-row {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1px; margin-bottom: 18px;
  background: #edf1f0; border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden;
}
.stat { padding: 16px 22px; background: var(--surface); min-width: 0; }
.stat .stat-label { font-size: max(var(--fs-min), .8rem); color: var(--text-2); font-weight: 500; }
.stat .stat-value { font-family: var(--mono); font-size: 1.55rem; font-weight: 600; margin-top: 4px; letter-spacing: -.02em; line-height: 1.15; }
.stat .stat-sub { font-size: max(var(--fs-min), .78rem); color: var(--text-3); margin-top: 3px; }
.stat.tone-ok .stat-value { color: var(--success); }
.stat.tone-warn .stat-value { color: var(--warning); }
.stat.tone-bad .stat-value { color: var(--danger); }
.stat.tone-muted .stat-value { color: var(--text-3); }

.notice-item { padding: 11px 0; border-bottom: 1px solid #edf1f0; cursor: pointer; }
.notice-item:last-child { border-bottom: none; }
.notice-item:hover .notice-title > span:not(.badge) { color: var(--primary); }
.notice-title { font-weight: 600; font-size: .92rem; display: flex; align-items: center; gap: 8px; }
.nt-clip { display: flex; color: var(--text-3); }
.notice-meta { font-size: max(var(--fs-min), .8rem); color: var(--text-3); margin-top: 3px; }
.notice-body { margin-top: 8px; font-size: .88rem; color: var(--text-2); white-space: pre-wrap; display: none; line-height: 1.7; }
.notice-item.open .notice-body { display: block; }

/* 모듈 준비중 */

.modal-overlay {
  position: fixed; inset: 0; z-index: 500; background: rgba(11,31,38,.48);
  display: flex; align-items: center; justify-content: center; padding: 20px;
}
.modal-box {
  background: var(--surface); border-radius: 6px; box-shadow: var(--shadow-lg); border-top: 5px solid var(--accent);
  width: 100%; max-width: 520px; max-height: 88vh; overflow-y: auto;
  padding: 26px; animation: rise .2s var(--ease-out);
}
.modal-box.wide { max-width: 780px; }
/* 전체화면 편집 — 긴 회의록을 넓게 쓰기 위한 모드 */
.modal-box.full { max-width: min(1500px, 96vw); max-height: 94vh; }
.modal-box.full .nb-rich { max-height: none; }
.modal-box.full .cn-form .nb-rich { min-height: 240px; }
/* 전체화면일 때 회의 정보·차기 회의 입력을 3열로 펼쳐 세로 스크롤을 줄인다 */
@media (min-width: 1100px) {
  .modal-box.full .mn-form .form-grid { grid-template-columns: 1fr 1fr 1fr; }
}
.modal-box h3 { font-size: 1.12rem; font-weight: 700; letter-spacing: -.01em; margin-bottom: 16px; }
.modal-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 20px; }

/* ── 공통 패널 모달(js/panel.js) — 화물 태그: 앰버 띠 · 크림 머리 · 야경 실루엣 · 절취선 ──
   폼용 작은 모달(.modal-box)과 크기 · 머리가 다르고 버튼 · 입력은 같다. 열려 있으면 뒤 화면 스크롤 잠금 */
html.pnl-lock { overflow: hidden; }
dialog.pnl {
  margin: auto; padding: 0; border: 0; color: var(--text); background: var(--tag-2);
  width: min(960px, calc(100vw - 48px)); height: min(86vh, 900px); max-width: none; max-height: none;
  display: flex; flex-direction: column; overflow: hidden; border-radius: 6px;
  box-shadow: 0 30px 80px rgba(11,31,38,.42), 0 0 0 1px rgba(11,31,38,.06);
  opacity: 0; scale: .97; translate: 0 10px;
  transition: opacity .2s var(--ease-out), scale .22s var(--ease-out), translate .22s var(--ease-out), display .22s allow-discrete, overlay .22s allow-discrete;
}
dialog.pnl:not([open]) { display: none; }
dialog.pnl[open]:not([data-closing]) { opacity: 1; scale: none; translate: none; }
@starting-style { dialog.pnl[open] { opacity: 0; scale: .97; translate: 0 10px; } }
dialog.pnl::backdrop { background: rgba(11,31,38,0); transition: background-color .22s ease, display .22s allow-discrete, overlay .22s allow-discrete; }
dialog.pnl[open]:not([data-closing])::backdrop { background: rgba(11,31,38,.5); }
@starting-style { dialog.pnl[open]::backdrop { background: rgba(11,31,38,0); } }
.pnl-head { position: relative; isolation: isolate; flex: none; display: flex; align-items: center; gap: 12px; padding: 26px 16px 14px 24px; background: var(--tag); }
.pnl-head::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 8px; background: var(--accent); }
.pnl-head::before {
  content: ""; position: absolute; inset: 8px 0 0 0; z-index: -1; background: var(--tag-ink); opacity: .12;
  -webkit-mask: url(../assets/img/night-terminal.svg) right bottom / auto 100% no-repeat; mask: url(../assets/img/night-terminal.svg) right bottom / auto 100% no-repeat;
}
.pnl-mark { flex: none; width: 48px; height: 48px; border-radius: 6px; display: flex; align-items: center; justify-content: center; background: var(--tag-ink); color: var(--accent); }
.pnl-mark.is-owl { background: none; border-radius: 0; }
.pnl-mark canvas, .pnl-mark .owl-svg { display: block; width: 100%; height: 100%; }
.pnl-tt { flex: 1; min-width: 0; }
.pnl-title { font-size: 1.32rem; font-weight: 700; letter-spacing: -.015em; line-height: 1.25; }
.pnl-sub { font-size: max(var(--fs-min), .84rem); color: var(--text-2); margin-top: 2px; font-variant-numeric: tabular-nums; }
.pnl-acts { display: flex; align-items: center; gap: 6px; }
.pnl-acts:empty { display: none; }
.pnl-more { display: none; }
.pnl-x { flex: none; width: 42px; height: 42px; border: 0; border-radius: 6px; background: none; color: var(--text); display: flex; align-items: center; justify-content: center; transition: background-color .12s ease, transform .16s var(--ease-out); }
.pnl-x:active { transform: scale(.96); }
@media (hover: hover) and (pointer: fine) { .pnl-x:hover { background: rgba(43,37,22,.07); } }
.pnl-tabs { position: relative; flex: none; display: flex; gap: 8px; padding: 2px 24px 14px; background: var(--tag); overflow-x: auto; scrollbar-width: none; }
.pnl-tabs.is-empty { padding: 0 0 6px; }
.pnl-tabs::after { content: ""; position: absolute; left: 14px; right: 14px; bottom: 0; border-top: 2px dashed var(--tag-perf); }
.pnl-tab {
  flex: none; display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 0 14px; border: 0; border-radius: 6px;
  background: var(--tag-2); color: var(--text-2); box-shadow: inset 0 0 0 1px var(--tag-line); font-size: .9rem; font-weight: 600; white-space: nowrap;
  transition: background-color .12s ease, color .12s ease;
}
.pnl-tab[aria-selected="true"] { background: var(--tag-ink); color: #fff; box-shadow: none; }
.pnl-n { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 5px; background: var(--accent); color: #1f1300; font-family: var(--mono); font-size: max(var(--fs-min), .76rem); display: inline-flex; align-items: center; justify-content: center; }
.pnl-body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 22px 24px 30px; background: var(--tag-2); }
.pnl-body:focus { outline: none; }
.pnl-search .pnl-body { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
@media (prefers-reduced-motion: reduce) {
  dialog.pnl, dialog.pnl::backdrop { transition: none; }
  dialog.pnl { scale: none; translate: none; }
}
@media screen and (max-width: 767px) {
  dialog.pnl { inset: 0; margin: 0; width: 100%; height: 100%; border-radius: 0; scale: none; translate: 0 28px; }
  @starting-style { dialog.pnl[open] { scale: none; translate: 0 28px; } }
  .pnl-head { gap: 10px; padding: max(18px, calc(env(safe-area-inset-top) + 12px)) 6px 10px 16px; }
  .pnl-head::after { height: 5px; }
  .pnl-head::before { inset: 5px 0 0 0; }
  .pnl-mark { width: 40px; height: 40px; border-radius: 6px; }
  .pnl-title { font-size: 1.14rem; }
  .pnl-acts, .pnl-print { display: none !important; }
  .pnl-more:not([hidden]) { display: inline-flex; }
  .pnl-tabs { padding: 0 16px 12px; }
  .pnl-body { padding: 16px 14px calc(26px + env(safe-area-inset-bottom)); }
  .hdr-search-f { margin: 12px 14px 4px; height: 52px; }
  .search-pop { padding: 2px 8px 22px; }
}

.toast-wrap { position: fixed; bottom: 22px; left: 50%; transform: translateX(-50%); z-index: 900; display: flex; flex-direction: column; gap: 8px; align-items: center; }
.toast {
  background: #0b1f26; color: #fff; padding: 11px 18px; border-radius: 6px;
  font-size: max(var(--fs-min), .84rem); box-shadow: var(--shadow-lg); animation: rise .2s var(--ease-out);
}
.toast.err { background: var(--danger); }
.toast.has-act { display: flex; align-items: center; gap: 14px; padding-right: 8px; }
.toast-act { flex: none; min-height: 34px; padding: 0 12px; border: 0; border-radius: 5px; background: var(--accent); color: #1f1300; font-size: .86rem; font-weight: 700; }
.page-head .term-tip { align-self: center; }
/* 대시보드 시작 바 — 핵심 3종 큰 칸 */
.dash-start { margin: 0 0 20px; padding: 18px 20px 20px; background: var(--surface); border: 1px solid var(--line); border-top: 2px solid var(--rule); border-radius: 4px; }
.ds-hi h2 { margin: 0; font-size: 1.36rem; font-weight: 700; letter-spacing: -.015em; }
.ds-hi p { margin: 4px 0 0; font-size: .98rem; color: var(--text-2); }
.ds-tiles { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 12px; margin-top: 14px; }
.ds-tiles[data-n="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.ds-tile {
  position: relative; min-width: 0; min-height: 92px; display: flex; align-items: center; gap: 14px; padding: 16px 18px; text-align: left;
  border: 0; border-radius: 4px; background: var(--tag); color: var(--text); box-shadow: inset 0 0 0 1px var(--tag-line);
  transition: box-shadow .12s ease, transform .16s var(--ease-out), background-color .12s ease;
}
.ds-tile[hidden] { display: none; }
.ds-tile:active { transform: scale(.985); }
.ds-tile:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
@media (hover: hover) and (pointer: fine) { .ds-tile:hover { box-shadow: inset 0 0 0 2px var(--primary); background: #fbf9f2; } }
.ds-ti { flex: none; width: 52px; height: 52px; border-radius: 6px; display: flex; align-items: center; justify-content: center; background: var(--tag-ink); color: var(--accent); }
.ds-ti.is-owl { background: none; }
.ds-ti .sup-owl, .ds-ti .owl-svg { width: 48px; height: 48px; display: block; }
.ds-tt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.ds-tt b { font-size: 1.22rem; font-weight: 700; }
.ds-tt small { font-size: .95rem; color: var(--text-2); }
.ds-tile .hf-k { align-self: flex-start; }
.ds-tile .sup-n { position: absolute; top: 10px; right: 10px; }
.ds-search { box-shadow: inset 0 0 0 2px var(--primary); background: var(--surface); }
@media screen and (max-width: 1099px) { .ds-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ds-tiles[data-n="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ds-tile .hf-k { display: none; } }
@media screen and (max-width: 767px) {
  .dash-start { padding: 14px 12px 14px; margin-bottom: 16px; }
  .ds-hi h2 { font-size: 1.16rem; }
  .ds-hi p { display: none; }
  .ds-tiles { gap: 8px; margin-top: 10px; }
  .ds-tile { flex-direction: column; justify-content: center; gap: 6px; min-height: 96px; padding: 12px 6px; text-align: center; }
  .ds-ti { width: 44px; height: 44px; }
  .ds-ti .sup-owl, .ds-ti .owl-svg { width: 44px; height: 44px; }
  .ds-tt { align-items: center; }
  .ds-tt b { font-size: 1rem; }
  .ds-tt small { display: none; }
}
/* 모바일 하단 탭 — 핵심 3종 */
.tab-btn .sup-owl { width: 26px; height: 26px; display: flex; align-items: center; justify-content: center; }
.tab-btn .sup-owl .owl-svg { width: 26px; height: 26px; }
.tab-btn .sup-n { position: absolute; top: 4px; left: calc(50% + 6px); min-width: 18px; height: 18px; padding: 0 4px; font-size: max(var(--fs-min), .72rem); }
.tab-btn[hidden] { display: none; }
/* 사용법 안내 — 단추를 비추는 구멍 + 말풍선 */
.tour { position: fixed; inset: 0; z-index: 1300; }
.tour-hole { position: fixed; border-radius: 8px; box-shadow: 0 0 0 4px var(--accent), 0 0 0 9999px rgba(11,31,38,.58); pointer-events: none; transition: left .22s var(--ease-out), top .22s var(--ease-out), width .22s var(--ease-out), height .22s var(--ease-out); }
.tour-pop { position: fixed; width: min(340px, calc(100vw - 24px)); padding: 18px 18px 14px; border-radius: 6px; background: var(--tag-2); box-shadow: var(--shadow-lg), inset 0 4px 0 var(--accent); }
.tour-step { font-size: max(var(--fs-min), .8rem); color: var(--text-2); }
.tour-pop h3 { margin: 4px 0 6px; font-size: 1.15rem; font-weight: 700; }
.tour-x { margin: 0; font-size: .95rem; line-height: 1.6; color: var(--text); }
.tour-acts { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }
.tour-acts .btn { min-height: 44px; padding: 0 18px; }
@media print { .tour { display: none !important; } }

/* 설정 탭 */
.tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--border); margin-bottom: 18px; flex-wrap: wrap; }
.tab {
  padding: 10px 16px; border: none; background: none; font-size: .88rem; font-weight: 600;
  color: var(--text-2); border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.tab.active { color: var(--text); border-bottom-color: var(--accent); }

.menu-tree-item { display: flex; align-items: center; gap: 8px; padding: 9px 11px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); margin-bottom: 6px; background: var(--surface); }
.menu-tree-item.is-child { margin-left: 26px; }
.menu-tree-item.is-hidden { background: repeating-linear-gradient(135deg, var(--surface), var(--surface) 7px, var(--bg) 7px, var(--bg) 14px); border-style: dashed; }
.menu-tree-item.is-hidden .mt-label, .menu-tree-item.is-hidden .mt-url { color: var(--text-3); text-decoration: line-through; text-decoration-color: var(--text-3); }
.menu-tree-item.is-hidden .mt-label .badge { text-decoration: none; }
.mt-btn.on { background: var(--primary-soft); color: var(--primary-dark); }
.menu-tree-item .mt-label { flex: 1; font-size: .93rem; font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.menu-tree-item .mt-type { font-size: max(var(--fs-min), .8rem); }
/* 넓은 화면에서 라벨↔버튼 사이 빈 공간에 대상 주소·라우트 표시 */
.menu-tree-item .mt-url {
  flex: 0 1 auto; max-width: 42%; min-width: 0; font-size: max(var(--fs-min), .78rem); color: var(--text-3);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; direction: ltr;
}
.menu-tree-item .mt-url-mod { color: #8fa7ae; }
@media (min-width: 1560px) {
  /* 주소가 있는 행은 라벨을 내용 폭으로 줄이고 주소가 남는 폭을 흡수 — 라벨과 버튼이 멀어지지 않게 */
  .menu-tree-item:has(.mt-url) .mt-label { flex: 0 1 auto; }
  .menu-tree-item .mt-url { flex: 1 1 auto; max-width: none; }
}
.menu-tree-item .mt-actions { display: flex; gap: 2px; }
.mt-btn { background: none; border: none; font-size: max(var(--fs-min), .85rem); padding: 4px 6px; border-radius: 4px; color: var(--text-2); }
.mt-btn:hover { background: var(--surface-2); color: var(--text); }
.mt-btn.danger:hover { color: var(--danger); background: var(--danger-soft); }
@media (max-width: 600px) {
  .menu-tree-item { flex-wrap: wrap; row-gap: 4px; }
  .menu-tree-item.is-child { margin-left: 14px; }
  .menu-tree-item .mt-url { display: none; }
  .menu-tree-item .mt-label { flex: 1 1 60%; }
  .menu-tree-item .mt-actions { margin-left: auto; }
}

/* ── 동기화 상태 (허브 패널 하단) ── */
.sync-dot {
  display: none; align-items: center; gap: 7px; height: 26px; padding: 0 2px;
  font-size: max(var(--fs-min), .78rem); font-weight: 500; border: none; background: none; color: var(--text-3); white-space: nowrap; cursor: pointer;
}
.sync-dot .sync-dot-ico { width: 8px; height: 8px; border-radius: 50%; background: #94a3b8; display: inline-block; }
.sync-dot.online, .sync-dot.syncing, .sync-dot.offline { display: inline-flex; }
.sync-dot.online .sync-dot-ico { background: #16a34a; }
.sync-dot.syncing .sync-dot-ico { background: var(--accent); animation: pulse 1s infinite; }
.sync-dot.offline { color: var(--danger); }
.sync-dot.offline .sync-dot-ico { background: var(--danger); }
@keyframes pulse { 50% { opacity: .35; } }

/* ── 일정관리 (캘린더) ── */
.cal-card { padding: 14px 14px 16px; }
.cal-toolbar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 8px; }
.cal-toolbar .spacer { flex: 1; }
.cal-title { font-size: 1.12rem; font-weight: 800; letter-spacing: -.3px; margin-left: 8px; }
.cal-views { display: flex; gap: 2px; background: var(--surface-2); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 2px; }
.cal-viewbtn { border: none; background: none; padding: 6px 13px; font-size: .88rem; font-weight: 700; color: var(--text-2); border-radius: 5px; }
.cal-viewbtn.active { background: var(--primary); color: #fff; }
.cal-fsbtn { font-weight: 700; }

/* ── 전체화면(넓게 보기) 모드 — 일정관리 전용, 다른 모듈 무영향 ── */
.cal-card.cal-fullscreen {
  position: fixed; inset: 0; z-index: 400;
  margin: 0; border: none; border-radius: 0; box-shadow: none;
  padding: 12px 18px 16px;
  display: flex; flex-direction: column;
  background: var(--surface); overflow: hidden;
  animation: fade .15s ease;
}
.cal-fullscreen .cal-toolbar,
.cal-fullscreen .cal-filters { flex: none; }
.cal-fullscreen #cal-body {
  flex: 1 1 auto; min-height: 0;
  display: flex; flex-direction: column; overflow: auto;
}
/* 월·주·2주 그리드를 세로로 꽉 채움 */
.cal-fullscreen .cal-gridwrap {
  flex: 1 1 auto; min-height: 0;
  display: flex; flex-direction: column;
}
.cal-fullscreen .cal-grid-head { flex: none; }
.cal-fullscreen .cal-week { flex: 1 1 0; min-height: 0; }
.cal-fullscreen .cal-week-bg { height: 100%; grid-template-rows: 1fr; }
.cal-fullscreen .cal-week-bg .cal-cell { min-height: 0; }

.cal-filters { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
.cal-filters .spacer { flex: 1; }
.cal-filter-label { font-size: max(var(--fs-min), .84rem); color: var(--text-2); font-weight: 700; }
.cal-fchip { border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); font-size: max(var(--fs-min), .84rem); font-weight: 600; padding: 5px 12px; border-radius: 6px; }
.cal-fchip:hover { border-color: var(--primary); color: var(--primary); }
.cal-fchip.active { background: var(--primary); border-color: var(--primary); color: #fff; }

.cal-grid-head { display: grid; grid-template-columns: repeat(7, 1fr); text-align: center; font-size: max(var(--fs-min), .82rem); font-weight: 700; color: var(--text-2); padding: 6px 0; }
.cal-grid-head .sun { color: var(--danger); }
.cal-grid-head .sat { color: var(--primary); }
/* 주 단위 레인 그리드 (구글캘린더식 스패닝 바) */
.cal-gridwrap { border-top: 1px solid var(--border); }
.cal-gridwrap.view-month { --wkmin: 128px; }
.cal-gridwrap.view-week  { --wkmin: 268px; }
.cal-gridwrap.view-2week { --wkmin: 228px; }
.cal-week { position: relative; border-left: 1px solid var(--border); }
.cal-week-bg { display: grid; grid-template-columns: repeat(7, 1fr); }
.cal-week-bg .cal-cell {
  min-height: var(--wkmin, 120px);
  border-right: 1px solid var(--border); border-bottom: 1px solid var(--border);
  padding: 3px 5px; background: var(--surface); overflow: hidden;
  display: flex; flex-direction: column;
}
.cal-cell.other { background: var(--surface-2); }
.cal-cell.other .cal-daynum { color: var(--text-3); }
.cal-cell.today { background: var(--primary-soft); }
.cal-cell.today .cal-daynum { color: #fff; background: var(--primary); border-radius: 6px; padding: 0 7px; }
.cal-cell.drop-hover { outline: 2px dashed var(--primary); outline-offset: -2px; }
.cal-daynum { font-size: max(var(--fs-min), .82rem); font-weight: 700; display: inline-block; margin-bottom: 2px; align-self: flex-start; }
.cal-daynum.sun { color: var(--danger); }
.cal-daynum.sat { color: var(--primary); }

.cal-week-ev {
  position: absolute; left: 0; right: 0; top: 24px; bottom: 22px;
  display: grid; grid-template-columns: repeat(7, 1fr);
  grid-auto-rows: 20px; row-gap: 2px;
  pointer-events: none; overflow: hidden; align-content: start;
}
.cal-week-ev > * { pointer-events: auto; min-width: 0; }
#cal-body.drag-active .cal-week-ev > * { pointer-events: none; } /* 드래그 중 셀로 통과 */

/* 드래그 이동: 커서를 따라오는 고스트 */
body.cal-dragging { cursor: grabbing !important; user-select: none; }
body.cal-dragging .cal-cell { cursor: grabbing !important; }
.cal-ghost {
  position: fixed; z-index: 9000; pointer-events: none; opacity: .95;
  box-shadow: 0 10px 24px rgba(15, 23, 42, .3); will-change: transform;
  max-width: 260px; white-space: nowrap;
}
.cal-ghost.cal-tchip { background: var(--surface) !important; padding: 2px 8px; border-radius: 4px; }
@media (hover: hover) { .cal-bar[data-drag], .cal-tchip[data-drag] { cursor: grab; } }

/* 기간/종일 일정: 한 줄 연결 바 */
.cal-bar {
  margin: 0 3px; display: flex; align-items: center; gap: 3px;
  font-size: max(var(--fs-min), .78rem); font-weight: 600; padding: 1px 6px; border-radius: 4px;
  cursor: pointer; user-select: none; overflow: hidden; line-height: 1.4;
}
.cal-bar .chip-title { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: -.2px; }
.cal-bar.done { opacity: .45; filter: saturate(.4); }
.cal-bar.done .chip-title { text-decoration: line-through; }
.cal-bar.cont-l { border-top-left-radius: 0; border-bottom-left-radius: 0; margin-left: 0; }
.cal-bar.cont-r { border-top-right-radius: 0; border-bottom-right-radius: 0; margin-right: 0; }
.cal-bar.cont-l::before { content: "‹"; opacity: .8; }
.cal-bar.cont-r::after { content: "›"; opacity: .8; }
.cal-bar.dragging { opacity: .4; }
.cal-bar.ev-gcal { padding-top: 0; padding-bottom: 0; }

/* 시간 일정: 투명 배경 + 색 글씨 (구글캘린더식) */
.cal-tchip {
  margin: 0 3px; display: flex; align-items: center; gap: 3px;
  font-size: max(var(--fs-min), .78rem); font-weight: 700; padding: 1px 4px; border-radius: 4px;
  cursor: pointer; user-select: none; overflow: hidden; line-height: 1.4;
  background: transparent !important; color: var(--evc, var(--text)) !important;
  border: none !important;
}
.cal-tchip:hover { background: var(--surface-2) !important; }
.cal-tchip .chip-title { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: -.2px; }
.cal-tchip .chip-time { font-weight: 600; }
.cal-tchip.done { opacity: .5; }
.cal-tchip.done .chip-title { text-decoration: line-through; }
.cal-tchip.dragging { opacity: .4; }
.chip-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--evf, var(--evc, #64748b)); flex-shrink: 0; }

.cal-chip {
  display: flex; align-items: center; gap: 3px;
  font-size: max(var(--fs-min), .78rem); font-weight: 600; padding: 2px 5px; border-radius: 4px;
  cursor: pointer; user-select: none; min-width: 0; line-height: 1.35;
}
.cal-chip .chip-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; letter-spacing: -.2px; }
.cal-chip .chip-time { font-size: max(var(--fs-min), .78rem); white-space: nowrap; }
.chip-check { font-size: max(var(--fs-min), .78rem); cursor: pointer; flex-shrink: 0; line-height: 1; }
.chip-check.done { opacity: .9; }
.chip-check.todo { display: none; }              /* 미완료: 평소엔 숨김(호버 시 노출) */
.cal-bar:hover .chip-check.todo,
.cal-tchip:hover .chip-check.todo,
.cal-chip:hover .chip-check.todo,
.cal-agenda-row:hover .chip-check.todo { display: inline-block; opacity: .55; }
.cal-chip.dragging { opacity: .4; }
.cal-chip.done { opacity: .45; filter: saturate(.4); }
.cal-chip.done .chip-title { text-decoration: line-through; }
.cal-more { border: none; background: none; font-size: max(var(--fs-min), .82rem); color: var(--primary); font-weight: 700; text-align: left; padding: 1px 4px; margin-top: auto; align-self: flex-start; pointer-events: auto; }
/* 반복 일정 완료 범위 선택 */
.scope-picker .btn { padding: 11px 14px; font-size: .87rem; }
.scope-picker .btn:hover { border-color: var(--primary); color: var(--primary); }
.nb-toolbar.nb-mini button { font-size: max(var(--fs-min), .82rem); padding: 3px 8px; }
.nb-memo { min-height: 110px; }

/* 일정 색 12색 — 색끼리 ΔE2000 ≥ 18, 글자 대비 4.5:1 이상.
   --evf = 칠(막대·점), --evc = 흰 바탕 위 글자색. 밝은 3색(노랑·하늘·연분홍)은 짙은 글자. */
.ev-red    { --evf: #d42a1e; --evc: #d42a1e; background: var(--evf); color: #fff; }
.ev-orange, .ev-amber { --evf: #f58220; --evc: #c2410c; background: var(--evf); color: #2b1204; }
.ev-yellow { --evf: #fde047; --evc: #a16207; background: var(--evf); color: #3d2c00; box-shadow: inset 0 0 0 1px rgba(161,98,7,.28); }
.ev-green, .ev-lime { --evf: #178236; --evc: #178236; background: var(--evf); color: #fff; }
.ev-teal   { --evf: #0f766e; --evc: #0f766e; background: var(--evf); color: #fff; }
.ev-sky    { --evf: #a5dcfb; --evc: #0369a1; background: var(--evf); color: #0b4a6f; box-shadow: inset 0 0 0 1px rgba(3,105,161,.25); }
.ev-blue, .ev-indigo { --evf: #1f4fd6; --evc: #1f4fd6; background: var(--evf); color: #fff; }
.ev-purple { --evf: #9b35c4; --evc: #9b35c4; background: var(--evf); color: #fff; }
.ev-pink   { --evf: #d0306a; --evc: #c0266f; background: var(--evf); color: #fff; }
.ev-rose   { --evf: #fdd1dc; --evc: #be185d; background: var(--evf); color: #9f1239; box-shadow: inset 0 0 0 1px rgba(190,24,93,.25); }
.ev-brown  { --evf: #6f4323; --evc: #6f4323; background: var(--evf); color: #fff; }
.ev-gray   { --evf: #646b73; --evc: #646b73; background: var(--evf); color: #fff; }
.cal-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; flex-shrink: 0; }

/* 구글캘린더 일정 칩 (읽기 전용 오버레이) */
.ev-gcal { --evc: #1a73e8; background: #fff; color: #1a73e8; border: 1.5px dashed #1a73e8; }
.chip-g {
  display: inline-flex; align-items: center; justify-content: center;
  width: 13px; height: 13px; border-radius: 3px; flex-shrink: 0;
  background: #1a73e8; color: #fff; font-size: max(var(--fs-min), .78rem); font-weight: 800;
}

/* 담당자 태그 / 리마인더 */
.chip-tag {
  font-size: max(var(--fs-min), .78rem); font-weight: 700; white-space: nowrap; flex-shrink: 0; opacity: .8;
}
.rem-picker { display: flex; gap: 12px; flex-wrap: wrap; }
.rem-opt { display: flex; align-items: center; gap: 5px; font-size: max(var(--fs-min), .84rem); cursor: pointer; font-weight: 600; color: var(--text-2); }
.team-picker { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 7px; }

.color-picker { display: flex; gap: 6px; flex-wrap: wrap; }
.color-swatch { width: 26px; height: 26px; border-radius: 50%; border: 2.5px solid transparent; box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.55); }
.color-swatch.sel { border-color: var(--text); transform: scale(1.15); }

/* 일 뷰 */
.cal-dayview { padding: 4px 2px; }
.cal-sec-label { font-size: max(var(--fs-min), .78rem); font-weight: 700; color: var(--text-3); margin: 10px 0 6px; }
.cal-agenda-row { display: flex; gap: 12px; padding: 7px 4px; border-bottom: 1px solid var(--border); align-items: flex-start; }
.cal-agenda-row:last-child { border-bottom: none; }
.ag-time { width: 92px; flex-shrink: 0; font-size: max(var(--fs-min), .8rem); font-weight: 700; color: var(--text-2); padding-top: 2px; }
.ag-chip { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ag-chip .cal-chip { font-size: .88rem; padding: 5px 12px; flex: 1 1 100%; } /* 일 보기: 제목 전체 폭 표시 */
.ag-memo { width: 100%; font-size: max(var(--fs-min), .8rem); color: var(--text-2); padding-left: 2px; }

/* 년 뷰 */
.cal-year { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 14px; }
.cal-mini { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 8px; background: var(--surface); }
.cal-mini-title { border: none; background: none; font-size: .88rem; font-weight: 800; color: var(--primary); margin-bottom: 4px; padding: 2px 4px; }
.cal-mini-title:hover { text-decoration: underline; }
.cal-mini-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; text-align: center; }
.mini-dow { font-size: max(var(--fs-min), .78rem); color: var(--text-3); font-weight: 700; }
.mini-day { border: none; background: none; font-size: max(var(--fs-min), .78rem); padding: 2px 0; border-radius: 4px; color: var(--text-2); position: relative; }
.mini-day:hover { background: var(--surface-2); }
.mini-day.today { background: var(--primary); color: #fff; font-weight: 700; }
.mini-day.has-ev::after { content: ""; position: absolute; bottom: -1px; left: 50%; transform: translateX(-50%); width: 4px; height: 4px; border-radius: 50%; background: var(--accent); }

/* ── 보안등급 이력 (세로 정렬) ── */
.lv-row {
  display: grid; grid-template-columns: 128px 46px 1fr auto;
  gap: 6px; align-items: center; padding: 3px 0;
  font-size: max(var(--fs-min), .82rem); color: var(--text-2);
}
.lv-row.expired { opacity: .55; }
.lv-range { white-space: nowrap; font-variant-numeric: tabular-nums; }
.lv-badge { text-align: center; }
.lv-note { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ── 공지 리치 에디터 ── */
.nb-toolbar {
  display: flex; gap: 2px; flex-wrap: wrap; align-items: center;
  border: 1.5px solid var(--border); border-bottom: none;
  border-radius: var(--radius-sm) var(--radius-sm) 0 0;
  background: var(--surface-2); padding: 5px 7px;
}
.nb-toolbar button {
  border: none; background: none; padding: 4px 9px; border-radius: 5px;
  font-size: max(var(--fs-min), .84rem); color: var(--text-2); font-weight: 600;
}
.nb-toolbar button:hover { background: var(--surface); color: var(--text); box-shadow: var(--shadow); }
.nb-sep { width: 1px; height: 18px; background: var(--border); margin: 0 5px; }
.nb-editor {
  min-height: 220px; max-height: 45vh; overflow-y: auto;
  border: 1.5px solid var(--border); border-radius: 0 0 var(--radius-sm) var(--radius-sm);
  padding: 12px 14px; font-size: .92rem; outline: none; background: var(--surface);
}
.nb-editor:focus { border-color: var(--primary); }
.nb-editor img, .notice-html img { max-width: 100%; height: auto; border-radius: 6px; }
.nb-editor table, .notice-html table { border-collapse: collapse; margin: 8px 0; width: auto; min-width: 50%; }
.nb-editor td, .nb-editor th, .notice-html td, .notice-html th {
  border: 1px solid var(--border); padding: 6px 10px; font-size: .86rem; min-width: 60px;
}
.notice-html { white-space: normal; }
.notice-html p { margin: 4px 0; }
.notice-html ul, .notice-html ol { padding-left: 22px; margin: 6px 0; }
.nb-files-view { display: flex; gap: 6px; flex-wrap: wrap; margin: 8px 0 4px; }
.nb-file {
  display: inline-flex; align-items: center; gap: 4px;
  background: var(--surface-2); border: 1px solid var(--border); border-radius: 6px;
  padding: 3px 11px; font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text);
}
a.nb-file:hover { border-color: var(--primary); color: var(--primary); }

/* ── 반응형 — 모바일(<768px): 앱바 + 하단 탭 + 전체 메뉴 시트 ── */
@media (max-width: 768px) {
  html { font-size: 14px; }
  .rail { display: none; }
  .header { left: 0 !important; padding: 0 6px 0 14px; gap: 8px; height: 58px; }
  :root { --header-h: 58px; }
  #menu-toggle, .crumbs, .user-chip { display: none; }
  .brand { display: flex; }
  .sec-badge { height: 30px; padding: 0 9px; font-size: max(var(--fs-min), .78rem); }
  .sec-badge .sb-l { display: none; }
  .main { margin-left: 0 !important; padding-bottom: calc(var(--tabbar-h) + 30px + env(safe-area-inset-bottom)); }
  .view, .view.view-wide, .view.view-mid { padding: 18px 14px 24px; }
  .page-title { font-size: 1.5rem; }
  .form-grid { grid-template-columns: 1fr; }

  /* 하단 떠 있는 탭 */
  .tabbar {
    display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); align-items: center;
    position: fixed; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); height: var(--tabbar-h);
    padding: 0 6px; border-radius: 6px; background: var(--sidebar-bg); z-index: 170;
    box-shadow: 0 10px 30px rgba(11,31,38,.28);
  }
  .tab-btn {
    position: relative; height: 56px; margin: 0 2px; border: 0; border-radius: 6px; background: none; color: var(--rail-text);
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    font-size: .93rem; font-weight: 600; transition: transform .16s var(--ease-out);
  }
  .tab-btn:active { transform: scale(.96); }
  .tab-btn.active { background: var(--rail-active); color: #fff; font-weight: 600; }

  /* 전체 메뉴 시트 — 허브 패널을 아래에서 올라오는 시트로 */
  .sidebar.panel {
    left: 0; right: 0; top: 48px; width: auto; border-right: 0; border-radius: 24px 24px 0 0; z-index: 190;
    transform: translateY(105%); transition: transform .36s var(--ease-drawer);
    box-shadow: 0 -8px 28px rgba(11,31,38,.2);
  }
  .app.sheet-open .sidebar.panel { transform: none; }
  .sidebar-backdrop.show { z-index: 185; }
  .panel-brand { height: 62px; border-bottom: 0; padding-top: 8px; position: relative; }
  .panel-brand::before { content: ""; position: absolute; top: 8px; left: 50%; width: 40px; height: 5px; margin-left: -20px; border-radius: 3px; background: var(--border-strong); }
  .sheet-only { display: inline-flex !important; }
  .nav-menu { padding: 0 16px 16px; }
  .hub, .hub.on { display: block; border-bottom: 1px solid #edf1f0; padding: 4px 0 8px; }
  .hub:last-child { border-bottom: 0; }
  .hub-head { padding: 10px 0 6px; }
  .hub-ico { display: flex; width: 32px; height: 32px; border-radius: 6px; background: var(--primary-soft); align-items: center; justify-content: center; }
  .hub.on .hub-ico { background: var(--sidebar-bg); color: #fff; }
  .hub-title { font-size: 1rem; }
  .hub-items { padding: 0 0 0 42px; }
  .hub-block { margin: 6px 0 0 42px; }
  .nav-item { min-height: 44px; font-size: .95rem; }
  .nav-pin { min-height: 44px; font-size: .92rem; }
  .panel-foot { padding: 12px 20px calc(12px + env(safe-area-inset-bottom)); }
  .sheet-logout { border: 1px solid var(--border-strong); background: var(--surface); border-radius: 6px; height: 34px; padding: 0 12px; font-size: max(var(--fs-min), .8rem); font-weight: 600; align-items: center; }
  .app.nav-signer .main { padding-bottom: 24px; }
  .cal-gridwrap.view-month { --wkmin: 78px; }
  .cal-gridwrap.view-week { --wkmin: 200px; }
  .cal-gridwrap.view-2week { --wkmin: 160px; }
  .cal-bar .chip-time, .cal-tchip .chip-time, .cal-chip .chip-time { display: none; }
  .cal-title { font-size: .92rem; }
}
@media (max-width: 380px) {
  .brand-text { display: none; }
}
/* 모바일 — 핵심 3종은 하단 탭으로, 글자 크기는 전체 메뉴 시트 아래 */
@media screen and (max-width: 767px) {
  .hdr-find, .hdr-sup, .hdr-fs { display: none !important; }
  .hdr-help { padding: 0 8px; }
  .hdr-help .hdr-l { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
  .sheet-fs[hidden] { display: none !important; }
  .sheet-fs:not([hidden]) { display: flex !important; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 20px; border-top: 1px solid var(--border); font-size: .9rem; font-weight: 600; color: var(--text-2); }
  .sheet-fs .fs-seg { height: 44px; }
  .sheet-fs .fs-b { width: 52px; }
}

/* ── 보고체계 연락망 ── */
.ct-hero {
  background: #8f1d16;
  color: #fff; border-radius: var(--radius); padding: 18px 22px; margin-bottom: 14px;
}
.ct-hero-main { font-size: 1.12rem; font-weight: 700; letter-spacing: -.2px; }
.ct-hero-main b { background: rgba(255,255,255,.18); border-radius: 6px; padding: 1px 8px; text-decoration: underline; text-underline-offset: 3px; }
.ct-hero-sub { font-size: max(var(--fs-min), .82rem); opacity: .92; margin-top: 6px; }
.ct-searchwrap { position: sticky; top: var(--header-h); z-index: 5; padding: 2px 0 10px; background: var(--bg); }
.ct-search {
  width: 100%; height: 42px; padding: 0 14px; font-size: .9rem;
  border: 1px solid #d6dedb; border-radius: 6px; background-color: var(--surface-2); outline: none;
}
.ct-search:focus { border-color: var(--primary); background-color: var(--surface); }
.ct-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
.ct-sec { margin-bottom: 14px; }
.ct-grid .ct-sec { margin-bottom: 0; }
.ct-sec mark { background: #fde68a; border-radius: 3px; padding: 0 2px; }
.ct-danger { border: 1.5px solid #fca5a5; background: var(--danger-soft); }
.ct-duty {
  font-size: max(var(--fs-min), .82rem); font-weight: 700; color: var(--danger);
  background: var(--danger-soft); border: 1px solid #fecaca; border-radius: 6px;
  padding: 3px 10px; margin-right: 6px; white-space: nowrap;
}
.ct-duty:hover { background: #fee2e2; }
.ct-row { padding: 8px 2px; border-bottom: 1px solid var(--border); display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; }
.ct-row:last-of-type { border-bottom: none; }
.ct-who { min-width: 150px; flex: 1 1 150px; }
.ct-role { font-size: max(var(--fs-min), .82rem); color: var(--text-2); margin-right: 6px; }
.ct-name { font-size: .92rem; }
.ct-dutytxt { display: block; font-size: max(var(--fs-min), .78rem); color: var(--text-3); }
.ct-nums { display: flex; flex-wrap: wrap; gap: 4px 14px; align-items: center; }
.ct-num { display: inline-flex; align-items: center; gap: 5px; font-size: .88rem; white-space: nowrap; }
.ct-tel { color: var(--text); font-variant-numeric: tabular-nums; font-weight: 600; }
a.ct-tel:hover { color: var(--primary); }
.ct-mini {
  font-size: max(var(--fs-min), .78rem); font-weight: 700; color: var(--primary);
  border: 1px solid var(--primary); border-radius: 6px; padding: 0 7px;
}
.ct-mini:hover { background: var(--primary-soft); }
.ct-copy { background: none; border: none; font-size: max(var(--fs-min), .82rem); opacity: .55; padding: 2px; }
.ct-copy:hover { opacity: 1; }
.ct-note { flex-basis: 100%; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.ct-secnote { margin-top: 10px; font-size: max(var(--fs-min), .82rem); color: var(--text-2); background: var(--surface-2); border-radius: var(--radius-sm); padding: 8px 12px; }
.ct-mailall { margin-top: 10px; display: flex; gap: 8px; flex-wrap: wrap; }
/* 보고 절차 아코디언 */
.ct-acc { border: 1px solid var(--border); border-radius: var(--radius-sm); margin-bottom: 8px; background: var(--surface-2); }
.ct-acc summary { cursor: pointer; padding: 10px 14px; font-weight: 700; font-size: .9rem; list-style: none; }
.ct-acc summary::before { content: "▸ "; color: var(--primary); }
.ct-acc[open] summary::before { content: "▾ "; }
.ct-acc-body { padding: 2px 16px 12px; font-size: .86rem; color: var(--text); white-space: normal; }
/* 사건별 보고처 */
.ct-inc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ct-inc { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 12px 14px; background: var(--surface-2); }
.ct-inc-head { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 8px; }
.ct-inc-no { font-size: 1.3rem; line-height: 1.2; }
.ct-inc-to { flex: 1; font-size: max(var(--fs-min), .82rem); font-weight: 700; color: var(--danger); background: var(--danger-soft); border-radius: var(--radius-sm); padding: 6px 10px; }
.ct-inc-tolabel { display: block; font-size: max(var(--fs-min), .78rem); color: var(--text-3); font-weight: 600; }
.ct-inc-items { font-size: max(var(--fs-min), .8rem); color: var(--text-2); }
/* 편집 모달 */
.ct-editlist { max-height: 46vh; overflow-y: auto; padding-right: 4px; }
.ct-editrow { display: flex; gap: 8px; align-items: flex-start; border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 8px 10px; margin-bottom: 8px; background: var(--surface-2); }
.ct-editfields { flex: 1; display: flex; flex-wrap: wrap; gap: 6px 10px; }
.ct-ef { display: flex; flex-direction: column; flex: 1 1 130px; }
.ct-ef-sm { flex: 0 0 56px; }
.ct-ef-wide { flex: 1 1 100%; }
.ct-ef span { font-size: max(var(--fs-min), .78rem); color: var(--text-3); font-weight: 600; }
.ct-ef input, .ct-ef textarea { padding: 5px 8px; border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: max(var(--fs-min), .84rem); }
.ct-editrow-btns { display: flex; flex-direction: column; gap: 2px; }
.ct-editrow-btns .btn { padding: 2px 7px; }
@media (max-width: 900px) {
  .ct-grid, .ct-inc-grid { grid-template-columns: 1fr; }
}

/* 사건별 보고처: ① 노랑 → ④ 짙은 빨강 */
.ct-inc { border-left-width: 5px; }
.ct-inc .ct-inc-no {
  width: 30px; height: 30px; flex: 0 0 30px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.05rem; color: #fff; background: var(--text-3);
}
.ct-inc.ct-lv1 { border-left-color: #eab308; background: #fefce8; }
.ct-inc.ct-lv1 .ct-inc-no { background: #eab308; }
.ct-inc.ct-lv2 { border-left-color: #f59e0b; background: #fffbeb; }
.ct-inc.ct-lv2 .ct-inc-no { background: #f59e0b; }
.ct-inc.ct-lv3 { border-left-color: #ea580c; background: #fff7ed; }
.ct-inc.ct-lv3 .ct-inc-no { background: #ea580c; }
.ct-inc.ct-lv4 { border-left-color: #991b1b; background: #fef2f2; }
.ct-inc.ct-lv4 .ct-inc-no { background: #991b1b; }
/* ── 통합 검색 (공통 패널 본문) ── */
.hdr-search { flex: 1; min-height: 0; display: flex; flex-direction: column; color: var(--text-3); }
.hdr-search.vendor-hide, [data-search-open].vendor-hide { display: none !important; }
.hdr-search-f {
  flex: none; display: flex; align-items: center; gap: 12px; margin: 18px 24px 6px; padding: 0 16px; height: 56px; border-radius: 6px;
  background: var(--surface); box-shadow: inset 0 0 0 1.5px var(--tag-line); transition: box-shadow .15s ease;
}
.hdr-search-f:focus-within { box-shadow: inset 0 0 0 2px var(--primary), 0 0 0 4px rgba(15,118,110,.12); }
.hdr-search-f > svg { flex: none; }
.hdr-search input { flex: 1; min-width: 0; height: 52px; border: 0; outline: none; background: none; font-size: 1.05rem; color: var(--text); }
.hdr-search input::-webkit-search-cancel-button { display: none; }
.hdr-search-k { flex: none; }
.search-pop { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 4px 16px 22px; }
.sp-group { display: flex; align-items: baseline; gap: 6px; font-size: max(var(--fs-min), .84rem); font-weight: 700; color: var(--text-2); padding: 16px 10px 6px; }
.sp-group small { font-family: var(--mono); font-weight: 600; color: var(--text-3); }
/* 결과 한 줄 — 앞 종류 꼬리표 · 제목 · 설명 · 끝 할 일 글자 */
.sp-item {
  display: flex; align-items: center; gap: 12px; width: 100%; min-height: 56px; margin-bottom: 6px;
  background: var(--surface); border: 1px solid var(--hair, #e1e7e5); text-align: left; cursor: pointer;
  padding: 8px 12px; border-radius: 4px; color: var(--text);
}
.sp-item:hover { border-color: var(--tag-line); background: #fff; }
.sp-item.active { box-shadow: inset 0 0 0 1.5px var(--primary); border-color: var(--primary); }
.sp-kind {
  flex: none; min-width: 52px; padding: 3px 6px; border-radius: 4px; text-align: center; font-size: max(var(--fs-min), .82rem); font-weight: 700;
  background: var(--surface-2); color: var(--text-2);
}
.sp-kind.k-scr { background: var(--primary-soft); color: var(--primary-dark); }
.sp-kind.k-doc { background: var(--info-soft); color: var(--info); }
.sp-kind.k-cal { background: var(--accent-soft); color: #8a4b06; }
.sp-kind.k-tel { background: var(--success-soft); color: var(--success); }
.sp-kind.k-bbs, .sp-kind.k-sup { background: var(--tag); color: var(--tag-ink); box-shadow: inset 0 0 0 1px var(--tag-line); }
.sp-txt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.sp-title { font-size: 1.04rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-sub { font-size: .88rem; color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-act { flex: none; display: inline-flex; align-items: center; gap: 2px; font-size: .92rem; font-weight: 700; color: var(--primary); }
.sp-hl { color: var(--primary-dark); background: var(--primary-soft); border-radius: 3px; padding: 0 1px; }
.sp-more { display: inline-flex; align-items: center; gap: 4px; min-height: 40px; margin: 0 0 4px; padding: 0 12px; border: 0; border-radius: 4px; background: none; color: var(--primary-dark); font-size: .9rem; font-weight: 600; }
@media (hover: hover) and (pointer: fine) { .sp-more:hover { background: var(--primary-soft); } }
.sp-kinds { display: flex; flex-wrap: wrap; gap: 8px; padding: 10px 2px 2px; }
.sp-kchip { min-height: 40px; padding: 0 14px; border: 1px solid var(--border-strong); border-radius: 999px; background: var(--surface); color: var(--text); font-size: .92rem; font-weight: 600; }
.sp-kchip b { font-family: var(--mono); font-weight: 600; color: var(--text-3); margin-left: 2px; }
.sp-kchip[aria-pressed="true"] { background: var(--tag-ink); border-color: var(--tag-ink); color: #fff; }
.sp-kchip[aria-pressed="true"] b { color: #cfe3e0; }
/* 처음 화면 — 자주 찾는 것 · 최근 검색어 · 최근 연 화면 · 전체 메뉴 */
.sp-sec { padding: 14px 2px 4px; }
.sp-sec-h { display: flex; align-items: center; gap: 8px; font-size: max(var(--fs-min), .84rem); font-weight: 700; color: var(--text-2); margin-bottom: 8px; }
.sp-clear { margin-left: auto; font-size: max(var(--fs-min), .82rem); font-weight: 600; }
.sp-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.sp-chip { min-height: 40px; padding: 0 16px; border: 1px solid var(--border-strong); border-radius: 999px; background: var(--surface); color: var(--text); font-size: .95rem; font-weight: 600; }
.sp-chip.is-go { border-color: var(--tag-line); background: var(--tag); }
.sp-chip.is-q { display: inline-flex; align-items: center; padding: 0 4px 0 0; overflow: hidden; }
.sp-chip-b { min-height: 38px; padding: 0 6px 0 14px; border: 0; background: none; color: inherit; font: inherit; }
.sp-chip-x { width: 30px; height: 30px; border: 0; border-radius: 50%; background: none; color: var(--text-3); display: inline-flex; align-items: center; justify-content: center; }
@media (hover: hover) and (pointer: fine) { .sp-chip:hover, .sp-chip-x:hover { border-color: var(--primary); color: var(--primary-dark); } }
.sp-menus { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 12px; border: 1px dashed var(--border-strong); border-radius: 4px; background: none; color: var(--text-2); font-size: .9rem; font-weight: 600; }
.sp-menus small { font-family: var(--mono); color: var(--text-3); }
/* 결과 없음 — 아르고에게 넘기기 */
.sp-none { margin: 14px 2px 6px; padding: 20px 20px 18px; border-radius: 4px; background: var(--tag); border: 1.5px dashed var(--tag-perf); }
.sp-none-t { margin: 0; font-size: 1.15rem; font-weight: 700; color: var(--text); }
.sp-none-s { margin: 4px 0 0; font-size: .95rem; color: var(--text-2); }
.sp-ask { display: flex; align-items: center; gap: 12px; margin-top: 14px; padding: 12px 12px 12px 14px; border-radius: 4px; background: var(--tag-ink); color: #fff; }
.sp-ask-owl { flex: none; width: 40px; height: 40px; line-height: 0; }
.sp-ask-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.sp-ask-t b { font-size: 1rem; }
.sp-ask-t span { font-size: .9rem; color: #cfe3e0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-ask-b { flex: none; display: inline-flex; align-items: center; gap: 4px; min-height: 48px; padding: 0 16px; border: 0; border-radius: 4px; background: var(--accent); color: #1f1300; font-size: 1rem; font-weight: 700; }
.sp-try { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; font-size: .9rem; color: var(--text-2); }
.sp-try > span { margin-right: 2px; }
@media screen and (max-width: 767px) {
  .sp-kind { min-width: 44px; font-size: max(var(--fs-min), .78rem); }
  .sp-act { font-size: 0; gap: 0; }
  .sp-ask { flex-wrap: wrap; }
  .sp-ask-b { width: 100%; justify-content: center; }
}
/* 많은 첨부 시 목록 자체 높이 제한 + 스크롤 (상세·편집 폼 공용) */
.br-files-scroll { max-height: 176px; overflow-y: auto; padding-right: 2px; }
.br-dropzone {
  border: 2px dashed var(--border); border-radius: 6px; padding: 16px 12px;
  text-align: center; color: var(--text-3); font-size: max(var(--fs-min), .84rem); cursor: pointer;
  transition: border-color .15s, background .15s, color .15s;
}
.br-dropzone:hover { border-color: var(--primary); color: var(--text-2); }
.br-dropzone.drag { border-color: var(--primary); background: var(--primary-soft); color: var(--primary); }
.br-dropzone u { text-underline-offset: 2px; }

/* ── 보안장비 협의회 회의록 ── */

/* ── 상세 모달(읽기) — 섹션 구분선·헤더 강조·표 격자선 ── */
.cn-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: max(var(--fs-min), .84rem); color: var(--text-2);
  padding: 4px 0 12px; border-bottom: 2px solid var(--border-strong); margin-bottom: 4px; }
.cn-meta b { color: var(--text); }
.cn-sec { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--border); }
.cn-sec:first-of-type { border-top: none; padding-top: 4px; }
.cn-sec-h { font-size: .9rem; font-weight: 800; color: var(--text);
  border-left: 4px solid var(--primary); padding: 1px 0 5px 9px; margin-bottom: 9px;
  border-bottom: 1px solid var(--border); }
.cn-text { font-size: .86rem; color: var(--text); white-space: pre-wrap; overflow-wrap: break-word;
  border: 1.5px solid var(--border-strong); border-left: 3px solid var(--primary);
  border-radius: 6px; padding: 9px 11px; background: var(--surface); }
/* 상세 표: 셀마다 격자선(세로 구분 뚜렷) + 진한 헤더 밑줄 */
.cn-att-tbl, .cn-act-tbl { border: 1.5px solid var(--border-strong); border-radius: 6px; overflow: hidden; }
/* 참석자 표는 고정 레이아웃 — 소속이 폭을 독점하지 않도록 소속·비고가 잔여폭 분배 */
.cn-att-tbl { table-layout: fixed; }
.cn-att-tbl td { overflow-wrap: break-word; }
.cn-att-tbl td:nth-child(2) { white-space: nowrap; }  /* 구분 badge 줄바꿈 방지 */
/* 직책은 한글 단어 중간에서 끊지 않음 — 폭을 넘는 긴 값만 마지막 수단으로 overflow-wrap */
.cn-att-tbl td.cn-a-role { word-break: keep-all; overflow-wrap: break-word; }
/* 연번 · 기한처럼 끊기면 안 되는 짧은 값 */
.tbl td.cn-nowrap { white-space: nowrap; word-break: keep-all; }
.cn-att-tbl th, .cn-act-tbl th { background: var(--surface-2); border-bottom: 2px solid var(--border-strong); }
.cn-att-tbl th, .cn-att-tbl td, .cn-act-tbl th, .cn-act-tbl td { border-right: 1px solid var(--border); font-size: max(var(--fs-min), .82rem); }
.cn-att-tbl th:last-child, .cn-att-tbl td:last-child, .cn-act-tbl th:last-child, .cn-act-tbl td:last-child { border-right: none; }
.cn-att-tbl tr:hover td, .cn-act-tbl tr:hover td { background: var(--primary-soft); }
.cn-act-done td { color: var(--text-3); text-decoration: line-through; }
.cn-act-done td:first-child { text-decoration: none; }

/* ── 편집 폼 — 필드셋 그룹 박스(테두리 구분) ── */
.cn-form .cn-fs { border: 1.5px solid var(--border-strong); border-radius: 6px;
  padding: 10px 14px 14px; margin: 0 0 16px; }
.cn-form .cn-fs > legend { font-size: max(var(--fs-min), .84rem); font-weight: 800; color: var(--primary);
  padding: 2px 9px; margin-left: 2px; background: var(--primary-soft);
  border: 1px solid var(--primary); border-radius: 6px; }
.cn-form .form-row { margin-bottom: 12px; }
.cn-form .form-row:last-child { margin-bottom: 0; }
.cn-form .form-row label { color: var(--text); }
/* 입력 테두리 진하게(연한 회색 → slate-300) — 필드 경계 뚜렷 */
.cn-form input, .cn-form select, .cn-form textarea { border-color: var(--border-strong) !important; }
.cn-form input:focus, .cn-form select:focus, .cn-form textarea:focus { border-color: var(--primary) !important; }
/* 본문 리치 에디터 — 세 필드가 쌓이므로 높이 축소 + 자리표시 + 진한 테두리 */
.cn-form .nb-rich { min-height: 76px; max-height: 34vh; border-color: var(--border-strong); }
.cn-form .nb-rich:empty::before { content: attr(data-ph); color: var(--text-3); pointer-events: none; }
.cn-form .nb-toolbar { border-color: var(--border-strong); }
.cn-text.cn-rich { white-space: normal; }  /* 리치 렌더는 pre-wrap 해제(notice-html 서식 사용) */
.cn-text.cn-rich > :first-child { margin-top: 0; }
.cn-text.cn-rich > :last-child { margin-bottom: 0; }

/* 참석자 동적행 — No·구분·소속·성명·직책·비고·삭제 */
.cn-a-no { font-size: max(var(--fs-min), .8rem); color: var(--text-3); text-align: center; font-variant-numeric: tabular-nums; }
/* 결정/액션 동적행 */
.cn-t-donebox { display: flex; align-items: center; justify-content: center; cursor: pointer;
  border: 1.5px solid var(--border-strong); border-radius: 6px; height: 100%; }
.cn-t-donebox input { width: auto; }

/* 서명 이미지(상세 참석자 표) */
.cn-sign-img { height: 26px; max-width: 92px; object-fit: contain; vertical-align: middle; }

/* 조직자용 — 참석자 서명 코드 안내 */
.cn-signcode-code { font-family: ui-monospace, "SFMono-Regular", Menlo, monospace; font-size: .95rem;
  color: var(--accent); background: #fff; border: 1px solid var(--accent); border-radius: 6px; padding: 0 7px; letter-spacing: 1px; }
.cn-signcode-copy { cursor: pointer; color: var(--accent); font-weight: 700; margin-left: 6px; white-space: nowrap; user-select: none; }
.cn-signcode-copy:hover { text-decoration: underline; }

/* 서명 화면(모바일 참석자) */
.cn-sign-page { max-width: 640px; margin: 0 auto; }
.cn-sign-head { text-align: center; padding: 6px 0 12px; border-bottom: 2px solid var(--border-strong); margin-bottom: 12px; }
.cn-sign-title { font-size: 1.15rem; font-weight: 800; color: var(--text); }
.cn-sign-meta { font-size: max(var(--fs-min), .85rem); color: var(--text-2); margin-top: 4px; }
.cn-sign-guide { text-align: center; font-size: .9rem; color: var(--text); background: var(--primary-soft);
  border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px; margin-bottom: 14px; }
.cn-sign-count { display: inline-block; margin-left: 6px; font-weight: 700; color: var(--primary); }
.cn-sign-list { display: flex; flex-direction: column; gap: 8px; }
.cn-sign-item { display: flex; align-items: center; gap: 10px; padding: 12px 14px;
  border: 1.5px solid var(--border-strong); border-radius: 6px; background: var(--surface); }
.cn-sign-item.done { border-color: var(--success); background: #f0fdf4; }
.cn-sign-who { flex: 1; min-width: 0; }
.cn-sign-who b { font-size: 1rem; }
.cn-sign-sub { display: block; font-size: max(var(--fs-min), .82rem); color: var(--text-2); margin-top: 3px; }
.cn-sign-act { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.cn-sign-act .btn { min-height: 38px; }
.cn-sign-thumb { height: 34px; max-width: 96px; object-fit: contain; border: 1px solid var(--border); border-radius: 4px; background: #fff; }
.cn-sign-ok { font-size: max(var(--fs-min), .8rem); color: var(--success); font-weight: 700; }
.cn-sign-foot { text-align: center; font-size: max(var(--fs-min), .82rem); color: var(--text-3); margin-top: 16px; }
/* 자가등록 */
.cn-sign-addbtn { display: block; width: 100%; margin-top: 10px; }

/* 서명 패드(캔버스) */
.sign-pad-wrap { display: flex; justify-content: center; margin: 4px 0 8px; }
.sign-pad { border: 2px dashed var(--border-strong); border-radius: 6px; background: #fff;
  touch-action: none; cursor: crosshair; max-width: 100%; }

@media (max-width: 768px) {
  .cn-sign-item { flex-wrap: wrap; }
  .cn-sign-act { width: 100%; justify-content: flex-end; }
}

/* ── 회의록 게시판 ── */
/* 좌측 폴더 사이드 + 우측 목록 */
.mn-wrap { display: grid; grid-template-columns: 232px minmax(0, 1fr); gap: 14px; align-items: start; }
.mn-wrap > * { min-width: 0; }
.mn-side { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 10px; position: sticky; top: calc(var(--header-h) + 12px); }
.mn-side-h { font-size: max(var(--fs-min), .8rem); font-weight: 800; color: var(--text-3); letter-spacing: .04em;
  padding: 2px 6px 8px; text-transform: none; }
.mn-fitem { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left;
  padding: 8px 9px; margin-bottom: 2px; border: 1px solid transparent; border-radius: 8px;
  background: none; cursor: pointer; font-size: max(var(--fs-min), .85rem); color: var(--text-2); font-family: inherit; }
.mn-fitem:hover { background: var(--surface-2); color: var(--text); }
.mn-fitem.active { background: var(--primary-soft); border-color: var(--primary); color: var(--primary); font-weight: 700; }
.mn-fi-ico { flex-shrink: 0; font-size: 1rem; }
.mn-fi-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mn-fi-n { flex-shrink: 0; font-size: max(var(--fs-min), .78rem); color: var(--text-3); background: var(--surface-2);
  border-radius: 6px; padding: 1px 7px; min-width: 24px; text-align: center; }
.mn-fitem.active .mn-fi-n { background: #fff; color: var(--primary); }
.mn-main { padding: 12px 14px 14px; }

/* 툴바(탭 + 검색 + 필터) */
.mn-toolbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 10px; }
.mn-tabs { display: flex; gap: 4px; }
.mn-tab { padding: 7px 12px; border: 1.5px solid var(--border); border-radius: 999px; background: var(--surface);
  color: var(--text-2); font-size: max(var(--fs-min), .82rem); font-weight: 600; cursor: pointer; font-family: inherit; white-space: nowrap; }
.mn-tab:hover { border-color: var(--border-strong); color: var(--text); }
.mn-tab.active { background: var(--primary); border-color: var(--primary); color: #fff; }
.mn-tab-n { display: inline-block; background: rgba(255,255,255,.28); border-radius: 8px; padding: 0 5px; font-size: max(var(--fs-min), .78rem); }
.mn-tab:not(.active) .mn-tab-n { background: #fef3c7; color: #b45309; }
.mn-search { position: relative; flex: 1; min-width: 210px; }
.mn-search-ico { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); font-size: max(var(--fs-min), .85rem); opacity: .6; pointer-events: none; }
.mn-search input { width: 100%; padding-left: 30px; }
.mn-toolbar select { padding: 7px 10px; border: 1.5px solid var(--border); border-radius: var(--radius-sm);
  font-size: max(var(--fs-min), .82rem); background: var(--surface); color: var(--text); }

/* 목록 */
.mn-list-tbl { table-layout: fixed; min-width: 720px; }
.mn-list-tbl td { overflow-wrap: break-word; }
.mn-fchip { display: inline-block; font-size: max(var(--fs-min), .8rem); color: var(--text-2); background: var(--surface-2);
  border: 1px solid var(--border); border-radius: 999px; padding: 2px 9px; white-space: nowrap;
  max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.mn-tags { display: flex; flex-wrap: wrap; gap: 3px; margin-top: 3px; }
.mn-tag { font-size: max(var(--fs-min), .76rem); color: var(--accent); background: #f0f9ff; border: 1px solid #bae6fd;
  border-radius: 4px; padding: 0 5px; }
.mn-carry-from { font-size: max(var(--fs-min), .76rem); color: var(--warning); margin-top: 2px; }
.mn-next { font-size: .88rem; color: var(--text); }

/* QR 서명 안내 박스 (상세) */
.mn-signbox { display: flex; gap: 14px; align-items: flex-start; margin: 12px 0 2px; padding: 12px 14px;
  border: 1px solid var(--border-strong); border-left: 4px solid var(--accent); border-radius: 6px; background: #f0f9ff; }
.mn-qr { flex-shrink: 0; width: 132px; height: 132px; background: #fff; border: 1px solid var(--border-strong);
  border-radius: 8px; padding: 5px; display: flex; align-items: center; justify-content: center; }
.mn-qr svg { width: 100%; height: 100%; display: block; }
.mn-qr-na { font-size: max(var(--fs-min), .78rem); color: var(--text-3); text-align: center; }
.mn-signbox-body { flex: 1; min-width: 0; }
.mn-signbox-h { font-size: .88rem; font-weight: 800; color: var(--accent); margin-bottom: 6px; }
.mn-signbox-steps { margin: 0; padding-left: 18px; font-size: max(var(--fs-min), .82rem); color: var(--text-2); line-height: 1.65; }
.mn-signbox-act { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 9px; }

/* 목록 — 서명 현황 배지 + QR 버튼 */
.mn-signpill { display: inline-block; margin-top: 2px; font-size: max(var(--fs-min), .76rem); font-weight: 700;
  border-radius: 999px; padding: 1px 7px; background: var(--surface-2); color: var(--text-3); border: 1px solid var(--border); }
.mn-signpill.part { background: #fffbeb; color: #b45309; border-color: #fde68a; }
.mn-signpill.ok { background: #f0fdf4; color: #15803d; border-color: #bbf7d0; }
.mn-signbtn { white-space: nowrap; border-color: var(--accent) !important; color: #8a4b06 !important; }   /* 앰버 글자는 흰 바탕 대비 4.5 이상으로 */
.mn-signbtn:hover { background: #f0f9ff !important; }
.mn-sign-stat { font-size: max(var(--fs-min), .78rem); font-weight: 700; margin-left: 8px; color: var(--warning);
  background: #fffbeb; border: 1px solid #fde68a; border-radius: 999px; padding: 1px 8px; }
.mn-sign-stat.ok { color: #15803d; background: #f0fdf4; border-color: #bbf7d0; }
.mn-att-none { font-size: max(var(--fs-min), .85rem); color: var(--text-2); background: var(--surface-2);
  border: 1px dashed var(--border-strong); border-radius: 8px; padding: 12px 14px; line-height: 1.6; }

/* 빈 게시판 — 사용법 안내 */
.mn-guide { padding: 26px 20px; text-align: center; }
.mn-guide-h { font-size: 1.05rem; font-weight: 800; color: var(--text); }
.mn-guide-sub { font-size: .88rem; color: var(--text-2); margin: 6px 0 12px; }
/* 본인 확인 기준 안내 박스 */
.mn-guide-crit { font-size: max(var(--fs-min), .84rem); color: var(--text-2); line-height: 1.7;
  background: var(--surface-2); border: 1px solid var(--border); border-radius: 6px;
  padding: 10px 14px; margin: 0 auto 18px; max-width: 560px; text-align: left; }
.mn-guide-steps { display: flex; flex-direction: column; gap: 10px; max-width: 620px; margin: 0 auto 18px; text-align: left; }
.mn-gs { display: flex; gap: 11px; align-items: flex-start; font-size: .86rem; color: var(--text-2);
  background: var(--surface-2); border: 1px solid var(--border); border-radius: 6px; padding: 11px 13px; line-height: 1.6; }
.mn-gs b { color: var(--text); }
.mn-gs-n { flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; background: var(--primary); color: #fff;
  font-size: max(var(--fs-min), .8rem); font-weight: 800; display: flex; align-items: center; justify-content: center; }

/* 서명 받기 화면 (대형 QR) */
.mn-signview h3 { margin: 0 0 2px; }
.mn-sv-sub { font-size: .86rem; color: var(--text-2); margin-bottom: 14px; }
.mn-sv-grid { display: grid; grid-template-columns: 340px 1fr; gap: 18px; align-items: start; }
.mn-sv-left { text-align: center; background: #f0f9ff; border: 1.5px solid var(--accent);
  border-radius: 6px; padding: 16px 14px; }
.mn-sv-qr { width: 300px; height: 300px; margin: 0 auto; background: #fff;
  border: 1px solid var(--border-strong); border-radius: 6px; padding: 8px; }
.mn-sv-qr svg { width: 100%; height: 100%; display: block; }
.mn-sv-codelabel { font-size: max(var(--fs-min), .78rem); color: var(--text-3); margin-top: 12px; }
.mn-sv-code { font-size: 2rem; font-weight: 800; letter-spacing: .14em; color: var(--accent); line-height: 1.2; }
.mn-sv-url { font-size: max(var(--fs-min), .76rem); color: var(--text-3); word-break: break-all; margin-top: 2px; }
.mn-sv-right { min-width: 0; }
.mn-sv-progress { border: 1.5px solid var(--border-strong); border-radius: 6px; padding: 12px 14px; margin-bottom: 12px; }
.mn-sv-progress.done { border-color: var(--success); background: #f0fdf4; }
.mn-sv-pnum { font-size: 1.9rem; font-weight: 800; color: var(--primary); }
.mn-sv-progress.done .mn-sv-pnum { color: var(--success); }
.mn-sv-pof { font-size: 1.1rem; font-weight: 700; color: var(--text-3); }
.mn-sv-plabel { font-size: max(var(--fs-min), .84rem); color: var(--text-2); margin-left: 6px; }
.mn-sv-bar { height: 7px; border-radius: 4px; background: var(--border); margin-top: 8px; overflow: hidden; }
.mn-sv-bar i { display: block; height: 100%; background: var(--primary); border-radius: 4px; transition: width .4s ease; }
.mn-sv-progress.done .mn-sv-bar i { background: var(--success); }
.mn-sv-list { display: flex; flex-direction: column; gap: 6px; max-height: 320px; overflow-y: auto; }
.mn-sv-item { display: flex; align-items: center; gap: 9px; padding: 8px 11px;
  border: 1px solid var(--border); border-radius: 8px; background: var(--surface); font-size: max(var(--fs-min), .85rem); }
.mn-sv-item.ok { border-color: #bbf7d0; background: #f0fdf4; }
.mn-sv-mark { flex-shrink: 0; }
.mn-sv-who { flex: 1; min-width: 0; }
.mn-sv-who span { display: block; font-size: max(var(--fs-min), .78rem); color: var(--text-3); }
.mn-sv-wait { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.mn-sv-empty { font-size: max(var(--fs-min), .85rem); color: var(--text-2); text-align: center; line-height: 1.7;
  border: 1px dashed var(--border-strong); border-radius: 6px; padding: 18px 14px; }
.mn-sv-hint { font-size: max(var(--fs-min), .82rem); color: var(--text-3); margin-top: 10px; line-height: 1.6; }

/* 작성 폼 헤더 — 자동 저장 / 전체화면 토글 */
.mn-formbar { float: right; display: inline-flex; align-items: center; gap: 10px;
  font-size: max(var(--fs-min), .82rem); font-weight: 400; }
.mn-autosw { display: inline-flex; align-items: center; gap: 5px; color: var(--text-2); cursor: pointer; user-select: none; }
.mn-autosw input { width: auto; margin: 0; }
.mn-autostat { color: var(--success); font-weight: 700; min-width: 108px; text-align: right; }
#mn-fullsw { white-space: nowrap; }
@media (max-width: 700px) {
  .mn-formbar { float: none; display: flex; margin-top: 8px; flex-wrap: wrap; }
  .mn-autostat { min-width: 0; text-align: left; }
}

/* 새 회의록 — 자동 채움 미리보기 */
.mn-preview { border: 1px solid var(--border-strong); border-radius: 8px; background: var(--surface-2);
  padding: 10px 12px; font-size: max(var(--fs-min), .83rem); color: var(--text-2); line-height: 1.7; margin: 4px 0 10px; }
.mn-preview-h { font-size: max(var(--fs-min), .8rem); font-weight: 800; color: var(--primary); margin-bottom: 4px; letter-spacing: .03em; }
.mn-preview b { color: var(--text); display: inline-block; min-width: 62px; }
.mn-chk { display: flex; align-items: center; gap: 8px; font-size: max(var(--fs-min), .85rem); color: var(--text-2);
  cursor: pointer; user-select: none; margin: 5px 0; }
.mn-chk input { width: auto; margin: 0; flex-shrink: 0; }
.mn-status-pick { display: flex; flex-direction: column; gap: 2px; }
.mn-legend-sub { font-weight: 400; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }

/* 폼 동적행 */
.mn-att-row { display: grid; grid-template-columns: 22px 1fr 1.4fr 1fr 1.2fr 20px 30px; gap: 6px;
  margin-bottom: 7px; align-items: center; }
.mn-att-row input { min-width: 0; }
.mn-a-sign { text-align: center; font-size: .9rem; }
.mn-att-bar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.mn-dec-row { display: grid; grid-template-columns: 30px 1fr 96px 146px 30px; gap: 6px; margin-bottom: 7px; align-items: center; }
.mn-dec-row input:not([type="checkbox"]) { min-width: 0; }
.mn-dec-row .mn-carry-from { grid-column: 2 / 5; margin-top: -3px; }
.mn-frow { display: grid; grid-template-columns: 62px 1.3fr 1.4fr 1fr 90px 96px; gap: 6px; margin-bottom: 7px; align-items: center; }
.mn-frow input, .mn-frow select { min-width: 0; }
.mn-frow-btns { display: flex; gap: 3px; }

@media (max-width: 900px) {
  .mn-wrap { grid-template-columns: minmax(0, 1fr); }
  .mn-side { position: static; display: flex; flex-wrap: wrap; gap: 4px; }
  .mn-side-h { width: 100%; }
  .mn-fitem { width: auto; flex: 0 1 auto; }
  .mn-fi-name { max-width: 130px; }
}
@media (max-width: 860px) {
  .mn-sv-grid { grid-template-columns: 1fr; }
  .mn-sv-qr { width: min(300px, 78vw); height: min(300px, 78vw); }
  .mn-sv-list { max-height: none; }
}
@media (max-width: 768px) {
  .mn-signbox { flex-direction: column; align-items: center; text-align: center; }
  .mn-signbox-steps { text-align: left; }
  .mn-att-row { grid-template-columns: 1fr 1fr; }
  .mn-att-row .cn-a-no, .mn-att-row .mn-a-sign { display: none; }
  .mn-att-row .mn-a-org, .mn-att-row .mn-a-note { grid-column: 1 / 3; }
  .mn-att-row [data-att-del] { grid-column: 2 / 3; justify-self: end; }
  .mn-dec-row { grid-template-columns: 30px 1fr 30px; }
  .mn-dec-row .mn-d-owner, .mn-dec-row .mn-d-due { grid-column: 2 / 3; }
  .mn-dec-row .mn-carry-from { grid-column: 1 / 4; }
  .mn-frow { grid-template-columns: 62px 1fr 96px; }
  .mn-frow .mn-f-desc, .mn-frow .mn-f-place, .mn-frow .mn-f-chair { grid-column: 1 / 4; }
  .mn-search { min-width: 100%; }
}

/* ── 저장소 관리 탭 ── */
.st-gauges { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 14px; }
.st-gauge { border: 1px solid var(--border-strong); border-radius: 6px; padding: 13px 15px; background: #fff; }
.st-gauge-head { display: flex; align-items: baseline; gap: 8px; font-size: .88rem; }
.st-gauge-num { font-size: max(var(--fs-min), .84rem); font-weight: 700; color: var(--text-1); }
.st-gauge-num span { font-weight: 500; color: var(--text-3); }
.st-bar { height: 9px; margin: 9px 0 6px; border-radius: 99px; background: #e2e8f0; overflow: hidden; }
.st-bar-fill { height: 100%; border-radius: 99px; transition: width .35s ease; }
.st-bar-fill.ok { background: linear-gradient(90deg, #22c55e, #16a34a); }
.st-bar-fill.warn { background: linear-gradient(90deg, #f59e0b, #d97706); }
.st-bar-fill.danger { background: linear-gradient(90deg, #ef4444, #dc2626); }
.st-gauge-foot { font-size: max(var(--fs-min), .78rem); color: var(--text-3); }
.st-tbl { font-size: max(var(--fs-min), .84rem); table-layout: fixed; }
.st-tbl th, .st-tbl td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.st-tbl tfoot th { border-top: 2px solid var(--border-strong); background: var(--primary-soft); }
.st-dim { color: var(--text-3); font-size: max(var(--fs-min), .8rem); }
.st-file { display: inline-block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; vertical-align: bottom; }
.st-loading { padding: 16px 0; font-size: max(var(--fs-min), .84rem); color: var(--text-3); }
.st-orphan-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin-bottom: 10px; font-size: max(var(--fs-min), .84rem); }
.st-chk { display: flex; align-items: center; gap: 6px; cursor: pointer; font-size: max(var(--fs-min), .82rem); }
.st-chk input, .st-tbl input[type=checkbox] { width: auto; }

/* ── 머리말 · 링 게이지 (ds-*) ── */
:root { --ds-navy-900: #0b2a33; }
.ds-head {
  position: relative; display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-bottom: 20px;
}
.ds-head .spacer { flex: 1; }

.ds-ring { position: relative; width: 134px; height: 134px; flex: none; }
.ds-ring svg { display: block; transform: rotate(-90deg); }
.ds-ring-c { position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; text-align: center; }
.ds-ring-p { font-size: 1.85rem; font-weight: 800; letter-spacing: -1.2px; line-height: 1; color: var(--ds-navy-900); }
.ds-ring-s { font-size: max(var(--fs-min), .76rem); font-weight: 700; color: var(--text-3); margin-top: 4px; }

/* ── 대시보드 — 화물 태그 카드(무재해 · 보안등급) + 다가오는 일정 + 하단 시트(공지 | 결정사항 | 구축 현황) ── */
.dash-top { display: grid; grid-template-columns: minmax(0, 560px) minmax(0, 1fr); gap: 20px; margin-bottom: 20px; align-items: stretch; }
.dash-top.guest { grid-template-columns: minmax(0, 560px) minmax(0, 1fr); }
.dash-card { background: var(--surface); border: 1px solid var(--border); border-radius: 6px; padding: 18px 22px 10px; min-width: 0; }
.dc-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 6px; }
.dc-head h2 { font-size: 1rem; font-weight: 700; letter-spacing: -.01em; }
.dc-head .spacer { flex: 1; }
.dc-meta { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.dc-meta b { color: var(--text); font-weight: 600; }

/* 화물 태그 카드 */
.ticket { position: relative; display: flex; min-height: 272px; background: var(--ticket-bg); color: #fff; border-radius: 6px; overflow: hidden; }
.tk-main { flex: 1; min-width: 0; padding: 24px 26px; display: flex; flex-direction: column; justify-content: space-between; gap: 14px; }
.tk-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.tk-label { font-size: .86rem; font-weight: 500; color: #c4d5d9; }
.tk-code { font-family: var(--mono); font-size: max(var(--fs-min), .76rem); font-weight: 600; letter-spacing: .06em; padding: 3px 8px; border-radius: 5px; background: var(--accent); color: #1f1300; }
.zero-n { font-family: var(--mono); font-size: 4.4rem; font-weight: 600; line-height: 1; letter-spacing: -.035em; white-space: nowrap; }
.ticket.no-zero .zero-n { color: #6f8a91; }
.tk-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.tk-sub { font-size: max(var(--fs-min), .82rem); color: #b3c6cb; }
.tk-btn {
  height: 30px; padding: 0 11px; border: 1px solid #2e5361; border-radius: 8px; background: transparent;
  color: #dbe8eb; font-size: max(var(--fs-min), .78rem); font-weight: 600; transition: background-color .12s ease, transform .16s var(--ease-out);
}
.tk-btn:active { transform: scale(.97); }
@media (hover: hover) and (pointer: fine) { .tk-btn:hover { background: #17404c; } }
.tk-perf {
  position: relative; width: 24px; flex: none; padding: 24px 0;
  background-image: linear-gradient(to bottom, #3a6170 60%, transparent 60%); background-size: 2px 10px;
  background-repeat: repeat-y; background-position: 11px 0; background-origin: content-box; background-clip: content-box;
}
.tk-perf::before, .tk-perf::after { content: ""; position: absolute; left: 0; width: 24px; height: 24px; border-radius: 50%; background: var(--bg); }
.tk-perf::before { top: -12px; }
.tk-perf::after { bottom: -12px; }
.tk-side { width: 212px; flex: none; padding: 24px 22px 20px 14px; display: flex; flex-direction: column; justify-content: space-between; gap: 12px; }
.tk-level-wrap { display: flex; flex-direction: column; gap: 3px; }
.tk-level { font-size: 2.6rem; font-weight: 700; line-height: 1.05; color: #9cc8ff; }
.tk-level[data-tone="ok"] { color: #86efac; }
.tk-level[data-tone="warn"] { color: #fde68a; }
.tk-level[data-tone="high"] { color: #fdba74; }
.tk-level[data-tone="crit"] { color: #fca5a5; }
.tk-next { font-size: max(var(--fs-min), .78rem); color: #fde68a; }
.lv-scale { display: flex; flex-direction: column; gap: 6px; }
.lv-bars { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; }
.lv-bars i { height: 6px; border-radius: 3px; background: #2a4852; }
.lv-bars i.on[data-tone="ok"] { background: #22c55e; }
.lv-bars i.on[data-tone="info"] { background: #5aa2ff; }
.lv-bars i.on[data-tone="warn"] { background: #eab308; }
.lv-bars i.on[data-tone="high"] { background: #f97316; }
.lv-bars i.on[data-tone="crit"] { background: #ef4444; }
.lv-names { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; text-align: center; font-size: max(var(--fs-min), .74rem); color: #8fa6ac; }
.lv-names .on { color: #fff; font-weight: 600; }
.tk-acts { display: flex; gap: 6px; flex-wrap: wrap; }
.tk-acts:empty { display: none; }

/* 다가오는 일정 */
.up-list { display: flex; flex-direction: column; }
.up-row { display: flex; align-items: flex-start; gap: 16px; padding: 12px 0; border-bottom: 1px solid #edf1f0; }
.up-row:last-child { border-bottom: none; }
.up-date { width: 54px; flex: none; display: flex; flex-direction: column; gap: 1px; }
.up-date b { font-size: .98rem; font-weight: 600; }
.up-date span { font-size: max(var(--fs-min), .78rem); color: var(--text-3); }
.up-date span.today { color: var(--primary); font-weight: 600; }
.up-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.up-title { font-size: .92rem; font-weight: 600; line-height: 1.45; }
.up-title.done { text-decoration: line-through; color: var(--text-3); }
.up-sub { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.up-dot { width: 9px; height: 9px; border-radius: 3px; margin-top: 7px; flex: none; background: var(--evf, var(--evc, var(--primary))); }

/* 하단 시트 — 한 장의 흰 면을 칸막이로 나눈다 */
.dash-sheet {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  background: var(--surface); border: 1px solid var(--border); border-radius: 6px; overflow: hidden;
}
.sheet-col { padding: 18px 22px 16px; min-width: 0; border-right: 1px solid #edf1f0; }
.sheet-col:last-child { border-right: 0; }
.dash-card .sheet-col { padding: 0; border: 0; }
.notice-list { margin-top: 4px; }
.dc-nums { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 8px 0 10px; }
.dc-nums div { display: flex; flex-direction: column; gap: 2px; }
.dc-nums span { font-size: max(var(--fs-min), .8rem); color: var(--text-2); }
.dc-nums b { font-size: 1.6rem; font-weight: 600; line-height: 1.1; }
.dc-nums .bad b { color: var(--danger); }
.act-list { display: flex; flex-direction: column; }
.act-row { display: flex; align-items: center; gap: 9px; width: 100%; padding: 8px 0; border: 0; border-top: 1px solid #edf1f0; background: none; text-align: left; font-size: max(var(--fs-min), .84rem); }
.act-t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.act-m { flex: none; max-width: 38%; font-size: max(var(--fs-min), .78rem); color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (hover: hover) and (pointer: fine) { .act-row:hover .act-t { color: var(--primary); } }
.ok-line { display: flex; align-items: center; gap: 8px; font-size: max(var(--fs-min), .84rem); color: var(--success); padding: 4px 0; }
.build-list { display: flex; flex-direction: column; gap: 2px; margin-top: 6px; }
.build-row {
  display: grid; grid-template-columns: 78px minmax(0, 1fr) 34px; align-items: center; gap: 10px;
  width: 100%; padding: 6px 4px; border: 0; border-radius: 8px; background: none; text-align: left; font-size: max(var(--fs-min), .8rem);
}
.build-row:not([data-dash-hub]) { cursor: default; }
@media (hover: hover) and (pointer: fine) { .build-row[data-dash-hub]:hover { background: var(--surface-2); } }
.br-bar { height: 6px; border-radius: 3px; background: #edf1f0; overflow: hidden; }
.br-bar i { display: block; height: 100%; border-radius: 3px; background: var(--primary); }
.br-n { font-size: max(var(--fs-min), .78rem); color: var(--text-3); text-align: right; }

/* 예정 모듈 안내 화면 */
.plan-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.plan-grid > .card { margin-bottom: 0; }
.plan-desc { font-size: .95rem; line-height: 1.75; color: var(--text); word-break: keep-all; }
.plan-note { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--border-strong); font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.plan-list { display: flex; flex-direction: column; }
.plan-row { display: flex; align-items: center; gap: 10px; width: 100%; padding: 10px 2px; border: 0; border-top: 1px solid #edf1f0; background: none; text-align: left; font-size: .86rem; }
.plan-row:first-child { border-top: 0; }
.plan-row-t { flex: 1; min-width: 0; font-weight: 500; }
@media (hover: hover) and (pointer: fine) { .plan-row:hover .plan-row-t { color: var(--primary); } }

/* 메뉴 관리 — 허브 아이콘 선택 */
.mt-ico { display: flex; width: 22px; justify-content: center; color: var(--primary); }
.ico-pick { display: flex; flex-wrap: wrap; gap: 6px; }
.ico-opt { position: relative; width: 44px; height: 44px; display: flex !important; align-items: center; justify-content: center; border: 1px solid var(--border-strong); border-radius: 6px; color: var(--text-2); cursor: pointer; margin: 0 !important; }
.ico-opt input { position: absolute; opacity: 0; pointer-events: none; }
.ico-opt:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-dark); box-shadow: 0 0 0 2px #cdebe5; }

/* 내부 프레임 */
.embed-frame { width: 100%; height: calc(100vh - var(--header-h) - 150px); min-height: 480px; border: 1px solid var(--border); border-radius: var(--radius); background: #fff; }
.vendor-hide { display: none !important; }

@media (max-width: 1180px) {
  .dash-top, .dash-top.guest { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .plan-grid { grid-template-columns: 1fr; }
}
@media (max-width: 768px) {
  .head-acts { width: 100%; }
  .head-acts .btn { flex: 1; min-width: 0; padding: 0 8px; }
  .ticket { flex-direction: column; min-height: 0; }
  .tk-main { padding: 20px 20px 16px; }
  .zero-n { font-size: 3.4rem; }
  .tk-perf {
    width: auto; height: 20px; padding: 0 22px;
    background-image: linear-gradient(to right, #3a6170 60%, transparent 60%); background-size: 10px 2px;
    background-repeat: repeat-x; background-position: 0 9px;
  }
  .tk-perf::before, .tk-perf::after { width: 20px; height: 20px; top: 0; bottom: auto; }
  .tk-perf::before { left: -10px; }
  .tk-perf::after { left: auto; right: -10px; }
  .tk-side { width: auto; padding: 12px 20px 18px; display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 4px 16px; }
  .tk-side > .tk-label { grid-column: 1 / -1; }
  .tk-level { font-size: 1.9rem; }
  .tk-acts { grid-column: 1 / -1; }
  .dash-sheet { grid-template-columns: 1fr; }
  .sheet-col { border-right: 0; border-bottom: 1px solid #edf1f0; }
  .sheet-col:last-child { border-bottom: 0; }
}

/* ── A4 인쇄 (보고용, 모든 화면 공통) — 화면 전용 요소를 빼고 .print-only 문서 머리말(시스템명 · 화면명 · 출력일시 · 출력자)을 낸다 ── */
.print-only { display: none; }
.print-bar { display: flex; justify-content: flex-end; margin-bottom: 10px; }
/* 머리말에 spacer 가 없는 화면(설정 등)에서 인쇄 버튼을 오른쪽 끝으로 */
[data-print-btn].pb-right { margin-left: auto; }

@media print {
  @page { size: A4 portrait; margin: 12mm 10mm 14mm; }
  html { font-size: 10.4pt; }
  body { background: #fff; }

  /* 화면 전용 요소 숨김 */
  .header, .sidebar, .rail, .tabbar, .cmdk, .sidebar-backdrop, .toast-wrap, #modal-overlay, .no-print, .print-bar, .tabs, .head-acts, .tk-acts, .tk-btn, .link-btn, .btn, .mt-btn, .ct-copy, .ct-mini, .cal-fsbtn, .cal-views, .hdr-search, .search-pop { display: none !important; }

  .main { margin-left: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; min-height: 0; }
  .view, .view.view-wide, .view.view-mid {
    max-width: none !important; padding: 0 !important; margin: 0 !important; animation: none;
  }

  /* 문서 머리말 */
  .print-only { display: block; }
  :is(#print-head, #pnl-print-head) { margin-bottom: 10mm; padding-bottom: 3mm; border-bottom: 2px solid var(--ds-navy-900); }
  :is(#print-head, #pnl-print-head) .ph-sys { font-size: 9pt; font-weight: 800; color: var(--ds-navy-900); letter-spacing: -.2px; }
  :is(#print-head, #pnl-print-head) .ph-sys span { font-weight: 600; color: #555; margin-left: 6px; }
  :is(#print-head, #pnl-print-head) .ph-title { font-size: 16pt; font-weight: 800; letter-spacing: -.5px; margin-top: 2mm; color: #111; }
  :is(#print-head, #pnl-print-head) .ph-meta { font-size: 8.5pt; color: #555; margin-top: 1.5mm; }

  /* 화면용 머리말은 문서 머리말(#print-head)로 대체 */
  .ds-head, .page-head { display: none !important; }

  /* 잘림 방지는 "한 페이지에 들어갈 만한" 조각에만 — 큰 카드에 걸면 통째로 다음 장으로 밀려
     첫 장이 비는 사고가 난다(달력·긴 목록에서 확인). */
  .notice-item, .ct-inc, .as-free-item, tr { break-inside: avoid; }
  .card { box-shadow: none !important; border: 1px solid #c9d4d4 !important;
    margin-bottom: 4mm; padding: 9px 11px 11px; }
  .dash-top { grid-template-columns: 1fr !important; gap: 4mm; margin-bottom: 4mm; }
  .tk-label { white-space: nowrap; }
  .ticket { min-height: 0; }
  .zero-n { font-size: 2.6rem; }
  .dash-sheet { grid-template-columns: repeat(3, 1fr) !important; }
  .dash-card, .dash-sheet, .stat-row { border-color: #c9d4d4 !important; }
  .notice-item .notice-body { display: block !important; }   /* 접힌 공지도 인쇄에는 펼쳐서 */
  /* 내부 링크 화면 — 프레임에 보이는 외부 사이트 화면을 A4 한 장에 그대로 싣는다(Chrome은 다른 도메인 프레임도 인쇄) */
  .embed-frame { display: block; width: 100%; height: 232mm; min-height: 0; border: 0; border-radius: 0; break-inside: avoid; }

  /* 일정관리(달력) — 인쇄 시 주 높이를 줄여 한 달이 한 장에 들어가도록,
     필터 칩은 현재 적용된 것만 남긴다(종이에서는 조작 불가) */
  /* 주 높이는 "일정 줄 수(maxRows)"가 요구하는 높이보다 줄이면 일정 막대가 칸 경계를 넘어
     겹쳐 인쇄되므로, 줄일 수 있는 최소선까지만 낮춘다(월 5줄 기준 ≈ 104px). */
  .cal-gridwrap.view-month { --wkmin: 104px; }
  .cal-gridwrap.view-week  { --wkmin: 210px; }
  .cal-gridwrap.view-2week { --wkmin: 176px; }
  .cal-filters .cal-fchip:not(.active) { display: none; }
  .cal-card { padding: 8px 10px 10px; }
  a { color: #111; text-decoration: none; }
  .ds-head::after { background: var(--ds-navy-900); }
  .ticket, .tk-code, .lv-bars i, .ct-hero, .sec-badge {
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }
}

/* 화면 머리말 우측 안내 문구 (일정관리 등) */
.page-note {
  font-size: max(var(--fs-min), .82rem); color: var(--text-3); font-weight: 600; white-space: nowrap;
  padding: 4px 10px; border: 1px dashed var(--border-strong); border-radius: 999px; background: var(--surface-2);
}
@media (max-width: 700px) { .page-note { display: none; } }

/* 담당자 다중 선택 칩 (일정 등록 폼) */
.team-picker { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.team-btn.sel {
  background: var(--primary); border-color: var(--primary); color: #fff;
  box-shadow: 0 2px 6px rgba(15,118,110,.25);
}
.team-btn.sel::after { content: " ✓"; font-weight: 800; }

/* 공지 본문 하단 버튼 — 본문이 pre-wrap 이라 템플릿 줄바꿈이 빈 줄로 찍히지 않도록 분리 */
.nb-acts { display: flex; gap: 6px; margin-top: 10px; white-space: normal; }

/* 담당자 관리 탭 */
.as-tbl td { vertical-align: middle; }
.as-tbl .mt-btn[disabled] { opacity: .3; cursor: default; }
.as-chip {
  display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 22px;
  padding: 0 6px; border-radius: 6px; background: var(--primary-soft); color: var(--primary-dark);
  font-size: max(var(--fs-min), .82rem); font-weight: 800;
}
.as-free { display: flex; flex-wrap: wrap; gap: 8px; }
.as-free-item {
  display: inline-flex; align-items: center; gap: 7px; padding: 5px 8px 5px 12px;
  border: 1px solid var(--border-strong); border-radius: 999px; font-size: .86rem; font-weight: 600;
}
.as-free-n { font-size: max(var(--fs-min), .78rem); color: var(--text-3); font-weight: 600; }

.hist-sel { max-width: 240px; padding: 8px 10px; font: inherit; font-size: .93rem;
  color: var(--text); background: #fff; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); }
.hist-sel:focus { border-color: var(--primary); outline: none; }
#hist-body .tbl td { vertical-align: middle; }

/* ── 암호 관리 (vault) ── */
.v-lock { display: flex; justify-content: center; padding: 26px 0 10px; }
.v-lock-card {
  width: 100%; max-width: 420px; background: var(--surface); border: 1px solid var(--border-strong);
  border-radius: 6px; padding: 30px 26px 24px; text-align: center;
  box-shadow: 0 10px 34px rgba(11, 31, 38, .08);
}
.v-lock-card.shake { animation: v-shake .34s ease; }
@keyframes v-shake {
  0%, 100% { transform: translateX(0); } 20% { transform: translateX(-7px); }
  40% { transform: translateX(6px); } 60% { transform: translateX(-4px); } 80% { transform: translateX(3px); }
}
.v-lock-ico {
  width: 62px; height: 62px; margin: 0 auto 14px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-size: 1.7rem;
  background: var(--primary-soft); border: 1px solid #bfe3dc;
}
.v-lock-title { margin: 0 0 6px; font-size: 1.14rem; font-weight: 800; letter-spacing: -.01em; }
.v-lock-note { margin: 0 0 4px; font-size: max(var(--fs-min), .85rem); color: var(--text-2); }
.v-lock-foot { margin: 18px 0 0; font-size: max(var(--fs-min), .82rem); line-height: 1.6; color: var(--text-3); }
.v-form { display: flex; flex-direction: column; gap: 10px; text-align: left; }
.v-chips { display: flex; flex-wrap: wrap; gap: 7px; justify-content: center; margin-bottom: 4px; }
.v-chip {
  display: inline-flex; align-items: center; gap: 7px; padding: 6px 13px 6px 6px;
  border: 1.5px solid var(--border-strong); background: var(--surface); border-radius: 999px;
  font-size: .89rem; font-weight: 600; color: var(--text-2); cursor: pointer;
  transition: border-color .12s, background .12s, color .12s;
}
.v-chip:hover { border-color: var(--primary); color: var(--text); }
.v-chip.sel { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-dark); }
.v-avatar {
  width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center;
  justify-content: center; background: var(--primary); color: #fff; font-size: max(var(--fs-min), .8rem); font-weight: 800;
}
.v-chip.sel .v-avatar { background: var(--primary-dark); }
.v-input {
  width: 100%; padding: 12px 14px; font: inherit; font-size: .96rem; color: var(--text);
  background: var(--surface); border: 1.5px solid var(--border-strong); border-radius: 6px;
}
.v-input:focus { border-color: var(--primary); outline: none; box-shadow: 0 0 0 3px var(--primary-soft); }
.v-pwwrap { position: relative; }
.v-pwwrap .v-input { padding-right: 46px; }
.v-eye {
  position: absolute; top: 50%; right: 6px; transform: translateY(-50%);
  background: none; border: none; font-size: 1rem; line-height: 1; padding: 7px 8px;
  border-radius: 8px; cursor: pointer; opacity: .62;
}
.v-eye:hover, .v-eye.on { opacity: 1; background: var(--bg); }
.v-caps { margin: -4px 0 0; font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--warning); }
.v-submit { padding: 12px 14px; font-size: .97rem; border-radius: 6px; }
.v-lock-card .login-error { margin: 2px 0 0; min-height: 1em; }
.vm-row { display: flex; align-items: center; gap: 8px; padding: 8px 2px; border-bottom: 1px solid var(--border); font-size: .9rem; }
.v-mask { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .08em; }
.v-sort {
  background: none; border: none; padding: 0; font: inherit; font-weight: 700; color: inherit;
  cursor: pointer; display: inline-flex; align-items: center; gap: 4px;
}
.v-sort:hover { color: var(--primary-dark); }
.v-sort.on { color: var(--primary-dark); }
.v-arw { font-size: max(var(--fs-min), .72rem); }

/* ── 규정 관리 (regulations) ── */
.reg-pdf-frame { width: 100%; height: 70vh; min-height: 320px; border: 1px solid var(--border-strong); border-radius: 6px; background: #fff; }
.reg-lang { font-size: max(var(--fs-min), .78rem); vertical-align: 2px; }
.reg-idea { border: 1px solid var(--border-strong); border-radius: 6px; padding: 11px 13px; margin-bottom: 8px; background: var(--surface); }
.reg-idea-head { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.reg-idea-loc { font-size: max(var(--fs-min), .82rem); font-weight: 700; color: var(--text-2); }
.reg-idea-body { font-size: .89rem; color: var(--text); margin-top: 6px; line-height: 1.6; overflow-wrap: break-word; }
.reg-idea-meta { font-size: max(var(--fs-min), .8rem); color: var(--text-3); margin-top: 6px; }
.reg-idea-open { display: inline-block; min-width: 15px; padding: 0 4px; margin-left: 3px; border-radius: 8px;
  background: var(--warning); color: #fff; font-size: max(var(--fs-min), .78rem); font-weight: 800; line-height: 15px; text-align: center; }
@media (max-width: 768px) { .reg-pdf-frame { height: 60vh; } }

/* 암호 관리 — 공용 / 개인용 */
.v-seg { display: inline-flex; border: 1.5px solid var(--border-strong); border-radius: 6px; overflow: hidden; }
.v-seg-opt { margin: 0; cursor: pointer; }
.v-seg-opt input { position: absolute; opacity: 0; pointer-events: none; }
.v-seg-opt span { display: inline-block; padding: 8px 18px; font-size: .92rem; font-weight: 600; color: var(--text-2); }
.v-seg-opt + .v-seg-opt span { border-left: 1.5px solid var(--border-strong); }
.v-seg-opt input:checked + span { background: var(--primary-soft); color: var(--primary-dark); }
.v-seg-opt input:focus-visible + span { outline: 2px solid var(--primary); outline-offset: -2px; }
.v-fchips { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.v-fchip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border: 1.5px solid var(--border-strong);
  background: var(--surface); border-radius: 999px; font-size: .86rem; font-weight: 600; color: var(--text-2); cursor: pointer; }
.v-fchip:hover { border-color: var(--primary); }
.v-fchip.on { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-dark); }
.v-fn { font-size: max(var(--fs-min), .8rem); font-weight: 700; color: var(--text-3); }
.v-fchip.on .v-fn { color: var(--primary-dark); }
.v-tag-personal { background: #fff7ed; color: #9a3412; font-size: max(var(--fs-min), .78rem); vertical-align: 2px; }
.v-row-personal td:first-child { box-shadow: inset 3px 0 0 #fdba74; }

/* ── 기존 모듈 검색창(.ct-search) 선 아이콘 ── */
.ct-search {
  padding-left: 38px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17' height='17' viewBox='0 0 24 24' fill='none' stroke='%235b6b71' stroke-width='1.9' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='m20 20-4.2-4.2'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: 13px 50%;
}

/* ── 일정 등록 모달 — 입력(왼쪽)과 설정(오른쪽) 분리, 설명은 ⓘ 말풍선 ── */
.modal-box:has(.evf) { max-width: 920px; padding: 0; display: flex; flex-direction: column; overflow: hidden; }
.evf { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.evf-body { display: grid; grid-template-columns: minmax(0, 1fr) 344px; gap: 0; flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
.evf-main { padding: 22px 26px 12px; min-width: 0; }
.evf-title { margin: 0 0 18px !important; font-size: 1.2rem !important; }
.evf-side { background: var(--panel-bg); border-left: 1px solid var(--border); padding: 20px 20px 16px;
  display: flex; flex-direction: column; gap: 14px; }
.evf-box .ico { color: inherit !important; }
.evf .nb-mini button { display: inline-flex; align-items: center; gap: 5px; }
.evf .modal-actions { margin: 0; padding: 14px 26px 20px; border-top: 1px solid var(--border); }
.evf-group { padding: 14px 16px 2px; margin: 4px 0 16px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-2); }
.evf-group .form-row { margin-bottom: 12px; }
.evf-inline { display: flex; gap: 10px; margin: -2px 0 12px; }
.evf-label { display: flex; align-items: center; gap: 4px; font-size: .86rem; font-weight: 700; color: var(--text-2); margin-bottom: 7px; }
.evf-side input:not([type=checkbox]), .evf-side select {
  width: 100%; padding: 9px 12px; border: 1px solid var(--border-strong); border-radius: 6px; background: var(--surface); outline: none; }
.evf-side input:not([type=checkbox]):focus, .evf-side select:focus { border-color: var(--primary); }
.evf-memo .nb-memo { min-height: 96px; }
.nb-memo:empty::before { content: attr(data-placeholder); color: var(--text-3); pointer-events: none; }

/* 체크 칩 — 네이티브 체크박스를 숨기고 선 아이콘 + 상자로 표시 (키보드 포커스 유지) */
.evf-opts { display: flex; flex-wrap: wrap; gap: 8px; }
.evf-opts-col { flex-direction: column; gap: 6px; }
.evf-opt { display: flex; align-items: center; gap: 4px; }
.evf-opt.is-disabled { opacity: .45; }
.evf-opt.is-disabled .evf-check { cursor: not-allowed; }
.evf-check { position: relative; display: inline-flex; align-items: center; gap: 8px; min-height: 34px; padding: 5px 12px 5px 9px; white-space: nowrap;
  border: 1px solid var(--border-strong); border-radius: 6px; background: var(--surface); cursor: pointer;
  font-size: .9rem; font-weight: 600; color: var(--text-2); transition: border-color .16s var(--ease-out), background-color .16s var(--ease-out), color .16s var(--ease-out); }
.evf-opts-col .evf-check { flex: 1; }
.evf-check input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.evf-box { display: inline-grid; place-items: center; width: 18px; height: 18px; border-radius: 5px; border: 1.5px solid var(--border-strong);
  background: var(--surface); color: transparent; flex: none; transition: background-color .16s var(--ease-out), border-color .16s var(--ease-out); }
.evf-check .ico { color: var(--text-3); flex: none; }
.evf-check:hover { border-color: var(--primary); }
.evf-check:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-dark); }
.evf-check:has(input:checked) .evf-box { background: var(--primary); border-color: var(--primary); color: #fff; }
.evf-check:has(input:checked) .ico { color: var(--primary); }
.evf-check:has(input:focus-visible) { outline: 2px solid var(--primary); outline-offset: 2px; }
.evf-occ { font-family: var(--mono); font-size: max(var(--fs-min), .82rem); font-weight: 500; color: var(--text-3); margin-left: 4px; }
.evf-side .rem-picker { gap: 6px; flex-wrap: nowrap; }
.evf-side .rem-opt { position: relative; }
.evf-side .rem-opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.evf-side .rem-opt span { display: inline-block; white-space: nowrap; padding: 5px 10px; border: 1px solid var(--border-strong); border-radius: 999px;
  background: var(--surface); font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--text-2); transition: background-color .16s var(--ease-out); }
.evf-side .rem-opt input:checked + span { background: var(--primary); border-color: var(--primary); color: #fff; }
.evf-side .rem-opt input:focus-visible + span { outline: 2px solid var(--primary); outline-offset: 2px; }
.evf-side .team-btn.sel::after { content: none; }
.evf .color-picker { display: grid; grid-template-columns: repeat(6, 30px); gap: 10px 12px; }
.evf .color-swatch { width: 30px; height: 30px; border-radius: 6px; border: 0; position: relative;
  transition: transform .16s var(--ease-out); }
.evf .color-swatch:hover { transform: translateY(-1px); }
.evf .color-swatch.sel { transform: none; box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--text); }
.evf .color-swatch:active { transform: scale(.94); }

/* ⓘ 설명 말풍선 */
.help-tip { display: inline-grid; place-items: center; width: 28px; height: 28px; margin: -4px 0; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: var(--text-3); cursor: help; flex: none; }
.help-tip:hover, .help-tip[aria-expanded="true"] { color: var(--primary); background: var(--primary-soft); }
.help-tipbox { position: fixed; z-index: 1600; left: 0; top: 0; max-width: 300px; padding: 10px 13px; border-radius: 6px;
  background: #0e1a1f; color: #eef4f3; font-size: max(var(--fs-min), .84rem); line-height: 1.55; box-shadow: 0 10px 28px rgba(11,31,38,.28);
  opacity: 0; visibility: hidden; transform: translateY(-3px); transition: opacity .14s var(--ease-out), transform .14s var(--ease-out), visibility 0s linear .14s; }
.help-tipbox.on { opacity: 1; visibility: visible; transform: none; transition: opacity .14s var(--ease-out), transform .14s var(--ease-out); }

@media (max-width: 860px) {
  .modal-box:has(.evf) { max-width: 560px; }
  .evf-body { grid-template-columns: 1fr; }
  .evf-side { border-left: 0; border-top: 1px solid var(--border); }
}
@media (max-width: 520px) {
  .evf-main { padding-left: 18px; padding-right: 18px; }
  .evf-side { padding: 16px 18px; }
  .evf .modal-actions { padding: 12px 18px 16px; }
  .evf .color-picker { grid-template-columns: repeat(6, 1fr); gap: 10px; }
  .evf .color-swatch { width: 100%; aspect-ratio: 1; height: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .help-tipbox, .evf-check, .evf .color-swatch { transition: none; }
}

/* ── 로그인 — 실사 사진(해 질 녘 이륙하는 화물기) ── */
.login-brand { position: relative; isolation: isolate; background: #0b1f26 url("../assets/img/login-dusk.webp") 50% 42% / cover no-repeat; }
.login-brand::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(180deg, rgba(8,24,30,.78) 0%, rgba(8,24,30,.2) 34%, rgba(8,24,30,.28) 58%, rgba(8,24,30,.9) 100%),
    linear-gradient(90deg, rgba(8,24,30,.55) 0%, rgba(8,24,30,0) 70%);
}
.lb-title { text-shadow: 0 2px 18px rgba(0,0,0,.35); }
.lb-foot { color: #b6c8cc; }
@media (max-width: 860px) {
  .login-brand { display: flex; min-height: 34vh; padding: 26px 24px 24px; gap: 14px; justify-content: space-between;
    background-image: url("../assets/img/login-dusk-sm.webp"); background-position: 50% 40%; }
  .lb-body { gap: 0; }
  .lb-title { font-size: 1.75rem; }
  .lb-tag, .lb-foot { display: none; }
  .login-mhead { display: none; }
  .login-main { padding-top: 32px; }
}

/* ── 허브 화면 머리말 = 사진 배너 ──
   #view[data-hub] 일 때 .page-head 뒤에 허브 사진 + 어두운 막(글자 대비 확보). 새로 만든 허브는 홈 사진. */
#view[data-hub] { --hero: url("../assets/img/hero-home.webp"); --hero-sm: url("../assets/img/hero-home-sm.webp"); --hero-pos: 50% 50%; }
#view[data-hub="hub-sec"] { --hero: url("../assets/img/hero-sec.webp"); --hero-sm: url("../assets/img/hero-sec-sm.webp"); --hero-pos: 50% 50%; }
#view[data-hub="hub-saf"] { --hero: url("../assets/img/hero-saf.webp"); --hero-sm: url("../assets/img/hero-saf-sm.webp"); --hero-pos: 50% 55%; }
#view[data-hub="hub-aud"] { --hero: url("../assets/img/hero-aud.webp"); --hero-sm: url("../assets/img/hero-aud-sm.webp"); --hero-pos: 50% 45%; }
#view[data-hub="hub-ops"] { --hero: url("../assets/img/hero-ops.webp"); --hero-sm: url("../assets/img/hero-ops-sm.webp"); --hero-pos: 50% 50%; }
#view[data-hub="hub-doc"] { --hero: url("../assets/img/hero-doc.webp"); --hero-sm: url("../assets/img/hero-doc-sm.webp"); --hero-pos: 50% 40%; }
#view[data-hub] .page-head {
  position: relative; isolation: isolate; overflow: hidden;
  min-height: 150px; align-items: flex-end; padding: 28px 28px 22px; border-radius: 6px;
  background: #0b1f26; color: #fff; box-shadow: 0 1px 2px rgba(14,26,31,.08);
}
#view[data-hub] .page-head::before {
  content: ""; position: absolute; inset: 0; z-index: -2;
  background: var(--hero) var(--hero-pos) / cover no-repeat;
  transform: scale(1.02); animation: hero-in .7s var(--ease-out) both;
}
#view[data-hub] .page-head::after {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(90deg, rgba(8,26,32,.93) 0%, rgba(8,26,32,.8) 34%, rgba(8,26,32,.34) 70%, rgba(8,26,32,.5) 100%),
    linear-gradient(0deg, rgba(8,26,32,.5) 0%, rgba(8,26,32,0) 60%);
}
@keyframes hero-in { from { opacity: 0; transform: scale(1.06); } to { opacity: 1; transform: scale(1.02); } }
#view[data-hub] .page-title { color: #fff; }
#view[data-hub] .page-meta { color: #bcd0d4; }
#view[data-hub] .page-desc { color: #d4e2e4; }
#view[data-hub] .page-note { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.34); color: #e7f1f2; }
#view[data-hub] .page-head .btn-ghost { background: rgba(255,255,255,.95); border-color: transparent; color: var(--text); }
#view[data-hub] .page-head .btn-soft { background: rgba(255,255,255,.95); color: var(--primary-dark); }
#view[data-hub] .page-head .btn-primary { box-shadow: 0 6px 16px rgba(0,0,0,.28); }
#view[data-hub] .page-head .badge { box-shadow: 0 0 0 1px rgba(255,255,255,.2); }
#view[data-hub] .page-head .head-link { color: rgba(255,255,255,.86); }
#view[data-hub] .page-head .head-link:hover { color: #fff; }
@media (max-width: 767px) {
  #view[data-hub] .page-head { min-height: 116px; padding: 20px 18px 16px; border-radius: 6px; }
  #view[data-hub] .page-head::before { background-image: var(--hero-sm); }
  #view[data-hub] .page-title { font-size: 1.42rem; }
}
@media print {
  #view[data-hub] .page-head::before, #view[data-hub] .page-head::after { display: none; }
}

/* ── 대시보드 히어로 — 화물 태그 카드 + 3D 장면 ── */
.dash-top, .dash-top.guest { grid-template-columns: minmax(0, 1fr); }
.tk-hero { min-height: 320px; }
.tk-hero .tk-main { position: relative; isolation: isolate; padding: 26px 30px 24px; }
.tk-stage {
  position: absolute; inset: 0 0 0 24%; z-index: -1; pointer-events: none;
  -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 24%); mask-image: linear-gradient(90deg, transparent 0%, #000 24%);
  opacity: 0; transition: opacity .9s var(--ease-out);
}
.tk-stage.h3d-on { opacity: 1; }
.tk-stage .h3d-canvas { display: block; width: 100%; height: 100%; }
.tk-stage.h3d-fallback { opacity: .9; background: url("../assets/img/dusk-wide.webp") 60% 55% / cover no-repeat; }
.tk-hero .tk-top { max-width: 260px; }
.tk-hero .zero-n { text-shadow: 0 2px 24px rgba(8,26,32,.6); }
.tk-hero .tk-side { width: 236px; background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,0)); }
/* 하단 시트 칸 수는 시트 자신의 폭(container query)으로 정한다 */
/* 쿼리 대상은 자손만 가능하므로 바깥 wrap을 컨테이너로 둔다 */
.dash-sheet-wrap { container-type: inline-size; }
.dash-sheet { gap: 1px; background: #e6ecea; grid-template-columns: 1fr; }
.dash-sheet .sheet-col { background: var(--surface); border: 0 !important; }
@container (min-width: 620px) {
  .dash-sheet.cols-2, .dash-sheet.cols-3, .dash-sheet.cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dash-sheet.cols-3 .sheet-col:last-child { grid-column: 1 / -1; }
}
@container (min-width: 1040px) {
  .dash-sheet.cols-3 { grid-template-columns: 1.3fr 1fr 1fr; }
  .dash-sheet.cols-3 .sheet-col:last-child { grid-column: auto; }
  .dash-sheet.cols-4 { grid-template-columns: 1.35fr 1fr 1fr 1fr; }
}
.dc-head { flex-wrap: wrap; row-gap: 2px; }
.dc-head h2, .dc-head .dc-meta, .dc-head .link-btn { white-space: nowrap; }
@media (max-width: 768px) {
  .tk-hero { min-height: 0; }
  .tk-hero .tk-main { padding: 20px 20px 16px; }
  .tk-hero .tk-top { max-width: none; order: 0; }
  .tk-hero .zero-n { order: 1; }
  .tk-stage { position: relative; inset: auto; order: 2; height: 190px; margin: -4px -20px 0; z-index: 0;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 84%, transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 84%, transparent 100%); }
  .tk-hero .tk-foot { order: 3; }
  .tk-hero .tk-side { width: auto; }
}
@media print {
  .tk-stage { display: none !important; }
  .dash-sheet.cols-4, .dash-sheet.cols-3 { grid-template-columns: repeat(2, 1fr) !important; background: #c9d4d4 !important; }
}
@media (prefers-reduced-motion: reduce) {
  #view[data-hub] .page-head::before { animation: none; }
  .tk-stage { transition: none; }
}
@media (min-width: 861px) {
  .login-brand { justify-content: flex-start; }
  .lb-body { flex: 1; justify-content: space-between; padding-top: 34px; }
}
@media (min-width: 769px) and (max-width: 1180px) { .tk-stage { inset: 0 0 0 34%; } }

/* 완료 버튼은 하단 버튼줄(항상 보임) */
.evf-foot { flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.evf-foot .spacer { flex: 1; }
.evf-done { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.evf-done select { height: 34px; padding: 0 30px 0 10px; border: 1px solid var(--border-strong); border-radius: 6px; background-color: var(--surface); font-size: .86rem; }
@media (max-width: 520px) {
  .evf-foot .spacer { display: none; }
  .evf-foot #f-cancel { margin-left: auto; }
  .evf-side .rem-picker { flex-wrap: wrap; }
}
/* 어절 단위 줄바꿈으로 긴 제목 + 당직실 번호가 넘치면 번호를 다음 줄로 */
.ct-sec .card-title { flex-wrap: wrap; row-gap: 6px; }

/* ── 비상연락망 — 보고 체계도(사고 유형별 탭 · 전체 화면 뷰어) ── */
.ct-flow { padding: 18px 22px 20px; }
.ct-fhead { display: flex; align-items: center; gap: 10px 16px; flex-wrap: wrap; }
.ct-fhead .card-title { margin: 0; }
.ct-ftabs { display: inline-flex; gap: 2px; padding: 3px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-2); }
.ct-ftab { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 16px; border: 0; border-radius: 6px;
  background: transparent; color: var(--text-2); font-size: .88rem; font-weight: 600; white-space: nowrap;
  transition: background-color .15s ease, color .15s ease; }
.ct-ftab[aria-selected="true"] { background: var(--primary); color: #fff; }
@media (hover: hover) and (pointer: fine) { .ct-ftab[aria-selected="false"]:hover { background: var(--primary-soft); color: var(--primary-dark); } }
.ct-fcount { min-width: 20px; padding: 0 6px; border-radius: 6px; background: rgba(15,118,110,.12); font-size: max(var(--fs-min), .78rem); line-height: 1.55; text-align: center; }
.ct-ftab[aria-selected="true"] .ct-fcount { background: rgba(255,255,255,.22); }
.ct-fpanel { margin-top: 16px; }
.ct-fgrid { display: grid; grid-template-columns: 208px minmax(0, 1fr); gap: 22px; align-items: start; }
.ct-fgrid.no-doc { grid-template-columns: minmax(0, 1fr); }
.ct-fthumb { position: sticky; top: 72px; display: block; padding: 0; border: 1px solid var(--border-strong); border-radius: 6px;
  overflow: hidden; background: #fff; cursor: zoom-in; text-align: left; transition: border-color .15s ease, box-shadow .15s ease; }
.ct-fthumb img { display: block; width: 100%; height: auto; aspect-ratio: 640 / 906; }
.ct-fthumb-pdf { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; aspect-ratio: 640 / 906;
  color: var(--text-3); font-weight: 700; font-size: max(var(--fs-min), .84rem); }
.ct-fzoom { position: absolute; left: 8px; bottom: 8px; display: inline-flex; align-items: center; gap: 5px; padding: 4px 11px 4px 9px;
  border-radius: 999px; background: rgba(11,31,38,.84); color: #fff; font-size: max(var(--fs-min), .82rem); font-weight: 600; }
@media (hover: hover) and (pointer: fine) { .ct-fthumb:hover { border-color: var(--primary); box-shadow: var(--shadow-md); } }
.ct-fmeta { display: flex; align-items: center; gap: 8px 10px; flex-wrap: wrap; margin-bottom: 10px; }
.ct-fmeta .spacer { flex: 1; }
.ct-ftitle { font-size: 1.06rem; font-weight: 700; letter-spacing: -.01em; }
.ct-fver { font-size: max(var(--fs-min), .8rem); color: var(--text-3); border: 1px solid var(--border); border-radius: 6px; padding: 0 7px; }
.ct-fsteps { list-style: none; display: flex; flex-wrap: wrap; align-items: center; row-gap: 4px; margin: 0 0 14px; padding: 9px 13px;
  border-radius: 6px; background: var(--surface-2); border: 1px solid var(--border); font-size: max(var(--fs-min), .84rem); font-weight: 600; }
.ct-fsteps li + li::before { content: "→"; margin: 0 9px; color: var(--primary); font-weight: 700; }
.ct-fsteps li:last-child { color: var(--primary-dark); }
.ct-fgroups { columns: 2 300px; column-gap: 26px; }
.ct-fgrp { break-inside: avoid; margin-bottom: 14px; }
.ct-fgrp-t { font-size: max(var(--fs-min), .8rem); font-weight: 700; color: var(--primary-dark); padding-bottom: 4px; border-bottom: 2px solid var(--primary-soft); }
.ct-frow .ct-who { min-width: 140px; flex-basis: 140px; }
.ct-fmemo { margin: 4px 0 0; }
@media (max-width: 760px) {
  .ct-flow { padding: 16px 14px 16px; }
  .ct-ftabs { display: flex; width: 100%; }
  .ct-ftab { flex: 1 1 0; justify-content: center; padding: 0 8px; }
  .ct-fgrid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .ct-fthumb { position: static; display: grid; grid-template-columns: 64px 1fr; align-items: center; gap: 12px; padding: 8px 10px; }
  .ct-fthumb img, .ct-fthumb-pdf { width: 64px; border: 1px solid var(--border); border-radius: 6px; }
  .ct-fzoom { position: static; justify-self: start; background: var(--primary-soft); color: var(--primary-dark); font-size: max(var(--fs-min), .84rem); }
  .ct-fgroups { columns: 1; }
}

/* 체계도 뷰어 — 전체 화면 <dialog> */
.ct-viewer { width: 100vw; height: 100vh; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0;
  background: #0b1f26; color: #fff; }
.ct-viewer[open] { display: flex; flex-direction: column; animation: rise .18s var(--ease-out); }
.ct-viewer::backdrop { background: rgba(6,16,20,.72); }
.ct-viewer [hidden] { display: none !important; }
.ctv-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; padding: 10px 14px; padding-top: max(10px, env(safe-area-inset-top));
  border-bottom: 1px solid rgba(255,255,255,.1); }
.ctv-t { flex: 1 1 240px; min-width: 0; display: flex; align-items: baseline; gap: 10px; }
.ctv-t b { font-size: 1rem; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ctv-ver { font-size: max(var(--fs-min), .82rem); color: var(--rail-text); white-space: nowrap; }
.ctv-acts { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ctv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; padding: 0 12px;
  border: 1px solid rgba(255,255,255,.18); border-radius: 6px; background: rgba(255,255,255,.06); color: #fff;
  font-size: max(var(--fs-min), .84rem); font-weight: 600; white-space: nowrap; transition: background-color .12s ease; }
.ctv-btn:hover { background: rgba(255,255,255,.14); color: #fff; }
.ctv-btn[aria-pressed="true"] { background: #fff; color: var(--sidebar-bg); }
.ctv-ico { width: 38px; padding: 0; }
.ctv-prev .ico { transform: scaleX(-1); }
.ctv-pos { min-width: 44px; text-align: center; font-size: max(var(--fs-min), .8rem); color: var(--rail-text); }
.ctv-stage { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; display: grid;
  grid-template-rows: minmax(0, 1fr); grid-template-columns: minmax(0, 1fr); place-items: center; padding: 14px; }
.ctv-img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; background: #fff; border-radius: 4px;
  box-shadow: 0 12px 40px rgba(0,0,0,.45); cursor: zoom-in; }
.ctv-stage.zoomed { display: block; cursor: zoom-out; }
.ctv-stage.zoomed .ctv-img { max-width: none; max-height: none; height: auto; margin: 0 auto; cursor: zoom-out; }
.ctv-frame { width: 100%; height: 100%; border: 0; border-radius: 6px; background: #fff; }
html.ct-viewing { overflow: hidden; }
@media (max-width: 560px) {
  .ctv-bar { padding: 8px 10px; padding-top: max(8px, env(safe-area-inset-top)); }
  .ctv-t { flex-basis: 100%; }
  .ctv-acts { width: 100%; }
  .ctv-close { margin-left: auto; }
  .ctv-stage { padding: 8px; }
}

/* 체계도 추가 · 편집 모달 — 본문만 스크롤, 저장·취소는 하단 고정 */
.modal-box:has(.cfe) { padding: 0; display: flex; flex-direction: column; overflow: hidden; }
.cfe { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.cfe-body { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 24px 26px 8px; }
.cfe .modal-actions { margin: 0; padding: 14px 26px 18px; border-top: 1px solid var(--border); }
.cfe-grid3 { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 0 14px; }
.cfe-label { display: flex !important; align-items: center; gap: 4px; }
.cfe-sec { margin-bottom: 16px; }
.cfe-sec-t { display: flex; align-items: center; gap: 4px; font-size: .86rem; font-weight: 700; color: var(--text-2); margin-bottom: 7px; }
.cfe-files { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
.cfe-file { display: flex; align-items: center; gap: 9px; padding: 6px 10px; border: 1px solid var(--border); border-radius: 6px;
  background: var(--surface-2); font-size: max(var(--fs-min), .84rem); }
.cfe-file a { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cfe-file img { border: 1px solid var(--border); border-radius: 4px; object-fit: cover; background: #fff; }
.cfe-none { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.cfe-upbtns { display: flex; gap: 8px; flex-wrap: wrap; }
.cfe-upbtns .btn { cursor: pointer; }
.cfe .ct-editlist { max-height: none; overflow: visible; padding-right: 0; }
.ct-ef-md { flex: 0 0 112px; }
@media (max-width: 640px) {
  .cfe-grid3 { grid-template-columns: 1fr 1fr; }
  .cfe-grid3 .form-row:first-child { grid-column: 1 / -1; }
  .cfe-body { padding: 20px 18px 8px; }
  .cfe .modal-actions { padding: 12px 18px 16px; }
}

@media print {
  .ct-ftabs, .ct-fthumb, #ct-viewer, .ct-searchwrap { display: none !important; }
  .ct-fpanel[hidden] { display: block !important; }
  .ct-fpanel { margin-top: 3mm; }
  .ct-fpanel + .ct-fpanel { margin-top: 5mm; padding-top: 4mm; border-top: 1px solid #c9d4d4; }
  .ct-fgrid { display: block; }
  .ct-fgroups { columns: 2; }
  .ct-fsteps { background: none !important; }
  .ct-fmemo { display: none; }
}

/* ── 보고 체계도 — 개정 PDF 비교(반자동 반영) ── */
.cfe-review { margin-top: 12px; padding: 12px 14px; border: 1px solid var(--border-strong); border-radius: 6px; background: var(--surface); }
.cfe-rv-head { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; margin-bottom: 8px; font-size: .9rem; }
.cfe-rv-sum { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.cfe-rv-note { font-size: max(var(--fs-min), .84rem); color: var(--text-2); }
.cfe-rv-wait { display: flex; align-items: center; gap: 8px; font-size: .86rem; color: var(--text-2); }
.cfe-spin { width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--primary-soft); border-top-color: var(--primary); animation: cfe-spin .8s linear infinite; }
@keyframes cfe-spin { to { transform: rotate(360deg); } }
.cfe-rv-done { display: flex; align-items: center; gap: 8px; font-size: .86rem; font-weight: 600; color: var(--success); }
.cfe-rv-list { list-style: none; display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; max-height: 300px; overflow-y: auto; }
.cfe-rv-list li { padding: 7px 10px; border-radius: 6px; background: var(--surface-2); border-left: 4px solid var(--border-strong); font-size: .86rem; }
.cfe-rv-list li.rv-chg { border-left-color: var(--accent); }
.cfe-rv-list li.rv-add { border-left-color: var(--primary); }
.cfe-rv-list li.rv-miss { border-left-color: var(--danger); }
.cfe-rv-list li.rv-ver { border-left-color: var(--info); }
.rv-main { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 7px; cursor: pointer; }
.rv-main input { width: 17px; height: 17px; accent-color: var(--primary); flex: none; }
.rv-tag { font-size: max(var(--fs-min), .78rem); font-weight: 700; color: var(--text-2); background: var(--surface); border: 1px solid var(--border); border-radius: 6px; padding: 0 6px; }
.rv-f { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.cfe-rv-list s { color: var(--text-3); }
.rv-fields { display: flex; gap: 6px; margin: 6px 0 0 24px; flex-wrap: wrap; }
.rv-fields input { flex: 1 1 160px; min-width: 0; padding: 5px 8px; border: 1px solid var(--border); border-radius: 8px; font-size: max(var(--fs-min), .84rem); background: var(--surface); }
.rv-fields input[data-rv-grp] { flex: 0 1 120px; }
.cfe-rv-acts { display: flex; justify-content: flex-end; margin-top: 10px; }
.ct-editrow-hit { border-color: var(--accent); background: var(--accent-soft); box-shadow: inset 4px 0 0 var(--accent); }
@media (max-width: 640px) { .rv-fields { margin-left: 0; } }

/* ── 화물 보안 — 보안검색 현황 · 검색장비 유지관리 · 대시보드 요약 띠 (CARES 연동) ── */
.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; }
.st-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; flex: none; background: var(--success); }
.st-dot[data-state="warn"] { background: var(--accent); }
.st-dot[data-state="bad"] { background: var(--danger); box-shadow: 0 0 0 3px rgba(180,35,24,.16); }
.st-dot[data-state="off"] { background: #9aa6aa; }
.scr-meta { font-size: max(var(--fs-min), .8rem); color: var(--text-3); white-space: nowrap; }
#view[data-hub] .scr-meta { color: #d4e2e4; }
.btn.is-busy .ico { animation: cfe-spin .8s linear infinite; }
.scr-wait { display: flex; align-items: center; gap: 10px; padding: 36px 8px; font-size: .9rem; color: var(--text-2); }
.nowrap { white-space: nowrap; }
.cell-sub { font-size: max(var(--fs-min), .82rem); color: var(--text-3); margin-top: 1px; }
.pre { white-space: pre-line; }

.scr-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 18px; align-items: start; }
@media (max-width: 1099px) { .scr-grid { grid-template-columns: minmax(0, 1fr); } }

/* 검색 라인 배치 — 검색대(X-ray)마다 한 열: X-ray → 옆에 둔 ETD, 끝 열은 환적·예비 구역 */
.scr-lanes { container-type: inline-size; }
.lane-board { display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); gap: 12px; }
@container (max-width: 1000px) {
  .lane-board { grid-template-columns: repeat(var(--lanes, 3), minmax(0, 1fr)); }
  .lane-board .lane-zone { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
}
@container (max-width: 620px) { .lane-board { grid-template-columns: minmax(0, 1fr); } .lane-board .lane-zone { grid-template-columns: minmax(0, 1fr); } }
.lane { display: flex; flex-direction: column; gap: 0; min-width: 0; padding: 12px; border-radius: 6px; background: var(--surface-2); border: 1px solid #e6ecea; }
.lane[data-state="bad"] { background: #fdf4f3; border-color: #f1c9c4; }
.lane-h { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-2); }
.lane-h .mono { font-weight: 500; color: var(--text-3); }
.lane-no { width: 26px; height: 26px; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center;
  background: var(--sidebar-bg); color: #fff !important; font-size: .86rem; font-weight: 600 !important; }
.lane[data-state="bad"] .lane-no { background: var(--danger); }
.lane-link { align-self: center; width: 2px; height: 16px; margin: 3px 0; background-image: linear-gradient(180deg, var(--border-strong) 55%, transparent 55%); background-size: 2px 6px; }
.lane > .unit-tile + .unit-tile, .zone > .unit-tile + .unit-tile { margin-top: 8px; }
.lane-none { font-size: max(var(--fs-min), .8rem); color: var(--text-3); padding: 10px 2px; text-align: center; }
.lane-zone { background: transparent; border-style: dashed; border-color: var(--border-strong); gap: 14px; }
.zone .lane-h { margin-bottom: 8px; }
.unit-tile { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 10px; width: 100%;
  padding: 10px 12px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); text-align: left;
  transition: border-color .15s ease, box-shadow .15s ease, transform .16s var(--ease-out); }
.unit-tile:active { transform: scale(.985); }
@media (hover: hover) and (pointer: fine) { .unit-tile:hover { border-color: var(--primary); box-shadow: 0 2px 10px rgba(14,26,31,.07); } }
.unit-tile[data-state="bad"] { border-color: #e9a8a1; }
.unit-tile[data-state="warn"] { border-color: #f3cf8a; }
.ut-ico { width: 34px; height: 34px; border-radius: 6px; display: flex; align-items: center; justify-content: center; background: var(--primary-soft); color: var(--primary-dark); }
.unit-tile[data-kind="etd"] .ut-ico { background: #eef2f1; color: var(--text-2); }
.unit-tile[data-state="bad"] .ut-ico { background: var(--danger-soft); color: var(--danger); }
.ut-body { display: flex; flex-direction: column; min-width: 0; }
.ut-name { display: flex; align-items: center; gap: 7px; min-width: 0; }
.ut-name b { font-size: .9rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ut-sub { font-size: max(var(--fs-min), .76rem); color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ut-foot { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; margin-top: 5px; }
.ut-ins { display: inline-flex; align-items: center; gap: 4px; font-size: max(var(--fs-min), .78rem); color: var(--text-3); white-space: nowrap; }
.ut-ins b { font-weight: 600; }
.ut-ins.done { color: var(--success); }

/* 일일점검 이행 — 장비 × 날짜 칸 */
.heat-legend { display: inline-flex; gap: 12px; font-size: max(var(--fs-min), .8rem); font-weight: 500; color: var(--text-2); }
.heat-legend span { display: inline-flex; align-items: center; gap: 5px; }
.heat-legend .hc { width: 11px; height: 11px; }
.scr-heat { container-type: inline-size; }
.scr-heat .card-title { flex-wrap: wrap; row-gap: 6px; }
.hl-short { display: none; }
.heat { display: flex; flex-direction: column; gap: 5px; --hc-n: 28; }
.heat-row { display: grid; grid-template-columns: 124px minmax(0, 1fr) 46px 46px 46px; align-items: center; gap: 10px; }
.heat-lb { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.heat-lb b { font-size: max(var(--fs-min), .84rem); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.heat-lb small { font-size: max(var(--fs-min), .74rem); color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.heat-cells { display: grid; grid-template-columns: repeat(var(--hc-n), minmax(0, 1fr)); gap: 3px; }
.hc { display: block; height: 20px; border-radius: 4px; background: #e6ecea; }
.hc[data-st="done"] { background: var(--primary); }
.hc[data-st="done"][data-bad] { background: var(--primary); box-shadow: inset 0 -5px 0 var(--danger); }
.hc[data-st="down"] { background: #d4584c; }
.hc[data-st="wait"] { background: transparent; box-shadow: inset 0 0 0 1.5px var(--border-strong); }
.heat-head { margin-bottom: 1px; }
.hc-h { font-size: max(var(--fs-min), .74rem); color: var(--text-3); text-align: center; white-space: nowrap; line-height: 1; font-family: var(--mono); }
.hc-h.we { color: #8a9a9f; }
.hc-h.today { color: var(--primary); font-weight: 700; font-family: var(--font); }
.hc-h.hc-mid { font-size: 0; }                              /* 28일 표에서는 월.일 대신 */
.hc-h.hc-mid[data-d]::after { content: attr(data-d); font-size: max(var(--fs-min), .74rem); }  /* 월요일이면 날짜만 */
.heat-rate, .heat-last { font-size: max(var(--fs-min), .8rem); color: var(--text-2); text-align: right; white-space: nowrap; }
.heat-head .heat-rate, .heat-head .heat-last { font-size: max(var(--fs-min), .74rem); color: var(--text-3); font-family: var(--font); }
.heat-rate.low { color: var(--warning); font-weight: 600; }
.heat-last.late { color: var(--warning); font-weight: 600; }
@container (max-width: 700px) {
  .hl-long { display: none; } .hl-short { display: inline; }
  .heat-legend { width: 100%; order: 5; }
  .heat { --hc-n: 14; }
  .hc-h.hc-mid { font-size: max(var(--fs-min), .74rem); }
  .hc-h.wk { font-size: 0; }
  .hc-h.hc-mid[data-d]::after { content: none; }
  .heat-cells > :nth-child(-n+14) { display: none; }
  .heat-row { grid-template-columns: 92px minmax(0, 1fr) 40px; gap: 8px; }
  .heat-last { display: none; }
}

/* 검색 환경 표 */
.env-tbl { font-size: .86rem; }
.env-tbl th, .env-tbl td { padding: 8px 10px; }
.env-tbl thead th { vertical-align: bottom; white-space: normal; }
.env-tbl thead small { display: block; font-size: max(var(--fs-min), .76rem); font-weight: 500; color: var(--text-3); font-family: var(--mono); }
.env-h { display: inline-flex; align-items: center; gap: 6px; color: var(--text); font-weight: 600; }
.env-tbl tbody th { font-weight: 500; color: var(--text-2); background: none; border-bottom: 1px solid #edf1f0; white-space: nowrap; }
.env-tbl tbody th small { margin-left: 4px; font-size: max(var(--fs-min), .76rem); color: var(--text-3); }
.env-tbl td { text-align: right; }
.env-tbl td.over { color: var(--danger); font-weight: 700; background: #fdf1ef; }
.env-tbl tr:hover td.over { background: #fbe4e0; }
.env-off { color: var(--text-3); text-align: center !important; }
.env-cond { margin-top: 12px; padding: 10px 12px 11px; border-radius: 6px; background: var(--surface-2); font-size: max(var(--fs-min), .82rem); color: var(--text-2); }
.ec-top { display: flex; align-items: center; gap: 8px; }
.ec-top .spacer { flex: 1; }
.env-cond b { color: var(--text); font-weight: 600; font-size: max(var(--fs-min), .84rem); }
.env-cond p { margin-top: 4px; }
.env-cond[data-level="danger"] { background: var(--danger-soft); }
.env-cond[data-level="watch"] { background: var(--accent-soft); }

/* 고장 목록 (현황 · 상세 공용) */
.flt-list { display: flex; flex-direction: column; }
.flt-row { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; align-items: center; gap: 12px; width: 100%;
  padding: 10px 4px; border: 0; border-top: 1px solid #edf1f0; background: none; text-align: left; border-radius: 0; }
.flt-list .flt-row:first-child { border-top: 0; }
@media (hover: hover) and (pointer: fine) { .flt-row:hover { background: var(--surface-2); } }
.flt-d { font-size: max(var(--fs-min), .82rem); color: var(--text-2); }
.flt-b { display: flex; flex-direction: column; min-width: 0; }
.flt-b b { font-size: .86rem; font-weight: 600; }
.flt-s { font-size: max(var(--fs-min), .82rem); color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.flt-m { display: flex; align-items: center; justify-content: flex-end; gap: 5px; flex-wrap: wrap; max-width: 220px; }
.flt-m small { font-size: max(var(--fs-min), .76rem); color: var(--text-3); white-space: nowrap; }

/* 대시보드 — 화물 보안검색 요약 띠 */
.dash-scr { margin-bottom: 20px; }
.dash-scr > .dc-head { padding: 0 4px; margin-bottom: 10px; }
.dash-scr > .dc-head .link-btn { margin-left: 4px; }
#dscr-body { container-type: inline-size; }
.dscr-cells { display: grid; grid-template-columns: 1fr; gap: 1px; background: #e6ecea; border: 1px solid var(--border); border-radius: 6px; overflow: hidden; }
@container (min-width: 620px) { .dscr-cells { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container (min-width: 1040px) { .dscr-cells { grid-template-columns: 1.2fr 1fr 1fr 1.1fr; } }
.dscr-cell { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 16px 20px 15px; border: 0; background: var(--surface); text-align: left; }
button.dscr-cell { transition: background-color .15s ease; }
@media (hover: hover) and (pointer: fine) { button.dscr-cell:hover { background: #fbfcfc; } }
.dscr-h { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; font-size: max(var(--fs-min), .84rem); font-weight: 600; color: var(--text-2); }
.dscr-hm { font-size: max(var(--fs-min), .76rem); font-weight: 500; color: var(--text-3); }
.dscr-n { font-size: 1rem; color: var(--text-3); line-height: 1; }
.dscr-n b { font-size: 1.9rem; font-weight: 600; color: var(--text); letter-spacing: -.02em; }
.dscr-sub { font-size: max(var(--fs-min), .8rem); color: var(--text-3); margin-top: auto; }
.dscr-sub b.bad { color: var(--danger); font-weight: 600; }
.dscr-sub b.warn { color: var(--warning); font-weight: 600; }
.dscr-err { display: flex; align-items: center; gap: 10px; padding: 18px 20px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); font-size: .86rem; color: var(--text-2); }
.dscr-cells.is-wait .dscr-cell { min-height: 132px; }
.sk { display: block; height: 14px; width: 42%; border-radius: 6px; background: linear-gradient(90deg, #edf1f0 0%, #f6f8f7 50%, #edf1f0 100%); background-size: 200% 100%; animation: sk 1.4s ease infinite; }
.sk-2 { height: 44px; width: 78%; }
@keyframes sk { from { background-position: 100% 0; } to { background-position: -100% 0; } }
/* 미니 라인 배치 */
.ml { display: flex; flex-direction: column; gap: 6px; }
.ml-row { display: flex; align-items: center; gap: 6px; }
.ml-x, .ml-e { display: inline-flex; align-items: center; justify-content: center; height: 24px; min-width: 34px; padding: 0 7px; border-radius: 7px;
  font-family: var(--mono); font-size: max(var(--fs-min), .78rem); font-weight: 600; }
.ml-x { background: var(--sidebar-bg); color: #fff; }
.ml-e { background: var(--primary-soft); color: var(--primary-dark); }
.ml-x[data-state="bad"], .ml-e[data-state="bad"] { background: var(--danger); color: #fff; }
.ml-x[data-state="warn"], .ml-e[data-state="warn"] { background: var(--accent); color: #1f1300; }
.ml-link { width: 22px; height: 2px; background-image: linear-gradient(90deg, var(--border-strong) 55%, transparent 55%); background-size: 6px 2px; }
.ml-none { font-size: max(var(--fs-min), .78rem); color: var(--text-3); }
.ml-rest { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 6px; margin-top: 2px; font-size: max(var(--fs-min), .76rem); color: var(--text-3); }
.ml-rest small { margin-right: 6px; font-size: max(var(--fs-min), .76rem); }
/* 오늘 점검 칸 */
.ins-dots { display: flex; flex-wrap: wrap; gap: 4px; }
.ins-dot { display: inline-flex; align-items: center; justify-content: center; min-width: 30px; height: 22px; padding: 0 5px; border-radius: 6px;
  font-family: var(--mono); font-size: max(var(--fs-min), .74rem); font-weight: 600; color: var(--text-3); box-shadow: inset 0 0 0 1.5px var(--border-strong); }
.ins-dot.on { background: var(--primary); color: #fff; box-shadow: none; }
/* 월별 고장 막대 */
.mb { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; align-items: end; height: 76px; }
.mb-c { display: flex; flex-direction: column; align-items: center; gap: 3px; height: 100%; min-width: 0; }
.mb-v { font-size: max(var(--fs-min), .76rem); color: var(--text-2); min-height: 1em; line-height: 1; }
.mb-bar { flex: 1; width: 100%; max-width: 22px; display: flex; align-items: flex-end; border-bottom: 1px solid var(--border-strong); }
.mb-bar i { display: block; width: 100%; border-radius: 4px 4px 0 0; background: var(--primary); min-height: 0; }
.mb-l { font-size: max(var(--fs-min), .74rem); color: var(--text-3); white-space: nowrap; }

/* 검색장비 유지관리 */
.eq-tabs { display: inline-flex; gap: 2px; padding: 3px; margin-bottom: 18px; border: 1px solid var(--tag-line); border-radius: 6px; background: var(--tag); }
.eq-tab { min-height: 38px; padding: 0 18px; border: 0; border-radius: 6px; background: transparent; color: var(--text-2); font-size: .88rem; font-weight: 600; white-space: nowrap;
  transition: background-color .15s ease, color .15s ease; }
.eq-tab[aria-selected="true"] { background: var(--tag-ink); color: #fff; }
@media (hover: hover) and (pointer: fine) { .eq-tab[aria-selected="false"]:hover { background: rgba(255,255,255,.7); color: var(--text); } }
.seg { display: inline-flex; flex-wrap: wrap; gap: 2px; padding: 3px; border: 1px solid var(--tag-line); border-radius: 6px; background: var(--tag); }
.seg-btn { min-height: 32px; padding: 0 11px; border: 0; border-radius: 8px; background: transparent; color: var(--text-2); font-size: max(var(--fs-min), .8rem); font-weight: 600; white-space: nowrap; }
.seg-btn[aria-pressed="true"] { background: var(--surface); color: var(--text); box-shadow: inset 0 0 0 1px var(--tag-line), 0 1px 2px rgba(43,37,22,.1); }
@media (hover: hover) and (pointer: fine) { .seg-btn[aria-pressed="false"]:hover { color: var(--text); } }
.toolbar .search-field { flex: 0 1 300px; }
.eq-tbl tbody tr[data-eq], .eq-tbl tbody tr[data-cares-only], .rp-tbl tbody tr[data-repair-row] { cursor: pointer; }
.eq-tbl tr.is-disposed td { color: var(--text-3); }
.eq-tbl tr.is-disposed .tbl-open { color: var(--text-3); text-decoration: line-through; }
.eq-custom { font-family: inherit; font-weight: 600; color: #8a4b06; }
.cell-sn { font-size: max(var(--fs-min), .82rem); color: var(--text-2); white-space: nowrap; }
.cell-n { font-size: .86rem; color: var(--text); }
.m-only { display: none; }
@media (max-width: 767px) { .m-only { display: inline; } }
.rp-sym span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; max-width: 460px; font-size: .88rem; }
.eqd-title { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.eqd-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 22px; margin: 0; }
.eqd-grid.one { grid-template-columns: 1fr; }
.eqd-grid > div { display: grid; grid-template-columns: 104px minmax(0, 1fr); gap: 10px; padding: 8px 0; border-bottom: 1px solid #edf1f0; font-size: .88rem; }
.eqd-grid dt { color: var(--text-3); font-size: max(var(--fs-min), .8rem); padding-top: 1px; }
.eqd-grid dd { margin: 0; min-width: 0; }
.eqd-sec { margin-top: 18px; }
.eqd-sec h4, .rp-photos h4 { display: flex; align-items: baseline; gap: 8px; font-size: .9rem; font-weight: 700; margin-bottom: 6px; }
.eqd-sec h4 .mono, .rp-photos h4 .mono { font-weight: 500; color: var(--text-3); font-size: max(var(--fs-min), .82rem); }
.eqd-sec h4 small { font-size: max(var(--fs-min), .78rem); font-weight: 500; color: var(--text-3); }
.eqd-none { font-size: max(var(--fs-min), .84rem); color: var(--text-3); padding: 4px 0; }
.ins-list { display: flex; flex-direction: column; }
.ins-row { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; padding: 7px 0; border-top: 1px solid #edf1f0; font-size: max(var(--fs-min), .84rem); }
.ins-row:first-child { border-top: 0; }
.ins-row .mono { font-size: max(var(--fs-min), .8rem); color: var(--text-2); }
.ins-who { color: var(--text-2); }
.ins-rm { flex: 1 1 180px; min-width: 0; color: var(--text-2); }
.elog-list { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
.elog-list:empty { display: none; }
.elog-row { display: grid; grid-template-columns: 150px 92px minmax(0, 1fr) 34px; gap: 6px; align-items: center; }
.form-row .elog-row input, .form-row .elog-row select { padding: 7px 9px; }
.rp-steps { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 0 0 16px; padding: 0; }
.rp-steps li { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border-radius: 6px; background: var(--surface-2); font-size: max(var(--fs-min), .84rem); color: var(--text-3); position: relative; }
.rp-steps li.on { background: var(--primary-soft); color: var(--text); }
.rp-steps b { font-weight: 600; font-size: max(var(--fs-min), .84rem); }
.rp-steps .mono { font-size: max(var(--fs-min), .8rem); }
.rp-steps small { font-size: max(var(--fs-min), .78rem); color: var(--text-3); }
.rp-steps .rp-gap { color: var(--primary-dark); }
.rp-dot { position: absolute; top: 10px; right: 10px; width: 18px; height: 18px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #dfe5e3; color: #fff; }
.rp-steps li.on .rp-dot { background: var(--primary); }
.rp-part { display: inline-flex; align-items: center; gap: 6px; margin: 0 10px 4px 0; }
.rp-photos { margin-top: 16px; }
.rp-photos:empty { display: none; }
.rp-ph { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 8px; }
.rp-ph a { position: relative; display: block; border-radius: 6px; overflow: hidden; border: 1px solid var(--border); aspect-ratio: 1; background: var(--surface-2); }
.rp-ph img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rp-ph small { position: absolute; left: 6px; bottom: 6px; padding: 0 6px; border-radius: 5px; background: rgba(11,31,38,.72); color: #fff; font-size: max(var(--fs-min), .74rem); }
/* 가동 분석 */
.av-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 18px; align-items: start; }
.av-grid > .card { margin-bottom: 18px; }
.av-grp + .av-grp { margin-top: 16px; padding-top: 14px; border-top: 1px solid #edf1f0; }
.av-gh { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; font-size: max(var(--fs-min), .84rem); }
.av-tg { display: inline-flex; align-items: center; gap: 4px; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.av-row { display: grid; grid-template-columns: 108px minmax(0, 1fr) 58px 92px; align-items: center; gap: 12px; padding: 5px 0; }
.av-lb { font-size: max(var(--fs-min), .84rem); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.av-lb .mono { color: var(--text-3); font-weight: 500; margin-left: 4px; }
.av-track { position: relative; height: 14px; border-radius: 4px; background: #edf1f0; }
.av-bar { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 4px; background: var(--primary); }
.av-bar.low { background: #b7791f; }
.av-target { position: absolute; top: -4px; bottom: -4px; width: 0; border-left: 2px dashed var(--text-2); z-index: 1; }
.av-v { font-size: max(var(--fs-min), .84rem); font-weight: 600; text-align: right; }
.av-s { font-size: max(var(--fs-min), .78rem); color: var(--text-3); white-space: nowrap; }
.cz-list { display: flex; flex-direction: column; gap: 12px; }
.cz-row { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 12px; }
.cz-bar { display: flex; gap: 2px; height: 26px; }
.cz-bar i { display: flex; align-items: center; justify-content: center; min-width: 22px; border-radius: 4px; color: #fff; font-style: normal; font-size: max(var(--fs-min), .78rem); font-weight: 600; font-family: var(--mono); }
.cz-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 4px; font-size: max(var(--fs-min), .8rem); color: var(--text-2); }
.cz-legend span { display: inline-flex; align-items: center; gap: 5px; }
.cz-legend i { width: 10px; height: 10px; border-radius: 3px; }
@media (max-width: 1099px) { .av-grid { grid-template-columns: minmax(0, 1fr); } }

@media (max-width: 767px) {
  .lane { padding: 10px; }
  .flt-row { grid-template-columns: 40px minmax(0, 1fr); }
  .flt-m { grid-column: 2; justify-content: flex-start; max-width: none; }
  .eq-tabs { display: flex; width: 100%; }
  .eq-tab { flex: 1 1 0; padding: 0 6px; font-size: max(var(--fs-min), .84rem); }
  .toolbar .search-field { flex: 1 1 100%; }
  .eqd-grid { grid-template-columns: 1fr; }
  .eqd-grid > div { grid-template-columns: 92px minmax(0, 1fr); }
  .rp-steps { grid-template-columns: 1fr 1fr; }
  .av-row { grid-template-columns: 84px minmax(0, 1fr) 52px; }
  .av-s { display: none; }
  .elog-row { grid-template-columns: 1fr 1fr 34px; }
  .elog-row input[type="text"] { grid-column: 1 / 3; }
  .env-tbl th, .env-tbl td { padding: 7px 7px; }
  /* 목록 표 → 행 카드 (가로 스크롤 없이) */
  .eq-tbl thead, .rp-tbl thead { display: none; }
  .eq-tbl, .eq-tbl tbody, .rp-tbl, .rp-tbl tbody { display: block; }
  .eq-tbl tr.grp-row { display: block; }
  .eq-tbl tr.grp-row td { display: block; }
  .eq-tbl tr[data-eq], .eq-tbl tr[data-cares-only] { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 10px; padding: 12px 10px; border-bottom: 1px solid #edf1f0; }
  .eq-tbl tr[data-eq] td, .eq-tbl tr[data-cares-only] td { display: block; padding: 0; border: 0; background: none !important; }
  .eq-tbl .c-name { grid-column: 1; grid-row: 1; }
  .eq-tbl .c-st { grid-column: 2; grid-row: 1; justify-self: end; }
  .eq-tbl .c-sn { grid-column: 1; grid-row: 2; }
  .eq-tbl .c-rep { grid-column: 2; grid-row: 2; justify-self: end; text-align: right; }
  .eq-tbl .c-life { grid-column: 1 / -1; grid-row: 3; display: flex !important; align-items: center; gap: 8px; }
  .eq-tbl .c-life .cell-sub { margin: 0; }
  .eq-tbl .c-base, .eq-tbl .c-ven { display: none !important; }
  .rp-tbl tr[data-repair-row] { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 10px; padding: 12px 10px; border-bottom: 1px solid #edf1f0; }
  .rp-tbl tr[data-repair-row] td { display: block; padding: 0; border: 0; background: none !important; }
  .rp-tbl .c-date { grid-column: 1; grid-row: 1; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
  .rp-tbl .c-st { grid-column: 2; grid-row: 1; justify-self: end; }
  .rp-tbl .c-unit { grid-column: 1 / -1; grid-row: 2; }
  .rp-tbl .c-sym { grid-column: 1 / -1; grid-row: 3; }
  .rp-tbl .c-cause { grid-column: 1; grid-row: 4; }
  .rp-tbl .c-dur { grid-column: 2; grid-row: 4; justify-self: end; font-size: max(var(--fs-min), .82rem); color: var(--text-2); }
  .rp-tbl .col-ext { display: none !important; }
}

@media print {
  .eq-tabs, .seg, .search-field, .scr-meta, .heat-legend, .scr-env .help-tip, .av-tg .help-tip { display: none !important; }
  .scr-grid, .av-grid { display: block; }
  .lane, .unit-tile, .hc, .ml-x, .ml-e, .ins-dot, .mb-bar i, .av-bar, .cz-bar i, .env-tbl td.over, .lane-no, .st-dot {
    -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .lane, .heat-row, .flt-row, .av-row, .unit-tile, .scr-lanes, .scr-env, .scr-faults, .scr-heat { break-inside: avoid; }
  /* 인쇄는 폭이 좁아도 28일 전부 */
  .scr-heat .hl-long { display: inline !important; } .scr-heat .hl-short { display: none !important; }
  .scr-heat .heat { --hc-n: 28 !important; }
  .scr-heat .heat-cells > .hc, .scr-heat .heat-cells > .hc-h { display: block !important; }
  .scr-heat .heat-row { grid-template-columns: 92px minmax(0, 1fr) 34px 36px 36px !important; gap: 6px !important; }
  .scr-heat .heat-last { display: block !important; }
  .scr-heat .hc { height: 13px; }
  .scr-heat .hc-h.wk { font-size: max(var(--fs-min), .74rem) !important; }
  .scr-heat .hc-h.hc-mid { font-size: 0 !important; }
  .lane-board { grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)) !important; gap: 6px; }
  .lane-board .lane-zone { grid-column: auto !important; display: flex !important; }
  .lane { padding: 8px; }
  .unit-tile { padding: 6px 8px; gap: 6px; }
  .ut-ico { width: 26px; height: 26px; }
  .ut-ico .ico { width: 16px; height: 16px; }
  .stat-row { grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); }
  .env-tbl th, .env-tbl td { padding: 3px 8px; }
  .env-cond { margin-top: 6px; padding: 6px 10px; }
  .flt-row { padding: 5px 4px; }
  .dscr-cells { grid-template-columns: repeat(4, 1fr) !important; }
  .dash-scr { break-inside: avoid; }
}
@media (prefers-reduced-motion: reduce) { .sk { animation: none; } }

/* ── 첨부 뷰어 — 공지 · 일정 메모 · 회의록의 파일/이미지 미리보기 ── */
.fv-viewer { width: 100vw; height: 100vh; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0;
  background: #0b1f26; color: #fff; }
.fv-viewer[open] { display: flex; flex-direction: column; animation: rise .18s var(--ease-out); }
.fv-viewer::backdrop { background: rgba(6,16,20,.72); }
.fv-viewer [hidden] { display: none !important; }
.fv-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; padding: 10px 14px; padding-top: max(10px, env(safe-area-inset-top));
  border-bottom: 1px solid rgba(255,255,255,.1); }
.fv-t { flex: 1 1 240px; min-width: 0; display: flex; align-items: baseline; gap: 10px; }
.fv-t b { font-size: 1rem; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fv-ext { font-size: max(var(--fs-min), .8rem); color: var(--rail-text); white-space: nowrap; }
.fv-acts { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.fv-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 38px; padding: 0 12px;
  border: 1px solid rgba(255,255,255,.18); border-radius: 6px; background: rgba(255,255,255,.06); color: #fff;
  font-size: max(var(--fs-min), .84rem); font-weight: 600; white-space: nowrap; transition: background-color .12s ease; }
.fv-btn:hover { background: rgba(255,255,255,.14); color: #fff; }
.fv-primary { background: var(--primary); border-color: transparent; }
.fv-primary:hover { background: #12897f; }
.fv-danger { color: #fca5a5; }
.fv-danger:hover { background: rgba(252,165,165,.16); color: #fecaca; }
.fv-ico { width: 38px; padding: 0; }
.fv-ico[data-fv="prev"] .ico { transform: scaleX(-1); }
.fv-pos { min-width: 44px; text-align: center; font-size: max(var(--fs-min), .8rem); color: var(--rail-text); }
.fv-stage { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; display: grid;
  grid-template-rows: minmax(0, 1fr); grid-template-columns: minmax(0, 1fr); place-items: center; padding: 14px; }
.fv-img { display: block; max-width: 100%; max-height: 100%; object-fit: contain; background: #fff; border-radius: 4px;
  box-shadow: 0 12px 40px rgba(0,0,0,.45); cursor: zoom-in; }
.fv-viewer.is-zoom .fv-stage { display: block; }
.fv-viewer.is-zoom .fv-img { max-width: none; max-height: none; height: auto; margin: 0 auto; cursor: zoom-out; }
.fv-frame { width: 100%; height: 100%; border: 0; border-radius: 6px; background: #fff; }
.fv-none { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 40px 24px; text-align: center; color: #dbe8eb; }
.fv-none .ico { color: #7f9ba3; }
.fv-none b { font-size: 1rem; font-weight: 600; word-break: break-all; }
.fv-none span { font-size: max(var(--fs-min), .84rem); color: var(--rail-text); }
.fv-wait .ico { animation: bb-spin 1s linear infinite; }
.fv-stage[data-kind="doc"] > .fv-none { margin: auto; }
.fv-pwf { display: flex; gap: 6px; width: min(320px, 100%); margin-top: 4px; }
.fv-pwi { flex: 1; min-width: 0; min-height: 38px; padding: 0 12px; border: 1px solid rgba(255,255,255,.28); border-radius: 6px;
  background: rgba(255,255,255,.08); color: #fff; font-size: .9rem; }
.fv-pwi::placeholder { color: #8fa5ab; }
.fv-pwi:focus-visible { outline: 2px solid #7dd3c8; outline-offset: 1px; }
.fv-pwf .fv-btn:disabled, .fv-pwi:disabled { opacity: .6; }
.fv-pwmsg { min-height: 1.2em; margin: 0; font-size: max(var(--fs-min), .84rem); color: #fca5a5; }
/* 문서 미리보기(엑셀 · 워드 · 한글 · PPT · CSV · 글) — 시트 탭 · 안내 + 문서 프레임 */
.fv-stage[data-kind="doc"] { display: flex; align-items: stretch; justify-content: stretch; padding: 10px 14px 14px; }
.fv-docwrap { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; gap: 8px; }
.fv-dochead { display: flex; align-items: center; gap: 8px 12px; flex-wrap: wrap; }
.fv-sheets { display: flex; gap: 4px; max-width: 100%; overflow-x: auto; scrollbar-width: thin; }
.fv-sheet { flex: none; min-height: 32px; padding: 0 12px; border: 1px solid rgba(255,255,255,.2); border-radius: 5px; background: rgba(255,255,255,.06);
  color: #dbe8eb; font-size: max(var(--fs-min), .84rem); font-weight: 600; white-space: nowrap; }
.fv-sheet:hover { background: rgba(255,255,255,.14); color: #fff; }
.fv-sheet[aria-selected="true"] { background: #fff; border-color: #fff; color: #0b1f26; }
.fv-sheet:focus-visible { outline: 2px solid #7dd3c8; outline-offset: 2px; }
.fv-note { margin: 0; font-size: max(var(--fs-min), .8rem); color: var(--rail-text); }
.fv-docf { flex: 1 1 0; height: auto; min-height: 0; }
html.fv-viewing { overflow: hidden; }
/* 첨부 칩·본문 이미지는 눌러서 여는 것 — 편집 중에도 같다 */
a.nb-file, .nb-file > a, .nb-editor img, .notice-html img, .ag-memo img, .cn-rich img { cursor: pointer; }
.nb-editor img:hover, .notice-html img:hover, .ag-memo img:hover, .cn-rich img:hover { outline: 2px solid var(--primary); outline-offset: 2px; }
@media (max-width: 560px) {
  .fv-bar { padding: 8px 10px; padding-top: max(8px, env(safe-area-inset-top)); }
  .fv-t { flex-basis: 100%; }
  .fv-acts { width: 100%; }
  .fv-acts { flex-wrap: wrap; }
  .fv-btn { padding: 0 10px; font-size: max(var(--fs-min), .8rem); }
  .fv-close { margin-left: auto; }
  .fv-stage { padding: 8px; }
  .fv-stage[data-kind="doc"] { padding: 6px 8px 8px; }
}

/* ── 링크 묶음 — 바로가기 하나 아래 하위 링크를 카드로 ── */
.nav-item.nav-set .ext-mark { color: var(--text-3); }
.nav-item.nav-set.active .ext-mark { color: var(--primary-dark); }
.menu-tree-item.is-sub { margin-left: 52px; }

.lk-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.lk-card { display: flex; align-items: center; gap: 12px; width: 100%; padding: 14px 14px 14px 13px; text-align: left;
  background: var(--surface); border: 1px solid var(--border); border-left: 3px solid var(--primary);
  border-radius: var(--radius-sm); box-shadow: var(--shadow); color: var(--text);
  transition: transform .12s var(--ease-out), box-shadow .12s ease, border-color .12s ease; }
.lk-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: var(--border-strong);
  border-left-color: var(--primary-dark); color: var(--text); }
.lk-card:active { transform: translateY(0); }
.lk-card:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.lk-ico { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 6px;
  background: var(--primary-soft); color: var(--primary-dark); font-size: 1.1rem; }
.lk-b { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.lk-t { font-size: .96rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lk-s { font-family: var(--mono); font-size: max(var(--fs-min), .76rem); color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.lk-tag { flex: none; font-size: max(var(--fs-min), .74rem); font-weight: 600; padding: 2px 7px; border-radius: 5px;
  background: var(--surface-2); border: 1px solid var(--border); color: var(--text-3); white-space: nowrap; }
.lk-go { flex: none; display: flex; color: var(--text-3); }
.lk-card:hover .lk-go { color: var(--primary); }
.lk-note { display: flex; align-items: center; gap: 7px; margin-top: 14px; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.lk-note .ico { flex: none; color: var(--accent-dark); }
@media (max-width: 520px) {
  .lk-grid { grid-template-columns: 1fr; gap: 10px; }
  .lk-card { padding: 12px; gap: 10px; }
  .lk-ico { width: 34px; height: 34px; }
  .lk-tag { display: none; }
  .menu-tree-item.is-sub { margin-left: 28px; }
}
@media print {
  .lk-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .lk-card { box-shadow: none; break-inside: avoid; }
  .lk-go { display: none; }
}

/* ── 규정 목록 검색 상태 표시 ── */
.rg-fnote { font-size: max(var(--fs-min), .82rem); color: var(--text-2); white-space: nowrap; }
.rg-fnote b { font-weight: 700; color: var(--primary-dark); }
.rg-fnote[hidden] { display: none; }
.empty [data-rg-clear] { display: inline-flex; }

/* ── 위기대응 담당자 (crisis) ── */
/* 우리 팀 임무 — 대시보드 화물 태그와 같은 짙은 판 */
.cr-home { display: flex; gap: 0; margin-bottom: 18px; background: var(--ticket-bg); color: #fff; border-radius: 6px; overflow: hidden; }
.cr-home-main { flex: 1; min-width: 0; padding: 20px 26px 18px; }
.cr-home-top { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin-bottom: 10px; }
.cr-home-top h2 { font-size: 1.3rem; font-weight: 700; letter-spacing: -.02em; margin-right: 4px; }
.cr-home-org { display: inline-flex; align-items: center; gap: 7px; padding: 3px 10px; border-radius: 7px; background: rgba(255,255,255,.09);
  font-size: max(var(--fs-min), .8rem); font-weight: 600; color: #dbe8eb; white-space: nowrap; }
.cr-home-list { list-style: none; margin: 0; padding: 0; }
.cr-home-list li { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 16px; padding: 8px 0; border-top: 1px solid rgba(167,188,193,.18); font-size: .96rem; }
.cr-home-list li:first-child { border-top: 0; }
.cr-home-list li > span:first-child { flex: 1 1 260px; min-width: 0; }
.cr-home-pair { display: flex; gap: 14px; }
.cr-home-side { width: 250px; flex: none; display: flex; flex-direction: column; justify-content: center; gap: 12px; padding: 20px 24px;
  border-left: 2px dashed #2e5361; }
.cr-hw { display: flex; align-items: center; gap: 10px; }
.cr-hk { flex: none; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 7px; background: var(--accent); color: #1f1300; font-size: max(var(--fs-min), .8rem); font-weight: 700; }
.cr-hw + .cr-hw .cr-hk { background: #2e5361; color: #dbe8eb; }
.cr-home .cr-pn { color: #fff; font-size: 1.02rem; font-weight: 700; }
.cr-home .cr-tel { background: rgba(255,255,255,.1); color: #fde68a; }
@media (hover: hover) and (pointer: fine) { .cr-home .cr-tel:hover { background: rgba(255,255,255,.18); } .cr-home .cr-pn:hover { color: #fde68a; } }

/* 조직 선택 줄 */
.cr-orgs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.cr-orgbtn { display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 0 11px; border: 1px solid var(--border); border-radius: 6px;
  background: var(--surface); font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--text-2); white-space: nowrap;
  transition: background-color .12s ease, border-color .12s ease, transform .16s var(--ease-out); }
.cr-orgbtn:active { transform: scale(.97); }
.cr-orgbtn .c { font-size: max(var(--fs-min), .78rem); color: var(--text-3); font-weight: 500; }
.cr-orgbtn[aria-pressed="true"] { background: var(--primary-soft); border-color: var(--primary); color: var(--primary-dark); }
.cr-orgbtn[aria-pressed="true"] .c { color: var(--primary-dark); }
@media (hover: hover) and (pointer: fine) { .cr-orgbtn[aria-pressed="false"]:hover { border-color: var(--border-strong); color: var(--text); } }
.cr-dot { display: inline-block; flex: none; width: 9px; height: 9px; border-radius: 3px; background: var(--oc, #646b73); }

/* 검색 · 보기 줄 */
.cr-bar { position: sticky; top: var(--header-h); z-index: 5; display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 6px 0 12px; background: var(--bg); }
.cr-bar .search-field { flex: 0 1 320px; }
.cr-result { display: inline-flex; align-items: center; gap: 8px; font-size: max(var(--fs-min), .82rem); color: var(--text-2); white-space: nowrap; }
.cr-result b { color: var(--primary-dark); font-weight: 700; }
.cr-clear { border: 0; background: none; padding: 2px 0; color: var(--primary); font-size: max(var(--fs-min), .82rem); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }

/* 조직별 · 팀별 표 */
.cr-sec { padding: 0; overflow: hidden; }
.cr-sechead { display: flex; align-items: center; gap: 10px; padding: 14px 20px; border-bottom: 1px solid #edf1f0; }
.cr-sechead h3 { font-size: 1.02rem; font-weight: 700; letter-spacing: -.01em; }
.cr-sechead .cr-dot { width: 11px; height: 11px; }
.cr-cnt { margin-left: auto; font-size: max(var(--fs-min), .8rem); color: var(--text-3); white-space: nowrap; }
.cr-cnt b { color: var(--text); font-weight: 600; }
.cr-tbl { --tc: 196px; --pc: 132px; --ec: 0px; }
.cr-tbl.has-edit { --ec: 42px; }
.cr-th { display: grid; grid-template-columns: var(--tc) minmax(0, 1fr) var(--pc) var(--pc) var(--ec); padding: 7px 0; background: var(--surface-2);
  border-bottom: 1px solid #edf1f0; font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-3); }
.cr-th span:first-child { padding-left: 20px; }
.cr-tg { display: grid; grid-template-columns: var(--tc) minmax(0, 1fr); border-top: 1px solid #edf1f0; }
.cr-th + .cr-tg { border-top: 0; }
.cr-team { padding: 11px 14px 11px 20px; display: flex; flex-direction: column; gap: 1px; }
.cr-team b { font-size: .92rem; font-weight: 700; }
.cr-team small { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.cr-line { display: grid; grid-template-columns: minmax(0, 1fr) var(--pc) var(--pc) var(--ec); align-items: center; padding: 9px 0; border-top: 1px solid #f2f5f4; }
.cr-line:first-child { border-top: 0; }
.cr-task { min-width: 0; padding-right: 16px; font-size: .92rem; }
.cr-orgtag { display: inline-flex; align-items: center; gap: 6px; padding: 1px 8px; border-radius: 6px; background: var(--surface-2); border: 1px solid #e7ecea;
  font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-2); white-space: nowrap; }
.cr-who { display: flex; align-items: center; gap: 6px; min-width: 0; padding-right: 10px; }
.cr-lbl { display: none; }
.cr-p { display: inline-flex; align-items: center; gap: 5px; min-width: 0; }
.cr-pn { border: 0; background: none; padding: 2px 0; font-size: .92rem; font-weight: 600; color: var(--text); white-space: nowrap;
  text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 4px; transition: text-decoration-color .12s ease; }
.cr-who.is-sub .cr-pn { font-weight: 500; color: var(--text-2); }
@media (hover: hover) and (pointer: fine) { .cr-pn:hover { text-decoration-color: currentColor; color: var(--primary-dark); } }
.cr-tel { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--primary-soft); color: var(--primary-dark); }
@media (hover: hover) and (pointer: fine) { .cr-tel:hover { background: #cfe9e4; } }
.cr-ref { border: 0; background: none; padding: 2px 0; font-size: max(var(--fs-min), .82rem); color: var(--text-3); text-decoration: underline dashed; text-underline-offset: 3px; white-space: nowrap; }
.cr-none { color: var(--text-3); }
.cr-edit { justify-self: center; display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--text-3); }
@media (hover: hover) and (pointer: fine) { .cr-edit:hover { border-color: var(--border); background: var(--surface); color: var(--text); } }
.cr-tg.is-home { background: linear-gradient(90deg, var(--accent-soft), rgba(254,243,220,.35)); }
.cr-tg.is-home .cr-team b { color: #8a4b06; }
.cr-line.is-home .cr-tt { font-weight: 600; }
.cr-sec mark, .cr-person mark { background: #fde68a; color: inherit; border-radius: 3px; padding: 0 1px; }

/* 담당자별 */
.cr-people { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); margin: 0 -1px -1px 0; }
.cr-person { padding: 16px 20px; border-right: 1px solid #edf1f0; border-bottom: 1px solid #edf1f0; min-width: 0; }
.cr-person.is-home { background: var(--accent-soft); }
.cr-person header { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; margin-bottom: 8px; }
.cr-pname { font-size: 1.06rem; font-weight: 700; letter-spacing: -.01em; }
.cr-ptel { display: inline-flex; align-items: center; gap: 5px; padding: 2px 9px; border-radius: 7px; background: var(--primary-soft); color: var(--primary-dark); font-size: max(var(--fs-min), .8rem); font-weight: 600; }
.cr-pteams { flex-basis: 100%; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.cr-person ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 7px; }
.cr-person li { display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 8px; align-items: start; font-size: .88rem; }
.cr-role { display: grid; place-items: center; width: 24px; height: 22px; margin-top: 1px; border-radius: 6px; background: var(--primary); color: #fff; font-size: max(var(--fs-min), .78rem); font-weight: 700; }
.cr-role.is-sub { background: #e4eae8; color: var(--text-2); }
.cr-ptask { display: block; }
.cr-ptask .cr-orgtag, .cr-task .cr-orgtag { margin-right: 7px; vertical-align: 1px; }

/* 매트릭스 (팀 × 조직) */
.cr-mxt { width: 100%; border-collapse: separate; border-spacing: 0; font-size: max(var(--fs-min), .84rem); }
.cr-mxt th, .cr-mxt td { padding: 5px 6px; text-align: center; border-bottom: 1px solid #f0f3f2; }
.cr-mxt thead th { position: sticky; top: 0; background: var(--surface); padding: 12px 6px 10px; font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-2); vertical-align: bottom; border-bottom: 1px solid var(--border); }
.cr-mxh { display: inline-flex; flex-direction: column; align-items: center; gap: 5px; white-space: nowrap; }
.cr-mxt tbody th[scope="row"] { text-align: left; padding-left: 20px; font-weight: 600; white-space: nowrap; }
.cr-mxt thead th:first-child { text-align: left; padding-left: 20px; }
.cr-mxdiv th { text-align: left !important; padding: 9px 20px 6px !important; background: var(--surface-2); font-size: max(var(--fs-min), .8rem); font-weight: 700; color: var(--text-3); }
.cr-mx { min-width: 30px; height: 26px; padding: 0 6px; border: 0; border-radius: 6px; font-family: var(--mono); font-size: max(var(--fs-min), .8rem); font-weight: 600;
  background: rgba(15,118,110,var(--a, .2)); color: var(--primary-dark); transition: transform .16s var(--ease-out); }
.cr-mx.is-strong { color: #fff; }
.cr-mx:active { transform: scale(.94); }
.cr-mxsum { color: var(--text-3); font-size: max(var(--fs-min), .8rem); }
.cr-mxt tr.is-home th[scope="row"] { color: #8a4b06; }
.cr-mxt tr.is-home td, .cr-mxt tr.is-home th { background: var(--accent-soft); }

/* 참고 */
.cr-notes h3 { font-size: .92rem; font-weight: 700; margin-bottom: 6px; }
.cr-notes ol { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 4px; font-size: .88rem; color: var(--text-2); }
.cr-notes a { font-family: var(--mono); font-weight: 600; }

/* 엑셀 반영 확인 */
.cr-dsum { margin: 0 0 14px; }
.cr-dsum > div { display: grid; grid-template-columns: 90px minmax(0, 1fr); gap: 10px; padding: 7px 0; border-bottom: 1px solid #edf1f0; font-size: .88rem; }
.cr-dsum dt { color: var(--text-3); font-size: max(var(--fs-min), .82rem); }
.cr-dsum dd { margin: 0; min-width: 0; }
.cr-dsec { margin-top: 12px; }
.cr-dsec h4 { font-size: .88rem; font-weight: 700; margin-bottom: 5px; }
.cr-dsec h4 .mono { color: var(--primary-dark); }
.cr-dsec ul { max-height: 200px; overflow: auto; margin: 0; padding: 6px 12px 6px 28px; border-radius: 6px; background: var(--surface-2); font-size: max(var(--fs-min), .84rem); }
.cr-dsec li { padding: 3px 0; }
.cr-dv { font-size: max(var(--fs-min), .8rem); color: var(--text-2); }
.cr-dsame { font-size: .88rem; color: var(--text-2); }

@media (max-width: 767px) {
  .cr-home { flex-direction: column; border-radius: 6px; }
  .cr-home-main { padding: 18px 18px 14px; }
  .cr-home-side { width: auto; flex-direction: row; flex-wrap: wrap; gap: 10px 22px; padding: 14px 18px 16px; border-left: 0; border-top: 2px dashed #2e5361; }
  .cr-orgs { flex-wrap: nowrap; overflow-x: auto; margin: 0 -14px 10px; padding: 0 14px 4px; scrollbar-width: none; }
  .cr-orgs::-webkit-scrollbar { display: none; }
  .cr-bar { position: static; }
  .cr-bar .search-field { flex: 1 1 100%; }
  .cr-sechead { padding: 12px 16px; }
  .cr-th { display: none; }
  .cr-tg { grid-template-columns: 1fr; }
  .cr-team { flex-direction: row; align-items: baseline; gap: 8px; padding: 11px 16px 2px; }
  .cr-line { grid-template-columns: auto minmax(0, 1fr) var(--ec); grid-template-areas: "task task edit" "main sub edit"; gap: 4px 14px; padding: 8px 16px; }
  .cr-tbl.has-edit { --ec: 34px; }
  .cr-task { grid-area: task; padding-right: 0; }
  .cr-who { grid-area: main; padding-right: 0; }
  .cr-who.is-sub { grid-area: sub; }
  .cr-edit { grid-area: edit; }
  .cr-lbl { display: inline-grid; place-items: center; width: 20px; height: 19px; border-radius: 5px; background: var(--primary); color: #fff; font-size: max(var(--fs-min), .76rem); font-weight: 700; }
  .cr-who.is-sub .cr-lbl { background: #e4eae8; color: var(--text-2); }
  .cr-people { grid-template-columns: 1fr; }
  .cr-person { padding: 14px 16px; }
}
@media print {
  .cr-bar, .cr-orgs, .cr-edit, .cr-tel, .cr-ptel { display: none !important; }
  .cr-home { background: #fff !important; color: var(--text); border: 1px solid #9aa7a4; }
  .cr-home .cr-pn { color: var(--text); }
  .cr-home-side { border-left-color: #9aa7a4; }
  .cr-home-org { background: #eef2f1; color: var(--text-2); }
  .cr-hk, .cr-role, .cr-dot, .cr-mx, .cr-tg.is-home, .cr-person.is-home { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .cr-sec { break-inside: auto; }
  .cr-tg, .cr-person, .cr-sechead { break-inside: avoid; }
  .cr-sechead { break-after: avoid; }
  .cr-pn { text-decoration: none; }
}
.cr-mxt tbody th[scope="row"], .cr-mxt thead th:first-child { position: sticky; left: 0; z-index: 1; background: var(--surface); }
.cr-mxt thead th:first-child { z-index: 2; }
.cr-mxt tr.is-home th[scope="row"] { background: var(--accent-soft); }

/* ── 운항 현황 — 대시보드 .dash-flt(지도 + 인천 접근 중) · 메뉴 #/flight(.fo-*). Leaflet 타일은 채도를 빼 화면 톤에 맞춘다 ── */
.dash-flt { margin-bottom: 20px; container-type: inline-size; }
.dash-flt > .dc-head { padding: 0 4px; margin-bottom: 10px; }
.dflt-body { display: grid; grid-template-columns: minmax(0, 1fr); background: var(--surface);
  border: 1px solid var(--border); border-radius: 6px; overflow: hidden; }
.dflt-mapwrap .fo-map { height: 420px; }
.dflt-side { display: flex; flex-direction: column; min-width: 0; padding: 16px 18px 12px; border-top: 1px solid var(--border); }
@container (min-width: 860px) {
  .dflt-body { grid-template-columns: minmax(0, 1fr) minmax(300px, 340px); }
  .dflt-side { border-top: 0; border-left: 1px solid var(--border); max-height: 420px; overflow-y: auto; }
}
.dflt-h { display: flex; align-items: baseline; gap: 10px; margin-bottom: 6px; }
.dflt-h h3 { font-size: .92rem; font-weight: 700; }
.dflt-h b { font-size: 1.35rem; font-weight: 600; color: var(--warning); line-height: 1; }

/* 지도 */
.fo-mapwrap { position: relative; min-width: 0; isolation: isolate; }
.fo-map { position: relative; width: 100%; height: 100%; min-height: 280px; background: #dde5e3; z-index: 0; }
.fo-map-msg { position: absolute; inset: 0; display: grid; place-items: center; font-size: max(var(--fs-min), .84rem); color: var(--text-3); }
.fo-map.is-ready .fo-map-msg { display: none; }
.fo-map .leaflet-container, .fo-map.leaflet-container { font-family: var(--font); background: #dde5e3; }
.fo-tiles { filter: grayscale(.92) contrast(.9) brightness(1.07); }
.fo-map .leaflet-control-attribution { font-size: max(var(--fs-min), .74rem); background: rgba(255,255,255,.82); color: var(--text-3); }
.fo-map .leaflet-control-attribution a { color: var(--text-2); }
.fo-map .leaflet-bar { border: 1px solid var(--border-strong); box-shadow: 0 2px 6px rgba(14,26,31,.1); border-radius: 6px; overflow: hidden; }
.fo-map .leaflet-bar a { width: 32px; height: 32px; line-height: 30px; color: var(--text); }
.fo-fit { position: absolute; top: 10px; right: 10px; z-index: 450; width: 34px; height: 34px; display: grid; place-items: center;
  border: 1px solid var(--border-strong); border-radius: 6px; background: rgba(255,255,255,.96); color: var(--text-2);
  box-shadow: 0 2px 6px rgba(14,26,31,.1); transition: color .15s ease, transform .16s var(--ease-out); }
.fo-fit:hover { color: var(--primary); }
.fo-fit:active { transform: scale(.94); }
.fo-legend { position: absolute; left: 10px; bottom: 10px; z-index: 450; display: flex; flex-wrap: wrap; gap: 4px 12px; max-width: calc(100% - 20px);
  padding: 6px 10px; border-radius: 6px; background: rgba(255,255,255,.94); box-shadow: 0 2px 6px rgba(14,26,31,.1);
  font-size: max(var(--fs-min), .78rem); color: var(--text-2); pointer-events: none; }
.fo-legend span { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.fo-legend b { color: var(--text); font-weight: 600; }
.fo-legend i { width: 9px; height: 9px; border-radius: 50%; background: var(--primary); }
.fo-legend [data-tone="appr"] i { background: #d97706; }
.fo-legend [data-tone="gnd"] i { background: var(--sidebar-bg); border-radius: 3px; }
.fo-legend [data-tone="lost"] i { background: #fff; box-shadow: inset 0 0 0 1.5px #7b8a90; }

/* 기체 표지 (Leaflet divIcon) */
.leaflet-marker-icon.fo-mk { background: none; border: 0; }
.fo-ac { position: absolute; inset: 0; display: grid; place-items: center; color: var(--primary); cursor: pointer; }
.fo-ac svg { width: 26px; height: 26px; fill: currentColor; stroke: #fff; stroke-width: 1.5px; paint-order: stroke;
  transform: rotate(var(--r, 0deg)); filter: drop-shadow(0 1px 1.5px rgba(11,31,38,.35)); transition: transform .6s var(--ease-out); }
.fo-ac[data-tone="appr"] { color: #d97706; }
.fo-ac[data-tone="emg"] { color: var(--danger); }
.fo-ac[data-tone="emg"]::after { content: ""; position: absolute; inset: -6px; border-radius: 50%; box-shadow: 0 0 0 2px var(--danger); animation: fo-pulse 1.4s ease-out infinite; }
@keyframes fo-pulse { from { opacity: .9; transform: scale(.7); } to { opacity: 0; transform: scale(1.5); } }
.fo-ac.is-est svg { fill: #fff; stroke: #6b7b81; stroke-width: 1.6px; }
.fo-lb { position: absolute; left: 29px; top: 4px; display: inline-flex; align-items: baseline; gap: 5px; padding: 1px 7px 2px; border-radius: 6px;
  background: rgba(255,255,255,.95); box-shadow: 0 1px 3px rgba(11,31,38,.2); font-family: var(--mono); font-size: max(var(--fs-min), 11.5px); line-height: 1.5;
  color: var(--text-3); white-space: nowrap; pointer-events: none; }
.fo-lb b { color: var(--text); font-weight: 600; }
.fo-mk.lb-l .fo-lb { left: auto; right: 29px; }
.fo-mk.lb-x .fo-lb { display: none; }
.fo-ac[data-tone="appr"] + .fo-lb b { color: #9a4a06; }
.fo-ac.is-est + .fo-lb { background: rgba(255,255,255,.8); }
.fo-apt { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 0; cursor: pointer; }
.fo-apt b, .fo-apt i { display: grid; place-items: center; height: 22px; font-family: var(--mono); font-size: max(var(--fs-min), 11px); font-style: normal; font-weight: 600; }
.fo-apt b { padding: 0 6px; border-radius: 6px 0 0 6px; background: var(--sidebar-bg); color: #fff; }
.fo-apt i { min-width: 20px; padding: 0 5px; border-radius: 0 6px 6px 0; background: #fff; color: var(--text); box-shadow: inset 0 0 0 1.5px var(--sidebar-bg); }
.fo-apt.is-home b { background: var(--primary); }
.fo-apt.is-home i { box-shadow: inset 0 0 0 1.5px var(--primary); color: var(--primary-dark); }

/* 팝업 */
.fo-popup .leaflet-popup-content-wrapper { border-radius: 6px; box-shadow: var(--shadow-md), 0 0 0 1px var(--border); padding: 0; }
.fo-popup .leaflet-popup-content { margin: 12px 14px 10px; font-family: var(--font); font-size: max(var(--fs-min), .84rem); line-height: 1.5; color: var(--text); }
.fo-popup .leaflet-popup-tip { box-shadow: none; }
.fo-pop-h { display: flex; align-items: baseline; gap: 8px; margin-bottom: 6px; padding-right: 14px; }
.fo-pop-h b { font-size: 1rem; }
.fo-pop-h span { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.fo-pop dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 3px 12px; margin: 0; }
.fo-pop dt { color: var(--text-3); font-size: max(var(--fs-min), .82rem); }
.fo-pop dd { margin: 0; font-variant-numeric: tabular-nums; }
.fo-pop dd small { color: var(--text-3); }
/* 공항 묶음 정보창 — 기체마다 두 줄. 줄바꿈 없이 재어 Leaflet 이 폭을 잡게 한다(안 그러면 글자 단위로 세로로 쪼개짐) */
.fo-pop-list { list-style: none; margin: 0; padding: 0; max-height: 280px; overflow-y: auto; }
.fo-pop-list li { padding: 7px 0; border-top: 1px solid var(--border); }
.fo-pop-list li:first-child { border-top: 0; padding-top: 2px; }
.fo-pop-list .pl-1 { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.fo-pop-list .pl-1 b { font-size: .92rem; }
.fo-pop-list .pl-1 span { color: var(--text-2); font-size: max(var(--fs-min), .81rem); }
.fo-pop-list .pl-1 .badge { margin-left: auto; }
.fo-pop-list .pl-2 { margin-top: 2px; color: var(--text-3); font-size: max(var(--fs-min), .81rem); white-space: nowrap; font-variant-numeric: tabular-nums; }

/* 인천 접근 중 목록 */
.appr-list { list-style: none; margin: 0; padding: 0; }
.appr-list li + li { border-top: 1px solid #edf1f0; }
.appr-row { width: 100%; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; padding: 10px 6px; border: 0; border-radius: 8px;
  background: none; text-align: left; transition: background-color .15s ease; }
@media (hover: hover) and (pointer: fine) { .appr-row:hover { background: var(--surface-2); } }
.ar-id { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.ar-id b { font-size: 1rem; font-weight: 600; }
.ar-id span { font-size: max(var(--fs-min), .82rem); color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ar-eta { grid-row: span 2; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; }
.ar-eta b { font-size: 1.12rem; font-weight: 600; color: #9a4a06; line-height: 1.2; }
.ar-eta small { font-size: max(var(--fs-min), .78rem); color: var(--text-3); white-space: nowrap; }
.ar-sub { display: flex; align-items: center; gap: 4px; font-size: max(var(--fs-min), .8rem); color: var(--text-2); min-width: 0; }
.ar-dn { display: inline-flex; color: #b45309; }
.fo-none { padding: 10px 2px; font-size: .86rem; color: var(--text-3); }
.dflt-h2 { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border); }
.arr-mini { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.arr-mini li { display: grid; grid-template-columns: 48px 64px minmax(0, 1fr) auto; gap: 8px; align-items: baseline; padding: 5px 6px; font-size: max(var(--fs-min), .84rem); }
.arr-mini b { font-weight: 600; }
.arr-mini span { color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.arr-mini small { font-size: max(var(--fs-min), .78rem); color: var(--text-3); white-space: nowrap; }

/* 운항 현황 화면 */
.fo-upd { font-size: max(var(--fs-min), .8rem); color: var(--text-3); white-space: nowrap; }
#view[data-hub] .fo-upd { color: #d4e2e4; }
.fo-alert { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 18px; padding: 12px 16px; border-radius: var(--radius);
  background: var(--danger-soft); color: var(--danger); font-size: .9rem; line-height: 1.6; box-shadow: inset 0 0 0 1px #f1c3bd; }
.fo-alert .ico { margin-top: 3px; }
.fo-alert.is-soft { background: var(--surface-2); color: var(--text-2); box-shadow: inset 0 0 0 1px var(--border); }
.fo-mapcard { padding: 0; overflow: hidden; }
.fo-map-full { height: clamp(380px, 58vh, 640px); }
.fo-boards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 18px; margin-bottom: 18px; }
.fo-boards > .card { margin-bottom: 0; min-width: 0; }
.fo-board .card-title { margin-bottom: 6px; }
.fo-up { display: inline-flex; transform: rotate(180deg); }
.fo-sub { display: flex; align-items: baseline; gap: 8px; margin: 16px 0 4px; padding-bottom: 6px; border-bottom: 1px solid var(--border); }
.fo-board .fo-sub:first-of-type { margin-top: 4px; }
.fo-sub h3 { font-size: max(var(--fs-min), .84rem); font-weight: 600; color: var(--text-2); }
.fo-sub span { font-size: max(var(--fs-min), .84rem); color: var(--text-3); }
table.fo-tbl { font-size: .88rem; }
.fo-tbl th, .fo-tbl td { padding: 8px 8px; }
.fo-tbl tr:hover td { background: none; }
.fo-t { width: 64px; color: var(--text-2); white-space: nowrap; }
.fo-note { text-align: right; white-space: nowrap; }
.fo-tbl thead th { font-size: max(var(--fs-min), .81rem); font-weight: 600; color: var(--text-3); }
.fo-fn { white-space: nowrap; }
.fo-fn > b, .fo-fn > span { display: block; }
.fo-fn small { display: block; margin-top: 1px; font-size: max(var(--fs-min), .81rem); color: var(--text-3); }
.fo-oth { color: var(--text-2); }
.fo-oth.is-empty { color: var(--text-3); }
.fo-cnt { font-size: max(var(--fs-min), .8rem); font-weight: 500; color: var(--text-3); }
.fo-fleet tbody tr { cursor: pointer; }
.fo-fleet .c-ac b { display: block; }
.fo-fleet .c-ac small { display: block; font-size: max(var(--fs-min), .78rem); color: var(--text-3); white-space: nowrap; }
.fo-fleet .c-alt, .fo-fleet .c-seen, .fo-fleet .c-dep { white-space: nowrap; font-size: .86rem; }
.fo-fleet .c-seen { color: var(--text-2); }
.fo-log td { white-space: nowrap; }

/* 기체 목록 편집 */
.fl-head, .fl-row { display: grid; grid-template-columns: 100px 96px minmax(0, 1fr) minmax(0, 1fr) 34px; gap: 8px; align-items: center; }
.fl-head { font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--text-2); margin: 6px 0; }
.fl-head span { display: inline-flex; align-items: center; gap: 4px; }
.fl-list { display: grid; gap: 6px; max-height: 52vh; overflow-y: auto; padding: 2px; }
.fl-row input, .fl-row select { width: 100%; min-width: 0; height: 38px; padding: 0 9px; border: 1px solid var(--border-strong); border-radius: 8px; background: var(--surface); }
.fl-row .mono { font-family: var(--mono); font-size: .86rem; }
.fl-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; }

@media (max-width: 640px) {
  .dflt-mapwrap .fo-map { height: 320px; }
  .fo-map-full { height: 60vh; min-height: 320px; }
  .fo-legend { font-size: max(var(--fs-min), .76rem); gap: 2px 9px; }
  .fo-upd { display: none; }
  /* 기체 현황 · 입출항 기록 → 행 카드 */
  .fo-fleet thead, .fo-log thead { display: none; }
  .fo-fleet, .fo-fleet tbody, .fo-log, .fo-log tbody { display: block; }
  .fo-fleet tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 10px; padding: 12px 6px; border-bottom: 1px solid #edf1f0; }
  .fo-fleet td { display: block; padding: 0; border: 0; background: none !important; }
  .fo-fleet .c-ac { grid-column: 1; grid-row: 1; }
  .fo-fleet .c-ac b, .fo-fleet .c-ac small { display: inline; margin-right: 6px; }
  .fo-fleet .c-st { grid-column: 2; grid-row: 1; justify-self: end; }
  .fo-fleet .c-wh { grid-column: 1; grid-row: 2; font-size: max(var(--fs-min), .84rem); color: var(--text-2); }
  .fo-fleet .c-seen { grid-column: 2; grid-row: 2; justify-self: end; font-size: max(var(--fs-min), .82rem); }
  .fo-fleet .c-fno:not(:empty), .fo-fleet .c-alt { grid-column: 1 / -1; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
  .fo-fleet .c-fno, .fo-fleet .c-dep, .fo-fleet td.is-empty { display: none; }
  .fo-log tr { display: grid; grid-template-columns: auto auto minmax(0, 1fr); gap: 2px 10px; align-items: center; padding: 10px 4px; border-bottom: 1px solid #edf1f0; }
  .fo-log td { display: block; padding: 0; border: 0; white-space: normal; }
  .fo-log td:nth-child(3) { grid-column: 3; }
  .fo-log td:nth-child(4), .fo-log td:nth-child(5), .fo-log td:nth-child(6) { grid-row: 2; font-size: max(var(--fs-min), .8rem); color: var(--text-2); }
  .fo-log td:nth-child(4) { grid-column: 1; }
  .fo-log td:nth-child(5) { grid-column: 2; }
  .fo-log td:nth-child(6) { grid-column: 3; justify-self: end; }
  .fl-head { display: none; }
  .fl-row { grid-template-columns: 1fr 1fr 34px; }
  .fl-row .fl-type, .fl-row .fl-model { grid-row: 2; }
  .fl-row .fl-type { grid-column: 1; }
  .fl-row .fl-model { grid-column: 2; }
  .fl-row .mt-btn { grid-column: 3; grid-row: 1; }
}
@media print {
  .fo-fit, .fo-map .leaflet-control-zoom, .fo-map .leaflet-popup-pane { display: none !important; }
  .dflt-mapwrap .fo-map, .fo-map-full { height: 95mm !important; min-height: 0; }
  .dflt-side { max-height: none; overflow: visible; }
  .dash-flt, .fo-mapcard, .fo-board { break-inside: avoid; }
  .fo-legend, .fo-lb, .fo-apt b, .fo-apt i, .fo-ac, .fo-alert { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .fo-tiles { filter: grayscale(1) contrast(.9) brightness(1.08); }
}

/* 로그인 확인 중(작업증명 · 서버 확인) */
#login-form.is-busy button[type="submit"] { opacity: .6; cursor: progress; }

/* ── 수검 대응 센터 (js/audit.js) ── */
.au-bar { display: inline-block; width: 72px; height: 6px; border-radius: 3px; background: #e3e9e7; overflow: hidden; vertical-align: middle; }
.au-bar i { display: block; height: 100%; border-radius: 3px; background: var(--primary); }
.au-tbl .c-date { white-space: nowrap; }
.au-tbl .au-dd { color: var(--accent-dark); font-weight: 600; font-family: var(--mono); }
.au-tbl .c-prep { white-space: nowrap; }
.au-tbl .c-prep .cell-sub { display: inline; margin-left: 6px; }
.au-tbl .c-f { white-space: nowrap; }
.au-open { color: var(--danger); font-weight: 600; }
.au-tbl tr.is-cancel td { color: var(--text-3); }
.au-tbl tr.is-cancel .tbl-open { text-decoration: line-through; color: var(--text-3); }
.au-tbl tbody tr[data-aud], .au-ftbl tbody tr.is-click { cursor: pointer; }
.au-ftbl .c-txt { min-width: 260px; }
.au-ftbl .c-due, .au-ftbl .c-own, .au-ftbl .c-st { white-space: nowrap; }
.au-ftxt { white-space: pre-wrap; overflow-wrap: break-word; }
.au-ftbl .cell-sub { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-top: 3px; }
.au-act { color: var(--text-2); flex-basis: 100%; white-space: pre-wrap; }
.au-ref { display: inline-block; padding: 0 7px; border-radius: 5px; background: var(--primary-soft); color: var(--primary-dark); font-size: max(var(--fs-min), .8rem); font-weight: 600; line-height: 1.6; }
.au-files { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.au-files:empty { display: none; }
.au-file { display: inline-flex; align-items: center; gap: 2px; }
.au-file .nb-file span { max-width: 240px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.au-files-edit { margin: 0 0 8px; }
/* 상세 */
.au-detail { margin-bottom: 16px; }
.au-dh { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 12px; margin-bottom: 12px; }
.au-dh .spacer { flex: 1; }
#au-back svg { transform: rotate(180deg); }
.au-title { font-size: 1.2rem; font-weight: 700; letter-spacing: -.01em; margin: 0; }
.au-chips { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.au-ddchip { display: inline-block; padding: 1px 9px; border-radius: 6px; background: var(--accent-soft); color: var(--accent-dark); font-size: max(var(--fs-min), .8rem); font-weight: 700; }
.au-pre { white-space: pre-wrap; }
.au-sub h4 { font-size: max(var(--fs-min), .84rem); font-weight: 700; color: var(--text-2); margin: 14px 0 4px; }
.au-sec { margin-bottom: 16px; }
.au-sh { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; margin-bottom: 8px; }
.au-sh h3 { font-size: 1rem; font-weight: 700; margin: 0; }
.au-sh .spacer { flex: 1; }
.au-cnt { font-size: max(var(--fs-min), .84rem); color: var(--text-3); }
.au-sh .au-bar { width: 120px; }
.au-none { color: var(--text-3); font-size: .88rem; padding: 6px 2px; }
.au-checks { list-style: none; margin: 0; padding: 0; }
.au-sep { margin: 0 7px; color: #b9c4c1; }
/* 폼 */
.au-opts { display: flex; flex-wrap: wrap; gap: 8px 20px; margin: 2px 0 6px; }
.au-opt { display: inline-flex; align-items: center; gap: 7px; font-size: .88rem; font-weight: 600; color: var(--text-2); }
.au-opt input { width: 17px; height: 17px; accent-color: var(--primary); }
.au-mh { font-size: max(var(--fs-min), .8rem); font-weight: 500; color: var(--text-3); margin-left: 6px; }
.au-rep { margin: -6px 0 12px; font-size: max(var(--fs-min), .8rem); }
.au-rep:empty { display: none; }
.au-rep-i { display: block; color: var(--text-2); margin-top: 4px; }
/* 대시보드 띠 */
.dash-aud { margin-bottom: 20px; }
.dash-aud > .dc-head { padding: 0 4px; margin-bottom: 10px; }
.da-row { display: flex; flex-wrap: wrap; gap: 12px; }
.da-next { flex: 1 1 440px; min-width: 0; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 16px;
  padding: 14px 18px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); text-align: left; color: var(--text); }
.da-dd { font-size: 1.4rem; font-weight: 700; color: var(--accent-dark); letter-spacing: -.02em; white-space: nowrap; }
.da-t { min-width: 0; }
.da-t b { display: block; font-size: .95rem; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.da-t small { display: block; font-size: max(var(--fs-min), .82rem); color: var(--text-3); margin-top: 2px; }
.da-next .au-bar { width: 110px; }
.da-f { flex: 0 1 300px; display: flex; align-items: center; justify-content: center; gap: 20px; padding: 14px 18px;
  border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); font-size: .86rem; color: var(--text-2); white-space: nowrap; }
.da-f b { font-size: 1.15rem; color: var(--text); margin-left: 4px; }
.da-f.bad span:last-child b { color: var(--danger); }
@media (hover: hover) and (pointer: fine) { .da-next:hover, .da-f:hover { border-color: var(--primary); } }
.da-next:active, .da-f:active { transform: scale(.99); }
@media (max-width: 767px) {
  .au-tbl thead, .au-ftbl thead { display: none; }
  .au-tbl, .au-tbl tbody, .au-ftbl, .au-ftbl tbody { display: block; }
  .au-tbl tr[data-aud], .au-ftbl tr[data-fnd] { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; padding: 12px 8px; border-bottom: 1px solid #edf1f0; }
  .au-tbl tr[data-aud] td, .au-ftbl tr[data-fnd] td { display: block; padding: 0; border: 0; background: none !important; min-width: 0; }
  .au-tbl .c-name { grid-column: 1; grid-row: 1; }
  .au-tbl .c-st { grid-column: 2; grid-row: 1; justify-self: end; }
  .au-tbl .c-date { grid-column: 1; grid-row: 2; display: flex !important; align-items: baseline; gap: 8px; }
  .au-tbl .c-date .cell-sub { margin: 0; }
  .au-tbl .c-body { grid-column: 2; grid-row: 2; justify-self: end; }
  .au-tbl .c-prep { grid-column: 1; grid-row: 3; }
  .au-tbl .c-f { grid-column: 2; grid-row: 3; justify-self: end; }
  .au-ftbl .c-ft { grid-column: 1; grid-row: 1; }
  .au-ftbl .c-st { grid-column: 2; grid-row: 1; justify-self: end; text-align: right; }
  .au-ftbl .c-txt { grid-column: 1 / -1; grid-row: 2; min-width: 0; }
  .au-ftbl .c-aud { grid-column: 1; grid-row: 3; }
  .au-ftbl .c-due { grid-column: 2; grid-row: 3; justify-self: end; }
  .au-ftbl .c-own { grid-column: 1; grid-row: 4; font-size: max(var(--fs-min), .8rem); color: var(--text-2); }
  .au-ftbl-in .c-own { grid-row: 3; }
  .au-ftbl .c-st .cell-sub { display: inline; margin-left: 4px; }
  .au-title { font-size: 1.08rem; flex-basis: 100%; order: 2; }
  .au-dh #au-back { order: 1; }
  .au-dh .au-chips { order: 3; }
  .au-dh .spacer { order: 4; }
  .au-dh #au-edit { order: 5; }
  .au-sh .au-bar { width: 80px; }
  .da-next { grid-template-columns: auto minmax(0, 1fr); gap: 6px 14px; padding: 12px 14px; }
  .da-next .au-bar { grid-column: 1 / -1; width: 100%; }
  .da-f { flex: 1 1 100%; justify-content: space-between; padding: 12px 14px; }
}
@media print {
  .au-bar, .au-bar i, .au-ref, .au-ddchip { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .au-sec .au-sh { break-inside: avoid; }
  .au-sec { break-inside: auto; }
}

/* ── 업무 연락처 (phonebook) ── */
.pb-dot { display: inline-block; flex: none; width: 10px; height: 10px; border-radius: 3px; background: var(--gc, #646b73); }
/* 구역 선택 줄 */
.pb-groups { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.pb-gbtn { display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 0 11px; border: 1px solid var(--border); border-radius: 6px;
  background: var(--surface); font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--text-2); white-space: nowrap;
  transition: background-color .12s ease, border-color .12s ease, transform .16s var(--ease-out); }
.pb-gbtn:active { transform: scale(.97); }
.pb-gbtn .c { font-size: max(var(--fs-min), .78rem); color: var(--text-3); font-weight: 500; }
.pb-gbtn[aria-pressed="true"] { background: color-mix(in srgb, var(--gc, var(--primary)) 12%, #fff); border-color: var(--gc, var(--primary)); color: var(--text); }
@media (hover: hover) and (pointer: fine) { .pb-gbtn[aria-pressed="false"]:hover { border-color: var(--border-strong); color: var(--text); } }
/* 검색 · 보기 줄 */
.pb-bar { position: sticky; top: var(--header-h); z-index: 5; display: flex; align-items: center; flex-wrap: wrap; gap: 10px; padding: 6px 0 12px; background: var(--bg); }
.pb-bar .search-field { flex: 0 1 320px; }
.pb-chk { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 11px; border: 1px solid #f3d9a4; border-radius: 6px;
  background: var(--accent-soft); color: var(--accent-dark); font-size: max(var(--fs-min), .82rem); font-weight: 600; white-space: nowrap; }
.pb-chk[aria-pressed="true"] { background: var(--accent); border-color: var(--accent); color: #1f1300; }
.pb-result { display: inline-flex; align-items: center; gap: 8px; font-size: max(var(--fs-min), .82rem); color: var(--text-2); white-space: nowrap; }
.pb-result b { color: var(--primary-dark); font-weight: 700; }
.pb-clear { border: 0; background: none; padding: 2px 0; color: var(--primary); font-size: max(var(--fs-min), .82rem); font-weight: 600; text-decoration: underline; text-underline-offset: 3px; }
/* 구역별 카드 */
.pb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 460px), 1fr)); gap: 16px; align-items: start; }
.pb-sec { padding: 0; overflow: hidden; border-top: 4px solid var(--gc); margin: 0; }
.pb-sechead { display: flex; align-items: center; gap: 8px; padding: 12px 18px; background: color-mix(in srgb, var(--gc) 8%, #fff); border-bottom: 1px solid color-mix(in srgb, var(--gc) 18%, #fff); }
.pb-sechead h3 { font-size: 1.02rem; font-weight: 700; letter-spacing: -.01em; color: color-mix(in srgb, var(--gc) 70%, #0e1a1f); }
.pb-cnt { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.pb-mailall { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 7px; background: #fff; border: 1px solid color-mix(in srgb, var(--gc) 30%, #fff);
  font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-2); white-space: nowrap; }
.pb-row { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 36px; gap: 6px 8px; padding: 11px 12px 11px 18px; border-top: 1px solid #edf1f0; }
.pb-row:first-child { border-top: 0; }
.pb-row.is-check { background: linear-gradient(90deg, var(--accent-soft), rgba(254,243,220,.25)); }
.pb-who { min-width: 0; }
.pb-acts { grid-column: 1; display: flex; flex-wrap: wrap; gap: 6px; }
.pb-edit { grid-column: 2; grid-row: 1 / span 2; align-self: start; display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid transparent; border-radius: 8px; background: transparent; color: var(--text-3); }
@media (hover: hover) and (pointer: fine) { .pb-edit:hover { border-color: var(--border); background: var(--surface); color: var(--text); } }
.pb-nm { display: flex; align-items: baseline; flex-wrap: wrap; gap: 3px 8px; }
.pb-nm b { font-size: .98rem; font-weight: 700; }
.pb-title { font-size: max(var(--fs-min), .81rem); color: var(--text-2); font-weight: 500; }
.pb-meta { display: flex; flex-wrap: wrap; gap: 2px 6px; margin-top: 2px; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.pb-duty { color: var(--text-2); }
.pb-duty::before { content: "· "; color: var(--text-3); }
.pb-meta > span:first-child.pb-duty::before { content: ""; }
.pb-note { margin-top: 3px; font-size: max(var(--fs-min), .82rem); color: var(--text-2); }
.pb-verify { display: flex; align-items: flex-start; gap: 5px; margin-top: 4px; font-size: max(var(--fs-min), .81rem); color: var(--accent-dark); }
.pb-verify svg { flex: none; margin-top: 3px; }
.pb-flag { display: inline-flex; align-items: center; gap: 3px; padding: 0 7px; border-radius: 6px; background: var(--accent-soft); border: 1px solid #f3d9a4;
  font-size: max(var(--fs-min), .76rem); font-weight: 700; color: var(--accent-dark); white-space: nowrap; align-self: center; }
.pb-act { display: inline-flex; align-items: center; gap: 5px; min-height: 30px; padding: 0 10px; border: 1px solid var(--border); border-radius: 8px;
  background: var(--surface); color: var(--text); font-size: max(var(--fs-min), .84rem); font-weight: 600; text-decoration: none; white-space: nowrap; max-width: 100%;
  transition: background-color .12s ease, border-color .12s ease, transform .16s var(--ease-out); }
.pb-act:active, .pb-b:active { transform: scale(.97); }
.pb-act svg { flex: none; color: var(--primary); }
.pb-act > span:last-child { overflow: hidden; text-overflow: ellipsis; }
.pb-act.is-mob { background: var(--primary-soft); border-color: #bfe0da; color: var(--primary-dark); }
.pb-act.is-mail svg { color: var(--info); }
.pb-act.is-mail { font-weight: 500; }
.pb-act.is-ext { background: var(--surface-2); color: var(--text-2); }
.pb-k { font-size: max(var(--fs-min), .76rem); font-weight: 700; color: var(--text-3); }
.pb-pair { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; min-width: 0; }
.pb-sms, .pb-cp { display: inline-grid; place-items: center; min-height: 30px; padding: 0 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
  font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--text-2); text-decoration: none; white-space: nowrap; }
@media (hover: hover) and (pointer: fine) {
  .pb-act:hover, .pb-sms:hover, .pb-cp:hover, .pb-mailall:hover { border-color: var(--primary); }
  .pb-b:hover { border-color: var(--gc); }
}
.pb-sec mark, .pb-tile mark, .pb-tbl mark { background: #fde68a; color: inherit; border-radius: 3px; padding: 0 1px; }
/* 빠른 연락 */
.pb-qsec { margin-bottom: 18px; }
.pb-qh { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font-size: .92rem; font-weight: 700; color: color-mix(in srgb, var(--gc) 70%, #0e1a1f); }
.pb-qh .mono { font-size: max(var(--fs-min), .8rem); color: var(--text-3); font-weight: 500; }
.pb-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 10px; }
.pb-tile { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 12px 14px; border: 1px solid var(--border); border-left: 4px solid var(--gc); border-radius: 6px; background: var(--surface); }
.pb-tt { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 7px; }
.pb-tt b { font-size: 1rem; font-weight: 700; }
.pb-ts { font-size: max(var(--fs-min), .81rem); color: var(--text-3); min-height: 1.2em; }
.pb-big { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.pb-b { flex: 1 1 0; display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-width: 64px; min-height: 40px; padding: 0 8px;
  border: 1px solid var(--border); border-radius: 6px; background: var(--surface-2); color: var(--text); font-size: .86rem; font-weight: 600; text-decoration: none; white-space: nowrap;
  transition: border-color .12s ease, transform .16s var(--ease-out); }
.pb-b.is-call { background: var(--primary); border-color: var(--primary); color: #fff; }
.pb-b svg { flex: none; }
/* 표 */
.pb-tcard { padding: 0; overflow: hidden; }
.pb-tbl { width: 100%; border-collapse: collapse; font-size: max(var(--fs-min), .82rem); }
.pb-tbl thead th { position: sticky; top: 0; z-index: 1; padding: 9px 10px; background: var(--surface-2); border-bottom: 1px solid var(--border); text-align: left;
  font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-3); white-space: nowrap; }
.pb-tbl td { padding: 7px 10px; border-bottom: 1px solid #f0f3f2; vertical-align: top; }
.pb-tbl td:first-child { border-left: 4px solid var(--gc); }
.pb-tgrp th { padding: 10px 12px 7px; text-align: left; background: color-mix(in srgb, var(--gc) 8%, #fff); border-left: 4px solid var(--gc);
  border-bottom: 1px solid color-mix(in srgb, var(--gc) 18%, #fff); font-size: .86rem; font-weight: 700; color: color-mix(in srgb, var(--gc) 70%, #0e1a1f); }
.pb-tgrp .pb-dot { margin-right: 7px; }
.pb-tgrp .mono { margin-left: 7px; font-size: max(var(--fs-min), .78rem); font-weight: 500; color: var(--text-3); }
.pb-tbl .pb-tn { min-width: 130px; }
.pb-tbl .pb-tn b { font-weight: 700; }
.pb-tbl .pb-tn .pb-flag { margin-left: 4px; }
.pb-tbl a { white-space: nowrap; }
.pb-tbl tr.is-check td { background: var(--accent-soft); }
.pb-tbl .pb-edit { width: 28px; height: 28px; }
.pb-tnote { min-width: 150px; color: var(--text-2); }
.pb-link { border: 0; background: none; padding: 0; color: var(--primary-dark); font-weight: 600; text-decoration: underline dotted; text-underline-offset: 3px; }
/* 참고 */
.pb-notes { margin-top: 16px; }
.pb-notes h3 { font-size: .92rem; font-weight: 700; margin-bottom: 6px; }
.pb-notes ul { margin: 0; padding-left: 20px; display: flex; flex-direction: column; gap: 4px; font-size: .88rem; color: var(--text-2); }
/* 편집 */
.pb-checkrow { display: flex; align-items: center; gap: 10px; }
.pb-checkrow > input { flex: 1; min-width: 0; }
.pb-cb { display: inline-flex; align-items: center; gap: 6px; margin: 0; white-space: nowrap; font-weight: 600; color: var(--accent-dark); }
.pb-cb input { width: 18px; height: 18px; }
.pb-glist { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.pb-grow { display: flex; align-items: center; gap: 6px; }
.pb-gsw { flex: none; width: 14px; height: 30px; border-radius: 4px; background: var(--gc); }
.pb-gname { flex: 1; min-width: 0; }
.pb-gcol { width: 84px; flex: none; }
.pb-gn { width: 28px; text-align: right; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.pb-gmv, .pb-gdel { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid var(--border); border-radius: 7px; background: var(--surface); color: var(--text-2); font-size: max(var(--fs-min), .76rem); }
.pb-gmv:disabled, .pb-gdel:disabled { opacity: .35; }
@media (max-width: 767px) {
  .pb-groups { flex-wrap: nowrap; overflow-x: auto; margin: 0 -14px 10px; padding: 0 14px 4px; scrollbar-width: none; }
  .pb-groups::-webkit-scrollbar { display: none; }
  .pb-bar { position: static; }
  .pb-bar .search-field { flex: 1 1 100%; }
  .pb-sechead { padding: 11px 14px; }
  .pb-row { padding: 10px 8px 10px 14px; }
  .pb-act.is-mail > span:last-child { max-width: 190px; }
}
@media print {
  .pb-bar, .pb-groups, .pb-edit, .pb-sms, .pb-cp, .pb-mailall { display: none !important; }
  .pb-grid { display: block; }
  .pb-sec { break-inside: auto; margin-bottom: 10px; }
  .pb-row { break-inside: avoid; grid-template-columns: 1fr; }
  .pb-act { border: 0; padding: 0 6px 0 0; min-height: 0; background: none !important; }
  .pb-sec, .pb-sechead, .pb-dot, .pb-tile, .pb-row.is-check, .pb-flag, .pb-tgrp th, .pb-tbl td { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .pb-b:not(.is-ext) { display: none; }
}

/* ── 수검 대응 센터 — 점검 체크리스트 (점검관용 양식: 문서 · 시행 0~4 · N/A) ── */
.ck-src { margin: -2px 0 12px; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.ck-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: 8px; margin-bottom: 12px; }
.ck-kpi { display: flex; flex-direction: column; align-items: flex-start; gap: 1px; min-width: 0; padding: 9px 12px; border: 1px solid var(--border);
  border-radius: 6px; background: var(--surface); text-align: left; color: var(--text); transition: border-color .12s ease, background-color .12s ease, transform .16s var(--ease-out); }
.ck-kpi[disabled] { cursor: default; }
button.ck-kpi:not([disabled]):active { transform: scale(.98); }
.ck-kpi-l { font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-3); white-space: nowrap; }
.ck-kpi b { font-size: 1.12rem; font-weight: 700; line-height: 1.25; }
.ck-kpi small { font-size: max(var(--fs-min), .78rem); color: var(--text-3); }
.ck-kpi.t-bad b { color: var(--danger); }
.ck-kpi.t-warn b { color: var(--accent-dark); }
.ck-kpi.t-ok b { color: var(--success); }
.ck-kpi[aria-pressed="true"] { border-color: var(--primary); background: var(--primary-soft); }
@media (hover: hover) and (pointer: fine) { button.ck-kpi:not([disabled]):hover { border-color: var(--border-strong); } }
.ck-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 4px 0 10px; border-bottom: 1px solid #edf1f0; }
.ck-f { display: inline-flex; align-items: center; gap: 7px; font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--text-2); }
.ck-f select { min-height: 34px; max-width: 260px; padding: 0 30px 0 10px; border: 1px solid var(--border); border-radius: 8px; background-color: var(--surface); font-size: .86rem; }
.ck-shown { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
/* 영역 */
.ck-grp { padding-top: 14px; }
.ck-gh { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; padding: 8px 12px; border-radius: 6px; background: var(--surface-2); border: 1px solid #e8eeec; }
.ck-gh h4 { margin: 0; font-size: .92rem; font-weight: 700; flex: 1 1 auto; min-width: 0; }
.ck-gsum { font-size: max(var(--fs-min), .8rem); color: var(--text-2); white-space: nowrap; }
.ck-gsum b { color: var(--text); font-weight: 700; }
.ck-gh .au-bar { width: 80px; }
.ck-rows { list-style: none; margin: 0; padding: 0; }
/* 항목 */
.ck-row { display: grid; grid-template-columns: 48px minmax(0, 1fr); gap: 4px 10px; padding: 12px 4px 12px 2px; border-bottom: 1px solid var(--border-strong); }
.ck-row:last-child { border-bottom: 0; }
.ck-no { padding-top: 2px; font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--primary-dark); }
.ck-main { min-width: 0; }
.ck-head { display: flex; align-items: flex-start; gap: 10px; }
.ck-t { flex: 1; min-width: 0; font-size: .93rem; white-space: pre-line; overflow-wrap: break-word; }
.ck-state { flex: none; }
.ck-refs { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 5px; }
.ck-refs .au-ref { font-weight: 500; }
/* SSOP 조항 — 현재 SSOP 의 해당 조항 · 별첨(기준 문서 PDF 의 그 쪽). 칩 없이 글자 링크 한 줄 */
.ck-sop { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 0; margin-top: 4px; font-size: max(var(--fs-min), .8rem); line-height: 1.55; }
.ck-sop-k { margin-right: 8px; font-size: max(var(--fs-min), .78rem); font-weight: 600; color: var(--text-3); white-space: nowrap; }
.ck-sopc { color: var(--primary-dark); font-weight: 600; white-space: nowrap; text-decoration: none; border-radius: 3px; }
a.ck-sopc { text-underline-offset: 3px; }
@media (hover: hover) and (pointer: fine) { a.ck-sopc:hover { text-decoration: underline; } }
a.ck-sopc:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
span.ck-sopc { color: var(--text-2); font-weight: 500; }
.ck-sop-sep { margin: 0 6px; color: var(--text-3); }
.ck-src-sop b { color: var(--text-2); font-weight: 600; }
.ck-sopopt small { margin-left: 6px; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
@media screen and (max-width: 767px) { .ck-sopc { display: inline-block; padding: 3px 0; } }
.ck-ctl { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin-top: 8px; }
.ck-ctl .spacer { flex: 1; }
.ck-sc { display: inline-flex; align-items: center; gap: 0; height: 32px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); overflow: hidden; }
.ck-sc-k { display: inline-flex; align-items: center; height: 100%; padding: 0 8px; font-size: max(var(--fs-min), .8rem); font-weight: 700; color: var(--text-3); background: var(--surface-2); border-right: 1px solid var(--border); }
.ck-sc select { height: 100%; min-width: 118px; padding: 0 26px 0 8px; border: 0; background-color: transparent; font-size: max(var(--fs-min), .84rem); font-weight: 600; cursor: pointer; }
.ck-sc select:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }
span.ck-sc b { padding: 0 4px 0 9px; font-size: .9rem; }
span.ck-sc small { padding-right: 9px; font-size: max(var(--fs-min), .8rem); color: var(--text-2); }
.ck-sc[data-v="0"] { border-color: #e7b4ae; background: var(--danger-soft); }
.ck-sc[data-v="1"], .ck-sc[data-v="2"] { border-color: #f0d49c; background: var(--accent-soft); }
.ck-sc[data-v="3"] { border-color: #b7dcc7; background: var(--success-soft); }
.ck-sc[data-v="4"] { border-color: #b9cfee; background: var(--info-soft); }
.ck-sc[data-v="0"] select, .ck-sc[data-v="0"] b { color: var(--danger); }
.ck-sc[data-v="1"] select, .ck-sc[data-v="2"] select, .ck-sc[data-v="1"] b, .ck-sc[data-v="2"] b { color: #8a4b06; }
.ck-sc[data-v="3"] select, .ck-sc[data-v="3"] b { color: var(--success); }
.ck-sc[data-v="4"] select, .ck-sc[data-v="4"] b { color: var(--info); }
.ck-sc.is-na { opacity: .55; }
.ck-na { height: 32px; padding: 0 11px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); font-size: max(var(--fs-min), .8rem); font-weight: 700; color: var(--text-3);
  transition: background-color .12s ease, border-color .12s ease, transform .16s var(--ease-out); }
.ck-na:active { transform: scale(.96); }
.ck-na[aria-pressed="true"] { background: #53636a; border-color: #53636a; color: #fff; }
@media (hover: hover) and (pointer: fine) { .ck-na[aria-pressed="false"]:hover { border-color: var(--border-strong); color: var(--text); } }
.ck-row[data-st="na"] .ck-t { color: var(--text-3); }
.ck-meta { margin-top: 6px; font-size: max(var(--fs-min), .82rem); color: var(--text-2); }
.ck-note { white-space: pre-line; }
.ck-ev { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 7px; }
.ck-link { display: inline-flex; align-items: center; gap: 5px; min-height: 28px; padding: 0 10px; border: 1px solid #cfe3de; border-radius: 7px; background: var(--primary-soft);
  color: var(--primary-dark); font-size: max(var(--fs-min), .8rem); font-weight: 600; white-space: nowrap; }
button.ck-link:active { transform: scale(.97); }
@media (hover: hover) and (pointer: fine) { button.ck-link:hover { border-color: var(--primary); } }
.ck-link.is-plan { border-style: dashed; border-color: var(--border-strong); background: var(--surface); color: var(--text-3); font-weight: 500; }
.ck-link.is-plan small { font-size: max(var(--fs-min), .76rem); color: var(--text-3); }
.ck-link.is-plan small::before { content: "·"; margin-right: 5px; }
/* 항목 수정 · 불러오기 · 근거 요지 */
.ck-fixed { padding: 10px 12px; margin-bottom: 12px; border-radius: 6px; background: var(--surface-2); border: 1px solid #e8eeec; }
.ck-rchoose { display: flex; flex-wrap: wrap; gap: 6px; }
.ck-rchoose .ck-rc { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; margin: 0; padding: 0 11px; border: 1px solid var(--border); border-radius: 8px;
  font-size: max(var(--fs-min), .82rem); font-weight: 500; color: var(--text-2); cursor: pointer; }
.ck-rchoose .ck-rc input { flex: none; width: 15px; height: 15px; margin: 0; padding: 0; border: 0; accent-color: var(--primary); }
.ck-rchoose .ck-rc small { font-size: max(var(--fs-min), .76rem); color: var(--text-3); }
.ck-rchoose .ck-rc:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-dark); font-weight: 600; }
.cl-src { margin: 0 0 10px; font-size: .88rem; }
.cl-secs { display: grid; gap: 6px; margin-bottom: 12px; }
.cl-sec { display: grid; grid-template-columns: 18px 26px minmax(0, 1fr) auto; align-items: center; gap: 8px; min-height: 42px; padding: 0 12px;
  border: 1px solid var(--border); border-radius: 6px; font-size: .88rem; cursor: pointer; }
.cl-sec input { width: 17px; height: 17px; accent-color: var(--primary); }
.cl-sec:has(input:checked) { border-color: var(--primary); background: var(--primary-soft); }
.cl-sec.is-have { cursor: default; color: var(--text-3); background: var(--surface-2); }
.cl-no { font-weight: 700; color: var(--primary-dark); }
.cl-st { min-width: 0; }
.cl-n { font-size: max(var(--fs-min), .82rem); color: var(--text-3); white-space: nowrap; }
.bs-ssi { display: inline-block; margin-left: 6px; padding: 1px 8px; border-radius: 6px; background: var(--danger-soft); color: var(--danger); font-size: max(var(--fs-min), .76rem); font-weight: 700; vertical-align: middle; }
.bs-t { margin: 0 0 6px; font-weight: 600; white-space: pre-line; }
.bs-mid { margin: 0 0 4px; font-size: max(var(--fs-min), .84rem); color: var(--primary-dark); }
.bs-body + .bs-mid { margin-top: 18px; }
.ck-rel { margin-top: 2px; }
.bs-body { margin-top: 12px; padding: 12px 14px; border-radius: 6px; background: var(--surface-2); border: 1px solid #e8eeec; font-size: .88rem; line-height: 1.65; max-height: 56vh; overflow: auto; }
.bs-body p { margin: 0 0 6px; overflow-wrap: break-word; }
.bs-body h5 { margin: 12px 0 6px; font-size: max(var(--fs-min), .84rem); font-weight: 700; color: var(--primary-dark); }
.bs-body .bs-li { padding-left: 4px; }
.bs-body .bs-note { color: var(--accent-dark); font-size: max(var(--fs-min), .84rem); }
.ck-no-m { display: none; }
@media (max-width: 767px) {
  .ck-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
  .ck-kpi { padding: 7px 8px; }
  .ck-kpi-l { font-size: max(var(--fs-min), .76rem); }
  .ck-kpi b { font-size: 1rem; }
  .ck-row { grid-template-columns: minmax(0, 1fr); padding: 12px 0; }
  .ck-no { display: none; }
  .ck-no-m { display: inline; margin-right: 7px; font-size: max(var(--fs-min), .8rem); font-weight: 700; color: var(--primary-dark); }
  .ck-sc { flex: 1 1 calc(50% - 4px); min-width: 0; }
  .ck-sc select { flex: 1; min-width: 0; width: auto; padding-right: 22px; font-size: max(var(--fs-min), .8rem); }
  .ck-sc-k { padding: 0 7px; }
  .ck-gh .au-bar { display: none; }
  .ck-f select { max-width: 200px; }
}
/* A4 — 점검관용 양식 */
@media print {
  .ck-list, .ck-kpis, .ck-bar, .ck-src { display: none !important; }
  .au-print { margin-top: 2mm; }
  .au-pcap { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2mm 6mm; margin-bottom: 2mm; font-size: 8.6pt; }
  .au-pcap span { color: #444; }
  .au-ptbl { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 8.4pt; line-height: 1.4; }
  .au-ptbl th, .au-ptbl td { border: 1px solid #9aa7a7; padding: 1.2mm 1.6mm; vertical-align: top; overflow-wrap: break-word; }
  .au-ptbl thead th { background: #e7eeed !important; font-weight: 700; text-align: center; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .au-ptbl thead { display: table-header-group; }
  .au-ptbl td.c { text-align: center; vertical-align: middle; font-weight: 700; }
  .au-pt { white-space: pre-line; }
  .au-pr { font-size: 7.6pt; color: #333; }
  .au-psop { margin-top: .8mm; padding-top: .6mm; border-top: 1px dotted #b8c4c3; font-size: 7.4pt; color: #224; }
  .au-psop b { font-weight: 700; }
  .ck-sop { display: none; }
  .au-pn { font-size: 7.6pt; color: #333; white-space: pre-line; }
  .au-psec td, .au-ptot td { background: #f1f5f4 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .au-psec td span, .au-ptot td span { float: right; font-size: 7.8pt; color: #333; }
  .au-psec, .au-ptot { break-after: avoid; }
  .au-pssi { margin-top: 2mm; font-size: 7.8pt; color: #7a1c14; }
}
.ck-link small { font-size: max(var(--fs-min), .78rem); font-weight: 500; color: var(--primary-dark); opacity: .85; }
.ck-link small::before { content: "·"; margin-right: 5px; }
.ck-link.is-warn { border-color: #f0d49c; background: var(--accent-soft); color: #8a4b06; }
.ck-link.is-warn small { color: #8a4b06; }

/* ── 보안교육 · 자격 관리 (js/training.js) ── */
.tr-sh { display: flex; align-items: center; gap: 8px 10px; margin-bottom: 8px; }
.tr-sh h3, .tr-sh h4 { margin: 0; font-size: 1rem; font-weight: 700; }
.tr-sh h4 { font-size: .92rem; }
.tr-sh .spacer { flex: 1; }
.tr-cnt { font-size: max(var(--fs-min), .84rem); color: var(--text-3); }
.tr-due { margin-bottom: 16px; }
.tr-role { display: inline-block; margin: 0 4px 3px 0; padding: 0 7px; border-radius: 5px; background: #eef2f1; color: var(--text-2); font-size: max(var(--fs-min), .8rem); font-weight: 600; line-height: 1.7; white-space: nowrap; }
.tr-gtbl .c-cell { white-space: nowrap; }
.tr-gtbl tbody td[data-tcell] { cursor: pointer; }
.tr-cell { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 1px; }
.tr-cell small { font-size: max(var(--fs-min), .78rem); color: var(--text-3); }
.tr-cell[data-st="exp"] small { color: var(--danger); font-weight: 600; }
.tr-cell[data-st="soon"] small { color: var(--accent-dark); font-weight: 600; }
.tr-na { color: #b9c4c1; }
.tr-stbl .c-date, .tr-stbl .c-n, .tr-stbl .c-kind { white-space: nowrap; }
.tr-stbl .c-name { min-width: 240px; }
.tr-miss { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.tr-miss small { font-size: max(var(--fs-min), .78rem); color: var(--text-3); }
.tr-ptbl .c-st, .tr-ptbl .c-ssi { white-space: nowrap; }
.tr-stbl tbody tr.is-click, .tr-ptbl tbody tr.is-click { cursor: pointer; }
.tr-roleadd { margin-top: 8px; width: 100%; max-width: 280px; min-height: 36px; padding: 0 11px; border: 1.5px solid var(--border-strong); border-radius: var(--radius-sm); font-size: .86rem; }
#modal-box > .seg { margin: 0 0 14px; }
@media (max-width: 767px) {
  .tr-gtbl thead, .tr-stbl thead, .tr-ptbl thead { display: none; }
  .tr-gtbl, .tr-gtbl tbody, .tr-stbl, .tr-stbl tbody, .tr-ptbl, .tr-ptbl tbody { display: block; }
  .tr-gtbl tbody tr, .tr-stbl tbody tr, .tr-ptbl tbody tr { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 6px 10px; padding: 12px 8px; border-bottom: 1px solid #edf1f0; }
  .tr-gtbl tbody td, .tr-stbl tbody td, .tr-ptbl tbody td { display: block; padding: 0; border: 0; background: none !important; min-width: 0; }
  .tr-gtbl .c-name, .tr-ptbl .c-name, .tr-stbl .c-name { flex: 1 1 60%; }
  .tr-gtbl .c-roles, .tr-ptbl .c-roles { flex: 1 1 100%; order: 2; }
  .tr-gtbl .c-cell { order: 3; display: inline-flex !important; align-items: center; gap: 6px; padding: 4px 8px !important; border: 1px solid #edf1f0 !important; border-radius: 8px; }
  .tr-gtbl .c-cell::before { content: attr(data-label); font-size: max(var(--fs-min), .78rem); font-weight: 600; color: var(--text-3); }
  .tr-gtbl .c-cell .tr-cell { flex-direction: row; align-items: center; gap: 5px; }
  .tr-stbl .c-date { order: 0; flex: 1 1 100%; }
  .tr-stbl .c-rec, .tr-stbl .c-kind, .tr-stbl .c-n { order: 3; }
  .tr-gtbl .c-cell.is-na { display: none !important; }
  .tr-ptbl .c-ssi { order: 3; flex: 1 1 100%; font-size: max(var(--fs-min), .84rem); }
  .tr-ptbl .c-ssi::before { content: attr(data-label); display: inline-block; width: 64px; font-size: max(var(--fs-min), .78rem); font-weight: 600; color: var(--text-3); }
  .tr-ptbl .c-st { order: 1; }
}
@media print {
  .tr-gtbl .c-cell small { color: #333 !important; }
  .tr-due { break-inside: avoid; }
}

/* ── SSI 서약 — SeMIS v2 보안서약서 명단 (js/training.js 'SSI 서약' 탭) ── */
.tr-src { display: inline-block; margin-left: 5px; padding: 0 6px; border-radius: 6px; background: #eef4f3; color: var(--text-3); font-size: max(var(--fs-min), .76rem); font-weight: 700; vertical-align: middle; }
.tr-semis { display: block; margin-top: 4px; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.tr-semis.is-warn { color: #8a4b06; }
.tr-plmiss { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0; font-size: .9rem; }
.tr-plmiss .tr-semis { display: inline; }
.tr-plnote { margin: 10px 0 0; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.tr-pltbl .c-no { width: 56px; text-align: center; color: var(--text-3); }
.tr-pltbl .c-date { white-space: nowrap; }
@media (max-width: 640px) {
  .tr-pltbl thead { display: none; }
  .tr-pltbl, .tr-pltbl tbody { display: block; }
  .tr-pltbl tbody tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 10px; padding: 11px 6px; border-bottom: 1px solid #edf1f0; }
  .tr-pltbl tbody td { display: block; padding: 0; border: 0; background: none !important; min-width: 0; }
  .tr-pltbl .c-no { display: none; }
  .tr-pltbl .c-name { grid-column: 1; grid-row: 1; }
  .tr-pltbl .c-date { grid-column: 2; grid-row: 1; text-align: right; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
  .tr-pltbl .c-dept { grid-column: 1; grid-row: 2; font-size: .86rem; color: var(--text-2); }
  .tr-pltbl .c-pos { grid-column: 1; grid-row: 3; font-size: max(var(--fs-min), .84rem); color: var(--text-3); }
  .tr-pltbl .c-st { grid-column: 2; grid-row: 2 / span 2; align-self: center; }
}
@media print {
  #tr-pllist .toolbar, #tr-plbody { display: none !important; }
  .tr-plcap { display: flex; justify-content: space-between; gap: 6mm; margin-bottom: 2mm; font-size: 9pt; }
  .tr-plcap span { color: #444; }
  .tr-plptbl { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 9pt; }
  .tr-plptbl th, .tr-plptbl td { border: 1px solid #9aa7a7; padding: 1.4mm 1.8mm; overflow-wrap: break-word; }
  .tr-plptbl thead { display: table-header-group; }
  .tr-plptbl thead th { background: #e7eeed !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .tr-plptbl tr { break-inside: avoid; }
  .tr-plptbl td.c { text-align: center; }
}

/* ── 보안 기록부 (js/seclog.js, 라우트 inspection) ── */
.sl-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 12px; }
.sl-card { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 14px 16px 12px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); }
.sl-card::before { content: ""; position: absolute; left: 0; top: 12px; bottom: 12px; width: 3px; border-radius: 0 3px 3px 0; background: var(--border-strong); }
.sl-card[data-tone="ok"]::before { background: var(--success); }
.sl-card[data-tone="ng"]::before, .sl-card[data-tone="part"]::before { background: var(--accent); }
.sl-card[data-tone="none"]::before { background: var(--danger); }
.sl-card-h { display: flex; align-items: baseline; gap: 8px; }
.sl-card-h b { font-size: .98rem; font-weight: 700; line-height: 1.35; }
.sl-cyc { flex: none; margin-left: auto; padding: 1px 8px; border-radius: 999px; background: var(--surface-2); border: 1px solid var(--border); font-size: max(var(--fs-min), .78rem); font-weight: 600; color: var(--text-3); white-space: nowrap; }
.sl-card-s { display: flex; align-items: center; gap: 7px; font-size: .92rem; font-weight: 600; }
.sl-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--border-strong); flex: none; }
.sl-card[data-tone="ok"] .sl-dot { background: var(--success); }
.sl-card[data-tone="ng"] .sl-dot, .sl-card[data-tone="part"] .sl-dot { background: var(--accent); }
.sl-card[data-tone="none"] .sl-dot { background: var(--danger); }
.sl-card-sub { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.sl-card-f { display: flex; align-items: center; gap: 8px; margin-top: 4px; }
.sl-card-f .spacer { flex: 1; }
.sl-ev { font-size: max(var(--fs-min), .78rem); color: var(--text-3); letter-spacing: .01em; }
/* 기록 현황 */
.sl-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-bottom: 12px; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.sl-legend span { display: inline-flex; align-items: center; gap: 5px; }
.sl-legend span::before { content: ""; width: 12px; height: 12px; border-radius: 3px; }
.sl-row { padding: 12px 0; border-top: 1px solid #edf1f0; }
.sl-row:first-of-type { border-top: 0; }
.sl-row-h { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 10px; margin-bottom: 8px; }
.sl-row-h b { font-size: .95rem; }
.sl-row-h .sl-cyc { margin-left: 0; }
.sl-row-h .spacer { flex: 1; }
.sl-rate { font-size: .86rem; font-weight: 700; color: var(--text-2); }
.sl-row-b { font-size: .88rem; color: var(--text-2); }
.sl-strip { display: flex; flex-wrap: wrap; gap: 3px; }
.sl-cell { width: 16px; height: 16px; padding: 0; border: 0; border-radius: 4px; cursor: pointer; }
.sl-cell:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
.sl-cell[data-c="ok"], .sl-legend [data-c="ok"]::before { background: #2f9e6a; }
.sl-cell[data-c="ng"], .sl-legend [data-c="ng"]::before { background: var(--accent); }
.sl-cell[data-c="part"], .sl-legend [data-c="part"]::before { background: #f6d38c; }
.sl-cell[data-c="miss"], .sl-legend [data-c="miss"]::before { background: #e0685c; }
.sl-cell[data-c="cur"], .sl-legend [data-c="cur"]::before { background: #fff; box-shadow: inset 0 0 0 1.5px var(--border-strong); }
.sl-miss { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; font-size: max(var(--fs-min), .82rem); }
.sl-miss > span:first-child { font-weight: 700; color: var(--danger); }
.sl-mbtn { border: 1px solid #f1c4bf; background: var(--danger-soft); color: var(--danger); border-radius: 7px; padding: 2px 8px; font-size: max(var(--fs-min), .82rem); }
/* 입력 */
.sl-seg { display: inline-flex; flex: none; gap: 2px; padding: 2px; border: 1px solid #d6dedb; border-radius: 6px; background: var(--surface-2); }
.sl-seg button { min-height: 34px; padding: 0 12px; border: 0; border-radius: 7px; background: transparent; font-size: max(var(--fs-min), .84rem); font-weight: 600; color: var(--text-2); white-space: nowrap; }
.sl-seg button[data-v="ok"][aria-pressed="true"] { background: var(--success); color: #fff; }
.sl-seg button[data-v="ng"][aria-pressed="true"] { background: var(--accent); color: #1f1300; }
.sl-seg button[data-v="na"][aria-pressed="true"] { background: #64748b; color: #fff; }
.sl-checks { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; counter-reset: slc; }
.sl-checks li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 10px; border: 1px solid #edf1f0; border-radius: 6px; counter-increment: slc; }
.sl-ct { flex: 1; min-width: 0; font-size: .9rem; }
.sl-ct::before { content: counter(slc) ". "; color: var(--text-3); font-weight: 600; }
.sl-allok { margin-left: 8px; border: 1px solid var(--border); background: var(--surface); border-radius: 7px; padding: 1px 9px; font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--primary-dark); }
.sl-rounds { display: grid; gap: 6px; margin-bottom: 8px; }
.sl-round { display: grid; grid-template-columns: 112px minmax(0, 1fr) minmax(0, 1.4fr) auto; gap: 6px; align-items: center; }
.sl-fbtns { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.sl-g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sl-pick { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 8px; }
.sl-pbtn { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); text-align: left; }
.sl-pbtn b { font-size: .92rem; }
.sl-pbtn span { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
@media (hover: hover) and (pointer: fine) { .sl-pbtn:hover { border-color: var(--primary); } }
/* 점검 양식 */
.sl-tpls { display: grid; gap: 10px; margin-bottom: 10px; }
.sl-tpl { padding: 12px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-2); }
.sl-tpl-h { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.sl-tpl-h input[data-k="name"] { flex: 1; font-weight: 700; }
.sl-on { display: inline-flex; align-items: center; gap: 5px; font-size: max(var(--fs-min), .84rem); white-space: nowrap; }
.sl-tpl-g { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin-bottom: 8px; }
.sl-tpl-g label, .sl-tpl-items { display: flex; flex-direction: column; gap: 4px; font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--text-3); }
.sl-tpl input, .sl-tpl select, .sl-tpl textarea { width: 100%; }
.sl-checks.is-view li { justify-content: space-between; }
@media (max-width: 640px) {
  .sl-checks li { flex-direction: column; align-items: stretch; }
  .sl-seg { width: 100%; }
  .sl-seg button { flex: 1; }
  .sl-round { grid-template-columns: 100px minmax(0, 1fr) auto; }
  .sl-round input[data-rn] { grid-column: 1 / -1; grid-row: 2; }
  .sl-g3 { grid-template-columns: 1fr 1fr; }
  .sl-tbl thead { display: none; }
  .sl-tbl, .sl-tbl tbody { display: block; }
  .sl-tbl tbody tr { display: flex; flex-wrap: wrap; gap: 4px 10px; padding: 11px 6px; border-bottom: 1px solid #edf1f0; }
  .sl-tbl tbody td { display: block; padding: 0; border: 0; background: none !important; min-width: 0; }
  .sl-tbl .c-name { flex: 1 1 60%; order: 0; }
  .sl-tbl .c-date { order: 1; }
  .sl-tbl .c-by, .sl-tbl .c-res { order: 2; }
  .sl-tbl .c-what { order: 3; flex: 1 1 100%; font-size: .86rem; color: var(--text-2); }
}
@media print {
  .sl-card-f button, .sl-mbtn { display: none !important; }
  .sl-cards { grid-template-columns: repeat(2, 1fr); }
  .sl-card, .sl-row { break-inside: avoid; }
  .sl-cell { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ── 바로가기 — 링크 아이콘(사이트 아이콘 · 선 아이콘 · 이모지) · 전체 화면 · 편집 ── */
.lki { display: inline-grid; place-items: center; flex: none; width: 22px; height: 22px; border-radius: 6px; overflow: hidden;
  font-size: max(var(--fs-min), .82rem); line-height: 1; }
.lki .ico { width: 64%; height: 64%; }
.lki.lki-img { background: #fff; box-shadow: inset 0 0 0 1px var(--border); }
.lki.lki-img img { display: block; width: 76%; height: 76%; object-fit: contain; }
.lki.lki-emo { background: var(--surface-2); box-shadow: inset 0 0 0 1px var(--border); color: var(--text); }
.t-teal   { --tn-bg: #dcf1ec; --tn-fg: #0b5550; }
.t-blue   { --tn-bg: #e2ecfb; --tn-fg: #1d4f91; }
.t-indigo { --tn-bg: #e7e7fb; --tn-fg: #3f3aa8; }
.t-violet { --tn-bg: #f0e6fb; --tn-fg: #6b21a8; }
.t-rose   { --tn-bg: #fce4e9; --tn-fg: #a8163a; }
.t-amber  { --tn-bg: #fcefd6; --tn-fg: #9a4a07; }
.t-green  { --tn-bg: #e1f2e8; --tn-fg: #166238; }
.t-slate  { --tn-bg: #e6eaef; --tn-fg: #334155; }
.lki.lki-ico { background: var(--tn-bg, #dcf1ec); color: var(--tn-fg, #0b5550); }
.lki.lk-ico { width: 40px; height: 40px; border-radius: 6px; font-size: 1.15rem; }
.lki.lk-ico .ico { width: 55%; height: 55%; }
.lki.lki-lg { width: 60px; height: 60px; border-radius: 6px; font-size: 1.7rem; }
.lki.lki-lg .ico { width: 50%; height: 50%; }
.lki.mt-lki { width: 26px; height: 26px; border-radius: 7px; font-size: .9rem; }
.lki.sc-hlki { width: 20px; height: 20px; border-radius: 5px; }
.nav-item .nav-lki { margin-left: -3px; }
@media print { .lki { -webkit-print-color-adjust: exact; print-color-adjust: exact; } }

/* 허브 패널 '바로가기' 머리글 — 전체 보기 · 추가 */
.hub-links .hub-block-t { gap: 2px; }
.hub-links .hb-t { flex: 1; min-width: 0; }
.hb-act { display: grid; place-items: center; width: 28px; height: 28px; margin: -4px 0; border: 0; border-radius: 8px;
  background: none; color: var(--text-3); }
@media (hover: hover) and (pointer: fine) { .hb-act:hover { background: #e6eeeb; color: var(--primary-dark); } }
@media (max-width: 767px) { .hb-act { width: 38px; height: 38px; margin: -9px 0; } }

/* 바로가기 화면 */
.sc-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 22px; }
.sc-bar .search-field { flex: 1 1 260px; max-width: 440px; }
.sc-tools { display: flex; gap: 8px; flex-wrap: wrap; }
.sc-tools:empty { display: none; }
.sc-sec + .sc-sec { margin-top: 28px; }
.sc-h { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font-size: 1rem; font-weight: 700; letter-spacing: -.01em; }
.sc-hico { display: flex; color: var(--primary); }
.sc-up { color: var(--text-3); font-weight: 500; white-space: nowrap; }
.sc-up::after { content: "›"; margin-left: 8px; color: var(--border-strong); }
.sc-ht { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.sc-n { font-family: var(--mono); font-size: max(var(--fs-min), .78rem); font-weight: 600; color: var(--text-3); padding: 1px 7px; border-radius: 5px; background: var(--surface-2); border: 1px solid var(--border); }
.sc-sec.is-sub { margin-left: 22px; padding-left: 16px; border-left: 2px dashed var(--border-strong); }
.sc-sec.is-focus .sc-h { color: var(--primary-dark); }
.sc-sec .empty-state { padding: 26px 16px; }
#sc-body.is-editing .sc-grid { gap: 16px 12px; }
.sc-item { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.lk-card.is-edit { border-left-color: var(--accent); }
.lk-card.is-edit .lk-go { color: var(--accent-dark); }
.lk-card.is-dim { opacity: .55; }
.sc-acts { display: flex; align-items: center; gap: 6px; }
.sc-sp { flex: 1; }
.sc-act { display: grid; place-items: center; width: 34px; height: 32px; border: 1px solid var(--border); border-radius: 8px;
  background: var(--surface); color: var(--text-2); }
@media (hover: hover) and (pointer: fine) {
  .sc-act:hover { border-color: var(--border-strong); color: var(--text); background: var(--surface-2); }
  .sc-act.danger:hover { color: var(--danger); border-color: #f3c3be; background: var(--danger-soft); }
}
.sc-more { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 28px; padding-top: 18px; border-top: 1px dashed var(--border-strong); }
.sc-more-t { font-size: max(var(--fs-min), .84rem); font-weight: 600; color: var(--text-2); margin-right: 4px; }
.sc-add { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 70px; padding: 12px;
  border: 1.5px dashed var(--border-strong); border-radius: var(--radius-sm); background: transparent;
  color: var(--text-2); font-size: .88rem; font-weight: 600; }
@media (hover: hover) and (pointer: fine) { .sc-add:hover { border-color: var(--primary); color: var(--primary-dark); background: var(--primary-soft); } }
@media (max-width: 520px) {
  .lki.lk-ico { width: 34px; height: 34px; border-radius: 6px; }
  .sc-sec.is-sub { margin-left: 6px; padding-left: 12px; }
  .sc-bar .search-field { max-width: none; }
}
@media print {
  .sc-bar, .sc-acts, .sc-add, .sc-more { display: none !important; }
  .sc-sec { break-inside: avoid-page; }
  .lk-card.is-edit, .lk-card.is-dim { border-left-color: var(--primary); opacity: 1; }
}

/* 메뉴 폼 — 아이콘 고르기 */
.lkp { display: flex; gap: 16px; align-items: flex-start; }
.lkp-prev { flex: none; padding-top: 2px; }
.lkp-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.lkp-main .seg { align-self: flex-start; }
.lkp-pane[hidden] { display: none; }
.lkp-row { display: flex; flex-wrap: wrap; gap: 8px; }
.lkp .lkp-file { position: relative; display: inline-flex; margin: 0; font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text); cursor: pointer; }
.lkp .lkp-file input { position: absolute; width: 1px; height: 1px; padding: 0; border: 0; opacity: 0; pointer-events: none; }
.lkp .lkp-file:focus-within { outline: 2px solid var(--primary); outline-offset: 2px; }
.lkp-msg { min-height: 1.3em; margin: 6px 0 0; font-size: max(var(--fs-min), .81rem); color: var(--text-3); overflow-wrap: anywhere; }
.lkp-msg.bad { color: var(--danger); }
.lkp-icos { gap: 5px; }
.lkp-icos .ico-opt { width: 38px; height: 38px; border-radius: 6px; }
.lkp-tones { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 12px; }
.lkp .lkp-tone { position: relative; display: block; width: 26px; height: 26px; margin: 0; border-radius: 50%; cursor: pointer; }
.lkp-tone input { position: absolute; opacity: 0; pointer-events: none; }
.lkp-tone span { display: block; width: 100%; height: 100%; border-radius: 50%; background: var(--tn-fg); }
.lkp-tone:has(input:checked) span { box-shadow: 0 0 0 2px var(--surface), 0 0 0 4px var(--tn-fg); }
.lkp-tone:has(input:focus-visible) span { outline: 2px solid var(--primary); outline-offset: 5px; }
.lkp #lkp-emoji { max-width: 140px; font-size: 1.1rem; }
@media (max-width: 520px) {
  .lkp { flex-direction: column; gap: 10px; }
}

/* ── 팀위기대응계획 SERP (js/serp.js) — 상단 비상 띠 · 탭 6개 · 역할 색(--tn-fg, .t-*) · 대응 화면 ── */
.sp-quick { display: flex; align-items: center; gap: 16px 20px; flex-wrap: wrap; margin-bottom: 18px; padding: 14px 16px 14px 20px;
  border-radius: var(--radius); background: var(--sidebar-bg); color: #fff; }
.sp-q-l { display: flex; flex-direction: column; min-width: 0; }
.sp-q-l b { font-size: 1rem; }
.sp-q-l small { font-size: max(var(--fs-min), .81rem); color: #b9cbd0; }
.sp-q-acts { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.sp-qbtn { display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 7px 16px 7px 13px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.06); color: #fff; text-align: left; text-decoration: none; }
.sp-qbtn span { display: flex; flex-direction: column; line-height: 1.3; }
.sp-qbtn b { font-size: .88rem; }
.sp-qbtn small { font-size: max(var(--fs-min), .82rem); color: #c8d7db; }
.sp-qbtn.is-occ { background: #fff; color: var(--danger); border-color: #fff; }
.sp-qbtn.is-occ small { color: var(--text-2); }
.sp-qbtn.is-start { background: var(--danger); border-color: var(--danger); }
.sp-qbtn.is-start small { color: #ffd9d4; }
.sp-qbtn.is-drill { background: transparent; }
@media (hover: hover) and (pointer: fine) {
  .sp-qbtn:hover { border-color: rgba(255,255,255,.5); }
  .sp-qbtn.is-start:hover { background: #9a1d13; }
}
.sp-live, .dash-serp .ds-go { display: flex; align-items: center; gap: 12px 20px; flex-wrap: wrap; padding: 14px 18px; border-radius: var(--radius);
  background: var(--danger); color: #fff; }
.sp-live { margin-bottom: 18px; }
.sp-live.is-drill, .dash-serp.is-drill .ds-go { background: #8a4b08; }
.sp-live-l { display: flex; align-items: center; gap: 12px; min-width: 0; }
.sp-live-l div { display: flex; flex-direction: column; min-width: 0; }
.sp-live-l b { font-size: 1.02rem; }
.sp-live-l small, .sp-live-n { font-size: max(var(--fs-min), .82rem); color: #ffe1dc; }
.sp-live.is-drill .sp-live-l small, .sp-live.is-drill .sp-live-n { color: #fde9cc; }
.sp-live-n b { color: #fff; }
.sp-live .sp-clock { font-size: 1.5rem; font-weight: 600; letter-spacing: -.02em; }
.sp-live-go { margin-left: auto; background: #fff; color: var(--danger); border: 0; font-weight: 700; }
.sp-pulse { flex: none; width: 12px; height: 12px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 0 rgba(255,255,255,.7); animation: sp-pulse 1.6s ease-out infinite; }
@keyframes sp-pulse { 0% { box-shadow: 0 0 0 0 rgba(255,255,255,.7); } 70% { box-shadow: 0 0 0 10px rgba(255,255,255,0); } 100% { box-shadow: 0 0 0 0 rgba(255,255,255,0); } }
@media (prefers-reduced-motion: reduce) { .sp-pulse { animation: none; } }
.dash-serp { margin-bottom: 20px; }
.dash-serp .ds-go { width: 100%; border: 0; text-align: left; font: inherit; cursor: pointer; }
.dash-serp .ds-t { display: flex; flex-direction: column; min-width: 0; }
.dash-serp .ds-t b { font-size: 1.02rem; }
.dash-serp .ds-t small, .dash-serp .ds-n { font-size: max(var(--fs-min), .82rem); color: #ffe1dc; }
.dash-serp.is-drill .ds-t small, .dash-serp.is-drill .ds-n { color: #fde9cc; }
.dash-serp .ds-n b { color: #fff; }
.dash-serp .sp-clock { font-size: 1.35rem; font-weight: 600; }
.dash-serp .ds-open { margin-left: auto; display: inline-flex; align-items: center; gap: 4px; font-size: .86rem; font-weight: 700; }

.sp-tabs .sp-dot { display: inline-block; width: 8px; height: 8px; margin-left: 4px; border-radius: 50%; background: var(--danger); vertical-align: middle; }
.sp-tabs .eq-tab[aria-selected="true"] .sp-dot { background: #fff; }
.sp-h2 { display: flex; align-items: baseline; gap: 10px; margin: 26px 2px 12px; font-size: 1.05rem; font-weight: 700; }
.sp-h2 span { font-family: var(--mono); font-size: max(var(--fs-min), .82rem); font-weight: 500; color: var(--text-3); }
.sp-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.sp-grid2 > .card { margin-bottom: 0; }
.sp-grid3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.sp-grid3 > .card { margin-bottom: 0; }
.sp-subsec { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--border); }
.sp-subsec h4 { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; font-size: .9rem; }
.sp-subsec h4 .mono { font-size: max(var(--fs-min), .8rem); color: var(--primary-dark); }
.sp-subsec h4 .sp-ed { margin-left: auto; width: 28px; height: 28px; }
.sp-subsec p { font-size: .88rem; color: var(--text-2); line-height: 1.7; }
.sp-sec { margin-bottom: 16px; }
.sp-sh { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; margin-bottom: 12px; }
.sp-sh h3 { font-size: .98rem; font-weight: 700; }
.sp-sh .spacer { flex: 1; }
.sp-no { font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--primary-dark); background: var(--primary-soft); padding: 1px 7px; border-radius: 6px; }
.sp-mut { font-size: max(var(--fs-min), .81rem); color: var(--text-3); }
.sp-body p { font-size: .9rem; color: var(--text-2); line-height: 1.7; }
.sp-body p + p { margin-top: 8px; }
.sp-hint { font-size: max(var(--fs-min), .84rem); color: var(--text-3); margin: -4px 0 12px; }
.sp-foot { font-size: max(var(--fs-min), .81rem); color: var(--text-3); margin-top: 10px; }
.sp-miss { color: var(--text-3); font-size: max(var(--fs-min), .84rem); font-style: normal; }
.sp-dots { list-style: none; display: flex; flex-direction: column; gap: 5px; }
.sp-dots li { position: relative; padding-left: 14px; font-size: .9rem; color: var(--text-2); }
.sp-dots li::before { content: ""; position: absolute; left: 2px; top: .7em; width: 5px; height: 5px; border-radius: 50%; background: var(--tn-fg, var(--primary)); }
.sp-ed { flex: none; display: inline-grid; place-items: center; width: 30px; height: 30px; border: 1px solid var(--border); border-radius: 8px;
  background: var(--surface); color: var(--text-3); }
@media (hover: hover) and (pointer: fine) { .sp-ed:hover { color: var(--primary-dark); border-color: var(--primary); } }
.sp-rev { display: inline-flex; align-items: center; padding: 1px 8px; border-radius: 6px; background: var(--accent-soft); color: var(--accent-dark); font-size: max(var(--fs-min), .78rem); font-weight: 700; white-space: nowrap; }
.sp-tel { display: inline-flex; align-items: center; gap: 5px; min-height: 30px; font-size: .88rem; font-weight: 600; color: var(--primary-dark); white-space: nowrap; }
.sp-tel.is-office { color: var(--text-2); font-weight: 500; }
.sp-telw { display: inline-flex; align-items: baseline; flex-wrap: wrap; gap: 0 4px; min-width: 0; }
.sp-tmore { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.sp-rc { display: inline-flex; align-items: center; padding: 1px 7px; border-radius: 6px; background: var(--tn-bg); color: var(--tn-fg); font-size: max(var(--fs-min), .78rem); font-weight: 700; white-space: nowrap; }
.sp-dl { display: grid; gap: 8px; margin-top: 12px; }
.sp-dl > div { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 12px; font-size: .88rem; }
.sp-dl dt { color: var(--text-3); }
.sp-dl2 { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; }

/* 초동대응 */
.sp-occbox { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 14px; padding: 14px 16px;
  border-radius: 6px; background: var(--danger-soft); }
.sp-occbox > div { display: flex; flex-direction: column; }
.sp-occbox small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.sp-occbox b { font-size: 1rem; }
.sp-callbig { min-height: 48px; font-size: 1.05rem; font-weight: 700; }
.sp-serc-t { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; font-size: .9rem; color: var(--text-2); }
.sp-big { font-size: 1.7rem; font-weight: 600; color: var(--primary-dark); letter-spacing: -.02em; }
.sp-serc .sp-dots { margin: 10px 0; }
.sp-online { margin-top: 12px; padding: 12px 14px; border-radius: 6px; border: 1px solid #f3d9a8; background: var(--accent-soft); }
.sp-online-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; color: var(--accent-dark); }
.sp-online-h b { color: var(--text); font-size: .92rem; }
.sp-online p { font-size: .88rem; color: var(--text); line-height: 1.7; }
.sp-kv { display: flex; gap: 10px; margin-top: 6px; }
.sp-kv span { color: var(--text-3); }
.sp-roleseg { max-width: 100%; }
.sp-phs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.sp-ph { min-width: 0; border: 1px solid var(--border); border-radius: 6px; overflow: hidden; }
.sp-ph-h { display: flex; align-items: center; justify-content: space-between; padding: 9px 12px; background: var(--surface-2); border-bottom: 1px solid var(--border); font-size: .88rem; }
.sp-ph-h span { color: var(--text-3); font-size: max(var(--fs-min), .8rem); }
.sp-tl { list-style: none; display: flex; flex-direction: column; }
.sp-ti { display: grid; grid-template-columns: 16px minmax(0, 1fr); gap: 4px 8px; padding: 9px 12px; border-top: 1px solid var(--border); }
.sp-ti:first-child { border-top: 0; }
.sp-box { width: 14px; height: 14px; margin-top: 4px; border: 1.5px solid var(--border-strong); border-radius: 4px; }
.sp-tt { display: flex; flex-direction: column; font-size: .88rem; line-height: 1.45; }
.sp-tt small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.sp-who { grid-column: 2; display: flex; flex-wrap: wrap; gap: 4px; }
.sp-nf { list-style: none; counter-reset: nf; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 24px; }
.sp-nf li { counter-increment: nf; display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; padding: 6px 0; border-bottom: 1px dashed var(--border); font-size: .88rem; }
.sp-nf li::before { content: counter(nf) ")"; font-family: var(--mono); font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.sp-nf small { color: var(--text-3); font-size: max(var(--fs-min), .8rem); }

/* 조직 · 연락망 */
.sp-chart .sp-ctop { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.sp-cside { display: flex; flex-direction: column; gap: 8px; }
.sp-cside > small, .sp-chead > small, .sp-csup > small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); font-weight: 600; }
.sp-cbox { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; padding: 8px 12px; border: 1px solid var(--border); border-radius: 6px; font-size: .88rem; }
.sp-chead { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 16px; border-radius: 6px; background: var(--tn-bg); color: var(--tn-fg); text-align: center; }
.sp-chead b { font-size: 1.2rem; color: var(--text); }
.sp-csup { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 6px 14px; width: min(520px, 100%); margin: 16px auto; padding: 10px 14px;
  border-radius: 6px; background: var(--tn-bg); position: relative; }
.sp-csup > small { color: var(--tn-fg); }
.sp-ccols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.sp-ccol { border-radius: 6px; border: 1px solid var(--border); border-top: 3px solid var(--tn-fg); padding: 4px 12px 8px; }
.sp-ccol-h { display: flex; justify-content: space-between; padding: 8px 0; font-size: .86rem; font-weight: 700; color: var(--tn-fg); }
.sp-pl { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 6px 0; border-top: 1px solid var(--border); font-size: .9rem; }
.sp-csup .sp-pl { border-top: 0; }
.sp-pl small { color: var(--text-3); font-size: max(var(--fs-min), .82rem); }
.sp-pl .sp-tel { margin-left: auto; }
.sp-role { margin-bottom: 14px; border-left: 4px solid var(--tn-fg); }
.sp-role-h { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.sp-role-h h3 { font-size: 1rem; }
.sp-role-h small { font-size: max(var(--fs-min), .81rem); color: var(--text-3); }
.sp-role-h .spacer { flex: 1; }
.sp-role-no { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 6px; background: var(--tn-bg); color: var(--tn-fg); font-weight: 700; }
.sp-role-b { display: grid; grid-template-columns: minmax(0, 330px) minmax(0, 1fr); gap: 18px; }
.sp-ppl { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; align-content: start; }
.sp-pc { padding: 10px 12px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-2); min-width: 0; }
.sp-pc-h { display: flex; align-items: center; gap: 8px; }
.sp-pc-h b { font-size: .98rem; }
.sp-pc-h small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.sp-pc-h .sp-ed { margin-left: auto; width: 28px; height: 28px; }
.sp-pc-n { display: flex; flex-direction: column; margin-top: 4px; }
.sp-pc-n .sp-tel span:not(.mono) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 210px; }
.sp-pc-m { margin-top: 6px; font-size: max(var(--fs-min), .81rem); color: var(--text-2); }
.sp-pc-m span { color: var(--text-3); margin-right: 6px; }
.sp-pc-m.is-note { color: var(--accent-dark); }
.sp-padd { align-self: start; }
.sp-padd, .sp-cadd { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; padding: 8px 12px;
  border: 1.5px dashed var(--border-strong); border-radius: 6px; background: transparent; color: var(--text-2); font-size: max(var(--fs-min), .84rem); font-weight: 600; }
.sp-cadd { min-height: 36px; margin-top: 6px; width: 100%; }
@media (hover: hover) and (pointer: fine) { .sp-padd:hover, .sp-cadd:hover { border-color: var(--primary); color: var(--primary-dark); background: var(--primary-soft); } }
.sp-more { padding: 0; margin-top: 14px; }
.sp-more > summary { padding: 14px 18px; font-size: .92rem; font-weight: 700; cursor: pointer; }
.sp-more > .card { border: 0; border-top: 1px solid var(--border); border-radius: 0; margin: 0; }

/* 연락처 */
.sp-cgrid { columns: 2 340px; column-gap: 16px; margin-top: 14px; }
.sp-cg { break-inside: avoid; margin-bottom: 16px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 6px; }
.sp-cg h3 { display: flex; justify-content: space-between; font-size: .88rem; font-weight: 700; margin-bottom: 4px; }
.sp-cg h3 span { color: var(--text-3); font-size: max(var(--fs-min), .82rem); }
.sp-cg ul { list-style: none; }
.sp-cr { display: flex; align-items: center; flex-wrap: nowrap; gap: 4px 10px; padding: 7px 0; border-top: 1px solid var(--border); }
.sp-cr .sp-telw { margin-left: auto; flex-direction: column; align-items: flex-end; }
.sp-grid3 .sp-sh, .sp-grid2 .sp-sh { flex-wrap: nowrap; align-items: flex-start; }
.sp-grid3 .sp-sh h3, .sp-grid2 .sp-sh h3 { flex: 1; min-width: 0; }
.sp-cr:first-child { border-top: 0; }
.sp-cr-t { flex: 1 1 160px; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; font-size: .88rem; }
.sp-cr-t small { flex-basis: 100%; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.sp-cr .sp-ed { width: 28px; height: 28px; }
.sp-cr.is-conf .sp-cr-t b { color: var(--danger); }
.sp-imgs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.sp-img { display: flex; flex-direction: column; gap: 8px; padding: 8px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); text-align: left; }
.sp-img img { width: 100%; height: 170px; object-fit: contain; background: #fff; border-radius: 8px; }
.sp-img b { font-size: .86rem; }
.sp-img small { display: block; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
@media (hover: hover) and (pointer: fine) { .sp-img:hover { border-color: var(--primary); } }

/* 체크리스트 · 양식 */
.sp-cks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 16px; }
.sp-ckc { margin-bottom: 0; border-top: 4px solid var(--tn-fg); }
.sp-ckn { font-size: max(var(--fs-min), .81rem); color: var(--text-3); }
.sp-cktbl td, .sp-ledger td { font-size: .86rem; }
.sp-ck-no { width: 34px; }
.sp-ck-at { width: 90px; }
.sp-ck-nt { width: 32%; }
.sp-blank td { height: 34px; }
.sp-ledger th { white-space: normal; font-size: max(var(--fs-min), .8rem); }
.sp-docs { padding-left: 22px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 24px; font-size: .88rem; color: var(--text-2); }

/* 대응 기록 · 문서 */
.sp-runs tbody tr { cursor: pointer; }
.sp-runs tr.is-live td { background: var(--danger-soft); }
.sp-sub { display: block; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.sp-slow { display: inline-flex; padding: 0 6px; border-radius: 5px; background: var(--accent-soft); color: var(--accent-dark); font-size: max(var(--fs-min), .78rem); font-weight: 700; white-space: nowrap; }
.sp-late { display: inline-flex; padding: 0 6px; border-radius: 5px; background: var(--danger-soft); color: var(--danger); font-size: max(var(--fs-min), .78rem); font-weight: 700; white-space: nowrap; }
.sp-file { margin-top: 12px; }
.sp-cmp .sp-purp { margin-bottom: 14px; }
.sp-cmp .sp-purp > b { display: block; font-size: .86rem; margin-bottom: 6px; }
.sp-chg { padding-top: 12px; border-top: 1px solid var(--border); margin-top: 12px; }
.sp-chg h4 { font-size: .92rem; margin-bottom: 10px; }
.sp-ba { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.sp-ba > div { padding: 12px 14px; border-radius: 6px; border: 1px solid var(--border); }
.sp-ba small { display: block; margin-bottom: 6px; font-size: max(var(--fs-min), .82rem); font-weight: 700; color: var(--text-3); }
.sp-ba p { font-size: .86rem; line-height: 1.7; color: var(--text-2); }
.sp-ba .sp-a { border-color: #f3d9a8; background: #fffaf0; }
.sp-new { color: var(--text) !important; background: #fde7b5; border-radius: 6px; padding: 3px 6px; margin: 2px -6px 0; }
.sp-mgmt tr.is-due td { background: #fffaf0; }
.sp-mgmt td.mono, .sp-mgmt td:nth-child(2) { white-space: nowrap; }
.sp-gaps { border-left: 4px solid var(--accent); }

/* 대응 화면 */
.sp-status { display: grid; grid-template-columns: minmax(0, 1.2fr) auto minmax(0, 1.6fr) minmax(0, .9fr); gap: 14px 20px; align-items: center;
  margin-bottom: 12px; padding: 16px 18px; border-radius: var(--radius); background: var(--sidebar-bg); color: #fff; border-left: 6px solid var(--danger); }
.sp-status.is-drill { border-left-color: var(--accent); }
.sp-status.is-end { background: #25343a; }
.sp-st-a { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; }
.sp-st-a b { font-size: 1.05rem; }
.sp-st-a small, .sp-st-t small, .sp-st-s small { font-size: max(var(--fs-min), .82rem); color: #b9cbd0; }
.sp-st-t { display: flex; flex-direction: column; }
.sp-st-t .sp-clock { font-size: 1.9rem; font-weight: 600; letter-spacing: -.03em; line-height: 1.15; }
.sp-st-p { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; }
.sp-pp { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 6px 8px 8px; border-radius: 6px; background: rgba(255,255,255,.07); overflow: hidden; }
.sp-pp span { font-size: max(var(--fs-min), .76rem); color: #b9cbd0; white-space: nowrap; }
.sp-pp b { font-size: .92rem; }
.sp-pp i { position: absolute; left: 0; bottom: 0; height: 3px; width: var(--p); background: #5fd1b8; }
.sp-pp.is-late { background: rgba(180,35,24,.55); }
.sp-pp.is-late span { color: #ffe1dc; }
.sp-st-s { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.sp-st-s b { font-size: .95rem; }
.sp-st-s .sp-miss { color: #ffb4a8; }
.sp-st-s .link-btn { color: #7ee0c9; padding: 2px 0; }
.sp-calls { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 14px; }
.sp-cbtn { display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 14px; border-radius: 6px; border: 1px solid var(--border-strong);
  background: var(--surface); color: var(--text); font-size: .86rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
.sp-cbtn svg { color: var(--primary); }
.sp-cbtn.is-act { border-color: var(--danger); color: var(--danger); }
.sp-cbtn.is-act svg { color: var(--danger); }
.sp-by { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.sp-by input { width: 130px; min-height: 38px; padding: 0 10px; border: 1px solid var(--border-strong); border-radius: 6px; font: inherit; font-size: .88rem; color: var(--text); }
.sp-rtabs .sp-tn { font-size: max(var(--fs-min), .78rem); opacity: .8; }
.sp-rbar { margin-bottom: 12px; }
.sp-rph { margin-bottom: 12px; padding: 0; overflow: hidden; }
.sp-rph-h { display: flex; align-items: baseline; gap: 10px; padding: 11px 16px; background: var(--surface-2); border-bottom: 1px solid var(--border); }
.sp-rph-h b { font-size: .95rem; }
.sp-rph-h .sp-mut { margin-left: auto; }
.sp-rl { list-style: none; }
.sp-ri { display: flex; align-items: flex-start; gap: 12px; padding: 12px 16px; border-top: 1px solid var(--border); }
.sp-ri:first-child { border-top: 0; }
.sp-ckc .sp-ri { padding: 10px 2px; }
.sp-chk { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 6px; border: 2px solid var(--border-strong); background: var(--surface); color: transparent;
  transition: background-color .15s ease, border-color .15s ease, transform .1s var(--ease-out); }
.sp-chk:active:not(:disabled) { transform: scale(.94); }
.sp-chk[aria-pressed="true"] { background: var(--success); border-color: var(--success); color: #fff; }
.sp-chk:disabled { opacity: .5; cursor: default; }
@media (hover: hover) and (pointer: fine) { .sp-chk:not(:disabled):hover { border-color: var(--success); color: var(--success); } .sp-chk[aria-pressed="true"]:hover { color: #fff; } }
.sp-ri-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.sp-ri-t > b { font-size: .95rem; font-weight: 600; }
.sp-ri-t > small { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.sp-ri-m { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 6px; margin-top: 3px; }
.sp-dm { font-size: max(var(--fs-min), .8rem); color: var(--success); font-weight: 600; }
.sp-dm span { color: var(--text-2); font-weight: 500; }
.sp-dn { flex-basis: 100%; font-size: max(var(--fs-min), .8rem); color: var(--text-2); }
.sp-ri.is-done .sp-ri-t > b { color: var(--text-2); }
.sp-ri.is-late:not(.is-done) { background: #fff6f5; }
.sp-ri.is-late:not(.is-done) .sp-chk { border-color: #e8a59d; }
.sp-ract { flex: none; }
.sp-nwrap { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.sp-nwrap .card { margin-bottom: 0; }
.sp-nform { display: flex; flex-direction: column; gap: 10px; }
.sp-nrow { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 6px 12px; align-items: center; }
.sp-nrow label { font-size: .86rem; font-weight: 600; }
.sp-nrow label .mono { color: var(--text-3); font-weight: 500; }
.sp-nrow input, .sp-nrow textarea { width: 100%; min-height: 40px; padding: 8px 12px; border: 1px solid var(--border-strong); border-radius: 6px; font: inherit; font-size: .9rem; }
.sp-nin { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; min-width: 0; }
.sp-nin > input, .sp-nin > textarea { align-self: stretch; }
.sp-opts { display: flex; flex-wrap: wrap; gap: 6px; }
.sp-opt { min-height: 34px; padding: 0 12px; border-radius: 6px; border: 1px solid var(--border-strong); background: var(--surface); font-size: max(var(--fs-min), .84rem); font-weight: 600; }
.sp-opt[aria-pressed="true"] { background: var(--danger); border-color: var(--danger); color: #fff; }
.sp-npv { position: sticky; top: calc(var(--header-h) + 12px); }
.sp-pre { white-space: pre-wrap; word-break: keep-all; overflow-wrap: anywhere; margin: 0 0 12px; padding: 12px 14px; border-radius: 6px; background: var(--surface-2);
  font-family: var(--font); font-size: .88rem; line-height: 1.7; }
.sp-nacts { display: flex; flex-wrap: wrap; gap: 8px; }
.sp-sent { list-style: none; margin-top: 12px; font-size: max(var(--fs-min), .84rem); color: var(--text-2); }
.sp-sent li { padding: 4px 0; border-top: 1px dashed var(--border); }
.sp-logadd { display: flex; gap: 10px; align-items: stretch; margin-bottom: 14px; }
.sp-logadd textarea { flex: 1; min-height: 46px; padding: 10px 12px; border: 1px solid var(--border-strong); border-radius: 6px; font: inherit; font-size: .92rem; resize: vertical; }
.sp-log { list-style: none; }
.sp-log li { display: flex; gap: 14px; align-items: flex-start; padding: 10px 0; border-top: 1px solid var(--border); }
.sp-log-t { flex: none; width: 74px; display: flex; flex-direction: column; font-size: .92rem; font-weight: 600; }
.sp-log-t small { font-size: max(var(--fs-min), .78rem); color: var(--text-3); font-weight: 500; }
.sp-log li > div { flex: 1; min-width: 0; }
.sp-log p { font-size: .92rem; }
.sp-log small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.sp-mtitle { font-size: .92rem; color: var(--text-2); margin: -4px 0 12px; }
.sp-mhint { font-size: max(var(--fs-min), .82rem); color: var(--text-3); margin: 0 0 12px; }
.sp-kseg { margin-bottom: 14px; }
.sp-chkrow { display: flex; align-items: center; gap: 8px; margin: 6px 0 4px; font-size: .88rem; }
.sp-chkrow input { width: 18px; height: 18px; }
.sp-lm { list-style: none; margin-bottom: 12px; }
.sp-lm li { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 0; border-top: 1px solid var(--border); }
.sp-lm li > div { display: flex; flex-direction: column; min-width: 0; font-size: .9rem; }
.sp-lm small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.sp-mgo { margin-bottom: 6px; }
.sp-rcl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 16px; max-height: 280px; overflow: auto; margin: 4px 0 14px; padding: 8px 10px;
  border: 1px solid var(--border); border-radius: 6px; }
.sp-rcl label { display: flex; align-items: center; gap: 8px; min-height: 36px; margin: 0; font-size: .88rem; font-weight: 500; }
.sp-rcl label .mono { margin-left: auto; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.sp-rcl input { width: 18px; height: 18px; }
.sp-report h2 { font-size: 13pt; margin: 0 0 3mm; }
.sp-report h3 { font-size: 10.5pt; margin: 5mm 0 2mm; }
.sp-rpt { width: 100%; border-collapse: collapse; font-size: 8.8pt; }
.sp-rpt th, .sp-rpt td { border: 1px solid #b9c4c4; padding: 3px 5px; text-align: left; vertical-align: top; }
.sp-rpt tbody th { width: 28mm; background: #f1f4f4; font-weight: 600; }
.sp-rpt thead th { background: #f1f4f4; }

@media (max-width: 1280px) {
  .sp-phs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sp-status { grid-template-columns: minmax(0, 1fr) auto; }
  .sp-st-p { grid-column: 1 / -1; }
}
@media (max-width: 1023px) {
  .sp-grid2, .sp-grid3, .sp-cks, .sp-nwrap { grid-template-columns: minmax(0, 1fr); }
  .sp-role-b { grid-template-columns: minmax(0, 1fr); }
  .sp-phs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sp-npv { position: static; }
  .sp-imgs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .sp-tabs { overflow-x: auto; scrollbar-width: none; }
  .sp-tabs .eq-tab, .sp-rtabs .eq-tab { flex: 0 0 auto; padding: 0 12px; }
  .sp-rtabs { overflow-x: auto; scrollbar-width: none; }
  .sp-quick { padding: 14px; }
  .sp-q-acts { margin-left: 0; width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sp-qbtn { padding: 7px 10px; }
  .sp-live .sp-clock { font-size: 1.25rem; }
  .sp-live-go { margin-left: 0; width: 100%; }
  .sp-phs, .sp-ccols, .sp-dl2, .sp-nf, .sp-docs, .sp-ba, .sp-rcl { grid-template-columns: minmax(0, 1fr); }
  .sp-chart .sp-ctop { grid-template-columns: minmax(0, 1fr); }
  .sp-chead { order: -1; }
  .sp-dl > div { grid-template-columns: 110px minmax(0, 1fr); }
  .sp-status { grid-template-columns: minmax(0, 1fr); padding: 14px; }
  .sp-st-p { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .sp-st-t .sp-clock { font-size: 1.6rem; }
  .sp-by { margin-left: 0; width: 100%; }
  .sp-by input { flex: 1; width: auto; }
  .sp-ri { padding: 12px; gap: 10px; flex-wrap: wrap; }
  .sp-ri-t { flex-basis: calc(100% - 52px); }
  .sp-ract { margin-left: 52px; }
  .sp-nrow { grid-template-columns: minmax(0, 1fr); }
  .sp-imgs { grid-template-columns: minmax(0, 1fr); }
  .sp-logadd { flex-direction: column; }
  .dash-serp .ds-open { margin-left: 0; }
  .sp-cr { flex-wrap: wrap; }
  .sp-cr .sp-telw { flex-direction: row; align-items: baseline; margin-left: 0; order: 3; flex-basis: 100%; }
  .sp-cr .sp-ed { order: 2; }
  .sp-sh > .sp-ed { margin-left: auto; }
}
@media print {
  .sp-quick, .sp-live, .sp-calls, .sp-ed, .sp-padd, .sp-cadd, .sp-roleseg, .sp-file, .sp-imgs, .dash-serp, .sp-gaps { display: none !important; }
  .sp-grid2, .sp-cks { grid-template-columns: 1fr 1fr !important; gap: 3mm; }
  .sp-grid3 { grid-template-columns: 1fr 1fr 1fr !important; gap: 3mm; }
  .sp-phs { grid-template-columns: repeat(5, 1fr) !important; gap: 2mm; }
  .sp-ti { padding: 4px 6px; }
  .sp-rc { border: 1px solid currentColor; }
  .sp-role, .sp-ckc, .sp-cg, .sp-ph, .sp-chg { break-inside: avoid; }
  .sp-cgrid { columns: 2; }
  .sp-status { background: #fff !important; color: #111 !important; border: 1px solid #b9c4c4 !important; }
}

/* 위기대응 담당자 — 연락처 편집 */
.cr-addnum { flex: none; display: inline-flex; align-items: center; gap: 2px; height: 26px; padding: 0 8px 0 5px; border: 1px dashed var(--border-strong); border-radius: 7px;
  background: transparent; color: var(--text-3); font-size: max(var(--fs-min), .78rem); font-weight: 600; }
@media (hover: hover) and (pointer: fine) { .cr-addnum:hover { border-color: var(--primary); color: var(--primary-dark); background: var(--primary-soft); } }
.cr-nonum { display: inline-flex; align-items: center; padding: 2px 9px; border-radius: 7px; background: var(--accent-soft); color: var(--accent-dark); font-size: max(var(--fs-min), .82rem); font-weight: 600; }
.cr-ptel.is-2 { background: var(--surface-2); color: var(--text-2); }
.cr-pedit { display: inline-flex; align-items: center; gap: 4px; min-height: 30px; padding: 0 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
  color: var(--text-2); font-size: max(var(--fs-min), .82rem); font-weight: 600; }
.cr-person.no-num .cr-pedit { border-color: var(--primary); color: var(--primary-dark); }
@media (hover: hover) and (pointer: fine) { .cr-pedit:hover { border-color: var(--primary); color: var(--primary-dark); } }
.cr-src { font-size: max(var(--fs-min), .78rem); color: var(--text-3); }
.cr-misschip { display: inline-flex; align-items: center; gap: 6px; min-height: 34px; padding: 0 12px; border: 1px solid #f3d9a8; border-radius: 6px; background: var(--accent-soft);
  color: var(--accent-dark); font-size: max(var(--fs-min), .8rem); font-weight: 600; white-space: nowrap; }
.cr-misschip[aria-pressed="true"] { background: var(--accent-dark); border-color: var(--accent-dark); color: #fff; }
.cr-mnote { margin: -4px 0 12px; padding: 8px 12px; border-radius: 6px; background: var(--surface-2); font-size: max(var(--fs-min), .84rem); color: var(--text-2); }
.cr-mtasks { margin-top: 6px; padding-top: 10px; border-top: 1px solid var(--border); }
.cr-mtasks > b { font-size: max(var(--fs-min), .84rem); }
.cr-mtasks ul { list-style: none; margin-top: 6px; display: flex; flex-direction: column; gap: 4px; max-height: 190px; overflow: auto; }
.cr-mtasks li { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 8px; align-items: center; font-size: max(var(--fs-min), .84rem); color: var(--text-2); }
.cr-bhead { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 14px; margin-bottom: 12px; }
.cr-bmeta { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.cr-bwrap { max-height: min(58vh, 520px); overflow: auto; border: 1px solid var(--border); border-radius: 6px; }
.cr-btbl thead th { position: sticky; top: 0; z-index: 1; }
.cr-btbl tbody th { font-weight: 400; text-align: left; padding: 8px 12px; }
.cr-btbl tbody th b { display: block; font-size: .92rem; }
.cr-btbl tbody th small { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.cr-btbl td { padding: 6px 8px; }
.cr-btbl input { width: 100%; min-width: 130px; min-height: 38px; padding: 0 10px; border: 1px solid var(--border-strong); border-radius: 6px; font: inherit; font-size: .9rem; font-family: var(--mono); }
.cr-btbl tr:hover td, .cr-btbl tr:hover th { background: transparent; }
@media print { .cr-addnum, .cr-pedit, .cr-misschip { display: none !important; } }
@media screen and (max-width: 767px) {
  .sp-cktbl th:nth-child(n+3), .sp-cktbl td:nth-child(n+3) { display: none; }
}

/* ── 테러 위협전화 대응 (js/threat.js) — SERP 의 띠 · 상태 띠 · 체크 버튼(.sp-*)을 그대로 쓰고 이 화면 전용만 .tc-* ── */
.tc-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.tc-en { display: block; font-size: max(var(--fs-min), .81rem); color: var(--text-3); line-height: 1.4; }
.tc-trigger { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; padding: 12px 14px; border-radius: 6px; background: var(--danger-soft); color: var(--danger); font-weight: 700; }
.tc-trigger .ico { flex: none; }
.tc-steps { list-style: none; display: flex; flex-direction: column; gap: 12px; counter-reset: none; }
.tc-step { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 14px; padding: 14px 16px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); }
.tc-step.is-report { border-left: 4px solid var(--danger); }
.tc-sn { display: flex; flex-direction: column; align-items: center; justify-content: center; align-self: start; min-height: 56px; border-radius: 6px; background: var(--sidebar-bg); color: #fff; }
.tc-sn small { font-size: max(var(--fs-min), .76rem); letter-spacing: .06em; color: #b9cbd0; }
.tc-sn b { font-size: 1.35rem; line-height: 1.1; }
.tc-step.is-report .tc-sn { background: var(--danger); }
.tc-step.is-report .tc-sn small { color: #ffd9d4; }
.tc-sb { min-width: 0; }
.tc-sh { display: flex; align-items: flex-start; gap: 10px; }
.tc-sh b { flex: 1; font-size: 1.02rem; line-height: 1.45; }
.tc-subs { margin: 10px 0 0; padding-left: 22px; display: flex; flex-direction: column; gap: 8px; }
.tc-subs li { font-size: .92rem; color: var(--text); line-height: 1.5; }
.tc-subs li::marker { color: var(--primary-dark); font-weight: 700; }
.tc-after { display: flex; gap: 8px; align-items: flex-start; margin-top: 12px; padding: 10px 12px; border-radius: 6px; background: var(--accent-soft); font-size: .9rem; color: var(--text); }
.tc-after .ico { flex: none; margin-top: 3px; color: var(--accent-dark); }
.tc-tips { list-style: none; display: flex; flex-direction: column; gap: 8px; }
.tc-tips li { position: relative; padding-left: 18px; font-size: .92rem; color: var(--text-2); line-height: 1.55; }
.tc-tips li::before { content: "▷"; position: absolute; left: 0; top: 0; color: var(--primary); font-size: max(var(--fs-min), .8rem); }
.tc-cp { display: inline-flex; flex-direction: column; gap: 0; min-width: 0; }
.tc-cp > small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); line-height: 1.3; }
.tc-tsocp { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-bottom: 12px; }
.tc-tsoci { padding-left: 22px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 22px; }
.tc-tsoci li { font-size: .88rem; }
.tc-chain, .tc-rchl { list-style: none; display: flex; flex-direction: column; }
.tc-ci { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 12px; padding: 12px 0; border-top: 1px solid var(--border); }
.tc-ci:first-child { border-top: 0; padding-top: 2px; }
.tc-cn { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--primary-soft); color: var(--primary-dark); font-size: max(var(--fs-min), .84rem); font-weight: 700; }
.tc-ci.is-us .tc-cn, .tc-rci.is-us .tc-cn { background: #e3ebfd; color: #1d3fa8; }
.tc-cb { min-width: 0; flex: 1; }
.tc-ch { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; }
.tc-ch > b { font-size: .98rem; }
.tc-ch .spacer { flex: 1; }
.tc-when { display: inline-flex; padding: 1px 8px; border-radius: 6px; background: var(--danger-soft); color: var(--danger); font-size: max(var(--fs-min), .8rem); font-weight: 700; }
.tc-how { display: flex; flex-wrap: wrap; gap: 2px 12px; margin-top: 3px; font-size: .86rem; color: var(--text-2); }
.tc-how span + span::before { content: "·"; margin-right: 12px; color: var(--text-3); }
.tc-cps { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 6px 22px; margin-top: 6px; }
.tc-basis { display: block; margin-top: 4px; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }

.tc-cmd { list-style: none; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; }
.tc-cmd li { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px; border: 1px solid var(--border); border-radius: 6px; font-size: .9rem; }
.tc-cmd li + li::before { content: "→"; margin-left: -18px; margin-right: 2px; color: var(--text-3); }
.tc-cmd li { margin-left: 10px; }
.tc-cmd li:first-child { margin-left: 0; }
.tc-cmd .mono { display: inline-grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--surface-2); font-size: max(var(--fs-min), .8rem); color: var(--text-2); }
.tc-gapl { padding-left: 22px; display: flex; flex-direction: column; gap: 6px; font-size: .88rem; color: var(--text-2); }

.tc-url { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; word-break: break-all; }
.tc-ex { display: block; margin-top: 2px; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.tc-chks { list-style: none; }
.tc-chks li { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 14px; padding: 9px 0; border-top: 1px solid var(--border); font-size: .88rem; }
.tc-chks li:first-child { border-top: 0; }
.tc-chks li > small { flex-basis: 100%; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.tc-chks .sp-ed { margin-left: auto; width: 28px; height: 28px; }
.tc-chkn { color: var(--text-2); }
.tc-chkn .is-bad { color: var(--danger); }
.tc-ck { display: inline-flex; align-items: baseline; gap: 5px; padding: 1px 8px; border-radius: 6px; font-size: max(var(--fs-min), .82rem); font-weight: 700; white-space: nowrap; }
.tc-ck small { font-size: max(var(--fs-min), .78rem); font-weight: 500; opacity: .85; }
.tc-ck.is-ok { background: var(--success-soft); color: var(--success); }
.tc-ck.is-ng { background: var(--danger-soft); color: var(--danger); }
.tc-ck.is-none { background: var(--surface-2); color: var(--text-3); font-weight: 600; }
.tc-ck.is-due { box-shadow: inset 0 0 0 1.5px var(--accent); }
.tc-lines { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; }
.tc-ln { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 6px; }
.tc-lnck { display: inline-flex; gap: 4px; margin-left: auto; }
.tc-ln > small { flex-basis: 100%; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }

/* 보고양식 — 종이 모양(화면 미리보기 · 인쇄 전용 결과 보고) */
.tc-paper { padding: 22px 26px; }
.tcf { max-width: 820px; margin: 0 auto; font-size: .9rem; }
.tcf-t { font-size: 1.12rem; font-weight: 800; margin-bottom: 8px; }
.tcf-tips { list-style: none; margin-bottom: 14px; color: var(--text-2); }
.tcf-tips li::before { content: "▷ "; color: var(--primary); }
.tcf-g { margin: 18px 0 6px; font-weight: 800; color: #1d3fa8; }
.tcf-s { margin-bottom: 12px; }
.tcf-st { font-weight: 800; margin-bottom: 4px; }
.tcf-b { display: flex; flex-wrap: wrap; border-top: 1px solid #5b6b71; border-left: 1px solid #5b6b71; }
.tcf-f { flex: 1 1 32%; min-width: 0; display: flex; gap: 6px; align-items: baseline; padding: 6px 8px; min-height: 36px; border-right: 1px solid #5b6b71; border-bottom: 1px solid #5b6b71; }
.tcf-f.is-wide, .tcf-f.is-opt { flex-basis: 100%; }
.tcf-f.is-long { flex-direction: column; min-height: 72px; }
.tcf-f.is-opt { flex-wrap: wrap; }
.tcf-l { color: var(--text-2); white-space: nowrap; }
.tcf-v { flex: 1; font-weight: 600; }
.tcf-os { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.tcf-o { padding: 0 8px; border: 1.5px solid transparent; border-radius: 999px; }
.tcf-o.is-on { border-color: var(--text); font-weight: 700; }
.tcf-o em { font-style: normal; font-weight: 600; }
.tcf-foot { margin-top: 12px; font-weight: 800; }
.tcf-foot::before { content: "☞ "; }
.tc-report .tcf { max-width: none; font-size: 8.8pt; margin-top: 4mm; }
.tc-report .tcf-f { min-height: 0; padding: 2px 5px; }
.tc-pre { white-space: pre-wrap; font-size: 8.6pt; margin: 0; }
.tc-runs .tc-rsum { max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tc-runs tbody tr { cursor: pointer; }

/* 응대 화면 */
.tc-status { grid-template-columns: minmax(0, 1.3fr) auto minmax(0, 1fr) minmax(0, .7fr); }
.tc-st-p { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tc-callg { display: grid; grid-template-columns: minmax(300px, 360px) minmax(0, 1fr); gap: 16px; align-items: start; }
.tc-rail { position: sticky; top: calc(var(--header-h, 64px) + 12px); display: flex; flex-direction: column; gap: 12px; }
.tc-rail > .card { margin-bottom: 0; padding: 14px; }
.tc-m2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 10px; }
.tc-fl { display: flex; flex-direction: column; gap: 4px; margin: 0 0 10px; }
.tc-flb { font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--text-2); }
.tc-flb small { font-weight: 500; color: var(--text-3); }
.tc-fl input, .tc-fl textarea, .tc-fo > input { width: 100%; min-height: 42px; padding: 8px 11px; border: 1px solid var(--border-strong); border-radius: 6px; font: inherit; font-size: .95rem; color: var(--text); background: var(--surface); }
.tc-fl textarea { resize: vertical; line-height: 1.5; }
.tc-fl input[readonly], .tc-fl textarea[readonly] { background: var(--surface-2); }
.tc-fo { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; }
.tc-fo > input { margin-top: 2px; }
.tc-seg { width: 100%; }
.tc-seg .seg-btn { flex: 1; }
.tc-rs + .tc-rs { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.tc-rsh { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.tc-rsh b { font-size: .92rem; line-height: 1.4; }
.tc-rsn { flex: none; display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; background: var(--sidebar-bg); color: #fff; font-size: max(var(--fs-min), .8rem); font-weight: 700; }
.tc-rul { list-style: none; display: flex; flex-direction: column; gap: 6px; }
.tc-ru { display: flex; align-items: flex-start; gap: 10px; }
.tc-ru .sp-chk { width: 36px; height: 36px; border-radius: 6px; }
.tc-rut { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; align-items: flex-start; gap: 4px 8px; font-size: .88rem; line-height: 1.45; padding-top: 6px; }
.tc-rut .tc-rsn { margin-top: -2px; }
.tc-rul-t { flex: 1; min-width: 0; }
.tc-ru.is-self .tc-rul-t { font-weight: 700; font-size: .92rem; }
.tc-ru.is-done .tc-rul-t { color: var(--text-3); }
.tc-ru.is-after .tc-rul-t { font-weight: 600; }
.tc-rut .sp-ri-m { flex-basis: 100%; margin-top: 0; }
.tc-callend { width: 100%; min-height: 54px; font-size: 1.02rem; font-weight: 700; justify-content: center; }
.tc-ended { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; padding: 10px 14px; border-radius: 6px; background: var(--success-soft); color: var(--success); font-size: .9rem; }
.tc-ended .link-btn { margin-left: auto; }
.tc-tipbar { list-style: none; display: flex; flex-wrap: wrap; gap: 6px 18px; margin-bottom: 14px; padding: 10px 14px; border-radius: 6px; background: var(--primary-soft); }
.tc-tipbar li { font-size: max(var(--fs-min), .84rem); color: var(--primary-dark); font-weight: 600; }
.tc-tipbar li::before { content: "▷ "; }
.tc-qg { margin: 20px 2px 10px; font-size: .98rem; font-weight: 800; color: #1d3fa8; }
.tc-q { padding: 16px 18px; margin-bottom: 12px; }
.tc-q.is-ask { border-left: 4px solid var(--danger); }
.tc-qt { font-size: 1.15rem; font-weight: 800; margin-bottom: 12px; letter-spacing: -.01em; }
.tc-q.is-obs .tc-qt { font-size: .98rem; margin-bottom: 8px; }
.tc-qf { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0 14px; }
.tc-qf > .tc-fl.is-long, .tc-qf > .tc-fo { grid-column: 1 / -1; }
.tc-opts { display: flex; flex-wrap: wrap; gap: 6px; }
.tc-opt { min-height: 40px; padding: 0 14px; border: 1px solid var(--border-strong); border-radius: 999px; background: var(--surface); color: var(--text); font: inherit; font-size: .9rem; }
.tc-opt[aria-pressed="true"] { background: var(--sidebar-bg); border-color: var(--sidebar-bg); color: #fff; font-weight: 700; }
.tc-opt:disabled { opacity: .7; cursor: default; }
.tc-opt:active:not(:disabled) { transform: scale(.97); }
@media (hover: hover) and (pointer: fine) { .tc-opt:not(:disabled):not([aria-pressed="true"]):hover { border-color: var(--primary); color: var(--primary-dark); } }
.tc-repg { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.tc-rside > .card { margin-bottom: 16px; }
.tc-rci { display: flex; align-items: flex-start; gap: 12px; padding: 12px 0; border-top: 1px solid var(--border); }
.tc-rci:first-child { border-top: 0; padding-top: 2px; }
.tc-rci .tc-ch .tc-cn { width: 24px; height: 24px; font-size: max(var(--fs-min), .8rem); }
.tc-rci.is-done .tc-ch > b { color: var(--text-2); }
.tc-usbox { margin: 0; }
.tc-ranks { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.tc-rank { display: inline-flex; align-items: center; gap: 6px; min-height: 38px; padding: 0 12px; border: 1px solid var(--border-strong); border-radius: 6px; background: var(--surface); font: inherit; font-size: max(var(--fs-min), .84rem); color: var(--text); text-align: left; }
.tc-rank .mono { color: var(--text-3); font-size: max(var(--fs-min), .82rem); }
.tc-rank[aria-pressed="true"] { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-dark); font-weight: 700; }
.tc-esc { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; padding: 10px 14px; border: 1px dashed var(--border-strong); border-radius: 6px; font-size: .86rem; color: var(--text-2); }
.tc-esc .ico { color: var(--danger); }
.tc-call-all { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.tc-cwrap { max-height: min(54vh, 520px); overflow: auto; border: 1px solid var(--border); border-radius: 6px; margin-bottom: 12px; }
.tc-ctbl thead th { position: sticky; top: 0; z-index: 1; }
.tc-ctbl td { padding: 6px 8px; vertical-align: middle; }
.tc-ctbl td small { display: block; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.tc-cseg .seg-btn { min-width: 52px; }
.tc-cseg .seg-btn[data-v="ng"][aria-pressed="true"] { background: var(--danger); border-color: var(--danger); color: #fff; }
#tc-fe { font-size: max(var(--fs-min), .84rem); line-height: 1.55; white-space: pre; overflow-wrap: normal; overflow-x: auto; }

@media (max-width: 1023px) {
  .tc-callg, .tc-repg { grid-template-columns: minmax(0, 1fr); }
  .tc-rail { position: static; }
  .tc-status { grid-template-columns: minmax(0, 1fr) auto; }
  .tc-status .sp-st-p { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
  .tc-step { grid-template-columns: 48px minmax(0, 1fr); gap: 10px; padding: 12px; }
  .tc-sn { min-height: 48px; }
  .tc-sn b { font-size: 1.15rem; }
  .tc-tsoci, .tc-m2 { grid-template-columns: minmax(0, 1fr); }
  .tc-paper { padding: 14px 12px; }
  .tcf-f { flex-basis: 100%; }
  .tc-status { grid-template-columns: minmax(0, 1fr) auto; gap: 10px 14px; }
  .tc-status .sp-st-p { grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tc-status .sp-st-t .sp-clock { font-size: 1.45rem; }
  .tc-how { flex-direction: column; }
  .tc-how span + span::before { display: none; }
  .tc-q { padding: 14px; }
  .tc-qt { font-size: 1.05rem; }
  .tc-cmd li + li::before { display: none; }
  .tc-cmd li { margin-left: 0; }
  .tc-runs .tc-rsum { max-width: 180px; }
}
@media print {
  .tc-bar, .tc-orig, .tc-chkc .btn, .tc-rail, .tc-callend, .tc-esc, .dash-threat { display: none !important; }
  .tc-step { break-inside: avoid; padding: 6px 8px; }
  .tc-sn { background: #fff !important; color: #111 !important; border: 1px solid #111; }
  .tc-sn small { color: #111 !important; }
  .tc-ci, .tc-ln { break-inside: avoid; }
  .tc-paper { padding: 0; border: 0 !important; }
  .tcf-o.is-on { border-color: #111; }
}

/* ── 일일 보안 · 안전 순찰일지 (js/patrol.js, 라우트 daily-safety) ── */
.pt-tabs { margin-bottom: 16px; }
.pt-daynav { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 18px; margin-bottom: 14px; padding: 12px 14px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); }
.pt-dn-l { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.pt-dn-in { min-height: 40px; padding: 0 10px; border: 1px solid var(--border-strong); border-radius: 6px; background: var(--surface); font-size: 1rem; font-weight: 600; }
.pt-dn-wd { font-weight: 600; color: var(--text-2); white-space: nowrap; margin-right: 4px; }
.pt-dn-r { display: flex; align-items: center; gap: 10px; }
.pt-sheetl { font-size: max(var(--fs-min), .8rem); color: var(--text-3); white-space: nowrap; }
.pt-dchips { display: flex; gap: 4px; }
.pt-dchip { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 46px; height: 48px; padding: 0 0 5px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); line-height: 1.15; }
.pt-dchip b { font-size: .95rem; }
.pt-dchip small { font-size: max(var(--fs-min), .76rem); color: var(--text-3); }
.pt-dchip::after { content: ""; position: absolute; bottom: 5px; width: 16px; height: 3px; border-radius: 2px; background: transparent; }
.pt-dchip[data-st="done"]::after { background: var(--success); }
.pt-dchip[data-st="wait"]::after, .pt-dchip[data-st="prog"]::after { background: var(--accent); }
.pt-dchip[data-st="miss"]::after { background: var(--danger); }
.pt-dchip[data-st="off"]::after { background: #94a3b8; }
.pt-dchip[aria-current] { border-color: var(--primary); background: var(--primary-soft); box-shadow: inset 0 0 0 1px var(--primary); }
.pt-dchip:disabled { opacity: .45; cursor: default; }
@media (hover: hover) and (pointer: fine) { .pt-dchip:not(:disabled):hover { border-color: var(--primary); } }
/* 순찰 · 확인 칸 */
.pt-slots { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 14px; }
.pt-slots.is-off .pt-offcard { grid-column: span 2; }
.pt-slot { display: flex; flex-direction: column; gap: 10px; min-height: 148px; padding: 14px 16px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); }
.pt-slot.is-on { border-color: #b9dcd5; background: linear-gradient(180deg, #f3faf8, var(--surface) 62%); }
.pt-slot.is-sup.is-on { border-color: #a9d3bc; background: linear-gradient(180deg, #eef8f2, var(--surface) 62%); }
.pt-slot-h { display: flex; align-items: baseline; gap: 8px; }
.pt-slot-t { font-size: max(var(--fs-min), .84rem); font-weight: 700; color: var(--text-2); }
.pt-slot-tm { margin-left: auto; font-size: .86rem; font-weight: 600; color: var(--text-2); }
.pt-slot-b { flex: 1; display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; padding: 8px 10px; border: 1px dashed transparent; border-radius: 6px; background: transparent; text-align: left; }
@media (hover: hover) and (pointer: fine) { button.pt-slot-b:hover { border-color: var(--border-strong); background: var(--surface-2); } }
.pt-slot-name { font-size: 1.28rem; font-weight: 700; white-space: nowrap; }
.pt-sig { display: block; max-width: 60%; max-height: 58px; object-fit: contain; }
.pt-slot-f { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.pt-pchips { display: flex; flex-wrap: wrap; gap: 8px; }
.pt-pchip { display: inline-flex; align-items: center; gap: 6px; min-height: 46px; padding: 0 16px; border: 1px solid var(--border-strong); border-radius: 6px; background: var(--surface); font-size: .95rem; font-weight: 600; white-space: nowrap; transition: border-color .15s var(--ease-out), background-color .15s var(--ease-out); }
.pt-pchip:active { transform: scale(.97); }
@media (hover: hover) and (pointer: fine) { .pt-pchip:hover { border-color: var(--primary); color: var(--primary-dark); } }
.pt-pchip.is-mine { border-color: var(--primary); box-shadow: inset 0 0 0 1px var(--primary); }
.pt-pchip[aria-pressed="true"] { background: var(--primary); border-color: var(--primary); color: #fff; }
.pt-pchip.is-add { border-style: dashed; color: var(--text-2); font-weight: 500; padding: 0 12px; }
.pt-nosig { display: inline-flex; color: var(--accent-dark); }
.pt-none { color: var(--text-3); font-size: .86rem; }
.pt-offb { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
.pt-offb span { color: var(--text-2); font-weight: 600; }
.pt-offb b { font-size: 1.28rem; }
.pt-offact { margin-top: auto; }
.pt-waitbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; margin: -2px 0 14px; padding: 10px 14px; border-radius: 6px; background: var(--accent-soft); color: #7a4306; font-size: .9rem; }
.pt-waitbar .btn { margin-left: auto; }
/* 특이사항 · 점검사항 */
.pt-cols { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 14px; align-items: start; }
.pt-notecard { position: sticky; top: calc(var(--header-h) + 14px); }
.pt-ch { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 10px; margin-bottom: 10px; }
.pt-ch .card-title { margin: 0; }
.pt-ch .spacer { flex: 1; }
.pt-lock { display: inline-flex; align-items: center; gap: 5px; font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--success); }
#pt-note { display: block; width: 100%; min-height: 128px; resize: vertical; padding: 10px 12px; border: 1px solid var(--border-strong); border-radius: 6px; line-height: 1.6; }
#pt-note[readonly] { background: var(--surface-2); }
.pt-nglist { display: grid; gap: 8px; margin-top: 12px; padding: 10px 12px; border-radius: 6px; background: var(--accent-soft); }
.pt-ngh { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; color: #7a4306; }
.pt-ngrow { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 8px; align-items: center; }
.pt-ngsec { padding: 1px 8px; border-radius: 999px; background: var(--surface); color: #7a4306; font-size: max(var(--fs-min), .78rem); font-weight: 700; white-space: nowrap; }
.pt-ngt { font-size: .88rem; }
.pt-ngrow input { grid-column: 1 / -1; min-height: 38px; padding: 0 10px; border: 1px solid #f0d49c; border-radius: 8px; background: var(--surface); }
.pt-noteact { margin-top: 12px; }
.pt-chksum { padding: 2px 10px; border-radius: 999px; background: var(--success-soft); color: var(--success); font-size: max(var(--fs-min), .8rem); font-weight: 600; white-space: nowrap; }
.pt-chksum[data-ng="1"] { background: var(--accent-soft); color: #8a4b06; }
.pt-csg + .pt-csg { margin-top: 14px; }
.pt-csg-h { margin-bottom: 6px; font-size: max(var(--fs-min), .8rem); font-weight: 700; color: var(--text-3); }
.pt-items { list-style: none; display: grid; gap: 4px; margin: 0; padding: 0; }
.pt-item { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 40px; padding: 6px 10px; border: 1px solid #edf1f0; border-radius: 6px; background: var(--surface); text-align: left; font-size: .9rem; line-height: 1.45; }
.pt-item-t { flex: 1; min-width: 0; }
.pt-item-v { flex: none; padding: 2px 9px; border-radius: 999px; background: transparent; color: var(--text-3); font-size: max(var(--fs-min), .8rem); font-weight: 500; white-space: nowrap; }
.pt-item[aria-pressed="true"] { border-color: #f1c46e; background: var(--accent-soft); }
.pt-item[aria-pressed="true"] .pt-item-v { background: var(--accent); color: #1f1300; }
.pt-item:disabled { cursor: default; color: inherit; }
@media (hover: hover) and (pointer: fine) { .pt-item:not(:disabled):hover { border-color: var(--border-strong); } }
/* 월별 일지 */
.pt-mnav { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; }
.pt-mnav .spacer { flex: 1; }
.pt-mlabel { font-size: 1.15rem; white-space: nowrap; }
.pt-sheet { margin-top: 14px; }
.pt-sh-h { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 10px; }
.pt-sh-h > b { font-size: 1rem; }
.pt-sh-h .spacer { flex: 1; }
.pt-stbl { width: 100%; min-width: 720px; border-collapse: collapse; table-layout: fixed; font-size: .9rem; }
.pt-stbl col.c-d { width: 76px; }
.pt-stbl col.c-s { width: 17%; }
.pt-stbl col.c-v { width: 128px; }
.pt-stbl th, .pt-stbl td { padding: 6px 8px; border: 1px solid #d5dcda; text-align: center; vertical-align: middle; }
.pt-stbl thead th { background: var(--surface-2); color: var(--text-2); font-size: max(var(--fs-min), .8rem); font-weight: 700; }
.pt-stbl tbody th { font-weight: 600; }
.pt-td small { display: block; color: var(--text-3); font-size: max(var(--fs-min), .76rem); font-weight: 500; }
.pt-tl { color: var(--text-3); font-size: max(var(--fs-min), .8rem); }
.pt-tn { font-weight: 600; }
.pt-tsig { display: block; max-width: 100%; max-height: 34px; margin: 0 auto; object-fit: contain; }
.pt-tsup { display: block; max-width: 100%; max-height: 60px; margin: 0 auto; object-fit: contain; }
.pt-tsp { height: 40px; text-align: left !important; color: var(--text-2); font-size: .86rem; line-height: 1.5; }
.pt-tsp .is-ng { color: #8a4b06; font-weight: 600; }
.pt-tday { cursor: pointer; }
@media (hover: hover) and (pointer: fine) { .pt-tday:hover th, .pt-tday:hover td { background: #f5faf9; } }
.pt-tday:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }
.pt-tday[data-st="miss"] .pt-td { color: var(--danger); }
.pt-tday[data-st="none"] { cursor: default; color: var(--text-3); }
.pt-tduty { font-size: max(var(--fs-min), .84rem); line-height: 1.35; }
.pt-tduty span { display: block; color: var(--text-3); font-size: max(var(--fs-min), .78rem); }
.pt-tduty b { display: block; }
.pt-tduty .pt-tsig { margin-top: 2px; }
/* 순찰자 · 서명 */
.pt-ptools { display: flex; justify-content: flex-end; margin-bottom: 12px; }
.pt-pgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 12px; }
.pt-pcard { display: flex; flex-direction: column; gap: 10px; padding: 14px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); }
.pt-pcard.is-off { opacity: .62; }
.pt-pc-h { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.pt-pc-h b { margin-right: 4px; font-size: 1.05rem; }
.pt-pc-sig { display: flex; align-items: center; justify-content: center; height: 96px; border: 1px dashed var(--border-strong); border-radius: 6px; background: #fbfcfc; }
.pt-sig-lg { display: block; max-width: 92%; max-height: 84px; object-fit: contain; }
.pt-pc-f { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.pt-pc-mv { display: inline-flex; gap: 2px; margin-left: auto; }
/* 서명 패드 · 폼 */
.pt-padsub { margin: -8px 0 10px; color: var(--text-2); font-size: .86rem; }
.pt-padwrap { position: relative; display: flex; justify-content: center; }
.pt-pad { display: block; border: 2px dashed var(--border-strong); border-radius: 6px; background: #fff; touch-action: none; cursor: crosshair; }
.pt-padline { position: absolute; left: 14%; right: 14%; bottom: 46px; border-bottom: 1px solid #e3e8e7; pointer-events: none; }
.pt-chk { display: inline-flex; align-items: center; gap: 6px; margin-top: 8px; font-size: .88rem; }
.pt-roles { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.pt-roles .pt-chk { margin-top: 0; }
.pt-fsig { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.pt-blist { list-style: none; display: grid; gap: 6px; max-height: 46vh; margin: 0; padding: 0; overflow: auto; }
.pt-blist label { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; padding: 8px 10px; border: 1px solid #edf1f0; border-radius: 6px; }
.pt-blist small { flex-basis: 100%; padding-left: 26px; color: var(--text-3); font-size: max(var(--fs-min), .8rem); }
.pt-popts { display: grid; gap: 8px; }
.pt-popt { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 6px; }
.pt-popt > div { flex: 1 1 140px; display: flex; flex-direction: column; }
.pt-popt span { color: var(--text-3); font-size: max(var(--fs-min), .8rem); }
.pt-prev { position: relative; height: 420px; overflow: hidden; border-radius: 6px; background: #d9dedd; }
.pt-prev iframe { position: absolute; left: 0; top: 0; border: 0; transform-origin: 0 0; background: #d9dedd; }
.pt-csecs { display: grid; gap: 10px; margin-bottom: 10px; }
.pt-csec { padding: 10px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-2); }
.pt-csec-h { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.pt-csec-h input { flex: 1; font-weight: 700; }
.pt-csec textarea { width: 100%; }
@media (max-width: 960px) {
  .pt-slots { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pt-slots > .is-sup { grid-column: 1 / -1; }
  .pt-cols { grid-template-columns: minmax(0, 1fr); }
  .pt-notecard { position: static; }
}
@media (max-width: 640px) {
  .pt-daynav { padding: 10px; }
  .pt-dn-l { width: 100%; }
  .pt-dn-in { flex: 1; min-width: 0; }
  .pt-dn-r { width: 100%; flex-direction: column; align-items: stretch; gap: 6px; }
  .pt-dchips { justify-content: space-between; }
  .pt-dchip { flex: 1; width: auto; }
  .pt-slots { grid-template-columns: minmax(0, 1fr); }
  .pt-slots.is-off .pt-offcard { grid-column: auto; }
  .pt-slot { min-height: 0; }
  .pt-pchip { flex: 1 1 auto; justify-content: center; }
  .pt-stbl { min-width: 0; }
  .pt-stbl colgroup, .pt-stbl thead { display: none; }
  .pt-stbl, .pt-stbl tbody, .pt-stbl tr { display: block; }
  .pt-stbl th, .pt-stbl td { border: 0; padding: 0; }
  .pt-stbl tbody.pt-tday { margin-bottom: 8px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 6px; }
  .pt-stbl tr.pt-r1 { display: grid; grid-template-columns: 44px repeat(2, minmax(0, 1fr)) 84px; grid-template-rows: auto auto; gap: 2px 8px; align-items: center; }
  .pt-stbl tr.pt-r1 > .pt-td { grid-column: 1; grid-row: 1 / 3; text-align: left; }
  .pt-stbl tr.pt-r1 > td:nth-child(2) { grid-column: 2; grid-row: 1; }
  .pt-stbl tr.pt-r1 > td:nth-child(3) { grid-column: 2; grid-row: 2; }
  .pt-stbl tr.pt-r1 > td:nth-child(4) { grid-column: 3; grid-row: 1; }
  .pt-stbl tr.pt-r1 > td:nth-child(5) { grid-column: 3; grid-row: 2; }
  .pt-stbl tr.pt-r1 > .pt-tsv { grid-column: 4; grid-row: 1 / 3; }
  .pt-stbl .pt-tnm { white-space: nowrap; }
  .pt-stbl .pt-tnm::before { content: attr(data-l); display: block; color: var(--text-3); font-size: max(var(--fs-min), .76rem); font-weight: 600; line-height: 1.3; }
  .pt-stbl tr.pt-r2 { display: flex; gap: 8px; margin-top: 6px; }
  .pt-stbl tr.pt-r2 > .pt-tl { display: none; }
  .pt-tsp { height: auto; }
  .pt-tsp:empty { display: none; }
  .pt-tsig { margin: 0; max-height: 28px; }
  .pt-tsup { max-height: 44px; }
}

/* ── 화물보안 대시보드 (sec-dash) · 검색 환경 띠 · 경비대원 배치도 ── */
/* 대시보드 띠 칸 수 — 메인 검색 환경 4칸(c4) · 화물보안 대시보드 화물 보안검색 3칸(c3) */
@container (min-width: 620px) { .dscr-cells.c3, .dscr-cells.c4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container (min-width: 900px) { .dscr-cells.c3 { grid-template-columns: 1.2fr 1fr 1fr; } }
@container (min-width: 1040px) { .dscr-cells.c4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.dscr-body { container-type: inline-size; }
.env-cell .env-h { color: var(--text-2); }
.env-big { display: flex; align-items: baseline; gap: 2px; font-size: 1rem; color: var(--text-3); line-height: 1; }
.env-big b { font-size: 1.9rem; font-weight: 600; color: var(--text); letter-spacing: -.02em; }
.env-big .env-rh { margin-left: 14px; }
.env-big .env-rh b { font-size: 1.35rem; }
.env-big.off { font-size: .9rem; color: var(--text-3); font-family: var(--font); }
.env-dp { font-size: max(var(--fs-min), .82rem); color: var(--text-2); }
.env-dp b { font-weight: 600; color: var(--text); }
.env-cell[data-level="danger"] { background: #fdf4f3; }
.env-cell[data-level="watch"] { background: #fffaf0; }
.env-cond-lv { display: flex; }
.sd-scr { margin-bottom: 20px; }
.sd-fail { border-color: #f3d9a8; background: var(--accent-soft); }

/* 카드 · 칸 */
.sd-card { container-type: inline-size; }
.sd-card .card-title { flex-wrap: wrap; row-gap: 4px; }
.sd-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; }
@container (min-width: 860px) { .sd-grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 28px; } }
.sd-grid-b { margin-top: 22px; padding-top: 18px; border-top: 1px solid #edf1f0; }
.sd-pane { min-width: 0; display: flex; flex-direction: column; }
.sd-ph { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 10px; margin-bottom: 10px; font-size: .86rem; }
.sd-ph b { font-weight: 600; }
.sd-ph .sd-legend { margin-left: auto; }
.sd-ph2 { margin-top: 18px; }
.sd-foot { margin-top: 10px; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.sd-foot b { color: var(--text); font-weight: 600; }
.sd-legend { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: max(var(--fs-min), .82rem); color: var(--text-2); }
.sd-card > .sd-legend { margin: -4px 0 10px; }
.sd-legend span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.sd-legend i { width: 14px; height: 3px; border-radius: 2px; background: var(--c); }
.sd-bars .av-row { grid-template-columns: 104px minmax(0, 1fr) 54px 118px; padding: 4px 0; }
.sd-bars .av-bar { background: var(--primary); }
.sd-bars .av-bar.low { background: #b7791f; }
.sd-late { display: grid; grid-template-columns: 40px 52px minmax(0, 1fr); align-items: baseline; gap: 10px; padding: 7px 0; border-top: 1px solid #edf1f0; font-size: max(var(--fs-min), .84rem); }
.sd-late:first-of-type { border-top: 0; }
.sd-lk { color: var(--text-2); font-weight: 600; }
.sd-lv { color: var(--success); }
.sd-lv b { font-size: 1.1rem; font-weight: 600; }
.sd-lv.bad { color: var(--warning); }
.sd-lt { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.sd-an { display: flex; flex-direction: column; }
.sd-an-row { display: grid; grid-template-columns: 44px 96px minmax(0, 1fr) auto; align-items: baseline; gap: 10px; padding: 7px 0; border-top: 1px solid #edf1f0; font-size: max(var(--fs-min), .84rem); }
.sd-an-row:first-child { border-top: 0; }
.sd-an-row > .mono { color: var(--text-2); font-size: max(var(--fs-min), .8rem); }
.sd-an-row > b { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sd-an-i { min-width: 0; color: var(--text-2); }
.sd-an-i small { display: block; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.sd-env { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; }
@container (min-width: 900px) { .sd-env { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; } }
.sd-over th small { margin-left: 4px; font-size: max(var(--fs-min), .76rem); color: var(--text-3); font-weight: 500; }
.sd-over tbody th { font-weight: 500; color: var(--text-2); background: none; border-bottom: 1px solid #edf1f0; white-space: nowrap; }
.sd-over td { text-align: right; color: var(--text-3); white-space: nowrap; }
.sd-over td.over { color: var(--danger); font-weight: 600; background: #fdf1ef; }
.sd-tbl { margin-top: 12px; font-size: max(var(--fs-min), .84rem); }
.sd-tbl summary { cursor: pointer; color: var(--primary); font-weight: 600; font-size: max(var(--fs-min), .8rem); width: max-content; }
.sd-tbl table { margin-top: 8px; font-size: max(var(--fs-min), .82rem); }
.sd-tbl td, .sd-tbl th { white-space: nowrap; }

/* 선 차트 — 선은 SVG(굵기 고정), 축 글자 · 표식은 HTML(화면 폭에 따라 작아지지 않게) */
.lc { position: relative; padding: 6px 8px 0 44px; }
.lc-plot { position: relative; height: var(--h, 150px); touch-action: pan-y; }
.lc-plot svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.lc-grid { stroke: #e3e9e7; stroke-width: 1; vector-effect: non-scaling-stroke; }
.lc-ref { stroke: var(--text-3); stroke-width: 1; stroke-dasharray: 4 4; vector-effect: non-scaling-stroke; }
.lc-ln { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.lc-one { stroke-width: 5; }
.lc-yt { position: absolute; right: calc(100% + 8px); transform: translateY(-50%); font-size: max(var(--fs-min), .74rem); color: var(--text-3); white-space: nowrap; }
.lc-rl { position: absolute; right: 2px; transform: translateY(-120%); font-size: max(var(--fs-min), .74rem); color: var(--text-3); background: rgba(255,255,255,.85); padding: 0 3px; border-radius: 3px; white-space: nowrap; }
.lc-dot { position: absolute; width: 8px; height: 8px; margin: -4px 0 0 -4px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 2px var(--surface); pointer-events: none; }
.lc-hv { position: absolute; top: 0; bottom: 0; width: 0; pointer-events: none; }
.lc-vl { position: absolute; top: 0; bottom: 0; left: 0; border-left: 1px solid var(--text-3); }
.lc-x { position: relative; height: 20px; margin-top: 4px; }
.lc-x span { position: absolute; transform: translateX(-50%); font-size: max(var(--fs-min), .74rem); color: var(--text-3); white-space: nowrap; }

/* 세로 막대 — 막대 폭 ≤ 22px, 값은 끝에 */
.cc { display: flex; flex-direction: column; }
.cc-plot { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 4px; align-items: end; height: var(--h, 120px); border-bottom: 1px solid var(--border-strong); }
.cc-col { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; min-width: 0; outline: 0; }
.cc-v { font-size: max(var(--fs-min), .76rem); color: var(--text-2); min-height: 1.2em; line-height: 1.2; }
.cc-bar { display: flex; flex-direction: column-reverse; gap: 2px; width: 100%; max-width: 22px; min-height: 0; }
.cc-bar i { display: block; min-height: 3px; background: var(--c); }
.cc-bar i:last-child { border-radius: 4px 4px 0 0; }
.cc-x { display: grid; grid-template-columns: repeat(var(--n), minmax(0, 1fr)); gap: 4px; margin-top: 4px; }
.cc-x span { font-size: max(var(--fs-min), .74rem); color: var(--text-3); text-align: center; white-space: nowrap; }
.cc.dense .cc-plot, .cc.dense .cc-x { gap: 2px; }
.cc.dense .cc-bar { max-width: 14px; }
@media (hover: hover) and (pointer: fine) { .cc-col:hover .cc-bar i { filter: brightness(1.08); } }

/* 차트 말풍선 */
.sd-tt { position: fixed; z-index: 700; max-width: 280px; padding: 8px 10px; border-radius: 6px; background: #0f2a33; color: #fff; font-size: max(var(--fs-min), .82rem); line-height: 1.5;
  box-shadow: var(--shadow-md); pointer-events: none; display: flex; flex-direction: column; gap: 1px; }
.sd-tt[hidden] { display: none; }
.sd-tt b { font-weight: 600; }
.sd-tt span { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.sd-tt i { width: 8px; height: 8px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 1.5px #fff; }
.sd-tt small { color: #a7bcc1; font-size: max(var(--fs-min), .76rem); }

/* 경비대원 배치도 — 도면 + 지점(데이터) */
.gp-card { container-type: inline-size; }
.gp-card .card-title { flex-wrap: wrap; row-gap: 4px; }
.gp-bar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 16px; margin-bottom: 12px; }
.gp-filter { display: flex; flex-wrap: wrap; gap: 6px; }
.gp-f { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; padding: 0 12px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface);
  font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-2); transition: border-color .15s ease, background-color .15s ease; }
.gp-f b { font-weight: 600; color: var(--text); }
.gp-f[aria-pressed="true"] { border-color: var(--sidebar-bg); background: var(--sidebar-bg); color: #fff; }
.gp-f[aria-pressed="true"] b { color: #fff; }
@media (hover: hover) and (pointer: fine) { .gp-f:hover { border-color: var(--primary); } }
.gp-sw { display: inline-block; flex: none; width: 11px; height: 11px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 1.5px #fff, 0 0 0 2.5px rgba(14,26,31,.35); }
.gp-fac { margin-left: auto; font-size: max(var(--fs-min), .8rem); color: var(--text-2); white-space: nowrap; }
.gp-fac b { font-weight: 600; color: var(--text); margin-left: 3px; }
.gp-fac i { font-style: normal; margin: 0 8px; color: var(--text-3); }
.gp-scroll { overflow-x: auto; border: 1px solid var(--border); border-radius: 6px; background: #fff; -webkit-overflow-scrolling: touch; }
.gp-map { position: relative; width: 100%; min-width: 760px; user-select: none; -webkit-user-select: none; }
.gp-img { display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.gp-noimg { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-size: .86rem; color: var(--text-3);
  background: repeating-linear-gradient(45deg, #f5f7f6 0 10px, #eef2f1 10px 20px); }
.gp-pt { position: absolute; width: 30px; height: 30px; margin: -15px 0 0 -15px; padding: 0; border: 0; background: none; display: flex; align-items: center; justify-content: center;
  transition: opacity .18s ease; z-index: 2; }
.gp-dot { width: 15px; height: 15px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 2px #fff, 0 0 0 3px rgba(14,26,31,.55); transition: transform .16s var(--ease-out), box-shadow .16s ease; }
.gp-lb { position: absolute; font-size: max(var(--fs-min), .76rem); font-weight: 700; color: #0e1a1f; white-space: nowrap; line-height: 1; pointer-events: none;
  text-shadow: 0 0 2px #fff, 0 0 2px #fff, 0 0 3px #fff, 0 0 4px #fff; font-family: var(--mono); letter-spacing: -.02em; }
.gp-pt[data-lp="b"] .gp-lb { top: 100%; left: 50%; transform: translate(-50%, -4px); }
.gp-pt[data-lp="t"] .gp-lb { bottom: 100%; left: 50%; transform: translate(-50%, 4px); }
.gp-pt[data-cr][data-lp="b"] .gp-lb { transform: translate(-50%, 13px); }   /* 도면의 카드리더(삼각형) 아래로 */
.gp-pt[data-lp="r"] .gp-lb { left: 100%; top: 50%; transform: translate(-6px, -50%); }
.gp-pt[data-lp="l"] .gp-lb { right: 100%; top: 50%; transform: translate(6px, -50%); }
@media (hover: hover) and (pointer: fine) { .gp-pt:hover .gp-dot { transform: scale(1.18); } }
.gp-pt.on { z-index: 4; }
.gp-pt.on .gp-dot { transform: scale(1.2); box-shadow: 0 0 0 2px #fff, 0 0 0 5px var(--c), 0 0 0 7px rgba(255,255,255,.9); }
.gp-map[data-f="person"] .gp-pt:not([data-k="person"]), .gp-map[data-f="cargo"] .gp-pt:not([data-k="cargo"]),
.gp-map[data-f="shared"] .gp-pt:not([data-k="shared"]), .gp-map[data-f="land"] .gp-pt:not([data-k="land"]) { opacity: .16; }
.gp-pop { position: absolute; z-index: 6; width: 250px; padding: 10px 12px 12px; border-radius: 6px; background: var(--surface); border: 1px solid var(--border);
  box-shadow: var(--shadow-lg); font-size: max(var(--fs-min), .82rem); transform: translate(-50%, 18px); }
.gp-pop[hidden] { display: none; }
.gp-pop[data-v="up"] { transform: translate(-50%, calc(-100% - 18px)); }
.gp-pop[data-h="left"] { transform: translate(-22px, 18px); }
.gp-pop[data-h="left"][data-v="up"] { transform: translate(-22px, calc(-100% - 18px)); }
.gp-pop[data-h="right"] { transform: translate(calc(-100% + 22px), 18px); }
.gp-pop[data-h="right"][data-v="up"] { transform: translate(calc(-100% + 22px), calc(-100% - 18px)); }
.gp-pop-h { display: flex; align-items: center; gap: 8px; }
.gp-pop-h b { font-size: 1.05rem; font-family: var(--mono); font-weight: 600; }
.gp-pop-h .spacer { flex: 1; }
.gp-pop-x { width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; border: 0; border-radius: 8px; background: none; color: var(--text-3); }
.gp-pop-x:hover { background: var(--surface-2); }
.gp-pop-k { margin-top: 2px; color: var(--text-2); }
.gp-pop-f { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
.gp-pop-n { margin-top: 8px; color: var(--text-2); white-space: pre-line; }
.gp-list { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 12px; }
@container (min-width: 900px) { .gp-list { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; } }
.gp-lrow { display: flex; flex-direction: column; gap: 6px; padding: 9px 0; border-top: 1px solid #edf1f0; }
.gp-lk { display: flex; align-items: center; gap: 7px; font-size: max(var(--fs-min), .8rem); color: var(--text-2); font-weight: 600; }
.gp-lk b { font-weight: 600; color: var(--text); }
.gp-lpts { display: flex; flex-wrap: wrap; gap: 5px; }
.gp-chip { position: relative; min-width: 42px; height: 30px; padding: 0 9px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
  font-family: var(--mono); font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--text); }
.gp-chip.on { border-color: var(--sidebar-bg); background: var(--sidebar-bg); color: #fff; }
@media (hover: hover) and (pointer: fine) { .gp-chip:hover { border-color: var(--primary); } }
.gp-note { margin-top: 10px; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
@container (max-width: 620px) { .gp-fac { margin-left: 0; width: 100%; } }

/* 배치도 편집 */
.gp-ed-meta { display: grid; grid-template-columns: minmax(0, 1.3fr) 170px minmax(0, 1.4fr); gap: 10px 14px; margin-bottom: 12px; }
.gp-ed-meta label { display: flex; flex-direction: column; gap: 4px; font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-2); }
.gp-ed-meta input { min-height: 40px; padding: 0 10px; border: 1px solid var(--border-strong); border-radius: 6px; font-weight: 400; }
.gp-ed-img { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; font-size: max(var(--fs-min), .84rem); }
.gp-ed-img .spacer { flex: 1; }
.gp-ed-imgt small { margin-left: 6px; color: var(--text-3); }
.gp-ed-file { cursor: pointer; }
.gp-ed-mapwrap { max-height: 46vh; overflow: auto; border: 1px solid var(--border); border-radius: 6px; background: #fff; }
.gp-edit-map { cursor: crosshair; min-width: 900px; }
.gp-ed-count { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 10px 0; font-size: max(var(--fs-min), .82rem); color: var(--text-2); }
.gp-ed-count b { color: var(--text); font-weight: 600; margin-right: 2px; }
.gp-sep { width: 1px; height: 12px; margin: 0 6px; background: var(--border-strong); }
.gp-ed-tw { max-height: min(300px, 28vh); overflow: auto; border: 1px solid var(--border); border-radius: 6px; margin-bottom: 10px; }
.gp-ed-tbl thead th { position: sticky; top: 0; z-index: 1; }
.gp-ed-tbl td { padding: 5px 6px; }
.gp-ed-tbl td.c, .gp-ed-tbl th.c { text-align: center; }
.gp-ed-tbl input[type="text"], .gp-ed-tbl select { width: 100%; min-height: 34px; padding: 0 8px; border: 1px solid var(--border-strong); border-radius: 8px; font-size: max(var(--fs-min), .84rem); background: var(--surface); }
.gp-ed-tbl .gp-in-label { min-width: 70px; font-family: var(--mono); }
.gp-ed-tbl [data-f="note"] { min-width: 140px; }
.gp-ed-tbl tr.on td { background: var(--primary-soft); }
.gp-ed-tbl tr:hover td { background: transparent; }
.gp-ed-tbl tr.on:hover td { background: var(--primary-soft); }
.gp-pick { width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); }
tr.on .gp-pick { border-color: var(--primary); box-shadow: 0 0 0 2px var(--primary-soft); }
.gp-xy { font-size: max(var(--fs-min), .78rem); color: var(--text-3); white-space: nowrap; }
@media (max-width: 760px) { .gp-ed-meta { grid-template-columns: minmax(0, 1fr); } }

/* 좁은 화면 */
@media (max-width: 640px) {
  .sd-bars .av-row { grid-template-columns: 84px minmax(0, 1fr) 52px; }
  .sd-bars .av-s { display: none; }
  .sd-an-row { grid-template-columns: 40px minmax(0, 1fr) auto; }
  .sd-an-row > b { grid-column: 2; }
  .sd-an-i { grid-column: 2 / 4; grid-row: 2; }
  .sd-an-row .badge { grid-column: 3; grid-row: 1; }
  .gp-f { min-height: 34px; padding: 0 10px; }
}

@media print {
  .gp-scroll, .gp-ed-mapwrap { overflow: visible; border-color: #b9c4c4; }
  .gp-map { min-width: 0; }
  .gp-pop, .gp-filter, .sd-tt, .lc-hv, #sd-refresh, .sd-tbl summary { display: none !important; }
  .sd-tbl:not([open]) > :not(summary) { display: block; }
  .gp-dot, .gp-sw, .lc-dot, .cc-bar i, .sd-legend i, .av-bar { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .sd-card, .gp-card, .sd-pane { break-inside: avoid; }
  .dscr-cells.c3, .dscr-cells.c4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ── 화면 정돈 (모바일 우선) — 한 화면에 한 가지 일 · 주 버튼 하나 + 더보기 · 요약 수치는 한 줄 띠 · 넘치는 표는 행 카드 ──
   모바일 규칙은 모두 screen 한정: 인쇄 폭(A4 ≈ 718px)이 max-width 조건에 걸리지 않게. */

/* ── 액션 시트 (더보기) ── */
.asheet { position: fixed; inset: 0; z-index: 700; display: flex; align-items: flex-end; justify-content: center; }
.asheet-bd { position: absolute; inset: 0; background: rgba(11,31,38,.42); opacity: 0; transition: opacity .24s ease; }
.asheet-panel {
  position: relative; width: min(520px, calc(100% - 16px)); margin: 0 0 calc(8px + env(safe-area-inset-bottom));
  display: flex; flex-direction: column; gap: 8px; transform: translateY(110%); transition: transform .32s var(--ease-drawer);
}
.asheet.on .asheet-bd { opacity: 1; }
.asheet.on .asheet-panel { transform: none; }
.asheet-list { background: var(--surface); border-radius: 6px; overflow: hidden; max-height: 70vh; overflow-y: auto; }
.asheet-t { padding: 13px 18px 11px; font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--text-3); text-align: center; border-bottom: 1px solid #edf1f0; }
.asheet-item {
  display: flex; align-items: center; gap: 14px; width: 100%; min-height: 54px; padding: 0 18px;
  border: 0; border-top: 1px solid #edf1f0; background: none; font-size: 1rem; font-weight: 500; color: var(--text); text-align: left;
}
.asheet-t + .asheet-item, .asheet-list > .asheet-item:first-child { border-top: 0; }
.asheet-item:active { background: var(--surface-2); }
.asheet-item.danger { color: var(--danger); }
.asheet-item[disabled] { color: var(--text-3); cursor: default; }
.asheet-ico { width: 22px; flex: none; display: flex; justify-content: center; color: var(--primary); }
.asheet-item.danger .asheet-ico { color: var(--danger); }
.asheet-ico svg { width: 20px; height: 20px; }
.asheet-cancel { min-height: 54px; border: 0; border-radius: 6px; background: var(--surface); font-size: 1rem; font-weight: 700; color: var(--primary-dark); }
.asheet-cancel:active { background: var(--surface-2); }
@media (min-width: 768px) {
  .asheet { align-items: center; }
  .asheet-panel { width: 380px; margin: 0; transform: scale(.96); opacity: 0; transition: transform .18s var(--ease-out), opacity .18s ease; }
  .asheet.on .asheet-panel { transform: none; opacity: 1; }
}
@media (prefers-reduced-motion: reduce) { .asheet-panel, .asheet-bd { transition: none !important; } }

/* ── 머리말: 더보기 버튼은 모바일에서만 ── */
.ph-more { display: none; }

/* ── PC: 사진 머리말을 낮은 띠로 ── */
@media screen and (min-width: 768px) {
  #view[data-hub] .page-head { min-height: 92px; padding: 18px 24px 16px; border-radius: 6px; align-items: center; }
  #view[data-hub] .page-title { font-size: 1.56rem; }
  #view[data-hub] .page-desc { font-size: max(var(--fs-min), .84rem); margin-top: -4px; }
}

/* ── 허브 패널: 바로가기는 5개까지, 나머지는 펼쳐 보기 ── */
.hub-links .lk-x { display: none; }
.hub-links.all .lk-x { display: flex; }
.lk-toggle {
  display: flex; align-items: center; gap: 6px; width: calc(100% + 16px); margin: 2px -8px 0; min-height: 34px; padding: 4px 12px;
  border: 0; border-radius: 6px; background: none; font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-3); text-align: left;
}
.lk-toggle:hover { background: #edf2f0; color: var(--text-2); }

/* ── 모바일 (<768px, 화면 전용) ── */
@media screen and (max-width: 767px) {
  .view, .view.view-wide, .view.view-mid { padding: 14px 16px 24px; }

  /* 앱바: 로그아웃은 전체 메뉴 시트 안으로 */
  .header { background: rgba(248,250,249,.86); }
  #logout-btn { display: none; }

  /* 하단 탭 — iOS 방식의 반투명 바(가장자리까지) */
  :root { --tabbar-h: 58px; }
  .tabbar {
    left: 0; right: 0; bottom: 0; height: calc(var(--tabbar-h) + env(safe-area-inset-bottom));
    padding: 0 6px env(safe-area-inset-bottom); border-radius: 0;
    background: rgba(248,250,249,.9); border-top: 1px solid rgba(14,26,31,.1); box-shadow: none;
    -webkit-backdrop-filter: saturate(1.8) blur(18px); backdrop-filter: saturate(1.8) blur(18px);
  }
  .tab-btn { height: var(--tabbar-h); margin: 0; border-radius: 0; color: #6b7a80; gap: 2px; font-size: max(var(--fs-min), .74rem); font-weight: 600; }
  .tab-btn.active { background: none; color: var(--primary); }
  .tab-btn .ico { width: 24px; height: 24px; }
  .main { padding-bottom: calc(var(--tabbar-h) + 20px + env(safe-area-inset-bottom)); }

  /* 전체 메뉴 시트: 운영 중인 메뉴만(준비 중 · 바로가기 목록은 PC 패널과 '바로가기' 화면에서) */
  .sidebar.panel .hub-planned, .sidebar.panel .hub-links { display: none !important; }

  /* 머리말 — 큰 제목 + 주 버튼 하나 + 더보기 */
  .page-head { flex-wrap: wrap; align-items: center; gap: 4px 8px; margin-bottom: 14px; }
  .page-head > * { order: 1; }
  .page-head > .page-title { order: 0; flex: 1 1 auto; min-width: 48%; font-size: 1.62rem; letter-spacing: -.025em; line-height: 1.22; }
  .page-head > .spacer { display: none; }
  .page-head > .ph-more { order: 2; }
  /* 제목 · 버튼이 아닌 것(부제 · 상태 문구 · 배지 등)은 다음 줄로 */
  .page-head > :not(.page-title):not(.btn):not(.ph-more):not(.spacer):not(.head-acts) { order: 3; flex: 1 1 100%; }
  .page-head > .page-meta { align-self: auto; padding: 0; font-size: max(var(--fs-min), .8rem); }
  .page-head .ph-hide, .page-head .page-desc, .page-head .page-note { display: none !important; }
  .page-head .ph-more {
    display: inline-flex; width: 38px; height: 38px; border-radius: 6px;
    background: var(--surface); border: 1px solid var(--border); color: var(--text);
  }
  .page-head .btn-primary { min-height: 38px; padding: 0 14px; border-radius: 6px; font-size: .86rem; }
  .page-head .head-acts:not(:has(.btn:not(.ph-hide))) { display: none; }

  /* 사진 머리말 → 흰 바탕 큰 제목 */
  #view[data-hub] .page-head {
    min-height: 0; padding: 0; border-radius: 0; background: none; color: inherit; box-shadow: none;
    overflow: visible; isolation: auto; align-items: center;
  }
  #view[data-hub] .page-head::before, #view[data-hub] .page-head::after { display: none; }
  #view[data-hub] .page-title { color: var(--text); font-size: 1.62rem; }
  #view[data-hub] .page-meta, #view[data-hub] .scr-meta, #view[data-hub] .fo-upd { color: var(--text-3); }
  #view[data-hub] .page-head .btn-ghost { background: var(--surface); border-color: var(--border-strong); }
  #view[data-hub] .page-head .btn-soft { background: var(--primary-soft); }
  #view[data-hub] .page-head .btn-primary { box-shadow: none; }
  #view[data-hub] .page-head .badge { box-shadow: none; }
  #view[data-hub] .page-head .head-link { color: var(--text-3); }

  /* 요약 수치 — 한 줄 띠(가로로 밀어 보기) */
  .stat-row {
    display: flex; gap: 0; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none;
    background: var(--surface); margin-bottom: 14px; border-radius: 6px;
  }
  .stat-row::-webkit-scrollbar { display: none; }
  .stat-row .stat { flex: 1 0 auto; min-width: 92px; padding: 10px 14px; scroll-snap-align: start; border-left: 1px solid #edf1f0; }
  .stat-row .stat:first-child { border-left: 0; }
  .stat-row .stat-label { font-size: max(var(--fs-min), .76rem); white-space: nowrap; }
  .stat-row .stat-value { font-size: 1.22rem; margin-top: 1px; }
  .stat-row .stat-sub { display: none; }

  .card { padding: 16px; border-radius: 6px; }
  .toolbar .search-field { flex: 1 1 100%; }

  /* 표 → 한 행 = 한 덩어리 (넘치거나 칸이 좁아 글자가 세로로 쌓이는 표만, app.js tidyTables) */
  .table-wrap:has(> table.tbl-stack) { overflow: visible; }
  table.tbl-stack, table.tbl-stack > tbody { display: block; width: 100% !important; min-width: 0 !important; max-width: none; }
  table.tbl-stack > thead, table.tbl-stack > colgroup { display: none; }
  table.tbl-stack > tbody > tr {
    display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; padding: 12px 2px;
    border-bottom: 1px solid #edf1f0; background: none;
  }
  table.tbl-stack > tbody > tr:last-child { border-bottom: 0; }
  table.tbl-stack > tbody > tr > td, table.tbl-stack > tbody > tr > th {
    display: block; padding: 0; border: 0; background: none !important; min-width: 0; max-width: 100%;
    width: auto !important; white-space: normal; font-size: .86rem; color: var(--text-2); text-align: left;
  }
  table.tbl-stack > tbody > tr > [data-role="title"] { order: -1; flex: 1 1 100%; font-size: 1rem; font-weight: 600; color: var(--text); line-height: 1.4; }
  table.tbl-stack > tbody > tr > td[data-label]:not([data-label=""]):not([data-role]):not(.td-bare):not(.td-act)::before {
    content: attr(data-label); margin-right: 5px; font-size: max(var(--fs-min), .78rem); font-weight: 500; color: var(--text-3);
  }
  table.tbl-stack > tbody > tr > .td-nil { display: none; }
  table.tbl-stack > tbody > tr > .td-act { margin-left: auto; }
  table.tbl-stack > tbody > tr.tr-full > td { flex: 1 1 100%; }
  table.tbl-stack > tbody > tr.grp-row { padding: 8px 2px 4px; border-bottom: 0; }
  table.tbl-stack > tbody > tr.grp-row > td { font-size: max(var(--fs-min), .82rem); font-weight: 700; color: var(--text-3); }
  table.tbl-stack > tbody > tr:hover > td { background: none !important; }
}

/* ── 대시보드 '오늘' — 3D 카드 옆(PC) · 아래(모바일) ── */
.dash-top.has-today { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 1180px) { .dash-top.has-today { grid-template-columns: minmax(0, 1.75fr) minmax(340px, 1fr); } }
.today-card { background: var(--surface); border: 1px solid var(--border); border-radius: 6px; padding: 16px 8px 8px; display: flex; flex-direction: column; min-width: 0; }
.td-head { display: flex; align-items: baseline; gap: 8px; padding: 0 14px 6px; }
.td-head h2 { font-size: 1.14rem; font-weight: 700; letter-spacing: -.01em; }
.td-list { display: flex; flex-direction: column; flex: 1; justify-content: center; }
.td-row {
  position: relative; display: grid; grid-template-columns: 38px minmax(0, 1fr) auto 16px; align-items: center; gap: 12px;
  width: 100%; min-height: 64px; padding: 8px 12px 8px 14px; border: 0; border-radius: 6px; background: none; text-align: left; color: var(--text);
  transition: background-color .12s ease, transform .16s var(--ease-out);
}
.td-row + .td-row::before { content: ""; position: absolute; top: 0; left: 64px; right: 12px; height: 1px; background: #edf1f0; }
.td-row:active { transform: scale(.985); background: var(--surface-2); }
@media (hover: hover) and (pointer: fine) { .td-row:hover { background: var(--surface-2); } .td-row:hover::before, .td-row:hover + .td-row::before { opacity: 0; } }
.td-ico { width: 38px; height: 38px; border-radius: 6px; display: flex; align-items: center; justify-content: center; background: var(--tn-bg); color: var(--tn-fg); }
.td-body { display: flex; flex-direction: column; min-width: 0; gap: 1px; }
.td-t { font-size: .92rem; font-weight: 600; }
.td-s { font-size: max(var(--fs-min), .8rem); color: var(--text-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.td-s em { font-style: normal; font-weight: 600; color: var(--warning); }
.td-v { font-size: 1.12rem; white-space: nowrap; }
.td-v b { font-weight: 600; }
.td-chev { display: flex; color: var(--border-strong); }
.td-row.tone-warn .td-v b { color: var(--accent-dark); }
.td-row.tone-bad .td-v b { color: var(--danger); }

/* 모듈 구축 현황 — 맨 아래 접힌 줄 */
.dash-build { margin-top: 14px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); }
.dash-build > summary { display: flex; align-items: center; gap: 10px; padding: 12px 18px; cursor: pointer; list-style: none; font-size: .86rem; font-weight: 600; color: var(--text-2); }
.dash-build > summary::-webkit-details-marker { display: none; }
.dash-build > summary::after { content: ""; margin-left: auto; width: 7px; height: 7px; border-right: 1.6px solid var(--text-3); border-bottom: 1.6px solid var(--text-3); transform: rotate(45deg); transition: transform .16s var(--ease-out); }
.dash-build[open] > summary::after { transform: rotate(-135deg); }
.dash-build .build-list { padding: 0 18px 14px; }
@media print { .dash-build { display: none; } }

/* 모바일: 3D 카드는 살리되 낮게 — 3D 장면을 무재해 숫자 뒤로 */
@media screen and (max-width: 767px) {
  .dash-top { gap: 12px; margin-bottom: 12px; }
  .ticket { border-radius: 6px; }
  .tk-hero .tk-main { position: relative; isolation: isolate; min-height: 176px; padding: 16px 18px 14px; gap: 4px; justify-content: flex-start; }
  .tk-hero .tk-stage {
    position: absolute; inset: 0 -24px 0 26%; height: auto; margin: 0; z-index: -1; order: 0;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 34%); mask-image: linear-gradient(90deg, transparent 0%, #000 34%);
  }
  .tk-hero .tk-top { max-width: 62%; }
  .tk-hero .zero-n { font-size: 3rem; margin-top: 2px; }
  .tk-hero .tk-foot { margin-top: auto; }
  .tk-hero .tk-sub { max-width: 58%; }
  .tk-hero .tk-foot .tk-btn { position: absolute; right: 14px; bottom: 12px; }
  .tk-perf { height: 16px; }
  .tk-perf::before, .tk-perf::after { width: 16px; height: 16px; }
  .tk-perf::before { left: -8px; } .tk-perf::after { right: -8px; }
  .tk-hero .tk-side { padding: 8px 18px 14px; gap: 2px 16px; }
  .tk-side > .tk-label { font-size: max(var(--fs-min), .78rem); }
  .tk-level { font-size: 1.55rem; }
  .tk-level-wrap .tk-sub { font-size: max(var(--fs-min), .76rem); }
  .tk-acts { gap: 6px; }
  .tk-btn { height: 28px; font-size: max(var(--fs-min), .76rem); }
  .today-card { border-radius: 6px; padding: 12px 4px 4px; }
  .td-head { padding: 0 14px 4px; }
  .td-row { min-height: 60px; }
}
@media (min-width: 1180px) { .dash-top.has-today .tk-stage { inset: 0 0 0 36%; } }
.tk-level-wrap .tk-sub { white-space: nowrap; }
@media screen and (max-width: 767px) {
  .dflt-mapwrap .fo-map { height: 250px; }
}

/* ── 일정관리 모바일 — 월 달력은 색 점 · 고른 날의 일정은 아래 목록 (iOS 캘린더 방식) ── */
.cal-card-m { padding: 12px 12px 8px; }
.calm-top { display: flex; align-items: center; gap: 2px; margin-bottom: 8px; }
.calm-title { font-size: 1.08rem; font-weight: 700; letter-spacing: -.01em; padding: 0 4px; white-space: nowrap; }
.calm-top .spacer { flex: 1; }
.calm-today { height: 32px; padding: 0 12px; margin-right: 6px; border: 1px solid var(--border-strong); border-radius: 6px; background: var(--surface); font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-2); }
.calm-seg { flex-wrap: nowrap; }
.calm-seg button { min-height: 28px; padding: 0 12px; border: 0; border-radius: 8px; background: transparent; color: var(--text-2); font-size: max(var(--fs-min), .8rem); font-weight: 600; }
.calm-seg button.on { background: var(--surface); color: var(--primary-dark); box-shadow: 0 1px 3px rgba(14,26,31,.12); }
.calm-filter { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 2px 0 10px; margin: 0 -12px; padding-left: 12px; padding-right: 12px; }
.calm-filter::-webkit-scrollbar { display: none; }
.calm-filter .cal-fchip { flex: none; padding: 4px 11px; font-size: max(var(--fs-min), .8rem); }
.calm-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); row-gap: 2px; padding-bottom: 8px; border-bottom: 1px solid #edf1f0; }
.calm-dow { text-align: center; font-size: max(var(--fs-min), .76rem); font-weight: 600; color: var(--text-3); padding: 2px 0 6px; }
.calm-dow.sun { color: #c0392b; } .calm-dow.sat { color: #1d4f91; }
.calm-day {
  display: flex; flex-direction: column; align-items: center; gap: 3px; min-height: 48px; padding: 4px 0 2px;
  border: 0; border-radius: 6px; background: none; color: var(--text);
}
.calm-day.other { visibility: hidden; }
.calm-n { width: 32px; height: 32px; display: flex; align-items: center; justify-content: center; border-radius: 50%; font-size: .95rem; font-weight: 500; font-variant-numeric: tabular-nums; }
.calm-day.sun .calm-n { color: #c0392b; } .calm-day.sat .calm-n { color: #1d4f91; }
.calm-day.today .calm-n { color: var(--primary); font-weight: 700; }
.calm-day.sel .calm-n { background: var(--text); color: #fff; font-weight: 700; }
.calm-day.sel.today .calm-n { background: var(--primary); }
.calm-dots { display: flex; gap: 3px; height: 6px; align-items: center; }
.calm-dots i { width: 6px; height: 6px; border-radius: 50%; background: var(--evf, var(--primary)); box-shadow: none; }
.calm-dots i.ev-gcal { background: #1a73e8; border: 0; }
.calm-dots em { font-style: normal; font-size: max(var(--fs-min), .72rem); line-height: 1; color: var(--text-3); }
.calm-agenda { padding: 10px 2px 4px; }
.calm-agh { display: flex; align-items: center; gap: 8px; padding: 0 2px 6px; font-size: .9rem; }
.calm-agh .spacer { flex: 1; }
.calm-add { width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; border: 0; border-radius: 6px; background: var(--primary-soft); color: var(--primary-dark); }
.calm-none { padding: 18px 4px 22px; color: var(--text-3); font-size: .86rem; }
.calm-ev {
  display: grid; grid-template-columns: 4px 46px minmax(0, 1fr) auto; align-items: center; gap: 10px; width: 100%;
  min-height: 52px; padding: 7px 4px; border: 0; border-top: 1px solid #edf1f0; text-align: left; cursor: pointer;
  background: none !important; color: var(--text) !important; box-shadow: none !important; border-radius: 0;
}
.calm-agh + .calm-ev { border-top: 0; }
.calm-ev:active { background: var(--surface-2) !important; }
.calm-bar { align-self: stretch; width: 4px; border-radius: 2px; background: var(--evf, var(--primary)); }
.calm-when { display: flex; flex-direction: column; font-size: max(var(--fs-min), .8rem); font-weight: 600; font-variant-numeric: tabular-nums; color: var(--text-2); line-height: 1.25; }
.calm-when small { font-weight: 500; color: var(--text-3); }
.calm-body { display: flex; flex-direction: column; min-width: 0; }
.calm-body b { font-size: .94rem; font-weight: 600; line-height: 1.35; }
.calm-body small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.calm-ev.done .calm-body b { text-decoration: line-through; color: var(--text-3); }
.calm-ev.done .calm-bar { opacity: .4; }
.calm-chk { display: flex; align-items: center; justify-content: center; min-width: 32px; }
.calm-chk .chip-check { display: inline-flex !important; width: 26px; height: 26px; align-items: center; justify-content: center; border-radius: 50%; border: 1.5px solid var(--border-strong); font-size: max(var(--fs-min), .8rem); color: transparent; opacity: 1; }
.calm-chk .chip-check.done { background: var(--primary); border-color: var(--primary); color: #fff; }
.calm.is-list .calm-lday + .calm-lday { border-top: 6px solid var(--bg); margin: 0 -12px; padding-left: 14px; padding-right: 14px; }

/* ── 회의록 모바일 — 폴더는 한 줄 칩, 도구줄은 두 줄 ── */
@media screen and (max-width: 767px) {
  .mn-side { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 0 16px 2px; margin: 0 -16px 10px; background: none; border: 0; border-radius: 0; }
  .mn-side::-webkit-scrollbar { display: none; }
  .mn-side-h, .mn-fi-ico { display: none; }
  .mn-fitem { flex: none; width: auto; min-height: 34px; padding: 4px 6px 4px 12px; border: 1px solid var(--border-strong); border-radius: 6px; background: var(--surface); font-size: max(var(--fs-min), .82rem); white-space: nowrap; }
  .mn-fitem.active { background: var(--primary); border-color: var(--primary); color: #fff; }
  .mn-fitem.active .mn-fi-n { background: rgba(255,255,255,.25); color: #fff; }
  .mn-fi-name { white-space: nowrap; }
  .mn-toolbar { gap: 8px; }
  .mn-tabs { flex: 1 1 100%; }
  .mn-tab { flex: 1; text-align: center; padding: 7px 8px; font-size: max(var(--fs-min), .84rem); }
  .mn-search { flex: 1 1 100%; min-width: 0; }
  .mn-search input { height: 40px; border-radius: 6px; }
  .mn-toolbar select { flex: 1; min-width: 0; }
  .mn-main.card { padding: 12px 14px; }
}

/* ── 운항 현황 모바일 — 긴 목록은 앞의 몇 줄만 ── */
table.fo-folded tbody tr.fo-x { display: none !important; }
.fo-more { display: block; width: 100%; min-height: 40px; margin-top: 6px; border: 0; border-radius: 6px; background: var(--surface-2); color: var(--primary-dark); font-size: max(var(--fs-min), .84rem); font-weight: 600; }
@media screen and (max-width: 767px) {
  .fo-map-full { height: 42vh; min-height: 240px; }
  .fo-boards { gap: 12px; }
}
@media screen and (max-width: 767px) {
  table.tbl-stack > tbody > tr > .col-ext { display: none; }
  .mn-side { flex-wrap: nowrap; }
}

/* ── 순찰일지 — 모바일은 점검 항목을 접어 두고(이상 항목만 표시), PC는 늘 펼침 ── */
.pt-chkfold > summary { display: none; }
@media screen and (max-width: 767px) {
  .pt-chkfold > summary {
    display: flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 4px; cursor: pointer; list-style: none;
    font-size: .86rem; font-weight: 600; color: var(--primary-dark);
  }
  .pt-chkfold > summary::-webkit-details-marker { display: none; }
  .pt-chkfold > summary .ico { transition: transform .16s var(--ease-out); }
  .pt-chkfold[open] > summary .ico { transform: rotate(180deg); }
}

/* 회의록 목록(PC): 제목 칸 최소 폭 확보 — 좁으면 제목 · 태그가 세로로 쌓인다(모자라면 표가 가로로 밀림) */
@media screen and (min-width: 768px) {
  .mn-list-tbl { min-width: 820px; }
  .mn-list-tbl th:nth-child(1) { width: 122px !important; }
  .mn-list-tbl th:nth-child(2) { width: 100px !important; }
  .mn-list-tbl th:nth-child(6) { width: 88px !important; }
  .mn-list-tbl th:nth-child(7) { width: 84px !important; }
  .mn-list-tbl th:nth-child(8) { width: 78px !important; }
  .mn-list-tbl th:nth-child(9) { width: 58px !important; }
  .mn-list-tbl .mn-tags { display: flex; flex-wrap: wrap; gap: 4px; }
}
.asheet-panel:focus { outline: none; }
.asheet:not(.on) { pointer-events: none; }
.mn-search-ico { display: flex; }
[hidden] { display: none !important; }   /* .btn 등의 display 지정이 hidden 속성을 이기지 않게 */

/* ── 화면 정돈 2단계 — 편집 모드 · 모바일 접기 (모두 screen 한정, 인쇄와 PC 화면은 그대로) ──
   .m-ed 편집 전용 단추는 모바일에서 평소 숨김(머리말 더보기 › '편집') · [data-mf] 묶음은 제목 줄만(검색 · 필터 중에는 펼침) · .m-hide 모바일에서 숨기는 보조 정보 */
.mf-tog, .mt-more { display: none; }
.page-head > .ph-done { display: none; }
@media screen and (max-width: 767px) {
  #view:not(.m-editing) .m-ed { display: none !important; }
  #view .m-hide { display: none !important; }
  #view.m-editing .page-head > .ph-done {
    display: inline-flex; order: 2; min-height: 38px; padding: 0 16px; border-radius: 6px; font-size: .9rem; font-weight: 700;
  }
  #view.m-editing .page-head > .ph-more { display: none; }   /* 편집 중에는 '완료'만(iOS 방식) */

  /* 접기 */
  [data-mf]:not([data-mf-on]) > :not(.mf-h) { display: none !important; }
  [data-mf] > .mf-h { cursor: pointer; -webkit-tap-highlight-color: transparent; }
  [data-mf]:not([data-mf-on]) > .mf-h { margin-bottom: 0 !important; }
  [data-mf]:not([data-mf-on]) > .mf-h .mf-x { display: none !important; }
  .mf-tog {
    display: inline-flex; align-items: center; justify-content: center; flex: none; width: 34px; height: 34px;
    margin: -8px -8px -8px auto; border: 0; border-radius: 6px; background: none; color: var(--text-3);
  }
  .mf-tog:active { background: var(--surface-2); }
  .mf-tog .ico { transition: transform .18s var(--ease-out); }
  [data-mf-on] > .mf-h > .mf-tog .ico { transform: rotate(180deg); }
  h3.mf-h, h2.mf-h { display: flex; align-items: center; gap: 8px; }

  /* 탭 줄은 한 줄(가로로 밀어 보기) */
  .tabs { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-bottom: 14px; }
  .tabs::-webkit-scrollbar { display: none; }
  .tabs .tab { flex: 0 0 auto; white-space: nowrap; }
  .sp-tabs::-webkit-scrollbar { display: none; }

  /* SERP · 위협전화 — 영문 병기 · 반복 안내는 모바일에서 숨김 */
  #view .tc-en { display: none !important; }
  .sp-sec[data-mf]:not([data-mf-on]), .sp-role[data-mf]:not([data-mf-on]) { margin-bottom: 10px; }
  .sp-cg[data-mf] { margin-bottom: 8px; padding: 10px 12px; }
  .sp-cg > h3.mf-h { justify-content: flex-start; min-height: 30px; margin-bottom: 0; }
  .sp-cg[data-mf-on] > h3.mf-h { margin-bottom: 4px; }
  .sp-grid3 > .sp-sec, .sp-grid2 > .sp-sec { min-width: 0; }
  .sp-grid3 .sp-sh.mf-h, .sp-grid2 .sp-sh.mf-h { align-items: center; }
  .sp-grid3 .sp-sh.mf-h > .spacer, .sp-grid2 .sp-sh.mf-h > .spacer { display: none; }

  /* 위기대응 담당자 · 업무 연락처 — 머리 띠가 있는 카드는 바깥 여백 없이(모바일 .card 여백을 덮어씀) */
  .card.cr-sec, .card.pb-sec { padding: 0; }
  .cr-sec[data-mf] { margin-bottom: 10px; }
  .cr-sec[data-mf]:not([data-mf-on]) > .cr-sechead { border-bottom-color: transparent; }
  .cr-sechead.mf-h { padding: 13px 16px; }
  .cr-sechead .mf-tog { margin-right: -6px; }
  .cr-notes[data-mf]:not([data-mf-on]) > h3 { margin-bottom: 0; }

  /* 업무 연락처 */
  .pb-grid { gap: 10px; }
  .pb-sec[data-mf]:not([data-mf-on]) > .pb-sechead { border-bottom-color: transparent; }
  .pb-sechead.mf-h { min-height: 50px; padding: 10px 14px 10px 16px; }
  .pb-qsec[data-mf] { margin-bottom: 0; border-bottom: 1px solid var(--border); }
  .pb-qsec[data-mf-on] { padding-bottom: 14px; }
  .pb-qh.mf-h { min-height: 50px; margin: 0; }
  .pb-notes[data-mf]:not([data-mf-on]) > h3 { margin-bottom: 0; }

  /* 비상연락망 */
  .ct-sec[data-mf] { margin-bottom: 10px; }
  .ct-grid { gap: 10px; }
  .ct-sec > .card-title.mf-h { flex-wrap: nowrap; }
  .ct-sec > .card-title.mf-h > span:not(.spacer):not(.ct-sico):not(.ct-cnt) { min-width: 0; }
  .ct-sec > .card-title.mf-h .ct-dnum { display: none; }
  .ct-fgrp[data-mf] { margin-bottom: 0; }
  .ct-fgrp[data-mf] > .ct-fgrp-t.mf-h {
    display: flex; align-items: center; gap: 8px; min-height: 46px; padding: 0 2px; font-size: .9rem;
    border-bottom: 1px solid #edf1f0; color: var(--text);
  }
  .ct-fgrp[data-mf-on] > .ct-fgrp-t.mf-h { color: var(--primary-dark); border-bottom-color: var(--primary-soft); }
  .ct-fgrp[data-mf-on] { margin-bottom: 10px; }
  .ct-hero { padding: 14px 16px; margin-bottom: 14px; }
  .ct-hero-main { font-size: 1rem; }

  /* 시스템 설정 — 메뉴 줄은 한 줄 + '…'(액션 시트) · 허브는 접어 둠 · 권한 배지는 수정 화면에서 */
  .menu-tree-item { flex-wrap: nowrap; gap: 8px; min-height: 48px; padding: 6px 4px 6px 10px; margin-bottom: 5px; }
  .menu-tree-item .mt-label { flex: 1 1 0; }
  .menu-tree-item > .badge ~ .badge { display: none; }
  .menu-tree-item .mt-more {
    display: inline-flex; flex: none; align-items: center; justify-content: center; width: 36px; height: 34px;
    border: 0; border-radius: 6px; background: none; color: var(--text-2);
  }
  .menu-tree-item .mt-more:active { background: var(--surface-2); }
  .menu-tree-item .mt-actions { display: none; }
  .menu-tree-item > .mf-tog { order: 5; margin: 0 0 0 -6px; }
  .mt-grp[data-mf] { margin-bottom: 5px; }
  .mt-grp[data-mf]:not([data-mf-on]) > .menu-tree-item.mf-h { margin-bottom: 0; }
  .mt-grp[data-mf-on] > .menu-tree-item.mf-h { border-color: var(--primary); }
}
@media (prefers-reduced-motion: reduce) { .mf-tog .ico { transition: none; } }

/* 비상연락망 — 이모지 대신 선 아이콘 */
.ct-sico { display: inline-flex; color: var(--primary); flex: none; }
.ct-danger .ct-sico { color: var(--danger); }
.ct-cnt { font-size: max(var(--fs-min), .8rem); font-weight: 500; color: var(--text-3); }
.ct-tel { display: inline-flex; align-items: center; gap: 5px; }
.ct-tel .ico { flex: none; color: var(--text-3); }
.ct-num.is-mobile .ct-tel .ico { color: var(--primary); }
.ct-copy { display: inline-flex; align-items: center; color: var(--text-3); }
.ct-hero-main { display: flex; align-items: flex-start; gap: 8px; }
.ct-hero-main .ico { flex: none; margin-top: 2px; }
.ct-duty { display: inline-flex; align-items: center; gap: 5px; }
.card-title .ico { flex: none; }
.card-title > .ico { color: var(--primary); }
.mt-btn .ico { display: block; }
.ct-fgrp-t .ct-cnt { margin-left: 6px; }

/* ── 보안교육 · 자격 관리 — 인원 목록 · 개인 화면 · 기준표 · 폼 ── */
/* 인원 목록 — 자격 상태 칩 묶음 */
.tr-ptbl .c-q { min-width: 260px; }
.tr-ptbl .c-next { white-space: nowrap; }
.tr-qs { display: flex; flex-wrap: wrap; gap: 5px 8px; }
.tr-qi { display: inline-flex; align-items: center; gap: 6px; padding: 3px 4px 3px 9px; border: 1px solid #edf1f0; border-radius: 8px; font-size: max(var(--fs-min), .8rem); }
.tr-qi .tr-qn { color: var(--text-2); font-weight: 600; white-space: nowrap; }
/* 모바일 한 줄 카드(인원 · 교육 기록) */
.tr-mlist { list-style: none; margin: 0; padding: 0; }
.tr-mlist li + li { border-top: 1px solid #edf1f0; }
.tr-mrow { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 3px 10px; width: 100%; padding: 12px 4px; border: 0; background: none; text-align: left; color: var(--text); cursor: pointer; }
.tr-mn { display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.tr-mn b { font-size: 1rem; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tr-mn small { font-size: max(var(--fs-min), .8rem); color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tr-ms { display: inline-flex; gap: 4px; justify-self: end; }
.tr-mx { grid-column: 1 / -1; font-size: max(var(--fs-min), .82rem); color: var(--text-2); }
/* 개인 · 교육 기록 화면 */
.tr-head .tr-back { order: -1; margin-right: 4px; }
.tr-pcap { display: none; }
.tr-pgrid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 18px; align-items: start; }
@media screen and (min-width: 1100px) { .tr-pgrid { grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); } }
.tr-pcard { margin-bottom: 18px; }
.tr-pcard .card-title { flex-wrap: wrap; row-gap: 2px; }
.tr-quals { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 10px; }
.tr-qual { display: flex; flex-direction: column; gap: 5px; padding: 12px 14px; border: 1px solid #e3e9e7; border-left: 4px solid var(--success); border-radius: 6px; background: var(--surface); text-align: left; color: var(--text); font: inherit; }
button.tr-qual { cursor: pointer; }
@media (hover: hover) and (pointer: fine) { button.tr-qual:hover { border-color: var(--primary); } }
.tr-qual[data-st="perm"] { border-left-color: var(--primary); }
.tr-qual[data-st="soon"], .tr-qual[data-st="win"], .tr-qual[data-st="grace"], .tr-qual[data-st="step"] { border-left-color: var(--accent); background: #fffaf0; }
.tr-qual[data-st="exp"], .tr-qual[data-st="susp"], .tr-qual[data-st="lapsed"], .tr-qual[data-st="none"] { border-left-color: var(--danger); background: #fff8f7; }
.tr-qh { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; }
.tr-qh b { font-size: .96rem; font-weight: 700; }
.tr-qd { font-size: .86rem; color: var(--text); }
.tr-qm { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.tr-qual .au-files { margin-top: 2px; }
.tr-hist { list-style: none; margin: 0; padding: 0; }
.tr-hist li { border-bottom: 1px solid #f0f3f2; padding-bottom: 4px; }
.tr-hist li:last-child { border-bottom: 0; }
.tr-hist li > .au-files { padding: 0 4px 6px 104px; }
.tr-hrow { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto; align-items: center; gap: 10px; width: 100%; padding: 10px 4px 6px; border: 0; background: none; text-align: left; color: var(--text); font: inherit; }
button.tr-hrow { cursor: pointer; }
@media (hover: hover) and (pointer: fine) { button.tr-hrow:hover { background: var(--primary-soft); } }
.tr-hd { font-size: .86rem; color: var(--text-2); }
.tr-hn { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.tr-hn b { font-size: .92rem; font-weight: 600; }
.tr-hn small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.tr-he { font-size: max(var(--fs-min), .82rem); color: var(--text-2); white-space: nowrap; }
/* 이수 이력 — 지금 기록은 상태 색 · 남은 날, 그 전 기록은 이력(흐리게) */
.tr-hist li.is-cur.tone-red { background: #fff8f7; box-shadow: inset 3px 0 0 var(--danger); }
.tr-hist li.is-cur.tone-amber { background: #fffaf0; box-shadow: inset 3px 0 0 var(--accent); }
.tr-hist li.is-cur .tr-he { display: inline-flex; align-items: center; gap: 6px; }
.tr-hdd { font-family: var(--mono); font-size: max(var(--fs-min), .84rem); font-weight: 700; }
.tone-red .tr-hdd { color: var(--danger); }
.tone-amber .tr-hdd { color: var(--accent-dark); }
.tr-hist li.is-past .tr-hd, .tr-hist li.is-past .tr-hn b, .tr-hist li.is-past .tr-he { color: var(--text-3); }
.tr-hist li.is-past .tr-hn b { font-weight: 500; }
.tr-past { font-family: var(--font); font-size: max(var(--fs-min), .76rem); font-weight: 600; color: var(--text-3); background: var(--surface-2); border: 1px solid var(--border); border-radius: 999px; padding: 0 6px; margin-right: 6px; }
/* 인원 목록 '다음 갱신' — 상태 색 · 남은 날 */
.tr-ptbl td.c-next.tone-red { color: var(--danger); font-weight: 600; }
.tr-ptbl td.c-next.tone-amber { color: var(--accent-dark); font-weight: 600; }
.tr-ndd { margin-left: 6px; font-size: max(var(--fs-min), .82rem); font-weight: 700; padding: 0 6px; border-radius: 5px; background: var(--accent-soft); }
.tone-red .tr-ndd { background: var(--danger-soft); }
/* 만료 · 미이수 알림판 — 표 형식(상태 · 이름 · 교육 · 기한 · 남은 날), 넓으면 두 단 */
.tr-alert { container-type: inline-size; padding: 10px 14px 6px; margin-bottom: 14px; border-radius: var(--radius); border: 1px solid #f3d9a8; background: #fffcf5; }
.tr-alert.is-bad { border-color: #f1c9c3; background: #fffafa; }
.tr-al-h { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; padding-bottom: 8px; font-size: .9rem; }
.tr-al-h > b { font-weight: 700; }
.tr-al-i { flex: none; width: 24px; height: 24px; border-radius: 7px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent-dark); }
.tr-alert.is-bad .tr-al-i { background: var(--danger-soft); color: var(--danger); }
.tr-al-t { display: inline-flex; align-items: baseline; flex-wrap: wrap; gap: 5px; font-size: max(var(--fs-min), .84rem); color: var(--text-2); }
.tr-al-t em { font-style: normal; font-family: var(--mono); font-weight: 700; }
.tr-al-t em.is-bad { color: var(--danger); }
.tr-al-t em.is-warn { color: var(--accent-dark); }
.tr-al-t small { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.tr-al-sep { color: var(--text-3); }
.tr-al-more { font-size: max(var(--fs-min), .82rem); }
.tr-al-tb { display: grid; grid-template-columns: minmax(0, 1fr); column-gap: 28px; }
.tr-al-r { display: grid; grid-template-columns: 76px minmax(60px, .9fr) minmax(0, 1.7fr) 66px 66px; gap: 8px; align-items: center; min-height: 34px; padding: 3px 6px; border-bottom: 1px solid #ecefee; font-size: max(var(--fs-min), .84rem); }
.tr-al-r[hidden] { display: none; }
.tr-al-hd { min-height: 26px; font-size: max(var(--fs-min), .78rem); font-weight: 600; color: var(--text-3); border-bottom-color: var(--border-strong); }
.tr-al-hd.is-2 { display: none; }
.tr-al-r[data-tperson] { cursor: pointer; border-radius: 0; transition: background-color 150ms ease; }
.tr-al-r[data-tperson]:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }
@media (hover: hover) and (pointer: fine) { .tr-al-r[data-tperson]:hover { background: rgba(15, 118, 110, .06); } }
.tr-al-st .badge { font-size: max(var(--fs-min), .76rem); }
.tr-al-nm { font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tr-al-co { min-width: 0; color: var(--text-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tr-al-dt, .tr-al-dd { text-align: right; font-size: max(var(--fs-min), .8rem); white-space: nowrap; }
.tr-al-dt { color: var(--text-3); }
.tr-al-r.tone-red .tr-al-dd { color: var(--danger); font-weight: 700; }
.tr-al-r.tone-amber .tr-al-dd { color: var(--accent-dark); font-weight: 700; }
@container (min-width: 820px) {
  .tr-al-tb { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tr-al-hd.is-2 { display: grid; }
}
@media (max-width: 560px) {
  .tr-alert { padding: 10px 10px 4px; }
  .tr-al-r { grid-template-columns: 64px minmax(48px, .8fr) minmax(0, 1.5fr) 58px; gap: 6px; padding: 3px 2px; }
  .tr-al-r .tr-al-dt { display: none; }
}
.tr-xls { gap: 4px; }
.ie-xls { display: inline-flex; align-items: center; gap: 3px; margin-right: 10px; }
@media print { .tr-xls { display: none !important; } .tr-al-r[hidden] { display: grid !important; } .tr-alert { background: #fff !important; break-inside: avoid; } }
.tr-dl { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; margin: 0; }
.tr-dl > div { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 10px; align-items: baseline; }
.tr-dl dt { font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-3); }
.tr-dl dd { margin: 0; font-size: .9rem; overflow-wrap: break-word; }
.tr-pcard > .au-files { margin-top: 12px; }
.tr-roles { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.tr-roles li { display: flex; flex-direction: column; gap: 1px; }
.tr-roles b { font-size: .92rem; font-weight: 600; }
.tr-roles small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.tr-eight { list-style: none; margin: 0; padding: 0; }
.tr-eight li { display: grid; grid-template-columns: 54px 128px minmax(0, 1fr); align-items: center; gap: 10px; padding: 9px 2px; border-bottom: 1px solid #f0f3f2; font-size: .9rem; }
.tr-eight li:last-child { border-bottom: 0; }
.tr-eight b { font-weight: 600; }
.tr-ok { display: inline-flex; color: var(--success); }
.tr-att { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 0 0 10px; font-size: .92rem; }
.tr-note { margin: 0; font-size: .9rem; white-space: pre-wrap; }
/* 직무 · 과정 기준표 */
.tr-ctool { margin: 4px 0 0; }
.tr-rch { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 8px; margin-bottom: 12px; }
.tr-rch b { font-size: 1rem; font-weight: 700; }
.tr-rch .spacer { flex: 1; }
.tr-rdl { margin-bottom: 12px; }
.tr-rdl > div { grid-template-columns: 82px minmax(0, 1fr); }
.tr-cat td { vertical-align: top; font-size: .86rem; }
.tr-cat td:first-child { min-width: 220px; }
.tr-cat .c-k { white-space: nowrap; }
.tr-catm { list-style: none; margin: 0; padding: 0; }
.tr-catm li { display: flex; flex-direction: column; gap: 2px; padding: 9px 0; border-top: 1px solid #f0f3f2; font-size: .86rem; }
.tr-catm li span { color: var(--text-2); display: flex; flex-wrap: wrap; gap: 4px 6px; align-items: center; }
.tr-catm li small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.tr-rules { background: #f7faf9; }
.tr-rl { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr)); gap: 8px 22px; }
.tr-rl li { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 8px; font-size: .86rem; }
.tr-rl b { font-weight: 700; color: var(--text-2); }
/* 폼 */
.tr-rgrp + .tr-rgrp { margin-top: 10px; }
.tr-rgrp > small { display: block; margin-bottom: 4px; font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--text-3); }
.tr-hint { display: block; margin-top: 4px; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.tr-ssiadd { margin-top: 6px; }
.tr-clist { list-style: none; margin: 0 0 12px; padding: 0; max-height: 56vh; overflow: auto; border: 1px solid #edf1f0; border-radius: 6px; }
.tr-clist li + li { border-top: 1px solid #f0f3f2; }
.tr-crow { display: flex; align-items: center; gap: 6px; width: 100%; padding: 10px 12px; border: 0; background: none; text-align: left; color: var(--text); cursor: pointer; font: inherit; }
.tr-crow > span:first-child { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.tr-crow b { font-size: .9rem; font-weight: 600; }
.tr-crow small { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
@media (hover: hover) and (pointer: fine) { .tr-crow:hover { background: var(--primary-soft); } }
.tr-cflags { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 4px 0 8px; }
@media screen and (max-width: 767px) {
  .tr-hrow { grid-template-columns: 82px minmax(0, 1fr) auto; }
  .tr-hist li > .au-files { padding-left: 4px; }
  .tr-hist li.is-cur .tr-he .badge { display: none; }
  .tr-dl > div, .tr-rdl > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .tr-eight li { grid-template-columns: 54px minmax(0, 1fr); }
  .tr-eight li > span:last-child { grid-column: 2; }
  .tr-rl li { grid-template-columns: minmax(0, 1fr); gap: 1px; }
  .tr-quals { grid-template-columns: minmax(0, 1fr); }
}
@media print {
  .tr-pcap { display: flex; justify-content: space-between; align-items: baseline; margin: 0 0 8px; font-size: 11pt; }
  .tr-pgrid { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
  .tr-qual, .tr-hist li { break-inside: avoid; }
  .tr-back { display: none !important; }
}

/* ── 점검 · 교육 대시보드 (js/auddash.js) ── */
.ie-card { margin-bottom: 18px; }
.ie-grid2 { grid-template-columns: minmax(0, 1fr); }
@container (min-width: 860px) { .ie-grid2 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.ie-sbs { display: flex; flex-direction: column; gap: 2px; }
.ie-sb { display: grid; grid-template-columns: minmax(96px, 168px) minmax(0, 1fr) 54px; align-items: center; gap: 10px; padding: 5px 0; outline: 0; }
.ie-sb-l { font-size: max(var(--fs-min), .84rem); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ie-sb-t { display: flex; gap: 2px; height: 14px; border-radius: 4px; background: #edf1f0; overflow: hidden; }
.ie-sb-t i { display: block; min-width: 3px; background: var(--c); }
.ie-sb-t i:first-child { border-radius: 4px 0 0 4px; }
.ie-sb-t i:last-child { border-radius: 0 4px 4px 0; }
.ie-sb-t i:only-child { border-radius: 4px; }
.ie-sb-v { font-size: max(var(--fs-min), .82rem); font-weight: 600; text-align: right; color: var(--text); }
.ie-dues { display: flex; flex-direction: column; }
.ie-due, .ie-aud { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; align-items: center; gap: 10px; width: 100%; padding: 8px 4px; border: 0; border-top: 1px solid #edf1f0; background: none; text-align: left; color: var(--text); cursor: pointer; font: inherit; }
.ie-aud { grid-template-columns: 64px minmax(0, 1fr) 72px 40px; }
.ie-dues > :first-child { border-top: 0; }
@media (hover: hover) and (pointer: fine) { .ie-due:hover, .ie-aud:hover { background: var(--primary-soft); } }
.ie-dd { font-size: max(var(--fs-min), .84rem); font-weight: 700; color: var(--text-2); }
.ie-dd[data-lv="3"] { color: var(--danger); }
.ie-dd[data-lv="2"] { color: var(--accent-dark); }
.ie-dn { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.ie-dn b { font-size: .9rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ie-dn small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ie-pg { height: 8px; border-radius: 4px; background: #edf1f0; overflow: hidden; }
.ie-pg i { display: block; height: 100%; border-radius: 4px; background: var(--primary); }
.ie-pc { font-size: max(var(--fs-min), .8rem); text-align: right; color: var(--text-2); }
.ie-more { align-self: flex-start; margin-top: 6px; }
.ie-ok { display: flex; align-items: center; gap: 8px; margin: 6px 0; font-size: .88rem; color: var(--text-2); }
.ie-ok svg { color: var(--success); flex: none; }
.ie-nums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.ie-nums > * { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 10px 12px; border: 1px solid #e3e9e7; border-radius: 6px; background: var(--surface); text-align: left; color: var(--text); font: inherit; }
.ie-nums button { cursor: pointer; }
.ie-nums b { font-size: 1.3rem; font-weight: 700; }
.ie-nums span span, .ie-nums > * > span { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.ie-nums .bad b { color: var(--danger); }
.ie-pend { list-style: none; margin: 0; padding: 0; }
.ie-pend li + li { border-top: 1px solid #edf1f0; }
.ie-pend button { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; width: 100%; padding: 9px 4px; border: 0; background: none; text-align: left; color: var(--text); cursor: pointer; font: inherit; }
.ie-pend b { font-size: .88rem; font-weight: 600; }
.ie-pend small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); white-space: nowrap; }
@media screen and (max-width: 767px) {
  .ie-sb { grid-template-columns: minmax(84px, 120px) minmax(0, 1fr) 48px; gap: 8px; }
  .ie-aud { grid-template-columns: 56px minmax(0, 1fr) 40px; }
  .ie-aud .ie-pg { display: none; }
  .ie-due { grid-template-columns: 56px minmax(0, 1fr) auto; }
}
@media print { .ie-card { break-inside: avoid; } }
/* 직무 · 과정 — 직무 한 줄(누르면 펼침) */
.tr-rgcard { margin-bottom: 16px; }
.tr-rds { display: flex; flex-direction: column; }
.tr-rd { border-top: 1px solid #edf1f0; }
.tr-rds > .tr-rd:first-child { border-top: 0; }
.tr-rd > summary { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) 70px 20px; align-items: center; gap: 12px; padding: 12px 4px; cursor: pointer; list-style: none; }
.tr-rd > summary::-webkit-details-marker { display: none; }
.tr-rd > summary > svg { color: var(--text-3); transition: transform .18s ease; }
.tr-rd[open] > summary > svg { transform: rotate(180deg); }
@media (hover: hover) and (pointer: fine) { .tr-rd > summary:hover { background: #f7faf9; } }
.tr-rn { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; min-width: 0; }
.tr-rn b { font-size: .96rem; font-weight: 700; }
.tr-rc { font-size: max(var(--fs-min), .84rem); color: var(--text-2); }
.tr-rp { font-size: max(var(--fs-min), .8rem); color: var(--text-3); text-align: right; white-space: nowrap; }
.tr-rp b { color: var(--text); font-weight: 600; }
.tr-rb { padding: 2px 4px 16px; }
@media screen and (max-width: 767px) {
  .tr-rd > summary { grid-template-columns: minmax(0, 1fr) auto 20px; gap: 4px 10px; }
  .tr-rd > summary .tr-rc { grid-column: 1; grid-row: 2; font-size: max(var(--fs-min), .8rem); }
  .tr-rd > summary .tr-rp { grid-column: 2; grid-row: 1; }
  .tr-rd > summary > svg { grid-column: 3; grid-row: 1; }
}
@media print { .tr-rd > summary > svg { display: none; } }
#tr-plist .toolbar select { max-width: 190px; }
/* 직무 · 과정 — 인천화물팀(직무군 소제목) · 협력사 · 조업사 */
.tr-rsec + .tr-rsec { margin-top: 14px; }
.tr-rsh { display: flex; align-items: center; gap: 8px; margin: 0 0 4px; padding: 0 2px 6px; border-bottom: 1px solid #edf1f0;
  font-size: max(var(--fs-min), .84rem); font-weight: 700; color: var(--text-2); letter-spacing: -.005em; }
.tr-rsh .rg-dot { width: 9px; height: 9px; }
.tr-vcat td { font-size: .86rem; }
.tr-vcat td:first-child { min-width: 200px; }
.tr-vcat td:first-child b { font-weight: 700; margin-right: 4px; }
.tr-vcat td:nth-child(3) { white-space: nowrap; }
.tr-vbasis { color: var(--text-2); }
.tr-vlist li > span .badge { margin-right: 2px; }
.tr-vwho { color: var(--text-2) !important; }
@media print {
  .tr-rsh .rg-dot { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  .tr-rsec { break-inside: auto; }
  .tr-rsh { break-after: avoid; }
}

/* ── 자체 보안점검 — 수준관리지침 별표 점검표 (js/selfcheck.js) ── */
.sc-head .sc-back { order: -1; margin-right: 4px; }
.sc-tbl .sc-res { white-space: nowrap; font-size: .86rem; color: var(--text-2); }
.sc-src { margin: 10px 2px 0; font-size: max(var(--fs-min), .81rem); color: var(--text-3); }
.sc-src a { text-decoration: underline; text-underline-offset: 2px; }   /* 글 속 링크는 색만으로 구분하지 않음(WCAG 1.4.1) */
.sc-fcards { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); gap: 12px; }
.sc-fcard { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px 12px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); }
.sc-fcard.is-ana { background: var(--primary-soft); border-color: #c6e2dc; }
.sc-fcard-h { display: flex; align-items: baseline; gap: 8px; }
.sc-fcard-h b { font-size: 1rem; }
.sc-bno { flex: none; padding: 1px 7px; border-radius: 6px; background: var(--surface-2); border: 1px solid var(--border); font-size: max(var(--fs-min), .82rem); color: var(--text-2); }
.sc-fcard-f { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: auto; padding-top: 6px; }
.sc-page input:not([type=checkbox]):not([type=file]):not([type=radio]), .sc-page select, .sc-page textarea {
  min-height: 36px; padding: 6px 10px; border: 1.5px solid var(--border-strong); border-radius: var(--radius-sm);
  background: var(--surface); color: var(--text); font-size: .9rem; font-weight: 400; outline: none; transition: border-color .15s; }
.sc-page textarea { padding: 8px 10px; line-height: 1.55; resize: vertical; }
.sc-page input:focus, .sc-page select:focus, .sc-page textarea:focus { border-color: var(--primary); }
.sc-page input:disabled, .sc-page select:disabled, .sc-page textarea:disabled { background: var(--surface-2); color: var(--text-2); }
.sc-info { padding-bottom: 12px; }
.sc-infog, .sc-appr { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 10px; }
.sc-apprw { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--border); }
.sc-appr-h { font-size: max(var(--fs-min), .82rem); font-weight: 700; color: var(--text-3); margin-bottom: 6px; }
.sc-appr { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.sc-infog label, .sc-appr label, .sc-fxg label, .sc-fxa, .sc-rm label { display: flex; flex-direction: column; gap: 4px; font-size: max(var(--fs-min), .81rem); color: var(--text-2); font-weight: 600; }
.sc-prog { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; font-size: .9rem; }
.sc-prog #sc-prog { font-weight: 600; }
.sc-sec { margin-bottom: 14px; }
.sc-note { margin: -4px 0 8px; font-size: max(var(--fs-min), .84rem); color: var(--text-3); }
.sc-items { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.sc-it { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 8px 12px; padding: 9px 10px; border: 1px solid #edf1f0; border-radius: 6px; }
.sc-it.is-tx, .sc-it.is-un { grid-template-columns: minmax(0, 1fr); }
.sc-it.is-eq { grid-template-columns: minmax(0, 1fr) auto minmax(140px, .8fr); }
.sc-it[data-a="RC"], .sc-it[data-a="P"] { border-color: #f3cf96; background: #fffaf0; }
.sc-it.is-flash { animation: sc-flash 1.6s var(--ease-out); }
@keyframes sc-flash { 0% { box-shadow: 0 0 0 3px rgba(245,158,11,.55); } 100% { box-shadow: 0 0 0 0 rgba(245,158,11,0); } }
.sc-q { display: flex; gap: 6px; min-width: 0; font-size: .92rem; line-height: 1.5; }
.sc-l { flex: none; color: var(--text-3); font-weight: 600; }
.sc-grp { padding: 8px 2px 2px; font-size: max(var(--fs-min), .84rem); font-weight: 700; color: var(--text-2); }
.sc-seg { display: inline-flex; flex: none; gap: 2px; padding: 2px; border: 1px solid #d6dedb; border-radius: 6px; background: var(--surface-2); }
.sc-seg button { min-width: 46px; min-height: 34px; padding: 0 10px; border: 0; border-radius: 7px; background: transparent; font-size: max(var(--fs-min), .84rem); font-weight: 600; color: var(--text-2); white-space: nowrap; font-family: var(--mono); }
.sc-seg.is-gp button { font-family: var(--font); }
.sc-seg button:disabled { cursor: default; }
.sc-seg button[aria-pressed="true"][data-sv="Y"], .sc-seg button[aria-pressed="true"][data-sv="G"] { background: var(--success); color: #fff; }
.sc-seg button[aria-pressed="true"][data-sv="N"] { background: #475569; color: #fff; }
.sc-seg button[aria-pressed="true"][data-sv="RC"], .sc-seg button[aria-pressed="true"][data-sv="P"] { background: var(--accent); color: #1f1300; }
.sc-seg button[aria-pressed="true"][data-sv="NA"] { background: #94a3b8; color: #10202a; }
.sc-nm, .sc-rmi { width: 100%; }
.sc-ta { width: 100%; resize: vertical; }
.sc-prs { display: grid; gap: 6px; }
.sc-prs label { display: grid; grid-template-columns: minmax(110px, 30%) minmax(0, 1fr); align-items: center; gap: 8px; font-size: .86rem; color: var(--text-2); }
.sc-uns { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.sc-uns label { display: inline-flex; align-items: center; gap: 6px; font-size: .9rem; color: var(--text-2); }
.sc-uns input { width: 86px; text-align: right; font-family: var(--mono); }
.sc-fxbox { grid-column: 1 / -1; display: grid; gap: 8px; padding: 10px 12px; border-radius: 6px; background: var(--surface); border: 1px dashed #e5b56a; }
.sc-fxh { display: flex; align-items: center; gap: 8px; font-size: max(var(--fs-min), .84rem); font-weight: 700; color: var(--accent-dark); }
.sc-fxg { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.sc-fxg select, .sc-fxg input { width: 100%; min-width: 0; }
.sc-rm { padding: 2px 2px 6px; }
.sc-rm textarea { width: 100%; }
.sc-prev { position: relative; height: 480px; overflow: hidden; border-radius: 6px; background: #d9dedd; }
.sc-prev iframe { position: absolute; left: 0; top: 0; border: 0; transform-origin: 0 0; background: #e9ece9; }
.sc-ana th[scope="rowgroup"] { background: var(--surface-2); vertical-align: middle; white-space: nowrap; }
.sc-ana .num { text-align: right; white-space: nowrap; }
.sc-ana .sc-ana-cat { display: none; }
.sc-ana .sc-ana-sum th.sc-ana-g { border-right: 0; }
.sc-ana .sc-ana-sum th, .sc-ana .sc-ana-sum td { border-top: 2px solid var(--border-strong); font-weight: 700; }
@media screen and (max-width: 767px) {
  .sc-it, .sc-it.is-eq { grid-template-columns: minmax(0, 1fr); }
  .sc-seg { width: 100%; }
  .sc-seg button { flex: 1; }
  .sc-fxg { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sc-prs label { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .sc-appr { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
  .sc-ana { font-size: max(var(--fs-min), .84rem); }
  .sc-ana .sc-ana-g, .sc-ana .sc-dk { display: none; }
  .sc-ana .sc-ana-cat { display: table-row; }
  .sc-ana .sc-ana-cat th { background: var(--surface-2); font-size: max(var(--fs-min), .8rem); }
  .sc-ana th, .sc-ana td { padding-left: 8px; padding-right: 8px; }
}
@media print {
  .sc-back, .sc-prog .btn, #sc-fbtn { display: none !important; }
  .sc-it { break-inside: avoid; }
}

/* ── 점검 표시(주체 → 대상 · 주기) · 수검대비 표식 · 다가오는 점검 ── */
.sc-tags { display: flex; flex-wrap: wrap; gap: 5px; }
.sc-tag { display: inline-flex; align-items: center; padding: 1px 8px; border-radius: 999px; font-size: max(var(--fs-min), .78rem); font-weight: 700; line-height: 1.6; white-space: nowrap; }
.sc-tag.is-off { background: var(--surface-2); border: 1px solid var(--border-strong); color: var(--text-2); }
.sc-tag.is-mark { background: #fdf3dc; border: 1px solid #efd29a; color: #7a4f00; }
.sc-who { display: grid; gap: 3px; margin: 2px 0 0; font-size: max(var(--fs-min), .83rem); color: var(--text-2); }
.sc-who > div { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 6px; align-items: baseline; }
.sc-who dt { font-size: max(var(--fs-min), .78rem); font-weight: 700; color: var(--text-3); }
.sc-who dd { margin: 0; overflow-wrap: anywhere; }
.sc-fcard.is-soon .sc-who div:last-child dd { color: #7a4f00; font-weight: 700; }
@media (pointer: coarse) { .sc-seg button { min-height: 44px; } .uc-day { min-height: 40px; } }
.sc-mark { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px dashed var(--border); }
.sc-mark-t { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.sl-who { display: flex; align-items: center; gap: 5px; font-size: max(var(--fs-min), .83rem); color: var(--text-2); }
.sl-who svg { flex: none; color: var(--text-3); }

/* 다가오는 점검 */
.uc-daily { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 2px 0 12px; margin-bottom: 4px; border-bottom: 1px solid #edf1f0; }
.uc-daily-h { font-size: max(var(--fs-min), .82rem); font-weight: 700; color: var(--text-3); margin-right: 2px; }
.uc-day { display: inline-flex; align-items: center; gap: 5px; min-height: 34px; padding: 4px 11px; border-radius: 999px; border: 1px solid #f1c7c2; background: #fdf1f0; color: var(--danger); font: inherit; font-size: max(var(--fs-min), .84rem); font-weight: 600; cursor: pointer; }
.uc-day.is-done { border-color: #cfe6d9; background: #eef7f2; color: var(--success); }
.uc-grps { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.uc-grp { min-width: 0; }
.uc-gh { display: flex; align-items: baseline; gap: 8px; margin: 0 0 4px; font-size: .9rem; }
.uc-list { list-style: none; margin: 0; padding: 0; }
.uc-row { position: relative; display: flex; align-items: center; gap: 8px; border-top: 1px solid #edf1f0; }
.uc-list > .uc-row:first-child { border-top: 0; }
.uc-main { flex: 1; min-width: 0; display: grid; grid-template-columns: 62px 74px minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 8px 4px; }
button.uc-main { width: 100%; border: 0; background: none; text-align: left; color: var(--text); font: inherit; cursor: pointer; }
@media (hover: hover) and (pointer: fine) { button.uc-main:hover { background: var(--primary-soft); } }
.uc-d { justify-self: start; padding: 2px 7px; border-radius: 6px; background: var(--surface-2); border: 1px solid var(--border); font-size: max(var(--fs-min), .8rem); font-weight: 700; color: var(--text-3); white-space: nowrap; }
.uc-dt { font-size: max(var(--fs-min), .8rem); color: var(--text-3); white-space: nowrap; }
.uc-n { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.uc-n b { font-size: .9rem; font-weight: 600; line-height: 1.35; }
.uc-n small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); line-height: 1.4; }
.uc-act { flex: none; display: flex; align-items: center; padding-right: 2px; }
.uc-recv { color: var(--text-3); display: inline-flex; }
@media (hover: hover) and (pointer: fine) { .uc-day:hover { filter: brightness(.97); border-color: var(--primary); } }
.uc-row.is-soon::before, .uc-row.is-late::before { content: ""; position: absolute; left: -10px; top: 8px; bottom: 8px; width: 3px; border-radius: 3px; background: #d99a0b; }
.uc-row.is-late::before { background: var(--danger); }
.uc-row.is-soon .uc-d { background: #fdf3dc; border-color: #efd29a; color: #7a4f00; }
.uc-row.is-late .uc-d { background: #fdecea; border-color: #f1c7c2; color: var(--danger); }
.uc-row.is-soon .uc-n b, .uc-row.is-late .uc-n b { font-weight: 700; }
.uc-row.is-soon .uc-dt, .uc-row.is-late .uc-dt { color: var(--text); font-weight: 600; }
.uc-more summary { padding: 6px 4px; font-size: max(var(--fs-min), .82rem); color: var(--primary); cursor: pointer; list-style: none; }
.uc-more summary::-webkit-details-marker { display: none; }
.uc-more[open] summary { display: none; }
@media screen and (max-width: 767px) {
  .uc-main { grid-template-columns: 64px minmax(0, 1fr) auto; grid-template-areas: "d n a" "t n a"; row-gap: 2px; }
  .uc-d { grid-area: d; } .uc-dt { grid-area: t; font-size: max(var(--fs-min), .78rem); } .uc-n { grid-area: n; } .uc-recv { grid-area: a; }
  .uc-row.is-soon::before, .uc-row.is-late::before { left: -6px; }
  .sc-who > div { grid-template-columns: 40px minmax(0, 1fr); }
}
@media print {
  .uc-act, .uc-daily button svg { display: none !important; }
  .uc-more summary { display: none; }
  .uc-more > .uc-list { display: block; }
}

/* ── 다가오는 점검 — 받는 점검 · 하는 점검 / 점검 일정 달력 / 안내 편집 ── */
.modal-actions .spacer { flex: 1; }
.uc-split { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; }
@container (min-width: 980px) { .uc-split.is-two { grid-template-columns: minmax(0, 1fr) minmax(0, 1.7fr); gap: 30px; } }
.uc-sec { min-width: 0; }
.uc-sh { position: relative; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; margin: 0 0 8px; padding: 0 0 8px 11px; border-bottom: 1px solid var(--border); font-size: .98rem; }
.uc-sh::before { content: ""; position: absolute; left: 0; top: 2px; bottom: 10px; width: 3px; border-radius: 3px; background: var(--primary); }
.uc-sh.is-recv::before { background: #2b59c3; }
.uc-sh b { font-weight: 700; letter-spacing: -.01em; }
.uc-sh > span:not(.dc-meta) { font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-3); }
.uc-sh > .dc-meta { margin-left: auto; }
.uc-empty { margin: 4px 0 8px; padding: 10px 4px; font-size: max(var(--fs-min), .85rem); color: var(--text-3); }
.uc-gh { margin-top: 2px; }
.uc-row.is-now::before { content: ""; position: absolute; left: -10px; top: 8px; bottom: 8px; width: 3px; border-radius: 3px; background: #2b59c3; }
.uc-row.is-now .uc-d { background: #eaf0fc; border-color: #c5d3f3; color: #1f3f8f; }
.uc-row.is-now .uc-n b { font-weight: 700; }
.ie-err .ie-ok { color: var(--text-3); }
.ie-pick { display: grid; gap: 8px; }
.ie-pick button { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.ie-pick b { font-size: .93rem; }
.ie-pick small { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
@media (hover: hover) and (pointer: fine) { .ie-pick button:hover { border-color: var(--primary); background: var(--primary-soft); } }

/* 점검 일정 달력 */
.ie-cal { --ic-recv: #2b59c3; --ic-recv-bg: #eaf0fc; --ic-recv-fg: #1f3f8f; --ic-due: #d99a0b; --ic-due-bg: #fdf3dc; --ic-due-fg: #7a4f00;
  --ic-late: #c2402f; --ic-late-bg: #fdecea; --ic-late-fg: #a3301f; --ic-done: #2f8f5b; --ic-done-bg: #eef7f2; --ic-done-fg: #23704a; }
.ic-nav { display: inline-flex; align-items: center; gap: 4px; }
.ic-nav .btn { min-height: 32px; }
.ic-nav .btn[disabled] { opacity: .45; cursor: default; }
.ic-lg { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: -4px 0 10px; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.ic-lg span { display: inline-flex; align-items: center; gap: 5px; }
.ic-lg i { width: 9px; height: 9px; border-radius: 3px; background: var(--c); }
.ic-lg .is-recv, .ic-dots .is-recv { --c: var(--ic-recv); }
.ic-lg .is-due, .ic-dots .is-due { --c: var(--ic-due); }
.ic-lg .is-late, .ic-dots .is-late { --c: var(--ic-late); }
.ic-lg .is-done, .ic-dots .is-done { --c: var(--ic-done); }
.ic-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1px solid var(--border); border-left: 1px solid var(--border); border-radius: 6px; overflow: hidden; }
.ic-wd { padding: 6px 0; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--surface-2); text-align: center; font-size: max(var(--fs-min), .8rem); font-weight: 700; color: var(--text-3); }
.ic-wd.is-sun, .ic-c.is-sun .ic-n { color: #c2402f; }
.ic-wd.is-sat, .ic-c.is-sat .ic-n { color: #2b59c3; }
.ic-c { min-width: 0; min-height: 96px; display: flex; flex-direction: column; gap: 3px; padding: 4px 4px 6px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--surface); }
.ic-c.is-out { background: var(--surface-2); }
.ic-c.is-out > *:not(.ic-n) { opacity: .5; }
.ic-c.is-out .ic-n { color: var(--text-3); font-weight: 500; }   /* 날짜 숫자는 대비 4.5 유지(흐리게 대신 연한 글자) */
.ic-n { align-self: flex-start; min-width: 26px; height: 26px; padding: 0 5px; border: 0; border-radius: 999px; background: none; font: inherit; font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-2); font-variant-numeric: tabular-nums; cursor: pointer; }
.ic-c.is-today .ic-n { background: var(--primary); color: #fff; }
.ic-c.is-sel:not(.is-today) .ic-n { box-shadow: inset 0 0 0 1.5px var(--primary); }
.ic-dots { display: none; }
.ic-evs { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ic-ev { display: block; width: 100%; padding: 2px 6px; border: 0; border-left: 3px solid var(--c, var(--border-strong)); border-radius: 4px; background: var(--bg, var(--surface-2)); color: var(--fg, var(--text)); font: inherit; font-size: max(var(--fs-min), .78rem); font-weight: 600; line-height: 1.45; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; cursor: pointer; }
.ic-ev.is-recv, .ic-ag-i.is-recv { --c: var(--ic-recv); --bg: var(--ic-recv-bg); --fg: var(--ic-recv-fg); }
.ic-ev.is-due, .ic-ag-i.is-due { --c: var(--ic-due); --bg: var(--ic-due-bg); --fg: var(--ic-due-fg); }
.ic-ev.is-late, .ic-ag-i.is-late { --c: var(--ic-late); --bg: var(--ic-late-bg); --fg: var(--ic-late-fg); }
.ic-ev.is-done, .ic-ag-i.is-done { --c: var(--ic-done); --bg: var(--ic-done-bg); --fg: var(--ic-done-fg); }
.ic-ev.is-done::before { content: "✓ "; }
.ic-ev.is-ng::after { content: " · 이상"; }
.ic-more { padding: 0 6px; border: 0; background: none; font: inherit; font-size: max(var(--fs-min), .78rem); font-weight: 700; color: var(--primary); cursor: pointer; }
@media (hover: hover) and (pointer: fine) { .ic-ev:hover { filter: brightness(.96); } .ic-n:hover { background: var(--primary-soft); } .ic-c.is-today .ic-n:hover { background: var(--primary); } }
.ic-ag { margin-top: 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-2); }
.ic-ag-h { display: flex; align-items: baseline; gap: 8px; margin-bottom: 6px; font-size: .88rem; }
.ic-ag-l { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.ic-ag-i { width: 100%; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--border); border-left: 3px solid var(--c); border-radius: 8px; background: var(--surface); color: var(--text); font: inherit; text-align: left; cursor: pointer; }
.ic-ag-i > svg { color: var(--text-3); }
.ic-k { padding: 1px 7px; border-radius: 6px; background: var(--bg); color: var(--fg); font-size: max(var(--fs-min), .78rem); font-weight: 700; white-space: nowrap; }
@container (min-width: 700px) { .ic-ag.is-auto { display: none; } }
@media screen { @container (max-width: 699px) {
  .ic-c { min-height: 54px; align-items: center; padding: 4px 2px 6px; cursor: pointer; }
  .ic-n { align-self: center; }
  .ic-evs { display: none; }
  .ic-dots { display: flex; gap: 3px; justify-content: center; }
  .ic-dots i { width: 6px; height: 6px; border-radius: 50%; background: var(--c); }
  .ic-lg { gap: 4px 10px; }
} }
@media (pointer: coarse) { .ic-n { min-width: 32px; height: 32px; } .ic-ag-i { min-height: 48px; } }
@media screen and (max-width: 767px) { .uc-row.is-now::before { left: -6px; } .uc-sh > .dc-meta { margin-left: 0; width: 100%; } }
@media print {
  .ic-nav, .ic-ag, .ie-up .card-title .btn { display: none !important; }
  .ic-c { min-height: 70px; }
  .ic-ev { white-space: normal; }
}

/* 자체 보안점검 안내 편집 */
.sc-cfg-sec { margin-top: 14px; }
.sc-cfg-sec:first-of-type { margin-top: 0; }
.sc-cfg-sec h4 { margin: 0 0 8px; font-size: .9rem; font-weight: 700; }
.sc-cfg-g { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.sc-cfg-g label, .sc-cfg-r label { display: flex; flex-direction: column; gap: 4px; min-width: 0; font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-3); }
.sc-cfg-g input, .sc-cfg-g select, .sc-cfg-r input { width: 100%; min-width: 0; min-height: 36px; padding: 6px 9px; border: 1.5px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface); font-size: .88rem; outline: none; }
.sc-cfg-g input:focus, .sc-cfg-g select:focus, .sc-cfg-r input:focus { border-color: var(--primary); }
.sc-cfg-rows { max-height: 48vh; overflow: auto; border: 1px solid var(--border); border-radius: 6px; }
.sc-cfg-r { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1.35fr) minmax(0, 1fr); align-items: end; gap: 6px 8px; padding: 10px 12px; border-top: 1px solid var(--border); }
.sc-cfg-r:first-child { border-top: 0; }
.sc-cfg-f { grid-column: 1 / -1; display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.sc-cfg-f b { flex: none; font-size: max(var(--fs-min), .8rem); }
.sc-cfg-f small { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: max(var(--fs-min), .8rem); color: var(--text-2); }
@media screen and (max-width: 767px) {
  .sc-cfg-rows { max-height: none; overflow: visible; }
  .sc-cfg-r { grid-template-columns: minmax(0, 1fr); }
}

/* ── 점검 표시(숨김 · 흐리게) · 하드카피 집계 · 일정관리 연동 ── */
/* 흐리게 카드 — 제목 + 가운데 안내 문구(누르면 하드카피 집계) */
.sl-card.is-dim, .sc-fcard.is-dim { appearance: none; -webkit-appearance: none; width: 100%; min-height: 120px; font: inherit; text-align: left; cursor: pointer;
  background: var(--surface-2); border: 1px dashed var(--border-strong); box-shadow: none; color: var(--text-3); }
.sl-card.is-dim::before { background: var(--border); }
.sl-card.is-dim .sl-card-h b, .sc-fcard.is-dim .sc-fcard-h b { color: var(--text-3); font-weight: 600; }
.sc-fcard.is-dim .sc-bno { opacity: .7; }
.sl-dim { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 6px 0 4px; font-size: .9rem; font-weight: 600; color: var(--text-2); }
.sl-dim .ico { opacity: .7; }
@media (hover: hover) and (pointer: fine) { .sl-card.is-dim:hover, .sc-fcard.is-dim:hover { border-color: var(--primary); background: var(--surface); } }
.sl-card.is-dim:focus-visible, .sc-fcard.is-dim:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.sl-hc { padding: 1px 8px; border-radius: 999px; border: 1px dashed var(--border-strong); font-size: max(var(--fs-min), .78rem); font-weight: 600; color: var(--text-3); white-space: nowrap; }
.sl-row.is-dim .sl-row-h b { color: var(--text-2); }
.sc-hcrow td { color: var(--text-2); }
/* 표시 관리(시스템관리자) */
.vis-rows { display: grid; gap: 6px; }
.vis-r { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 190px); align-items: center; gap: 8px 12px; padding: 8px 10px; border: 1px solid #edf1f0; border-radius: 6px; }
.vis-n { display: flex; flex-direction: column; min-width: 0; }
.vis-n b { font-size: .92rem; font-weight: 600; }
.vis-n small { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.vis-r[data-m="hide"] .vis-n b { color: var(--text-3); text-decoration: line-through; }
.vis-r[data-m="dim"] .vis-n b { color: var(--text-2); }
.vis-seg { display: inline-flex; gap: 2px; padding: 2px; border: 1px solid #d6dedb; border-radius: 6px; background: var(--surface-2); }
.vis-seg button { min-height: 34px; padding: 0 12px; border: 0; border-radius: 7px; background: transparent; font-size: max(var(--fs-min), .84rem); font-weight: 600; color: var(--text-2); white-space: nowrap; }
.vis-seg button[data-vm=""][aria-pressed="true"] { background: var(--primary); color: #fff; }
.vis-seg button[data-vm="dim"][aria-pressed="true"] { background: #64748b; color: #fff; }
.vis-seg button[data-vm="hide"][aria-pressed="true"] { background: var(--danger); color: #fff; }
.vis-r:not([data-m="dim"]) .vis-msg { visibility: hidden; }
/* 하드카피 집계 — 매일: 달력 칸 / 주 · 월 · 분기 · 연: 주기 줄 / 편별 · 수시: 월 건수 */
.hc-nav { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.hc-nav b { font-size: .95rem; }
.hc-nav .spacer { flex: 1; }
.hc-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.hc-wd { text-align: center; font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--text-3); padding-bottom: 2px; }
.hc-wd.is-sun { color: var(--danger); }
.hc-wd.is-sat { color: #1d4f91; }
.hc-d { display: grid; place-items: center; min-height: 40px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); font: inherit; font-size: .88rem; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--text-2); }
button.hc-d { cursor: pointer; }
button.hc-d:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
.hc-d.is-pad { border: 0; background: none; }
.hc-d.is-off { border-color: transparent; background: var(--surface-2); color: var(--text-3); font-weight: 500; }
.hc-d.is-rec { border-color: #9fd3c7; background: var(--primary-soft); color: var(--primary-dark); }
.hc-d[data-v="ok"] { border-color: var(--success); background: var(--success); color: #fff; }
.hc-d[data-v="ng"] { border-color: var(--accent); background: var(--accent); color: #1f1300; }
.hc-d[data-v="miss"] { border-color: var(--danger); background: var(--danger); color: #fff; }
.hc-lg { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 10px; font-size: max(var(--fs-min), .81rem); color: var(--text-3); }
.hc-lg span { display: inline-flex; align-items: center; gap: 5px; }
.hc-lg span::before { content: ""; width: 12px; height: 12px; border-radius: 3px; }
.hc-lg [data-v="ok"]::before { background: var(--success); }
.hc-lg [data-v="ng"]::before { background: var(--accent); }
.hc-lg [data-v="miss"]::before { background: var(--danger); }
.hc-lg [data-v="rec"]::before { background: var(--primary-soft); box-shadow: inset 0 0 0 1px #9fd3c7; }
.hc-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; max-height: 60vh; overflow: auto; }
.hc-rows li { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 10px; padding: 8px 10px; border: 1px solid #edf1f0; border-radius: 6px; }
.hc-rows li.is-focus { border-color: var(--primary); }
.hc-l { font-size: .9rem; font-weight: 600; }
.hc-l small { margin-left: 4px; font-weight: 500; color: var(--text-3); }
.hc-rec { padding: 2px 8px; border-radius: 999px; background: var(--primary-soft); font-size: max(var(--fs-min), .81rem); font-weight: 600; color: var(--primary-dark); }
.hc-seg { display: inline-flex; gap: 2px; padding: 2px; border: 1px solid #d6dedb; border-radius: 6px; background: var(--surface-2); }
.hc-seg button { min-height: 34px; padding: 0 12px; border: 0; border-radius: 7px; background: transparent; font-size: max(var(--fs-min), .84rem); font-weight: 600; color: var(--text-2); }
.hc-seg button[data-hv="ok"][aria-pressed="true"] { background: var(--success); color: #fff; }
.hc-seg button[data-hv="ng"][aria-pressed="true"] { background: var(--accent); color: #1f1300; }
.hc-seg button[data-hv="miss"][aria-pressed="true"] { background: var(--danger); color: #fff; }
.hc-cnt { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; font-size: .86rem; color: var(--text-2); }
.hc-cnt input { width: 92px; text-align: right; }
.hc-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; padding: 12px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface-2); }
.hc-form label { display: flex; flex-direction: column; gap: 4px; font-size: max(var(--fs-min), .81rem); font-weight: 600; color: var(--text-3); }
.hc-form input { width: 100%; }
.hc-form .hc-wide { grid-column: 1 / -1; }
.hc-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.hc-list li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid #edf1f0; border-radius: 6px; font-size: .9rem; }
.hc-list li.is-edit { border-color: var(--primary); background: var(--primary-soft); }
.hc-li { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.hc-li small { font-size: max(var(--fs-min), .81rem); color: var(--text-3); overflow-wrap: break-word; }
.hc-fx { flex: none; }
.hc-none { margin: 4px 0 0; font-size: .88rem; color: var(--text-3); }
/* 일정관리 — 점검 일정(읽기 전용) · 바로 가기 아이콘 */
.chip-go { flex: none; display: inline-grid; place-items: center; width: 18px; height: 18px; margin-left: 1px; padding: 0; border: 0; border-radius: 5px;
  background: rgba(255, 255, 255, .72); color: #0f172a; cursor: pointer; line-height: 0; }
.chip-go .ico { width: 12px; height: 12px; }
@media (hover: hover) and (pointer: fine) { .chip-go:hover { background: #fff; box-shadow: 0 0 0 1px rgba(15, 23, 42, .25); } }
.chip-go:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
.cal-bar.is-insp.late:not(.done), .cal-chip.is-insp.late:not(.done) { box-shadow: inset 0 0 0 2px rgba(0, 0, 0, .28); }
.cal-tchip .chip-go { background: var(--surface-2); }
/* 앞날의 '매일 점검'은 옅게(되풀이 일정) — 오늘 · 지난날 · 주기 마감일은 진하게 */
.cal-bar.is-insp.soft, .cal-chip.is-insp.soft { background: var(--surface); color: var(--evc); box-shadow: inset 0 0 0 1px var(--evf); font-weight: 600; }
.is-insp.soft .chip-go { background: var(--surface-2); }
.ag-chip .chip-go { width: 26px; height: 26px; border-radius: 7px; }
.ag-chip .chip-go .ico { width: 15px; height: 15px; }
.calm-ev.has-go { grid-template-columns: 4px 46px minmax(0, 1fr) auto auto; }
.calm-go { display: inline-flex; gap: 6px; }
.calm-go .chip-go { width: 34px; height: 34px; border-radius: 6px; background: var(--surface-2); border: 1px solid var(--border); color: var(--text-2); }
.calm-go .chip-go .ico { width: 16px; height: 16px; }
.calm-ev.is-insp.late:not(.done) .calm-body b::after { content: " · 지남"; font-weight: 600; color: var(--danger); }
/* 점검 일정 상세 — 양식별 완료 체크(전산 기록 · 이상은 잠금) */
.insp-parts { gap: 6px; }
.insp-parts .evf-check { white-space: normal; min-height: 36px; }
.insp-parts .evf-check small { margin-left: auto; padding-left: 8px; font-size: max(var(--fs-min), .78rem); font-weight: 500; color: var(--text-3); white-space: nowrap; }
.insp-parts .is-locked .evf-check { cursor: default; }
@media screen and (max-width: 767px) {
  /* 버튼 4개가 한 줄에 들도록 바로 가기는 아이콘만(이름은 화면 낭독용으로 남김) */
  .insp-acts .btn[data-igo] { position: relative; flex: none; width: 40px; padding: 0; justify-content: center; }
  .insp-acts .btn[data-igo] span { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .insp-acts #f-close { margin-right: auto; }
}
@media screen and (max-width: 767px) {
  .vis-r { grid-template-columns: minmax(0, 1fr) auto; }
  .vis-r .vis-msg { grid-column: 1 / -1; }
  .vis-r:not([data-m="dim"]) .vis-msg { display: none; }
  .hc-form { grid-template-columns: 1fr 1fr; }
  .hc-d { min-height: 42px; }
}
@media print {
  .chip-go, .calm-go { display: none !important; }
  .sl-card.is-dim, .sc-fcard.is-dim { break-inside: avoid; }
}

/* ── 위해물품 적발 일지 (CARES 월 집계 · js/hazfind.js) ── */
.hzf-slot { display: contents; }
.hzf-link { display: inline-flex; align-items: center; gap: 4px; text-decoration: none; }
.hzf-head { display: flex; align-items: baseline; gap: 4px; margin: 6px 0 8px; }
.hzf-big { font-size: 2rem; font-weight: 700; letter-spacing: -.02em; line-height: 1.1; color: var(--text); }
.hzf-head span { font-size: .9rem; color: var(--text-2); }
.hzf-bar { display: flex; gap: 2px; height: 12px; border-radius: 4px; background: #edf1f0; overflow: hidden; min-width: 0; }
.hzf-bar i { display: block; min-width: 3px; background: var(--c); }
.hzf-bar i:first-child { border-radius: 4px 0 0 4px; }
.hzf-bar i:last-child { border-radius: 0 4px 4px 0; }
.hzf-bar i:only-child { border-radius: 4px; }
.hzf-dl { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: 6px 14px; margin: 12px 0 0; }
.hzf-dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; padding: 4px 0; border-bottom: 1px solid #edf1f0; }
.hzf-dl dt { display: inline-flex; align-items: center; gap: 6px; font-size: max(var(--fs-min), .82rem); color: var(--text-2); white-space: nowrap; }
.hzf-dl dt i { width: 9px; height: 9px; border-radius: 2px; background: var(--c); }
.hzf-dl dd { margin: 0; font-size: .92rem; font-weight: 600; color: var(--text); }
.hzf-dl.is-loc { margin-top: 6px; }
.hzf-line { display: grid; grid-template-columns: minmax(96px, 168px) minmax(0, 1fr) auto auto; align-items: center; gap: 10px; padding: 9px 0 3px; margin-top: 6px; border-top: 1px solid #edf1f0; }
.hzf-t { font-size: max(var(--fs-min), .84rem); font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hzf-t small { margin-left: 6px; font-size: max(var(--fs-min), .76rem); color: var(--text-3); }
.hzf-line .hzf-bar { height: 14px; }
.hzf-bar.is-empty { background: #edf1f0; }
.hzf-v { font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--text); white-space: nowrap; }
.hzf-s { font-size: max(var(--fs-min), .82rem); color: var(--text-3); white-space: nowrap; }
@media screen and (max-width: 767px) {
  .hzf-line { grid-template-columns: minmax(0, 1fr) auto; }
  .hzf-line .hzf-bar { grid-column: 1 / -1; grid-row: 2; }
  .hzf-s { display: none; }
}

/* ── 보안교육 · 자격 관리 — 직무군 색 (js/training.js RGROUPS) ──
   3군 + 기타. 색은 CVD 검증 전 쌍 통과(CVD 10.2 · 정상 시각 19.6), 상태 색(초록 · 호박 · 빨강 · 틸) 색상은 피함.
   표식은 점(8px) + 옅은 바탕, 글자는 본문 잉크. 기타는 기본색 + 빈 고리(모양으로도 구분) */
.rg-sup { --rc: #3a4e9d; --rt: #dfe3ef; --rs: #ebedf5; --rb: #c4cae2; }
.rg-scr { --rc: #0d98ce; --rt: #d8eff7; --rs: #e7f5fa; --rb: #b6e0f0; }
.rg-ins { --rc: #932643; --rt: #eedce1; --rs: #f4e9ec; --rb: #dfbec7; }
.rg-etc { --rc: #8a979b; --rt: #eef2f1; --rs: #f5f7f6; --rb: #d6dedb; }
.rg-dot { display: inline-block; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--rc, #8a979b); vertical-align: middle; }
.rg-dot.rg-etc { background: transparent; box-shadow: inset 0 0 0 1.5px var(--rc); }
.tr-role { display: inline-flex; align-items: center; gap: 6px; margin: 0 4px 4px 0; padding: 1px 8px 1px 7px; border-radius: 6px; background: var(--rt, #eef2f1);
  color: var(--text); font-size: max(var(--fs-min), .8rem); font-weight: 600; line-height: 1.65; white-space: nowrap; }
.tr-role .rg-dot { width: 7px; height: 7px; }
.tr-role.is-held { background: var(--rs, transparent); box-shadow: inset 0 0 0 1px var(--rb, var(--border-strong)); font-weight: 500; }
.tr-role.is-held small { margin-left: 2px; font-size: max(var(--fs-min), .74rem); font-weight: 600; color: var(--text-3); }
.tr-rmini .is-held { color: var(--text-3); }
/* 인원 목록 위 직무군 범례 = 걸러 보기 */
.tr-rglg { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: -2px 0 12px; }
.tr-rgb { display: inline-flex; align-items: center; gap: 7px; min-height: 32px; padding: 0 11px 0 10px; border: 1px solid var(--border); border-radius: 999px;
  background: var(--surface); color: var(--text-2); font-size: max(var(--fs-min), .82rem); font-weight: 600; white-space: nowrap;
  transition: background-color .15s var(--ease-out), border-color .15s var(--ease-out), color .15s var(--ease-out); }
.tr-rgb b { font-weight: 600; color: var(--text-3); }
@media (hover: hover) and (pointer: fine) { .tr-rgb:not(:disabled):hover { border-color: var(--rb); background: var(--rt); color: var(--text); } }
.tr-rgb[aria-pressed="true"] { border-color: var(--rc); background: var(--rt); color: var(--text); box-shadow: inset 0 0 0 1px var(--rc); }
.tr-rgb[aria-pressed="true"] b { color: var(--text); }
.tr-rgb.is-zero { opacity: .5; cursor: default; }
.tr-rgb:focus-visible { outline: 2px solid var(--rc); outline-offset: 2px; }
/* 직무 · 과정 탭 색 범례(누르지 않음) */
.tr-rglg.is-key { margin: 0; gap: 4px 14px; }
/* 모바일 한 줄 카드 — 이름 옆 직무군 점 */
.tr-rdots { display: inline-flex; align-items: center; gap: 3px; flex: none; align-self: center; }
/* 이수 현황표 이름 칸 — 작은 직무 표시 */
.tr-rmini { display: flex; flex-wrap: wrap; gap: 1px 10px; margin-top: 2px; }
.tr-rmini > span { display: inline-flex; align-items: center; gap: 5px; font-size: max(var(--fs-min), .81rem); color: var(--text-2); white-space: nowrap; }
.tr-rmini .rg-dot { width: 7px; height: 7px; }
/* 개인 화면 직무 카드 */
.tr-roles li { padding-left: 2px; }
.tr-roles b { display: inline-flex; align-items: center; gap: 8px; }
.tr-roles small { padding-left: 16px; }
/* 직무 · 과정 기준표 — 직무 줄 왼쪽 색 띠 + 점 */
.tr-rd[class*="rg-"] > summary { box-shadow: inset 3px 0 0 var(--rc); padding-left: 14px; }
.tr-rd.rg-etc > summary { box-shadow: inset 3px 0 0 var(--rb); }
.tr-rd[class*="rg-"][open] > summary { background: var(--rs); }
.tr-rn > .rg-dot { margin-right: -1px; }
/* 인원 등록 · 과정 편집 — 직무 고르기 */
.tr-rgrp > small { display: flex; align-items: center; gap: 7px; font-size: max(var(--fs-min), .81rem); }
.tr-rgrp:not(.rg-etc) .ck-rc:has(input:checked) { border-color: var(--rc); background: var(--rt); color: var(--text); }
.tr-rgrp:not(.rg-etc) .ck-rc input { accent-color: var(--rc); }
#tc-roles .ck-rc .rg-dot { margin-left: -1px; }
#tc-roles .ck-rc:not(.rg-etc):has(input:checked) { border-color: var(--rc); background: var(--rt); color: var(--text); }
@media screen and (max-width: 767px) {
  .tr-rglg:not(.is-key) { flex-wrap: nowrap; overflow-x: auto; margin: 0 -2px 10px; padding: 2px 2px 4px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .tr-rglg:not(.is-key)::-webkit-scrollbar { display: none; }
  .tr-rgb { min-height: 36px; }
  .tr-rglg.is-key { gap: 4px 12px; }
}
@media print {
  .tr-rglg:not(.is-key) { display: none; }
  .rg-dot, .tr-role, .tr-rd[class*="rg-"] > summary { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ── 보안교육 이수 등록 — 본인 등록 · 임명일 · 링크 관리 ── */
.tr-self { display: inline-block; margin-left: 4px; padding: 0 7px; border-radius: 999px; background: var(--info-soft); color: var(--info); font-size: max(var(--fs-min), .76rem); font-weight: 700; vertical-align: middle; white-space: nowrap; }
.tr-self.is-ok { background: #eef4f3; color: var(--text-3); font-weight: 600; }
.tr-ms .tr-self { margin: 0 4px 0 0; }
.tr-apt { margin-left: 4px; padding: 0 6px; border-radius: 6px; background: var(--surface-2); border: 1px solid var(--border); color: var(--text-2); font-size: max(var(--fs-min), .76rem); font-weight: 500; }
.tr-apts { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.tr-apts li { display: grid; grid-template-columns: minmax(0, 1fr) 180px; align-items: center; gap: 10px; padding: 6px 10px; border-radius: var(--radius-sm); background: var(--surface-2); box-shadow: inset 3px 0 0 var(--rc, var(--border-strong)); }
.tr-apts li.rg-etc { box-shadow: inset 3px 0 0 var(--rb); }
.tr-apts li span { display: inline-flex; align-items: center; gap: 8px; font-size: .88rem; font-weight: 600; min-width: 0; }
.tr-apts input { min-height: 36px; padding: 0 9px; border: 1.5px solid var(--border-strong); border-radius: 8px; font-family: var(--mono); font-size: .86rem; background: var(--surface); }
.tr-chk { margin-top: 8px; }
.tr-chk small { color: var(--text-3); margin-left: 4px; }
.pb-chk b { margin-left: 2px; font-size: max(var(--fs-min), .82rem); }
.te-body { display: flex; flex-direction: column; gap: 12px; }
.te-link { border: 1px solid var(--border); border-radius: var(--radius); padding: 12px 14px; background: var(--surface); }
.te-link.is-off { background: var(--surface-2); }
.te-link.is-off .te-url { color: var(--text-3); text-decoration: line-through; text-decoration-color: var(--border-strong); }
.te-url { margin-top: 4px; font-size: max(var(--fs-min), .82rem); color: var(--text-2); overflow-wrap: anywhere; }
.te-acts { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.te-acts .spacer { flex: 1; }
.te-acts [data-te="qr"][aria-pressed="true"] { border-color: var(--primary); color: var(--primary); }
.te-acts .te-renew { color: var(--text-3); }
.te-acts .te-renew.is-armed { border-color: var(--danger); color: var(--danger); }
.te-none { padding: 4px; }
.te-qr { display: flex; align-items: center; gap: 14px; margin-top: 10px; padding: 10px; border-radius: var(--radius-sm); background: var(--surface-2); }
.te-qr svg { width: 176px; height: 176px; background: #fff; border-radius: 8px; }
.te-h { display: flex; align-items: baseline; gap: 8px; margin-top: 6px; font-size: .92rem; font-weight: 700; }
.te-h small { font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--info); }
.te-h .spacer { flex: 1; }
.te-h small.te-hn { color: var(--danger); font-family: var(--mono); }
.te-need { list-style: none; margin: 0 0 8px; padding: 0; border-top: 1px solid var(--border); max-height: 300px; overflow-y: auto; }
.te-nrow { width: 100%; display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 10px; align-items: start; padding: 8px 4px; border: none; border-bottom: 1px solid var(--border); background: none; text-align: left; font: inherit; font-size: .86rem; cursor: pointer; }
@media (hover: hover) and (pointer: fine) { .te-nrow:hover { background: var(--surface-2); } }
.te-nis { display: flex; flex-wrap: wrap; gap: 4px 10px; }
.te-ni { color: var(--text-2); white-space: nowrap; }
.te-ni em { margin-left: 5px; font-style: normal; font-weight: 700; font-size: max(var(--fs-min), .82rem); }
.te-ni.tone-red em { color: var(--danger); }
.te-ni.tone-amber em { color: var(--accent-dark); }
.te-recent { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; border-top: 1px solid var(--border); }
.te-rrow { width: 100%; display: flex; align-items: center; gap: 10px; padding: 9px 4px; border: none; border-bottom: 1px solid var(--border); background: none; text-align: left; font-size: .88rem; }
.te-rrow:hover { background: var(--surface-2); }
.te-rt { color: var(--text-3); font-size: max(var(--fs-min), .82rem); flex: none; }
.te-rrow small { color: var(--text-3); font-size: max(var(--fs-min), .82rem); flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.te-rn { color: var(--text-3); font-size: max(var(--fs-min), .82rem); white-space: nowrap; }
@media screen and (max-width: 767px) {
  .tr-apts li { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .te-rrow { flex-wrap: wrap; gap: 4px 8px; }
  .te-rrow small { flex-basis: 100%; order: 5; }
}

/* ── 점검교육 · 수검대응 자료 — 증빙 문서 서가 · 협력사 · 계약 · 상용화주 · 보안 처리 대장 · 전파교육 · 검색 실적 ── */
/* 버튼 위계: 주 버튼(btn-primary) 하나 · 보조(btn-ghost) · 관리 · 드문 조작은 글자 단추(link-btn) */
.link-btn { display: inline-flex; align-items: center; gap: 4px; color: var(--text-2); }
.link-btn .ico { color: currentColor; }
@media (hover: hover) and (pointer: fine) { .link-btn:hover { color: var(--primary-dark); } }
.link-btn.danger { color: var(--danger); }
.modal-actions .link-btn { min-height: 40px; padding: 0 6px; font-size: max(var(--fs-min), .84rem); }

/* 증빙 문서 서가 */
.dk-grps { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px 22px; }
.dk-grp { min-width: 0; }
.dk-gh { display: flex; align-items: baseline; gap: 8px; padding-bottom: 6px; border-bottom: 1px solid var(--border); margin-bottom: 4px; }
.dk-gh h4 { margin: 0; font-size: .92rem; font-weight: 700; letter-spacing: -.01em; }
.dk-n { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.dk-list { list-style: none; margin: 0; padding: 0; }
.dk-row { display: flex; align-items: flex-start; gap: 10px; padding: 8px 2px; border-bottom: 1px solid #eef2f1; flex-wrap: wrap; }
.dk-row:last-child { border-bottom: none; }
.dk-ext { flex: none; width: 40px; padding: 2px 0; border-radius: 5px; background: var(--surface-2); border: 1px solid var(--border); color: var(--text-3); font-size: max(var(--fs-min), .72rem); font-weight: 600; text-align: center; letter-spacing: .02em; margin-top: 2px; }
.dk-main { flex: 1 1 200px; min-width: 0; }
.dk-t { font-size: .9rem; font-weight: 600; line-height: 1.45; overflow-wrap: anywhere; }
.dk-t a { color: var(--text); }
@media (hover: hover) and (pointer: fine) { .dk-t a:hover { color: var(--primary-dark); text-decoration: underline; } }
.dk-ssi { display: inline-block; margin-left: 4px; padding: 0 5px; border-radius: 4px; background: var(--danger-soft); color: var(--danger); font-size: max(var(--fs-min), .74rem); font-weight: 700; vertical-align: 1px; }
.dk-meta { margin-top: 1px; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.dk-sep { margin: 0 5px; color: var(--border-strong); }
.dk-more { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 3px; }
.dk-f { font-size: max(var(--fs-min), .82rem); color: var(--text-2); overflow-wrap: anywhere; }
.dk-edit { flex: none; margin-left: auto; }
.dk-old-btn { flex: none; font-size: max(var(--fs-min), .8rem); margin-left: 50px; padding: 0 2px; }
.dk-row:has(.dk-edit) .dk-old-btn { margin-left: 50px; }
.dk-olds { list-style: none; padding: 0 0 6px 50px; }
.dk-olds ul { list-style: none; margin: 0; padding: 0; border-left: 2px solid var(--border); }
.dk-row.is-old { padding-left: 10px; border-bottom-color: transparent; }
.dk-row.is-old .dk-ext { opacity: .7; }
.dk-row.is-old .dk-t { font-weight: 500; }
.dk-add { display: inline-flex; align-items: center; gap: 3px; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.dk-add:hover { color: var(--primary); }
.card-title .dk-add { margin: 0; }
.dk-top { display: flex; justify-content: flex-end; margin: -4px 0 6px; }
.dk-empty { margin: 8px 0; font-size: max(var(--fs-min), .84rem); color: var(--text-3); }
.dk-card .card-title { margin-bottom: 10px; }
.dk-hl { color: var(--primary-dark); background: var(--primary-soft); border-radius: 3px; padding: 0 1px; }
.dk-fhit { margin-top: 2px; font-size: max(var(--fs-min), .8rem); color: var(--text-3); overflow-wrap: anywhere; }
.dk-qbar { padding-top: 0; }
/* 문서 서가 게시판형(문서가 많은 화면) — 게시판(bb-*) 문법에 문서 칸만 더한다 */
.dkb-bar .bb-cat-b { display: inline-flex; align-items: center; gap: 5px; }
.dkb-cn { font-size: max(var(--fs-min), .78rem); font-weight: 500; color: var(--text-3); }
.bb-cat-b[aria-pressed="true"] .dkb-cn { color: rgba(255, 255, 255, .82); }
.dkb-tbl col.c-cat { width: 128px; } .dkb-tbl col.c-file { width: 27%; } .dkb-tbl col.c-at { width: 86px; } .dkb-tbl col.c-act { width: 44px; }
.dkb-tbl td { vertical-align: top; }
.dkb-tbl td.bb-no, .dkb-tbl td.bb-at, .dkb-tbl td.bb-catc { padding-top: 9px; }
.dkb-tw { display: flex; align-items: baseline; flex-wrap: wrap; gap: 2px 7px; min-width: 0; }
.dkb-t, .dkb-t.nb-file { display: inline; padding: 0; border: 0; border-radius: 0; background: none; color: var(--text); font-size: .9rem; font-weight: 600; line-height: 1.45; overflow-wrap: anywhere; }
a.dkb-t:hover, a.dkb-t:focus-visible { color: var(--primary-dark); text-decoration: underline; }
.dkb-tw .dk-ssi { margin-left: 0; }
.dkb-ob { font-size: max(var(--fs-min), .8rem); }
.dkb-om { flex: none; padding: 0 5px; border-radius: 3px; background: var(--surface); border: 1px solid var(--border); color: var(--text-3); font-size: max(var(--fs-min), .74rem); font-weight: 600; }
.dkb-sub { margin-top: 2px; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.dkb-tc .dk-more { margin-top: 4px; }
.dkb-fc { min-width: 0; }
.dkb-fn { display: flex; align-items: center; gap: 6px; min-width: 0; }
.dkb-x { flex: none; padding: 1px 4px; border: 1px solid var(--border); border-radius: 3px; background: var(--surface-2); color: var(--text-3); font-size: max(var(--fs-min), .72rem); font-weight: 600; }
.dkb-fnn { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: max(var(--fs-min), .84rem); color: var(--text-2); }
.dkb-fc .cell-sub { display: block; margin-top: 2px; }
.dkb-row.is-old td { background: var(--surface-2); }
.dkb-row.is-old .dkb-t { font-weight: 500; }
.dkb-tbl tr.dkb-row:not(.is-old):hover td { background: var(--primary-soft); }
.dkb-act { text-align: center; }
.dkb-mlist { display: flex; flex-direction: column; border-top: 1px solid var(--line); }
.dkb-mi { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; padding: 10px 2px; border-bottom: 1px solid var(--hair); }
.dkb-mi.is-old { padding-left: 14px; background: var(--surface-2); }
.dkb-mt { display: flex; align-items: flex-start; gap: 6px; width: 100%; min-width: 0; }
.dkb-mt .dkb-t { flex: 0 1 auto; min-width: 0; }
.dkb-mt .dk-edit { margin-left: auto; }
.dkb-mi .bb-ms { overflow-wrap: anywhere; }
/* 체크리스트 증빙 문서 칩 */
.ck-doc { display: inline-flex; align-items: center; gap: 5px; max-width: 100%; min-height: 28px; padding: 0 9px; border: 1px solid var(--border); border-radius: 7px; background: var(--surface);
  color: var(--text-2); font-size: max(var(--fs-min), .82rem); font-weight: 500; }
.ck-doc span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 260px; }
.ck-doc small { color: var(--text-3); font-size: max(var(--fs-min), .76rem); }
@media (hover: hover) and (pointer: fine) { .ck-doc:hover { border-color: var(--border-strong); color: var(--text); } }
.ck-docmore { font-size: max(var(--fs-min), .8rem); }

/* 상세 정의 목록 · 아래 주석 (협력사 · 계약 · 상용화주 · 보안 처리 대장 공용) */
.pn-dl { display: grid; grid-template-columns: 1fr; margin: 0 0 12px; }
.pn-dl > div { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 10px; padding: 8px 0; border-bottom: 1px solid #edf1f0; font-size: .9rem; }
.pn-dl dt { color: var(--text-3); font-size: max(var(--fs-min), .81rem); padding-top: 1px; }
.pn-dl dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.pn-note { margin: 10px 2px 0; font-size: max(var(--fs-min), .81rem); color: var(--text-3); line-height: 1.55; }

/* 협력사 · 보안요원 — 편성표 */
.pn-legend { display: inline-flex; flex-wrap: wrap; gap: 4px 14px; margin-left: auto; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.pn-legend > span { display: inline-flex; align-items: center; gap: 5px; }
.pn-band { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 16px 0 8px; }
.pn-band:first-child { margin-top: 4px; }
.pn-band h3 { margin: 0; font-size: .96rem; font-weight: 700; }
.pn-band h3 .mono { margin-left: 4px; color: var(--text-3); font-weight: 600; font-size: .86rem; }
.pn-lead { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.pn-board { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.pn-col { border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-2); padding: 10px; min-width: 0; }
.pn-ch { display: flex; align-items: baseline; gap: 6px; margin-bottom: 8px; }
.pn-ch h4 { margin: 0; font-size: .88rem; font-weight: 700; }
.pn-ch .mono { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.pn-ch small { font-size: max(var(--fs-min), .78rem); color: var(--text-3); }
.pn-ps { display: flex; flex-wrap: wrap; gap: 5px; }
.pn-p { display: inline-flex; align-items: center; gap: 4px; min-height: 30px; padding: 0 9px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface);
  font-size: max(var(--fs-min), .84rem); color: var(--text); transition: border-color .12s ease, transform .16s var(--ease-out); }
.pn-p:active { transform: scale(.97); }
@media (hover: hover) and (pointer: fine) { .pn-p:hover { border-color: var(--primary); } }
.pn-p.is-chk { border-style: dashed; border-color: var(--accent); }
.pn-pos { font-size: max(var(--fs-min), .76rem); font-weight: 700; color: var(--primary-dark); background: var(--primary-soft); border-radius: 5px; padding: 0 5px; }
.pn-sup { color: #b7791f; font-size: max(var(--fs-min), .82rem); line-height: 1; }
.pn-sup.is-plan { color: var(--text-3); }
.pn-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--border-strong); flex: none; }
.pn-dot.is-green { background: var(--success); } .pn-dot.is-amber { background: #d99a0b; } .pn-dot.is-red { background: var(--danger); } .pn-dot.is-blue { background: var(--info); }
.pn-foot { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; margin-top: 16px; padding-top: 12px; border-top: 1px solid var(--border); }
.pn-foot h4 { margin: 0 0 6px; font-size: .86rem; font-weight: 700; color: var(--text-2); }
.pn-mv { display: flex; flex-wrap: wrap; gap: 2px 12px; padding: 4px 0; font-size: max(var(--fs-min), .82rem); }
.pn-mv b { min-width: 40px; color: var(--text-2); }
.pn-mv small { margin-right: 4px; color: var(--text-3); }
.pn-tbl td, .pn-tbl th { white-space: nowrap; }
.pn-tbl tr.is-click { cursor: pointer; }
.pn-vendors { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 12px; margin-bottom: 18px; align-items: start; }
.pn-v { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); padding: 14px 16px; }
.pn-vh { display: flex; align-items: center; gap: 8px; }
.pn-vh h4 { margin: 0; font-size: 1rem; font-weight: 700; }
.pn-vh .mt-btn { margin-left: auto; }
.pn-vs { margin: 4px 0 8px; font-size: .86rem; color: var(--text-2); }
.pn-vd { margin: 0; display: grid; gap: 4px; }
.pn-vd > div { display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 8px; font-size: max(var(--fs-min), .84rem); }
.pn-vd dt { color: var(--text-3); font-size: max(var(--fs-min), .82rem); }
.pn-vd dd { margin: 0; overflow-wrap: anywhere; }
.pn-vk { display: flex; gap: 16px; margin-top: 10px; padding-top: 8px; border-top: 1px solid #eef2f1; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.pn-vk b { color: var(--text); margin-left: 4px; }
.pn-vadd { align-self: center; justify-self: start; }
.pn-regs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.pn-regs label { display: flex; flex-direction: column; gap: 3px; font-size: max(var(--fs-min), .82rem); color: var(--text-3); font-weight: 600; margin: 0; }

/* 계약 · 상용화주 · 보안 처리 대장 표 */
.kt-tbl tr.is-click, .kc-tbl tr.is-click, .sx-tbl tr.is-click, .dv-tbl tr.is-click { cursor: pointer; }
.kt-f, .sx-f { display: inline-flex; align-items: center; gap: 4px; font-size: max(var(--fs-min), .8rem); font-weight: 600; white-space: nowrap; }
.kt-prev summary { cursor: pointer; font-size: max(var(--fs-min), .84rem); color: var(--text-2); margin-bottom: 6px; }
.kc-stat td, .kc-stat th, .ss-tbl td, .ss-tbl th { text-align: right; }
.kc-stat td:first-child, .kc-stat th:first-child, .ss-tbl td:first-child, .ss-tbl th:first-child { text-align: left; }
.kc-stat tfoot td, .ss-tbl tfoot td { background: var(--surface-2); font-size: max(var(--fs-min), .84rem); }
.kc-bar { width: 22%; min-width: 80px; }
.kc-bar i { display: block; height: 8px; border-radius: 4px; background: #2b59c3; opacity: .75; }
.sx-types { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 12px; }
.sx-type { display: inline-flex; align-items: center; gap: 6px; min-height: 32px; padding: 0 11px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface);
  font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-2); }
.sx-type b { font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.sx-type.on { border-color: var(--primary); background: var(--primary-soft); color: var(--primary-dark); }
.sx-type.on b { color: var(--primary-dark); }

/* 보안 전파교육 — 건 × 파트 */
.dv-tbl { font-size: .86rem; }
.dv-tbl th.dv-dh { text-align: center; font-size: max(var(--fs-min), .8rem); padding: 10px 6px; }
.dv-tbl th.dv-dh.is-v { color: var(--accent-dark); }
.dv-tt { min-width: 240px; max-width: 360px; white-space: normal; }
.dv-tt b { font-weight: 600; }
.dv-c { text-align: center; padding: 8px 4px !important; }
.dv-x { font-size: max(var(--fs-min), .76rem); color: var(--text-3); }
.dv-c.is-miss .dv-x { color: var(--danger); font-weight: 600; }
.dv-ok { display: inline-flex; flex-direction: column; align-items: center; gap: 0; color: var(--success); font-weight: 700; line-height: 1.1; }
.dv-ok .mono { font-size: max(var(--fs-min), .74rem); color: var(--text-3); font-weight: 500; }
@media (hover: hover) and (pointer: fine) { a.dv-ok:hover { color: var(--primary-dark); } }
.dv-cards { display: flex; flex-direction: column; gap: 8px; }
.dv-card { border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 10px 12px; background: var(--surface); }
.dv-ch { display: flex; align-items: center; gap: 8px; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.dv-ch b { color: var(--text); }
.dv-t { margin: 4px 0 6px; font-size: .92rem; font-weight: 600; }
.dv-dchips { display: flex; flex-wrap: wrap; gap: 4px; }
.dv-d { padding: 1px 7px; border-radius: 6px; font-size: max(var(--fs-min), .78rem); background: var(--danger-soft); color: var(--danger); }
.dv-d.on { background: var(--success-soft); color: var(--success); }
.dv-res { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.dv-res li { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; padding: 6px 8px; border-radius: 8px; background: var(--surface-2); font-size: .86rem; }
.dv-res li b { min-width: 72px; }
.dv-fres { display: flex; flex-direction: column; gap: 6px; }
.dv-fr { display: grid; grid-template-columns: 130px 150px minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 4px 0; border-bottom: 1px solid #eef2f1; }
.dv-ft { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-size: .86rem; font-weight: 600; }
.dv-fr input[type=date] { min-height: 34px; padding: 0 8px; border: 1px solid var(--border-strong); border-radius: 8px; font-size: max(var(--fs-min), .84rem); }

/* 보안검색 실적 */
.ss-card .card-title { flex-wrap: wrap; }
.ss-years { margin-bottom: 10px; }

@media screen and (max-width: 767px) {
  .dk-grps { grid-template-columns: minmax(0, 1fr); }
  .dk-old-btn, .dk-row:has(.dk-edit) .dk-old-btn { margin-left: 50px; }
  .pn-legend { display: none; }
  .pn-board { grid-template-columns: minmax(0, 1fr); }
  .pn-regs { grid-template-columns: minmax(0, 1fr); }
  .pn-dl > div { grid-template-columns: 96px minmax(0, 1fr); }
  .dv-fr { grid-template-columns: minmax(0, 1fr) 140px; }
  .dv-fr [data-dff] { grid-column: 1 / -1; }
  .kc-bar { display: none; }
}
@media print {
  .dk-add, .dk-edit, .dk-old-btn, .ck-docmore, .dkb-ob { display: none !important; }
  .dk-hl { background: none; color: inherit; font-weight: 700; }
  .dk-grps { grid-template-columns: 1fr 1fr; }
  .pn-p { border-color: #bbb; }
  .dv-ok, .pn-dot { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
/* 버튼 위계 — 관리 · 설정 동작은 머리말에서 글자 버튼으로 */
.page-head .head-link { padding: 6px 4px; font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--text-3); white-space: nowrap; }
.page-head .head-link:hover { color: var(--primary); }
.btn-ghost.is-due { border-color: color-mix(in srgb, var(--primary) 45%, var(--border)); color: var(--primary); }
.tbl-open svg { vertical-align: -2px; margin-right: 5px; flex: none; color: var(--text-3); }
.sx-tbl td.mono, .kt-tbl td.mono { white-space: nowrap; }
.sx-tbl td .cell-sub { max-width: 280px; }
/* 증빙 연결 칩 — 긴 증빙 설명은 칩 안에서 줄바꿈(모바일 가로 넘침 방지) */
.ck-link { max-width: 100%; flex-wrap: wrap; text-align: left; }
.ck-link small { white-space: normal; overflow-wrap: anywhere; }

/* ── 탭 묶음 — 메뉴 한 줄 안의 화면들을 본문 위 탭으로 오간다(모듈 안 탭과 구분되게 밑줄형) ── */
.subtabs { display: flex; align-items: flex-end; gap: 18px; max-width: 1240px; margin: 0 auto; padding: 20px 36px 0; }
.subtabs.view-wide { max-width: 2100px; }
.subtabs.view-mid { max-width: 1560px; }
.subtabs[hidden] { display: none; }
.subtabs + .view { padding-top: 18px; }
.sbt-name { flex: none; padding-bottom: 11px; font-size: max(var(--fs-min), .81rem); font-weight: 600; color: var(--text-3); white-space: nowrap; }
.sbt-list { display: flex; flex: 1; min-width: 0; gap: 22px; border-bottom: 1px solid var(--border); overflow-x: auto; scrollbar-width: none; }
.sbt-list::-webkit-scrollbar { display: none; }
.sbt-tab { position: relative; flex: none; display: inline-flex; align-items: center; gap: 7px; padding: 8px 2px 11px; border: 0; background: none;
  font-size: .95rem; font-weight: 600; color: var(--text-3); white-space: nowrap; transition: color .15s var(--ease-out); }
.sbt-tab::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; border-radius: 2px; background: transparent; }
.sbt-tab.on { color: var(--text); }
.sbt-tab.on::after { height: 3px; bottom: -2px; background: var(--accent); }
.sbt-n { min-width: 20px; padding: 0 6px; border-radius: 999px; background: var(--accent-soft); color: var(--accent-dark); font-size: max(var(--fs-min), .78rem); font-weight: 700; line-height: 20px; text-align: center; font-variant-numeric: tabular-nums; }
.sbt-opt { padding: 0 6px; border: 1px solid var(--border-strong); border-radius: 6px; color: var(--text-3); font-size: max(var(--fs-min), .76rem); font-style: normal; font-weight: 600; line-height: 18px; }
@media (hover: hover) and (pointer: fine) { .sbt-tab:hover { color: var(--text); } }
.sbt-tab:active { transform: scale(.97); }
@media screen and (max-width: 767px) {
  .subtabs { padding: 10px 16px 0; }
  .subtabs + .view { padding-top: 12px; }
  .sbt-name { display: none; }
  .sbt-list { gap: 18px; }
  .sbt-tab { font-size: .92rem; padding: 8px 1px 10px; }
}
@media print { .subtabs { display: none !important; } .subtabs + .view { padding-top: 0; } }

/* ── 메인 데스크 — 올리기 · 반영안 확인 · 접수 대장 ── */
.dk-drop { display: flex; align-items: center; gap: 16px; padding: 22px 24px; border: 1.5px dashed var(--border-strong); background: var(--surface-2); cursor: pointer;
  transition: border-color .15s var(--ease-out), background-color .15s var(--ease-out); }
.dk-drop:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.dk-drop.on { border-color: var(--primary); background: var(--primary-soft); }
.dk-dico { flex: none; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 6px; background: var(--surface); color: var(--primary); box-shadow: var(--shadow); }
.dk-dt { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.dk-dt b { font-size: 1rem; }
.dk-dt small { color: var(--text-3); font-size: max(var(--fs-min), .8rem); }
.dk-db { flex: none; display: flex; gap: 8px; }
.dk-cam { display: none; }
.dk-queue { display: flex; flex-direction: column; gap: 14px; margin-bottom: 18px; }
.dk-item { padding: 16px 18px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.dk-item.is-up { opacity: .8; }
.dk-ih { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; color: var(--text-2); }
.dk-ih > svg { flex: none; color: var(--text-3); }
.dk-fn { min-width: 0; font-weight: 600; color: var(--text); overflow-wrap: anywhere; }
.dk-ih small { color: var(--text-3); }
.dk-by { font-size: max(var(--fs-min), .82rem); }
.dk-sum { margin: 10px 0 0; padding: 10px 12px; border-radius: var(--radius-sm); background: var(--surface-2); }
.dk-sum b { display: block; font-size: .95rem; }
.dk-sum p { margin: 4px 0 0; font-size: .86rem; line-height: 1.6; color: var(--text-2); }
.dk-err { margin: 10px 0 0; font-size: .86rem; color: var(--danger); }
.dk-acts { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; }
.dk-act { border: 1px solid var(--border); border-radius: var(--radius-sm); }
.dk-act.on { border-color: color-mix(in srgb, var(--primary) 40%, var(--border)); }
.dk-ah { display: flex; align-items: center; gap: 8px; padding: 9px 12px; cursor: pointer; font-size: .9rem; }
.dk-act.on .dk-ah { background: var(--primary-soft); border-radius: var(--radius-sm) var(--radius-sm) 0 0; }
.dk-ab { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px 12px; padding: 10px 12px 12px; }
.dk-act:not(.on) .dk-ab { display: none; }
.dk-f { display: flex; flex-direction: column; gap: 4px; min-width: 0; font-size: max(var(--fs-min), .82rem); font-weight: 600; color: var(--text-3); }
.dk-w { grid-column: span 2; }
.dk-f input, .dk-f select, .dk-find input, .dk-find select { width: 100%; min-width: 0; padding: 7px 9px; border: 1.5px solid var(--border-strong); border-radius: var(--radius-xs);
  background: var(--surface); font-size: .88rem; font-weight: 400; color: var(--text); outline: none; }
.dk-f input:focus, .dk-f select:focus, .dk-find input:focus, .dk-find select:focus { border-color: var(--primary); }
.dk-ck { display: inline-flex; align-items: center; gap: 6px; align-self: end; padding: 7px 0; font-size: .86rem; color: var(--text-2); cursor: pointer; }
.dk-note { grid-column: 1 / -1; margin: 0; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.dk-finds { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 6px; }
.dk-find { display: grid; grid-template-columns: auto 110px minmax(0, 1fr) 120px 140px; gap: 6px; align-items: center; }
.dk-find .dk-ck { padding: 0; align-self: center; }
.dk-finds .link-btn { align-self: flex-start; }
.dk-add { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 12px; margin-top: 10px; font-size: max(var(--fs-min), .8rem); color: var(--text-3); }
.dk-foot { display: flex; align-items: center; gap: 8px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); }
.dk-h { margin: 0; font-size: 1rem; }
.dk-tbl td { vertical-align: top; }
.dk-go { display: inline-block; margin: 0 4px 4px 0; padding: 2px 8px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); font-size: max(var(--fs-min), .82rem); color: var(--text-2); text-align: left; }
@media (hover: hover) and (pointer: fine) { .dk-go:hover { border-color: var(--primary); color: var(--primary); } }
/* 끌어다 놓는 동안 — 화면 가운데 큰 안내판(잉크 바탕 + 앰버 띠) */
body.desk-drag::after { content: "여기 놓으면 접수 카운터가 읽고 정리합니다"; position: fixed; left: 50%; top: 50%; z-index: 900; transform: translate(-50%, -50%);
  min-width: min(440px, calc(100vw - 32px)); padding: 46px 28px 34px; text-align: center; border-radius: 6px; background: var(--tag-ink); color: #fff;
  font-size: 1.3rem; font-weight: 700; line-height: 1.4; box-shadow: var(--shadow-lg), inset 0 8px 0 var(--accent); pointer-events: none; }
body.desk-drag #main { outline: 2px dashed var(--primary); outline-offset: -6px; }
@media screen and (max-width: 767px) {
  .dk-drop { flex-wrap: wrap; padding: 16px; gap: 12px; }
  .dk-dico { width: 44px; height: 44px; }
  .dk-db { width: 100%; }
  .dk-db .btn { flex: 1; justify-content: center; }
  .dk-cam { display: inline-flex; }
  .dk-item { padding: 14px; }
  .dk-ab { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dk-find { grid-template-columns: 22px minmax(0, 1fr) minmax(0, 1fr); }
  .dk-find select { grid-column: 2 / -1; }
  .dk-find input[data-ff="text"] { grid-column: 1 / -1; }
  .dk-find input[data-ff="ref"] { grid-column: 1 / 3; }
  .dk-foot { flex-wrap: wrap; }
}
@media print { .dk-queue, .dk-drop { display: none !important; } }
.dk-drop { margin-bottom: 18px; border-radius: var(--radius); border-color: var(--tag-perf); background: var(--surface); }
.dk-dico { background: var(--tag); color: var(--accent-dark); box-shadow: inset 0 0 0 1px var(--tag-line); }
.dk-sum { background: var(--tag); }
.dk-none { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 30px 12px 18px; color: var(--text-2); font-size: .9rem; }
.dk-cnt { font-size: max(var(--fs-min), .81rem); color: var(--text-3); }
.dk-log .toolbar { margin-bottom: 12px; }
/* ── 접수 카운터 — 3단계 · 올리기 칸 · 한 문장 확인 카드 ── */
.dkc-steps { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 0 14px; padding: 0; border: 1px solid var(--tag-line); border-radius: 4px; overflow: hidden; background: var(--surface); }
.dkc-steps li { display: flex; align-items: center; gap: 10px; min-height: 54px; padding: 8px 14px; font-size: 1rem; font-weight: 600; color: var(--text-2); }
.dkc-steps li + li { border-left: 1px solid var(--tag-line); }
.dkc-steps li.is-now { background: var(--tag); color: var(--text); }
.dkc-n { flex: none; width: 30px; height: 30px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-family: var(--mono); font-size: .92rem; font-weight: 700;
  box-shadow: inset 0 0 0 2px var(--border-strong); color: var(--text-2); }
.dkc-steps li.is-now .dkc-n { background: var(--tag-ink); color: #fff; box-shadow: none; }
.dkc-steps li.is-done .dkc-n { background: var(--success); color: #fff; box-shadow: none; }
.dkc-note { margin: -6px 0 14px; font-size: .9rem; color: var(--text-2); }
.dkc-drop { display: flex; align-items: center; gap: 16px; margin-bottom: 12px; padding: 24px 24px; border: 2px dashed var(--primary); border-radius: 6px; background: var(--surface); cursor: pointer;
  transition: border-color .15s var(--ease-out), background-color .15s var(--ease-out); }
.dkc-drop.on { background: var(--primary-soft); }
.dkc-drop .dk-dt b { font-size: 1.2rem; }
.dkc-drop .dk-dt small { font-size: .92rem; color: var(--text-2); }
.dkc-drop .btn { min-height: 48px; padding: 0 18px; font-size: 1rem; }
.dkc-ex { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 0 0 18px; padding: 0; }
.dkc-ex li { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border: 1px solid var(--hair); border-radius: 4px; background: var(--surface); font-size: .92rem; }
.dkc-ex b { font-weight: 700; }
.dkc-ex span { color: var(--primary-dark); font-weight: 600; }
.dkc-ex span::before { content: "→ "; color: var(--text-3); }
.dkc { padding: 16px 18px 14px; border-radius: 4px; box-shadow: none; border-top: 2px solid var(--rule); }
.dkc-more { width: 40px; height: 40px; margin: -6px -8px -6px 0; }
.dkc-say { display: flex; align-items: flex-start; gap: 12px; margin: 12px 0 0; padding: 14px 14px; border-radius: 4px; background: var(--tag); box-shadow: inset 0 0 0 1px var(--tag-line); }
.dkc-owl { flex: none; width: 36px; height: 36px; line-height: 0; }
.dkc-s { margin: 0; font-size: 1.1rem; line-height: 1.65; color: var(--text); }
.dkc-k { background: var(--accent-soft); color: var(--text); font-weight: 700; padding: 0 1px; border-radius: 3px; }
.dkc-sum { margin: 4px 0 0; font-size: .9rem; color: var(--text-2); }
.dkc-wait { margin: 12px 0 0; font-size: .95rem; color: var(--text-2); }
.dkc-info, .dkc .dk-err { display: flex; align-items: flex-start; gap: 8px; margin: 12px 0 0; padding: 10px 12px; border-radius: 4px; font-size: .95rem; line-height: 1.55; }
.dkc-info { background: var(--info-soft); color: var(--info); }
.dkc .dk-err { background: var(--danger-soft); color: var(--danger); }
.dkc-info .ico, .dkc .dk-err .ico { margin-top: 3px; }
.dkc-acts { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.dkc-row { border: 1px solid var(--line); border-radius: 4px; background: var(--surface); }
.dkc-row.on { border-color: color-mix(in srgb, var(--primary) 50%, var(--line)); }
.dkc-rh { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; min-height: 58px; padding: 8px 10px 8px 12px; }
.dkc-ck { flex: 1 1 260px; min-width: 0; display: flex; align-items: center; gap: 12px; cursor: pointer; }
.dkc-ck input { flex: none; width: 24px; height: 24px; accent-color: var(--primary); }
.dkc-rt { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.dkc-rt b { font-size: 1.04rem; }
.dkc-rt small { font-size: .9rem; color: var(--text-2); overflow-wrap: anywhere; }
.dkc-row:not(.on) .dkc-rt { opacity: .62; }
.dkc-need { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border-radius: 4px; background: var(--accent-soft); color: #8a4b06; font-size: .86rem; font-weight: 600; }
.dkc-fix { flex: none; min-height: 40px; padding: 0 12px; }
.dkc-row .dk-ab { border-top: 1px dashed var(--line); }
.dkc-row .dk-ab[hidden] { display: none; }
.dkc-add { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 14px; margin-top: 10px; font-size: .88rem; color: var(--text-2); }
.dkc-add .link-btn { min-height: 36px; }
.dkc-foot { display: flex; align-items: center; gap: 10px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--hair); }
.dkc-foot .btn { min-height: 50px; padding: 0 20px; font-size: 1.02rem; }
.dkc-foot .spacer, .dkc .dk-ih .spacer { flex: 1; }
.dkc-mine { margin-top: 6px; }
.dkc-h { display: flex; align-items: baseline; gap: 8px; margin: 4px 0 10px; font-size: 1.05rem; }
.dkc-h small { font-size: max(var(--fs-min), .84rem); font-weight: 500; color: var(--text-3); }
.dkc-ask { margin: 0; font-size: .98rem; line-height: 1.6; color: var(--text-2); }
@media screen and (max-width: 767px) {
  .dkc-steps li { flex-direction: column; justify-content: center; gap: 4px; padding: 8px 4px; font-size: max(var(--fs-min), .84rem); text-align: center; }
  .dkc-drop { flex-wrap: wrap; padding: 16px; }
  .dkc-drop .dk-db { width: 100%; }
  .dkc-drop .dk-db .btn { flex: 1; justify-content: center; }
  .dkc-ex { grid-template-columns: minmax(0, 1fr); gap: 6px; }
  .dkc-ex li { flex-direction: row; flex-wrap: wrap; gap: 6px; }
  .dkc { padding: 14px; }
  .dkc-s { font-size: 1.02rem; }
  .dkc-foot { flex-wrap: wrap; }
  .dkc-foot .spacer { display: none; }
  .dkc-foot .btn { flex: 1; justify-content: center; }
  .dkc-foot .dkc-go { order: -1; flex-basis: 100%; }
}
@media print { .dkc-steps, .dkc-ex { display: none !important; } }
.dk-log .table-wrap { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); }

/* ── 아르고 부엉이(js/argo-owl.js) — 그림이라 메뉴 · 버튼 이모지 금지 규칙과 무관 ── */
.owl { display: inline-block; flex: none; line-height: 0; }
.owl canvas, .owl .owl-svg { display: block; width: 100%; height: 100%; }

/* ── 패널 인쇄 — 지금 탭 본문만 A4 로(화면 · 패널은 숨김) ── */
#pnl-print { display: none; }
@media print {
  html.pnl-printing body > *:not(#pnl-print) { display: none !important; }
  html.pnl-printing #pnl-print { display: block !important; }
  #pnl-print .pnl-body { padding: 0; overflow: visible; background: #fff; }
  #pnl-print .table-wrap { border: 0; }
}

/* ── 아르고 AI 도우미(js/argo.js) — 공통 패널 안 대화. 질문은 페트롤 잉크, 답은 흰 카드, 입력줄은 절취선 아래 태그 ── */
.pnl-argo .pnl-body { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.ag { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.ag-log { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 22px 24px 10px; }
.ag-turn + .ag-turn { margin-top: 22px; }
.ag-q { display: flex; justify-content: flex-end; }
.ag-qb { max-width: min(78%, 640px); padding: 10px 15px; border-radius: 14px 14px 4px 14px; background: var(--tag-ink); color: #fff; font-size: .95rem; line-height: 1.55; overflow-wrap: anywhere; }
.ag-qf { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.ag-qb .ag-chip { background: rgba(255,255,255,.12); color: #e7f0ee; box-shadow: none; }
.ag-dim { color: #b9cbd0; }
.ag-a { display: flex; align-items: flex-start; gap: 10px; margin-top: 12px; }
.ag-av { flex: none; width: 30px; height: 30px; line-height: 0; }
.ag-av .owl-svg { width: 30px; height: 30px; }
.ag-ab { flex: 1; min-width: 0; max-width: 780px; display: flex; flex-direction: column; gap: 10px; }
.ag-md { padding: 12px 16px; border-radius: 4px 14px 14px 14px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--tag-line); font-size: .97rem; line-height: 1.68; overflow-wrap: break-word; }
.ag-md p { margin: 0 0 .55em; }
.ag-md p:last-child, .ag-md ul:last-child, .ag-md ol:last-child { margin-bottom: 0; }
.ag-md ul, .ag-md ol { margin: 0 0 .6em; padding-left: 1.25em; }
.ag-md li + li { margin-top: 2px; }
.ag-md .ag-h { font-weight: 700; margin-top: .3em; }
.ag-md code { font-family: var(--mono); font-size: .86em; padding: 1px 5px; border-radius: 5px; background: var(--tag); }
.ag-go { display: inline-flex; align-items: center; gap: 2px; min-height: 30px; margin: 1px 2px; padding: 2px 6px 2px 10px; border: 0; border-radius: 8px;
  background: var(--primary-soft); color: var(--primary-dark); font-size: .86rem; font-weight: 600; vertical-align: baseline; transition: background-color .12s ease, transform .16s var(--ease-out); }
.ag-go:active { transform: scale(.97); }
.ag-card { padding: 12px 14px; border-radius: 6px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--tag-line), inset 4px 0 0 var(--success); }
.ag-card.is-confirm { box-shadow: inset 0 0 0 1px var(--tag-line), inset 4px 0 0 var(--accent); }
.ag-card.is-danger { box-shadow: inset 0 0 0 1px var(--tag-line), inset 4px 0 0 var(--danger); }
.ag-card.is-undone { box-shadow: inset 0 0 0 1px var(--tag-line), inset 4px 0 0 var(--text-3); }
.ag-card.is-undone .ag-card-l { color: var(--text-2); text-decoration: line-through; text-decoration-color: var(--text-3); }
.ag-card-h { display: flex; align-items: center; gap: 8px; font-size: .92rem; }
.ag-card-h .ico { color: var(--success); }
.is-confirm .ag-card-h .ico { color: var(--accent-dark); }
.is-danger .ag-card-h .ico { color: var(--danger); }
.is-undone .ag-card-h .ico { color: var(--text-3); }
.ag-card-st { margin-left: auto; font-size: max(var(--fs-min), .81rem); color: var(--text-2); white-space: nowrap; }
.ag-card-l { list-style: none; margin: 8px 0 0; padding: 0; font-size: .9rem; line-height: 1.55; }
.ag-card-l li + li { margin-top: 2px; }
.ag-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 10px; }
.ag-acts .ag-go { margin: 0; }
.ag-undo { margin-left: auto; min-height: 32px; font-size: max(var(--fs-min), .84rem); }
.ag-err { display: flex; align-items: flex-start; gap: 8px; margin: 0; padding: 10px 12px; border-radius: 6px; background: var(--danger-soft); color: var(--danger); font-size: .9rem; }
.ag-err .ico { flex: none; margin-top: 3px; }
.ag-wait { display: flex; align-items: center; gap: 10px; margin: 2px 0; font-size: .88rem; color: var(--text-2); }
.ag-dots { display: inline-flex; gap: 4px; }
.ag-dots i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent); animation: ag-dot 1.1s ease-in-out infinite; }
.ag-dots i:nth-child(2) { animation-delay: .15s; }
.ag-dots i:nth-child(3) { animation-delay: .3s; }
@keyframes ag-dot { 0%, 80%, 100% { opacity: .3; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }
@media (prefers-reduced-motion: reduce) { .ag-dots i { animation: none; opacity: .7; } }
.ag-empty { min-height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 24px 8px; text-align: center; }
.ag-hello { margin: 0; font-size: 1.15rem; font-weight: 700; letter-spacing: -.01em; }
.ag-sugs { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; max-width: 640px; }
.ag-sug { min-height: 40px; padding: 8px 14px; border: 0; border-radius: 6px; background: var(--surface); color: var(--text); box-shadow: inset 0 0 0 1px var(--tag-line);
  font-size: .9rem; transition: box-shadow .12s ease, transform .16s var(--ease-out); }
.ag-sug:active { transform: scale(.97); }
.ag-compose { flex: none; position: relative; padding: 14px 24px 16px; background: var(--tag); }
.ag-compose::before { content: ""; position: absolute; left: 14px; right: 14px; top: 0; border-top: 2px dashed var(--tag-perf); }
.ag-files { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.ag-chip { display: inline-flex; align-items: center; gap: 5px; max-width: 100%; padding: 4px 8px; border-radius: 7px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--tag-line); font-size: max(var(--fs-min), .81rem); color: var(--text-2); }
.ag-chip span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ag-chip-x { flex: none; width: 24px; height: 24px; margin: -2px -4px -2px 0; border: 0; border-radius: 6px; background: none; color: var(--text-2); display: inline-flex; align-items: center; justify-content: center; }
.ag-box { display: flex; align-items: flex-end; gap: 6px; padding: 6px; border-radius: 6px; background: var(--surface); box-shadow: inset 0 0 0 1.5px var(--tag-line); transition: box-shadow .15s ease; }
.ag-box:focus-within { box-shadow: inset 0 0 0 2px var(--primary); }
.ag-box textarea { flex: 1; min-width: 0; width: 100%; height: auto; min-height: 0; margin: 0; padding: 8px 4px; border: 0; outline: none; resize: none; background: transparent;
  font-size: 1rem; line-height: 1.5; field-sizing: content; min-block-size: 1.5lh; max-block-size: 8lh; }
.ag-ib, .ag-send { flex: none; width: 42px; height: 42px; border: 0; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; transition: background-color .12s ease, transform .16s var(--ease-out); }
.ag-ib { background: none; color: var(--text-2); }
.ag-send { background: var(--tag-ink); color: #fff; }
.ag-ib:active:not(:disabled), .ag-send:active:not(:disabled) { transform: scale(.96); }
.ag-ib:disabled, .ag-send:disabled { opacity: .45; cursor: default; }
.ag-meta { margin: 6px 4px 0; font-size: max(var(--fs-min), .84rem); color: var(--text-2); text-align: right; }
/* 첫 화면 3칸 — 찾기 · 알려주기 · 등록하기 */
.ag-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; width: min(760px, 100%); text-align: left; }
.ag-cols[data-n="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); width: min(540px, 100%); }
.ag-col { display: flex; flex-direction: column; gap: 8px; padding: 12px; border-radius: 4px; background: var(--surface); box-shadow: inset 0 0 0 1px var(--tag-line); }
.ag-col-h { margin: 0 0 2px; font-size: .9rem; font-weight: 700; color: var(--text-2); }
.ag-col .ag-sug { min-height: 48px; width: 100%; padding: 8px 12px; text-align: left; font-size: .98rem; background: var(--tag-2); }
.ag-box textarea { font-size: 1.05rem; }
.ag-ib, .ag-send { width: 46px; height: 46px; }
.ag-cf .btn { min-height: 44px; padding: 0 18px; font-size: .98rem; }
.ag-cf-tip { flex-basis: 100%; font-size: max(var(--fs-min), .84rem); color: var(--text-2); }
.ag-undo-tip { margin: 6px 0 0; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }
.ag-todesk { min-height: 30px; font-size: max(var(--fs-min), .84rem); }
@media screen and (max-width: 767px) {
  .ag-cols, .ag-cols[data-n="2"] { grid-template-columns: minmax(0, 1fr); }
  .ag-empty { justify-content: flex-start; }
}
dialog.pnl-argo.ag-drag .ag-box { box-shadow: inset 0 0 0 2px var(--accent); }
dialog.pnl-argo.ag-drag .ag-log { background: var(--accent-soft); }
@media (hover: hover) and (pointer: fine) {
  .ag-go:hover { background: #cfe8e2; }
  .ag-sug:hover { box-shadow: inset 0 0 0 1.5px var(--primary); }
  .ag-ib:hover:not(:disabled) { background: var(--tag); color: var(--text); }
  .ag-send:hover:not(:disabled) { background: var(--primary-dark); }
  .ag-chip-x:hover { background: var(--tag); color: var(--text); }
}
@media screen and (max-width: 767px) {
  .ag-log { padding: 14px 12px 8px; }
  .ag-qb { max-width: 88%; }
  .ag-a { gap: 8px; }
  .ag-av, .ag-av .owl-svg { width: 26px; height: 26px; }
  .ag-md { padding: 11px 13px; }
  .ag-compose { padding: 10px 10px calc(10px + env(safe-area-inset-bottom)); }
  .ag-undo { margin-left: 0; }
}
@media print {
  #pnl-print .ag-log { overflow: visible; padding: 0; }
  #pnl-print .ag-compose, #pnl-print .ag-acts, #pnl-print .ag-wait, #pnl-print .ag-empty { display: none !important; }
  #pnl-print .ag-turn { break-inside: avoid; }
  #pnl-print .ag-qb { background: #fff; color: #111; border: 1px solid #999; }
  #pnl-print .ag-qb .ag-chip { background: #fff; color: #333; border: 1px solid #bbb; }
  #pnl-print .ag-md, #pnl-print .ag-card { box-shadow: none; border: 1px solid #bbb; }
  #pnl-print .ag-go { background: none; padding: 0; min-height: 0; color: #111; text-decoration: underline; }
}

/* ══ 문서형 구획 — 본문 14px · 구획은 위 굵은 선 + 제목 + 가는 구분선 · 둥근 모서리 · 그림자 최소(Mark 선택) ══
   공통 키트(.card · .stat-row · .tbl · .page-head · .tabs)와 대시보드 면을 여기서 한 번에 바꾼다. 모듈 전용 면은 아래 '모듈 면' 목록 */
:root {
  --radius: 4px; --radius-sm: 6px; --radius-xs: 4px;
  --border: #d3dbd8; --border-strong: #b8c4c0;
  --rule: #0f2a33;        /* 구획 위 굵은 선 */
  --line: #c3cdca;        /* 구획 테두리 · 표 머리 아랫선 */
  --hair: #e1e7e5;        /* 행 구분선 */
  --head-bg: #f2f5f4;     /* 표 머리 바탕 */
  --header-h: 56px;
}
.view { padding: 20px 28px 32px; max-width: 1320px; }
@media (min-width: 768px) and (max-width: 1099px) { .view { padding: 18px 20px 28px; } }
.subtabs { max-width: 1320px; padding: 14px 28px 0; }
.subtabs + .view { padding-top: 14px; }
.sbt-tab { font-size: .93rem; padding: 6px 2px 9px; }

/* 머리말 — 일반 화면은 제목 아래 굵은 선 */
.page-head { margin-bottom: 16px; }
.page-title { font-size: 1.6rem; }
#view:not([data-hub]) > .page-head { padding-bottom: 12px; border-bottom: 2px solid var(--rule); }
#view[data-hub] .page-head { min-height: 96px; padding: 20px 24px 16px; border-radius: var(--radius); box-shadow: none; }

/* 구획(카드) */
.card { border: 1px solid var(--line); border-top: 2px solid var(--rule); border-radius: 0 0 var(--radius) var(--radius); padding: 14px 18px 16px; margin-bottom: 16px; }
.card-title { font-size: 1.07rem; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--hair); }

/* 요약 띠 */
.stat-row { gap: 1px; margin-bottom: 16px; background: var(--hair); border: 1px solid var(--line); border-radius: var(--radius); }
.stat { padding: 11px 18px 12px; }
.stat .stat-value { font-size: 1.5rem; margin-top: 2px; }

/* 표 — 머리 위아래 실선, 행은 가는 선 */
table.tbl { font-size: .93rem; }
.tbl th { padding: 8px 10px; background: var(--head-bg); color: var(--text); font-size: .86rem; font-weight: 600;
  border-top: 1px solid #93a5a8; border-bottom: 1px solid var(--line); }
.tbl td { padding: 8px 10px; border-bottom: 1px solid var(--hair); }
.tbl tr:last-child td { border-bottom: 1px solid var(--hair); }
.tbl-cap tbody tr:nth-child(even) td { background: rgba(107,127,133,.045); }
.tbl .grp-row td { padding: 5px 10px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.cell-sub { font-size: max(var(--fs-min), .82rem); }

/* 조작 · 입력 — 촘촘하게 */
.btn { min-height: 34px; padding: 0 13px; gap: 6px; }
.btn-sm { min-height: 28px; padding: 0 10px; border-radius: 5px; }
.search-field { height: 36px; padding: 0 12px; border-radius: var(--radius-sm); }
.form-row { margin-bottom: 12px; }
.form-row input, .form-row select, .form-row textarea { padding: 7px 10px; }
.toolbar { margin-bottom: 10px; }
.seg { border-radius: 7px; padding: 2px; }
.seg-btn { min-height: 28px; padding: 0 10px; border-radius: 5px; }
.tabs { border-bottom: 1px solid var(--line); margin-bottom: 14px; }
.tab { padding: 8px 14px; }
.empty { padding: 22px 10px; }
.empty-state { padding: 28px 16px; }
.modal-box { border-radius: 6px; padding: 22px; }
.modal-box h3 { margin-bottom: 14px; }
.modal-actions { margin-top: 16px; }

/* 상단바 · 메뉴 */
.nav-item { min-height: 34px; padding: 6px 11px; border-radius: 6px; }
.nav-pin { min-height: 32px; border-radius: 6px; }
.icon-btn { width: 36px; height: 36px; border-radius: 6px; }
.hub-head { padding: 12px 20px 8px; }

/* 대시보드 면 */
.dash-card, .dash-sheet, .today-card { border: 1px solid var(--line); border-top: 2px solid var(--rule); border-radius: 0 0 var(--radius) var(--radius); }
.dash-top { gap: 16px; margin-bottom: 16px; }
.sheet-col { border-right-color: var(--hair); }
.dc-head { padding-bottom: 8px; margin-bottom: 4px; border-bottom: 1px solid var(--hair); }
.ticket { border-radius: 8px; }
.dash-build { border-radius: var(--radius); }

@media screen and (max-width: 767px) {
  .view, .view.view-wide, .view.view-mid { padding-top: 14px; padding-bottom: 22px; }
  #view[data-hub] .page-head { min-height: 84px; padding: 16px 16px 12px; border-radius: var(--radius); }
  .card { padding: 12px 14px 14px; }
  .tabbar { background: rgba(248,250,249,.98); }
  .tab-btn { color: var(--text-3); }
}
/* 휴대폰 입력칸 — 16px 미만이면 iOS 가 확대한다 */
@media screen and (max-width: 767px) and (pointer: coarse) {
  input:not([type=checkbox]):not([type=radio]), select, textarea { font-size: 16px; }
}
@media print {
  .card, .dash-card, .dash-sheet, .today-card { border: 1px solid #999; border-top: 2px solid #222; }
  .tbl th { border-top: 1px solid #666; border-bottom: 1px solid #999; background: #f2f2f2; }
}

/* ── 게시판(js/board.js) — 목록은 촘촘한 표 · 공지 고정 줄 · 쪽 번호, 본문은 문서처럼 ── */
.bb-card { padding-top: 12px; }
.bb-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding-bottom: 10px; border-bottom: 1px solid var(--hair); }
.bb-cats { display: flex; flex-wrap: wrap; gap: 4px; }
.bb-cat-b { min-height: 28px; padding: 0 11px; border: 1px solid var(--border); border-radius: 5px; background: var(--surface); color: var(--text-2); font-size: max(var(--fs-min), .84rem); font-weight: 600; }
.bb-cat-b[aria-pressed="true"] { background: var(--tag-ink); border-color: var(--tag-ink); color: #fff; }
.bb-search { display: flex; align-items: center; gap: 6px; margin-left: auto; flex-wrap: nowrap; min-width: 0; }
.bb-search select { height: 36px; padding: 0 8px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface); font-size: .86rem; }
.bb-search .search-field { width: 240px; }
.bb-body { min-height: 120px; }
.bb-wait, .bb-err { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 28px 10px; color: var(--text-3); font-size: .9rem; }
.bb-err { color: var(--danger); flex-wrap: wrap; }
.bb-wait .ico { animation: bb-spin 1s linear infinite; }
@keyframes bb-spin { to { transform: rotate(360deg); } }
.bb-meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 0 8px; font-size: .86rem; color: var(--text-2); }
.bb-meta .spacer { flex: 1; }
.bb-meta b { color: var(--text); }
.bb-meta q { color: var(--text); font-weight: 600; }
.bb-bulk { display: inline-flex; gap: 6px; }
.bb-size { height: 28px; padding: 0 6px; border: 1px solid var(--border-strong); border-radius: 5px; background: var(--surface); font-size: max(var(--fs-min), .82rem); }

table.bb-tbl { table-layout: fixed; }
.bb-tbl col.c-ck { width: 38px; } .bb-tbl col.c-no { width: 64px; } .bb-tbl col.c-cat { width: 110px; }
.bb-tbl col.c-file { width: 26%; } .bb-tbl col.c-by { width: 110px; } .bb-tbl col.c-at { width: 92px; } .bb-tbl col.c-v { width: 64px; }
.bb-tbl th, .bb-tbl td { padding-top: 7px; padding-bottom: 7px; }
.bb-tbl th.bb-no, .bb-tbl td.bb-no, .bb-tbl th.bb-at, .bb-tbl td.bb-at, .bb-tbl th.bb-v, .bb-tbl td.bb-v, .bb-tbl .bb-ck { text-align: center; }
.bb-tbl td.bb-no { color: var(--text-3); font-size: max(var(--fs-min), .84rem); }
.bb-tbl td.bb-no .ico { margin: 0 auto; color: var(--danger); }
.bb-tbl td.bb-by, .bb-tbl td.bb-catc { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--text-2); }
.bb-tbl td.bb-at, .bb-tbl td.bb-v { color: var(--text-2); font-size: .86rem; }
.bb-ck input { width: 15px; height: 15px; vertical-align: middle; }
.bb-tw { display: flex; align-items: center; gap: 6px; min-width: 0; padding-left: calc(var(--bb-ind, 0) * 16px); }
.bb-t { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); font-weight: 500; }
.bb-t:hover, .bb-t:focus-visible { color: var(--primary); text-decoration: underline; }
.bb-row.is-unread .bb-t, .bb-mi.is-unread .bb-mtt, .bb-gi.is-unread .bb-gtt { font-weight: 650; }
.bb-re { display: inline-flex; flex: none; color: var(--text-3); }
.bb-pin { flex: none; }
.bb-ic { display: inline-flex; flex: none; color: var(--text-3); }
.bb-nc { flex: none; font-family: var(--mono); font-size: max(var(--fs-min), .8rem); font-weight: 600; color: var(--accent-dark); }
.bb-n { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 15px; height: 15px; border-radius: 3px;
  background: #c2410c; color: #fff; font-family: var(--mono); font-size: max(var(--fs-min), .72rem); font-weight: 700; line-height: 1; }
.bb-row.is-pin td { background: #fff8ec; }
.bb-row.is-pin + .bb-row:not(.is-pin) td { border-top: 1px solid var(--line); }
.bb-tbl tr.bb-row:hover td { background: var(--primary-soft); }
.bb-fc { min-width: 0; }
.bb-f { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; color: var(--text-2); font-size: .86rem; }
.bb-f span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bb-f:hover { color: var(--primary); }
.bb-fw { display: flex; align-items: center; gap: 6px; min-width: 0; white-space: nowrap; }
.bb-fw .bb-f { flex: 0 1 auto; min-width: 0; }
.bb-fw .cell-sub { flex: none; margin: 0; }

.bb-mlist { display: flex; flex-direction: column; border-top: 1px solid var(--line); }
.bb-mi { display: flex; flex-direction: column; gap: 3px; padding: 10px 2px; border-bottom: 1px solid var(--hair); color: var(--text); }
.bb-mi.is-pin { background: #fff8ec; padding-left: 8px; padding-right: 8px; }
.bb-mi.is-re { padding-left: 18px; }
.bb-mt { display: flex; align-items: center; gap: 6px; min-width: 0; }
.bb-mtt { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.bb-mcat { flex: none; font-size: max(var(--fs-min), .8rem); color: var(--primary-dark); font-weight: 600; }
.bb-ms { font-size: max(var(--fs-min), .82rem); color: var(--text-3); }

.bb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 14px; padding: 12px 0 4px; }
.bb-gi { display: flex; flex-direction: column; gap: 5px; min-width: 0; color: var(--text); }
.bb-gimg { display: flex; align-items: center; justify-content: center; aspect-ratio: 4 / 3; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-2); color: var(--border-strong); }
.bb-gimg img { width: 100%; height: 100%; object-fit: cover; }
.bb-gt { display: flex; align-items: center; gap: 5px; min-width: 0; }
.bb-gtt { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bb-gi:hover .bb-gtt { color: var(--primary); text-decoration: underline; }

.bb-pager { display: flex; align-items: center; justify-content: center; gap: 4px; padding: 14px 0 2px; flex-wrap: wrap; }
.bb-pg { min-width: 30px; height: 30px; padding: 0 6px; border: 1px solid var(--border); border-radius: 4px; background: var(--surface); color: var(--text-2); font-family: var(--mono); font-size: .86rem; }
.bb-pg.on { background: var(--tag-ink); border-color: var(--tag-ink); color: #fff; font-weight: 600; }
.bb-pg:disabled { opacity: .4; cursor: default; }
@media (hover: hover) and (pointer: fine) { .bb-pg:not(.on):not(:disabled):hover { border-color: var(--primary); color: var(--primary); } .bb-cat-b:hover { border-color: var(--primary); } }
.bb-pgi { margin-left: 8px; font-size: max(var(--fs-min), .82rem); color: var(--text-3); }

/* 글 보기 */
.bb-post { padding: 0; }
.bb-ph { padding: 16px 20px 12px; border-bottom: 1px solid var(--line); }
.bb-ptl { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.bb-ptl h2 { font-size: 1.36rem; font-weight: 700; letter-spacing: -.01em; line-height: 1.35; }
.bb-pm { display: flex; align-items: center; gap: 0; flex-wrap: wrap; margin-top: 8px; font-size: .86rem; color: var(--text-2); }
.bb-pm > * + *::before { content: ""; display: inline-block; width: 1px; height: 11px; margin: 0 10px; background: var(--border-strong); vertical-align: -1px; }
.bb-pm b { color: var(--text); }
.bb-pno { color: var(--text-3); }
.bb-files { margin: 0; padding: 10px 20px; background: var(--surface-2); border-bottom: 1px solid var(--hair); }
.bb-files-h { display: flex; align-items: center; gap: 6px; font-size: .86rem; color: var(--text-2); margin-bottom: 4px; }
.bb-files ul { list-style: none; display: flex; flex-direction: column; gap: 2px; }
.bb-files li { display: flex; align-items: center; gap: 8px; min-width: 0; }
.bb-file { display: inline-flex; align-items: center; gap: 6px; min-width: 0; color: var(--text); font-size: .9rem; }
.bb-file span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bb-file:hover { color: var(--primary); text-decoration: underline; }
.bb-content { padding: 18px 20px 22px; min-height: 140px; font-size: 1rem; line-height: 1.75; overflow-wrap: anywhere; }
.bb-content p { margin: 0 0 .6em; }
.bb-readers { margin: 0 20px 14px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface-2); }
.bb-readers summary { display: flex; align-items: center; gap: 10px; padding: 8px 12px; cursor: pointer; font-size: .86rem; color: var(--text-2); }
.bb-readers summary b { font-weight: 600; color: var(--text); }
.bb-readers summary b.is-un { color: var(--danger); }
.bb-rd { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 4px 12px 12px; }
.bb-rd h4 { font-size: max(var(--fs-min), .82rem); color: var(--text-3); margin-bottom: 6px; }
.bb-chip { display: inline-flex; align-items: center; gap: 4px; margin: 0 4px 4px 0; padding: 2px 8px; border: 1px solid var(--border); border-radius: 4px; background: var(--surface); font-size: max(var(--fs-min), .84rem); }
.bb-chip.is-un { color: var(--danger); border-color: #f2c4bf; }
.bb-chip small { color: var(--text-3); }
.bb-pa { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 10px 20px; border-top: 1px solid var(--line); }
.bb-pa .spacer { flex: 1; }
.bb-cmts .card-title { font-size: .98rem; }
.bb-cl { list-style: none; display: flex; flex-direction: column; }
.bb-c { padding: 9px 0; border-bottom: 1px solid var(--hair); }
.bb-ch { display: flex; align-items: center; gap: 8px; font-size: .88rem; }
.bb-ch .mt-btn { margin-left: auto; }
.bb-c p { margin-top: 3px; font-size: .94rem; white-space: normal; }
.bb-cform { display: flex; gap: 8px; align-items: flex-end; margin-top: 10px; }
.bb-cform textarea { flex: 1; min-width: 0; min-height: 56px; padding: 8px 10px; border: 1.5px solid var(--border-strong); border-radius: var(--radius-sm); resize: vertical; font: inherit; }
.bb-cform textarea:focus { border-color: var(--primary); outline: none; }
.bb-pn { display: flex; flex-direction: column; border-top: 2px solid var(--rule); border-bottom: 1px solid var(--line); background: var(--surface); margin-bottom: 16px; }
.bb-pn a { display: flex; align-items: center; gap: 14px; padding: 9px 14px; color: var(--text); font-size: .9rem; min-width: 0; }
.bb-pn a + a { border-top: 1px solid var(--hair); }
.bb-pnl { display: inline-flex; align-items: center; gap: 4px; flex: none; width: 76px; color: var(--text-3); font-size: max(var(--fs-min), .84rem); }
.bb-pnt { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bb-pn a:hover .bb-pnt { color: var(--primary); text-decoration: underline; }

/* 글쓰기 모달 */
.bb-form .form-row label { margin-bottom: 4px; }
.bb-pinrow { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.bb-chk, .bb-until { display: inline-flex !important; align-items: center; gap: 6px; margin: 0 !important; font-weight: 600; cursor: pointer; }
.bb-chk input { width: auto !important; }
.bb-until input { width: auto !important; padding: 4px 8px !important; }
.bb-editor { min-height: 240px; max-height: 52vh; overflow-y: auto; }
.bb-drop { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px; border: 1.5px dashed var(--border-strong); border-radius: var(--radius-sm); background: var(--surface-2); }
.bb-drop.on { border-color: var(--primary); background: var(--primary-soft); }
.bb-wfl { display: flex; flex-direction: column; gap: 4px; width: 100%; }
.bb-wfl:empty { display: none; }
.bb-wf { display: flex; align-items: center; gap: 8px; padding: 4px 8px; border: 1px solid var(--border); border-radius: 4px; background: var(--surface); font-size: .88rem; }
.bb-wfn { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bb-add { cursor: pointer; }

/* 게시판 관리 */
.bb-adm td { vertical-align: top; }
.bb-optc { max-width: 320px; }
.bb-oc { display: inline-block; margin: 0 4px 3px 0; padding: 0 7px; border: 1px solid var(--border); border-radius: 4px; font-size: max(var(--fs-min), .78rem); color: var(--text-2); background: var(--surface-2); white-space: nowrap; }
.bb-adm tr.is-orphan td { background: #fff4f2; }
.bf-sw { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0 18px; margin: 4px 0 12px; padding: 4px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-2); }
.sw-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px solid var(--hair); cursor: pointer; }
.sw-l { display: flex; flex-direction: column; min-width: 0; }
.sw-l b { font-size: .9rem; }
.sw-l small { font-size: max(var(--fs-min), .78rem); color: var(--text-3); line-height: 1.4; }
.sw { position: relative; flex: none; width: 38px; height: 22px; }
.sw input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; z-index: 1; }
.sw i { position: absolute; inset: 0; border-radius: 999px; background: #b9c5c1; transition: background-color .15s var(--ease-out); }
.sw i::after { content: ""; position: absolute; top: 3px; left: 3px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: transform .15s var(--ease-out); }
.sw input:checked + i { background: var(--primary); }
.sw input:checked + i::after { transform: translateX(16px); }
.sw input:focus-visible + i { outline: 2px solid var(--primary); outline-offset: 2px; }
.bf-inl { display: flex; align-items: center; gap: 8px; }
.bf-inl input { width: 90px !important; }
.bf-inl select { flex: 1; }
.nav-new { min-width: 18px; padding: 0 5px; border-radius: 4px; background: #c2410c; color: #fff !important; text-align: center; font-weight: 700; }
.notice-item.bb-dash { display: block; color: var(--text); }
.notice-item.bb-dash.is-unread .notice-title > span:not(.badge) { font-weight: 700; }
.notice-item.bb-dash .bb-n { margin-left: 2px; }

@media screen and (max-width: 767px) {
  .bb-bar { gap: 8px; }
  .bb-search { margin-left: 0; width: 100%; }
  .bb-search .search-field { flex: 1; width: auto; }
  .bb-search select { width: 96px; }
  .bb-ph { padding: 14px 14px 10px; }
  .bb-ptl h2 { font-size: 1.2rem; }
  .bb-pm { gap: 2px 12px; }
  .bb-pm > * + *::before { display: none; }
  .bb-files, .bb-pa { padding-left: 14px; padding-right: 14px; }
  .bb-content { padding: 14px; }
  .bb-readers { margin: 0 14px 12px; }
  .bb-rd { grid-template-columns: 1fr; }
  .bb-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .bb-pnl { width: 64px; }
}
@media print {
  .bb-bar, .bb-pager, .bb-meta .bb-bulk, .bb-meta select, .bb-ck, .bb-pa, .bb-cform, .bb-pn { display: none !important; }
  .bb-readers { display: block; }
  .bb-readers[open] summary, .bb-readers summary { list-style: none; }
  .bb-row.is-pin td { background: #f6f6f6 !important; }
}

/* ══ 탭 묶음이 눈에 띄게 — 패널은 묶음 아래 화면을 늘 펼치고, 본문 위 탭은 상자형(선택 = 진한 바탕) ══ */
.nav-grp { display: flex; flex-direction: column; }
.nav-bundle { font-weight: 600; color: var(--text); }
.nav-bundle.cur { font-weight: 700; }
.nav-subs { display: flex; flex-direction: column; gap: 1px; margin: 1px 0 6px 13px; padding-left: 9px; border-left: 1px solid var(--line); }
.nav-sub { min-height: 32px; padding: 5px 10px; font-size: max(var(--fs-min), .84rem); color: var(--text-2); }
.nav-sub.active { color: var(--text); }
.nav-sub.active::before { content: ""; position: absolute; left: -10px; top: 6px; bottom: 6px; width: 2px; border-radius: 2px; background: var(--rule); }
.nav-sub.is-opt { margin-top: 0; border-top: 0; border-radius: 6px; }
@media screen and (max-width: 767px) { .nav-sub { min-height: 40px; font-size: .9rem; } }

.subtabs { align-items: center; gap: 12px; }
.sbt-name { padding: 0 12px 0 0; border-right: 1px solid var(--line); font-size: .9rem; font-weight: 700; color: var(--text); line-height: 30px; }
.sbt-list { flex: 0 1 auto; gap: 3px; padding: 3px; border: 1px solid var(--line); border-radius: 6px; background: var(--head-bg); }
.sbt-tab { padding: 6px 14px; border-radius: 4px; font-size: .9rem; color: var(--text-2); }
.sbt-tab::after, .sbt-tab.on::after { display: none; }
.sbt-tab.on { background: var(--rule); color: #fff; box-shadow: 0 1px 2px rgba(15, 42, 51, .25); }
.sbt-tab.on .sbt-n { background: rgba(255, 255, 255, .18); color: #fff; }
.sbt-tab.on .sbt-opt { border-color: rgba(255, 255, 255, .55); color: #fff; }
@media (hover: hover) and (pointer: fine) { .sbt-tab:not(.on):hover { background: #fff; color: var(--text); } }
.sbt-tab:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
@media screen and (max-width: 767px) {
  .sbt-list { flex: 1 1 auto; }
  .sbt-tab { padding: 7px 12px; font-size: .88rem; }
}

/* ── 화면 규칙 — 머리말(주 단추 1 · ⋯ · 인쇄 맨 끝) · 카드 머리(제목 + 같은 모양 단추 1 + ⋯) · 단추 3종 · 탭 한 모양 · 조건 칩 · 허브 홈 · 가장 작은 글자 12px.
   규칙 원문은 docs/DESIGN.md §20 ── */
@media print { :root { --fs-min: 0rem; } }

/* 레일 — 이름은 패널 제목과 같게(좁으면 두 줄) */
.rail-btn { width: 72px; min-height: 64px; gap: 4px; font-size: .86rem; line-height: 1.2; }
.rail-btn span { max-width: 70px; white-space: normal; word-break: keep-all; overflow: hidden; text-overflow: clip;
  display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; }

/* 패널 허브 이름 = 허브 대시보드로 가는 단추 */
.hub-title .hub-go { display: flex; align-items: center; gap: 6px; width: 100%; margin: -4px -8px; padding: 4px 8px; border: 0; border-radius: 6px;
  background: none; color: inherit; font: inherit; letter-spacing: inherit; text-align: left; cursor: pointer; }
.hub-title .hub-go > span:first-child { min-width: 0; }
.hub-go-ic { display: flex; flex: none; color: var(--text-3); opacity: .7; }
.hub-title .hub-go.active { color: var(--primary-dark); }
.hub-title .hub-go.active .hub-go-ic { color: var(--primary); opacity: 1; }
@media (hover: hover) and (pointer: fine) { .hub-title .hub-go:hover { background: #e9efed; } .hub-title .hub-go:hover .hub-go-ic { opacity: 1; } }
.hub-title .hub-go:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }

/* 단추 3종 — 주(진한 청록) · 보조(흰 바탕 + 테두리) · 위험. 머리말 · 카드 머리의 연한 단추 · 글자 링크는 보조 모양으로 */
.page-head .btn-soft, .page-head .head-link, .dash-start .btn-soft { background: var(--surface); border: 1px solid var(--border-strong); color: var(--text); }
.page-head .head-link { min-height: 28px; padding: 0 10px; border-radius: 5px; font-size: .86rem; font-weight: 600; text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
#view[data-hub] .page-head .btn-soft, #view[data-hub] .page-head .head-link { background: rgba(255,255,255,.95); border-color: transparent; color: var(--text); }
.card-title .link-btn, .dc-head .link-btn, .card-title .c-act, .dc-head .c-act {
  min-height: 28px; padding: 0 10px; border: 1px solid var(--border-strong); border-radius: 5px; background: var(--surface);
  color: var(--text); font-size: .86rem; font-weight: 600; white-space: nowrap; text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
.card-title .link-btn .ico, .dc-head .link-btn .ico { color: var(--text-3); }
@media (hover: hover) and (pointer: fine) {
  .page-head .btn-soft:hover, .page-head .head-link:hover, .card-title .link-btn:hover, .dc-head .link-btn:hover, .card-title .c-act:hover, .dc-head .c-act:hover {
    border-color: var(--text-3); background: var(--surface-2); text-decoration: none; }
}
.card-title .link-btn + .link-btn, .dc-head .link-btn + .link-btn { margin-left: 4px; }

/* ⋯ 더보기 — 드물게 쓰는 기능. 머리말은 ph-rare(어느 폭에서나 ⋯ 안), 카드 머리는 c-rare */
.page-head .ph-rare, .c-rare { display: none !important; }
@media screen and (min-width: 768px) {
  .page-head.ph-has-rare > .ph-more { display: inline-flex; width: 34px; height: 34px; border: 1px solid var(--border-strong); background: var(--surface); color: var(--text-2); }
  #view[data-hub] .page-head.ph-has-rare > .ph-more { background: rgba(255,255,255,.95); border-color: transparent; color: var(--text); }
}
.card-title .c-more, .dc-head .c-more { flex: none; width: 28px; height: 28px; margin: -2px 0; border: 1px solid var(--border-strong); border-radius: 5px;
  background: var(--surface); color: var(--text-2); display: inline-grid; place-items: center; }
.card-title .c-more .ico, .dc-head .c-more .ico { width: 18px; height: 18px; }
@media (hover: hover) and (pointer: fine) { .page-head > .ph-more:hover, .card-title .c-more:hover, .dc-head .c-more:hover { border-color: var(--text-3); color: var(--text); } }

/* PC 에서 단추로 연 목록 = 단추 아래 작은 목록(팝오버) */
@media screen and (min-width: 768px) {
  .asheet.asheet-pop { display: block; }
  .asheet-pop .asheet-bd { background: transparent; }
  .asheet-pop .asheet-panel { position: absolute; width: auto; min-width: 220px; max-width: 340px; margin: 0; gap: 0;
    border: 1px solid var(--line); border-radius: 6px; background: var(--surface); box-shadow: 0 10px 28px rgba(11,31,38,.16), 0 2px 6px rgba(11,31,38,.08);
    transform: scale(.97); opacity: 0; transition: transform .14s var(--ease-out), opacity .14s ease; }
  .asheet-pop.on .asheet-panel { transform: none; opacity: 1; }
  .asheet-pop .asheet-t, .asheet-pop .asheet-cancel { display: none; }
  .asheet-pop .asheet-list { border-radius: 6px; max-height: 60vh; padding: 4px; }
  .asheet-pop .asheet-item { min-height: 40px; padding: 0 12px; gap: 10px; border: 0; border-radius: 4px; font-size: .93rem; }
  .asheet-pop .asheet-ico svg { width: 18px; height: 18px; }
  .asheet-pop .asheet-item:not([disabled]):hover, .asheet-pop .asheet-item:focus-visible { background: var(--surface-2); outline: none; }
  .asheet-pop .asheet-item:focus-visible { box-shadow: inset 0 0 0 2px var(--primary); }
}

/* 탭 한 모양 — 본문 위 묶음 탭 · 화면 안 탭 · 설정 탭: 회색 띠 + 고른 탭 = 진한 바탕 흰 글자 */
.eq-tabs, .tabs { display: inline-flex; flex-wrap: nowrap; gap: 2px; max-width: 100%; padding: 3px; border: 1px solid var(--line); border-radius: 6px;
  background: var(--head-bg); overflow-x: auto; scrollbar-width: none; }
.eq-tabs::-webkit-scrollbar, .tabs::-webkit-scrollbar { display: none; }
.eq-tabs { margin-bottom: 16px; }
.tabs { margin-bottom: 14px; border-bottom: 1px solid var(--line); }
.eq-tab, .tab { flex: none; min-height: 32px; padding: 0 14px; border: 0; border-radius: 4px; background: transparent; color: var(--text-2);
  font-size: .9rem; font-weight: 600; white-space: nowrap; display: inline-flex; align-items: center; gap: 6px; }
.tab { border-bottom: 0; margin-bottom: 0; }
.eq-tab[aria-selected="true"], .tab.active { background: var(--rule); color: #fff; box-shadow: 0 1px 2px rgba(15,42,51,.25); }
@media (hover: hover) and (pointer: fine) { .eq-tab[aria-selected="false"]:hover, .tab:not(.active):hover { background: #fff; color: var(--text); } }
.eq-tab:focus-visible, .tab:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
.sbt-list { padding: 3px; gap: 2px; }
.sbt-tab { min-height: 32px; padding: 0 14px; font-size: .9rem; }

/* 조건(필터 · 보기 전환) = 작은 칩 — 탭과 다른 모양(흰 바탕 + 테두리, 고르면 연한 청록) */
.seg { display: inline-flex; flex-wrap: wrap; gap: 6px; padding: 0; border: 0; border-radius: 0; background: none; }
.seg-btn { min-height: 30px; padding: 0 12px; border: 1px solid var(--border-strong); border-radius: 999px; background: var(--surface); color: var(--text-2);
  font-size: .86rem; font-weight: 600; box-shadow: none; }
.seg-btn[aria-pressed="true"] { background: var(--primary-soft); border-color: var(--primary); color: var(--primary-dark); box-shadow: none; }
@media (hover: hover) and (pointer: fine) { .seg-btn[aria-pressed="false"]:hover { border-color: var(--text-3); color: var(--text); } }
.seg-btn:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
.cal-viewbtn { border-radius: 999px; }

@media screen and (max-width: 767px) {
  .eq-tabs, .tabs { display: flex; width: 100%; }
  .eq-tab, .tab { flex: 1 0 auto; justify-content: center; padding: 0 10px; font-size: .88rem; }
}

/* 허브 홈(#/hub/…) — 바로가기 칸 + 현황 카드 */
.hh-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; }
.hh-tile { display: flex; align-items: center; gap: 12px; min-height: 66px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 6px;
  background: var(--surface); color: var(--text); text-align: left; text-decoration: none; font: inherit;
  transition: border-color .15s ease, background-color .15s ease, transform .16s var(--ease-out); }
.hh-tile:active { transform: scale(.98); }
@media (hover: hover) and (pointer: fine) { .hh-tile:hover { border-color: var(--text-3); background: var(--surface-2); } }
.hh-tile:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
.hh-ic { flex: none; width: 38px; height: 38px; border-radius: 6px; display: grid; place-items: center; background: var(--primary-soft); color: var(--primary-dark); }
.hh-t { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.hh-t b { font-size: 1rem; font-weight: 700; line-height: 1.3; }
.hh-g { font-style: normal; font-size: .86rem; color: var(--text-3); line-height: 1.3; }
.hh-s { font-size: .86rem; color: var(--text-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hh-s.t-bad { color: var(--danger); font-weight: 600; }
.hh-s.t-warn { color: var(--warning); font-weight: 600; }
.hh-s.t-ok { color: var(--success); }
.hh-n { flex: none; min-width: 24px; padding: 0 7px; border-radius: 4px; background: var(--accent-soft); color: #8a4b06; font-size: .86rem; font-weight: 600; line-height: 22px; text-align: center; }
.hh-go { flex: none; display: flex; color: var(--text-3); }
.hh-tile.is-bad { border-color: #efb3ac; background: var(--danger-soft); }
.hh-tile.is-bad .hh-ic { background: #fff; color: var(--danger); }
.hh-list { display: flex; flex-direction: column; }
.hh-row { display: grid; grid-template-columns: 74px auto minmax(0, 1fr) auto; align-items: center; gap: 12px; min-height: 42px; padding: 6px 4px;
  border: 0; border-bottom: 1px solid var(--hair); background: none; color: var(--text); text-align: left; text-decoration: none; font: inherit; }
.hh-row:last-child { border-bottom: 0; }
@media (hover: hover) and (pointer: fine) { .hh-row:hover { background: var(--surface-2); } }
.hh-row:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }
.hh-d { color: var(--text-3); font-size: .9rem; }
.hh-k { color: var(--text-2); font-size: .88rem; white-space: nowrap; }
.hh-x { display: flex; align-items: center; gap: 6px; min-width: 0; }
.hh-x > span:last-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hh-x.is-unread { font-weight: 700; }
.hh-m { color: var(--text-3); font-size: .88rem; white-space: nowrap; }
.hh-wait { display: flex; align-items: center; gap: 8px; padding: 18px 4px; color: var(--text-3); }
@media screen and (max-width: 767px) {
  .hh-grid { grid-template-columns: 1fr 1fr; gap: 6px; }
  .hh-tile { flex-direction: column; align-items: flex-start; gap: 8px; min-height: 96px; }
  .hh-go { display: none; }
  .hh-row { grid-template-columns: 70px auto minmax(0, 1fr); gap: 8px; }
  .hh-row .hh-m:empty { display: none; }
  .hh-row .hh-m { grid-column: 2 / -1; }
}
@media print {
  .hh-grid { grid-template-columns: 1fr 1fr 1fr; }
  .hh-tile { min-height: 0; break-inside: avoid; }
  .hh-go, .hh-ic { display: none; }
}

/* 일정 칩 · 모바일 일정 줄 — 키보드는 안의 제목 단추(바로 가기 단추와 겹쳐 놓지 않음 · WCAG 4.1.2) */
button.chip-title, button.calm-body { margin: 0; padding: 0; border: 0; border-radius: 3px; background: none; color: inherit; font: inherit;
  text-align: left; cursor: pointer; min-width: 0; min-height: 0; box-shadow: none; }
button.chip-title { display: block; }
button.chip-title:focus-visible, button.calm-body:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }

/* 대시보드 — 블록 4개: 시작 칸 · 현황(3D 띠 200px + 오늘 줄) · 운항(지도 300px) · 일정/공지/결정. 진행 중 SERP · 위협전화 띠는 그때만 맨 위 */
.dash-start { padding: 14px 18px 16px; margin-bottom: 16px; }
.ds-hi h2 { font-size: 1.22rem; }
.ds-tiles { margin-top: 10px; gap: 10px; }
.ds-tile { min-height: 68px; padding: 10px 14px; gap: 12px; }
.ds-ti { width: 42px; height: 42px; }
.ds-ti .sup-owl, .ds-ti .owl-svg { width: 40px; height: 40px; }
.ds-tt b { font-size: 1.1rem; }
.ds-tt small { font-size: .9rem; }

.dash-now { display: flex; flex-direction: column; margin-bottom: 16px; min-width: 0; }
.dash-now .ticket.tk-hero { min-height: 200px; border-radius: 8px; }
.dash-now.has-today .ticket.tk-hero { border-radius: 8px 8px 0 0; }
.dash-now.has-today .tk-perf::after { background: var(--surface); }
.dash-now .tk-hero .tk-main { padding: 18px 28px 16px; gap: 8px; }
.dash-now .zero-n { font-size: 3.5rem; }
.dash-now .tk-hero .tk-side { width: 236px; padding: 18px 22px 16px 14px; gap: 8px; }
.dash-now .tk-level { font-size: 2.2rem; }
.dash-now .tk-stage { inset: 0 0 0 30%; }
.tk-more { position: absolute; top: 10px; right: 10px; z-index: 2; width: 32px; height: 32px; display: grid; place-items: center;
  border: 1px solid #2e5361; border-radius: 6px; background: rgba(15,42,51,.6); color: #dbe8eb; }
@media (hover: hover) and (pointer: fine) { .tk-more:hover { background: #17404c; color: #fff; } }
.tk-more:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.dash-now .tk-hero .tk-side .tk-label { padding-right: 34px; }

.today-strip { display: flex; align-items: stretch; min-width: 0; border: 1px solid var(--line); border-top: 0; border-radius: 0 0 6px 6px; background: var(--surface); }
.today-strip .td-head { flex: none; width: 104px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 0; padding: 10px 16px;
  border-right: 1px solid var(--hair); background: var(--head-bg); }
.today-strip .td-head h2 { font-size: 1.07rem; }
.today-strip .td-list { flex: 1; min-width: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); justify-content: stretch; }
.today-strip .td-row { grid-template-columns: 34px minmax(0, 1fr) auto; gap: 10px; min-height: 66px; padding: 10px 14px; border-radius: 0; }
.today-strip .td-row + .td-row::before { top: 12px; bottom: 12px; left: 0; right: auto; width: 1px; height: auto; background: var(--hair); }
.today-strip .td-ico { width: 34px; height: 34px; }
.today-strip .td-chev { display: none; }
.today-strip .td-t { font-size: .93rem; }
.today-strip .td-v { font-size: 1.07rem; }
.dash-flt .dflt-mapwrap .fo-map { height: 300px; }
@media (min-width: 1100px) { .dash-flt .dflt-side { max-height: 300px; } }
.dash-flt > .dc-head, .dash-sheet .dc-head, .dash-scr > .dc-head { align-items: center; }
.dc-head h2 { font-size: 1.07rem; }

@media screen and (max-width: 767px) {
  .dash-now .ticket.tk-hero { min-height: 0; }
  .dash-now .zero-n { font-size: 3rem; }
  .dash-now .tk-hero .tk-side { width: auto; padding: 8px 18px 14px; }
  .dash-now .tk-level { font-size: 1.55rem; }
  .dash-now .tk-stage { inset: 0 -24px 0 26%; }
  .today-strip { flex-direction: column; }
  .today-strip .td-head { width: auto; flex-direction: row; align-items: baseline; gap: 8px; padding: 8px 14px; border-right: 0; border-bottom: 1px solid var(--hair); }
  .today-strip .td-list { grid-template-columns: 1fr 1fr; }
  .today-strip .td-row { grid-template-columns: minmax(0, 1fr) auto; min-height: 60px; padding: 8px 12px; }
  .today-strip .td-row .td-ico { display: none; }
  .today-strip .td-row + .td-row::before { display: none; }
  .today-strip .td-row { border-top: 1px solid var(--hair); }
  .today-strip .td-row:nth-child(-n+2) { border-top: 0; }
  .today-strip .td-row:nth-child(odd) { border-right: 1px solid var(--hair); }
  .ds-tile { min-height: 84px; }
}
@media print {
  .tk-more { display: none !important; }
  .today-strip { border: 1px solid #999; border-top: 0; }
  .today-strip .td-list { grid-template-columns: repeat(3, 1fr); }
}

/* 카드 안 탭(SeMIS.ui.tabs · pane) — 한 카드에 묶은 내용. 칸 안의 원래 제목 줄은 '보조 머리'(이름은 탭이 대신, 화면낭독은 그대로) */
.ct-tabs { margin: 0 0 12px; }
.ct-pane[hidden] { display: none; }
.sd-trend, .sd-sub, .ie-sub { container-type: inline-size; }
.ct-pane > .sd-sub > .card-title, .ct-pane > .ie-sub > .card-title, .ie-rec > .ie-sub > .card-title {
  margin: 0 0 10px; padding: 0 0 8px; font-size: .93rem; font-weight: 600; border-bottom: 1px solid var(--hair); }
.ct-pane > .sd-sub > .card-title .ct-t, .ct-pane > .ie-sub > .card-title .ct-t {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ic-head { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; flex-wrap: wrap; }
.ic-head > b { font-size: 1rem; }
.ie-sched .ie-up .uc-split { margin-top: 0; }
@media print {
  .ct-tabs { display: none !important; }
  .ct-pane[hidden] { display: block !important; }
  .ct-pane + .ct-pane { margin-top: 6mm; }
  .ct-pane > .sd-sub > .card-title .ct-t, .ct-pane > .ie-sub > .card-title .ct-t { position: static; width: auto; height: auto; margin: 0; clip: auto; overflow: visible; font-weight: 700; }
  .gp-body[hidden] { display: block !important; }
  .ic-nav { display: none !important; }
}
/* 공통 패널 머리의 드문 기능 — PC 도 ⋯ 안 */
.pnl-acts .ph-rare { display: none !important; }
@media screen and (min-width: 768px) { .pnl.pnl-has-rare .pnl-more:not([hidden]) { display: inline-flex; } }