/* 한빛금강 운행관리 — 모바일 우선 (viewport 375px 기준, §8)
   토큰·컴포넌트 문법은 docs/화면설계서.html의 것을 그대로 따른다. */
:root{
  --red:#D9201F; --deepred:#B01C1B; --ink:#2A2220; --char:#392E2C;
  --muted:#6E5D59; --paper:#FBF5F4; --card:#FFFFFF; --line:#EED5D3;
  --chip:#F6DEDC; --ok:#2E7D4F; --okbg:#E7F3EC; --warn:#B75A00; --warnbg:#FCEFDD;
  --info:#3D4C63; --infobg:#EEF1F6;
  --soft:#EEE9E8; --softline:#F3E6E4; --offbg:#F6F1F0;
  /* rev.9 2단계: ERP 폼의 '필수 칸' 배경(연노랑) — 기존 톤과 충돌 없는 최소 추가 */
  --reqbg:#FFFBE0;
  /* rev.7: --muted 8A7A76→6E5D59 — 새벽 야외 가독(대비 3.8→5.5:1). */
}

/* rev.8: §3 폰트 self-host — Pretendard Variable (OFL, fonts/LICENSE-OFL.txt).
   기기별 서체 3종 분화(맑은고딕/Apple SD/Roboto) 종식 — swap이라 로딩 중엔 폴백. */
@font-face{
  font-family:"Pretendard";
  src:url("/static/fonts/PretendardVariable.subset.woff2") format("woff2-variations");
  font-weight:45 920;
  font-style:normal;
  font-display:swap;
}
*{margin:0;padding:0;box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{font-family:"Pretendard","Malgun Gothic","Apple SD Gothic Neo",
  "Noto Sans KR",sans-serif;
  background:var(--paper);color:var(--ink);line-height:1.5;
  padding-bottom:calc(84px + env(safe-area-inset-bottom))}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}

.appbar{display:flex;align-items:center;justify-content:space-between;
  padding:12px 14px;border-bottom:1px solid var(--line);background:var(--card);
  position:sticky;top:0;z-index:20}
.appbar .logo{font-weight:800;font-size:16px;white-space:nowrap}
.appbar .logo em{color:var(--red);font-style:normal}
.appbar .who{font-size:12px;color:var(--muted);white-space:nowrap}
.appbar form{display:inline}
.appbar .out{background:none;border:1px solid var(--line);border-radius:8px;
  padding:5px 8px;font-size:13px;color:var(--muted);white-space:nowrap}
.backbtn{border:0;background:var(--char);border-radius:10px;width:42px;height:36px;
  padding:0;color:#fff;flex:none;display:flex;align-items:center;justify-content:center}
.backbtn svg{display:block}

main{padding:14px;max-width:640px;margin:0 auto}
.t-lg{font-size:18px;font-weight:800;margin-bottom:10px}
.small{font-size:13px;color:var(--muted)}
.row{display:flex;justify-content:space-between;align-items:center;gap:8px}
.divide{border-top:1px dashed var(--line);margin:10px 0}

.card{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:12px;margin-bottom:10px}
.kv{display:flex;justify-content:space-between;font-size:14.5px;padding:4px 0}
.kv b{font-weight:700}

.pill{display:inline-block;border-radius:99px;padding:3px 10px;font-size:12.5px;font-weight:700}
.pill.ok{background:var(--okbg);color:var(--ok)}
.pill.warn{background:var(--warnbg);color:var(--warn)}
.pill.red{background:var(--chip);color:var(--deepred)}
.pill.gray{background:var(--soft);color:var(--muted)}
/* [v1.57.4 사용자 결정] '퇴근' = 정상 종료 — 경보색(빨강)이 아니라 테두리만 있는 중립색. 램프 점은 §8대로 그대로 */
.pill.end{background:var(--card);color:var(--muted);box-shadow:inset 0 0 0 1px var(--line)}
.pill.dark{background:var(--char);color:#fff}
.pill.info{background:var(--infobg);color:var(--info)}  /* 상태 아닌 분류용 (rev.7) */

.btn{display:block;width:100%;text-align:center;border-radius:11px;padding:13px 0;
  font-size:16px;font-weight:800;border:0}
.btn.red{background:var(--red);color:#fff}
.btn.dark{background:var(--char);color:#fff}
.btn.ghost{background:var(--card);border:1px solid var(--line);color:var(--ink);
  font-weight:600;font-size:14px;padding:11px 0}
.btn:disabled{opacity:.5}

.fld{margin-bottom:12px}
.fld label{display:block;font-size:13px;color:var(--muted);margin-bottom:4px}
/* 16px = iOS 포커스 자동 확대 방지 (rev.7 — 15px는 카톡 인앱에서 화면이 튄다) */
.fld input,.fld select,.fld textarea{width:100%;border:1px solid var(--line);
  border-radius:9px;background:var(--card);padding:11px 12px;font-size:16px;color:var(--ink);font-family:inherit}
.fld input:focus,.fld select:focus{outline:2px solid var(--red);outline-offset:-1px}
/* [v1.54.1] 체크박스·라디오는 칸 폭으로 늘리지 않는다(대리 정정 '지움'이 입력칸 아래 가운데로 떨어지고
   글자는 오른쪽 끝으로 밀리던 것) — '지움'은 입력칸 바로 아래 왼쪽에 붙인다 */
.fld input[type=checkbox],.fld input[type=radio]{width:auto;padding:0;border:0;margin:0}
.fld .clearchk{display:inline-flex;align-items:center;gap:4px;margin:4px 0 0;font-size:12.5px;white-space:nowrap}

.banner{border-radius:10px;padding:10px 12px;font-size:13.5px;font-weight:700;margin-bottom:10px}
.banner.ok{background:var(--okbg);color:var(--ok)}
.banner.warn{background:var(--warnbg);color:var(--warn)}
.banner.err{background:var(--chip);color:var(--deepred)}
.banner.info{background:var(--infobg);color:var(--info)}

/* 키보드 포커스 링 (rev.7) — 레드·차콜·흰 배경 어디서든 보이는 이중 링 */
a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex]:focus-visible{
  outline:2px solid #fff;box-shadow:0 0 0 4px rgba(57,46,44,.85);border-radius:6px}

/* ── 홈: 상태 버튼 (§8 v4) ── */
.clockbtn{display:block;width:100%;border:0;border-radius:16px;padding:22px 0;
  text-align:center;font-weight:800;font-size:20px;color:#fff;background:var(--red)}
.clockbtn .tm{display:block;font-size:13px;font-weight:600;opacity:.85;margin-top:3px}
.clockbtn.done{background:#C9C0BE}
/* [v1.66.3] 상온 본근무 배송 출발 다음 = 전일상차 단계(전일상차 카드와 같은 주황) */
.clockbtn.preload{background:#B75A00}
.statuschip{font-size:13px;font-weight:700;border-radius:99px;padding:4px 12px}
.timeline{margin:12px 0}
.timeline .kv b{font-variant-numeric:tabular-nums}
.linkline{display:block;text-align:center;font-size:14px;color:var(--muted);
  text-decoration:underline;margin-top:10px;background:none;border:0;width:100%}

/* ── 긴급 (§8 하단 고정) ── */
.emergbar{position:fixed;left:0;right:0;bottom:0;z-index:30;
  padding:10px 14px calc(10px + env(safe-area-inset-bottom));
  background:linear-gradient(transparent, var(--paper) 40%)}
.emergbtn{display:block;width:100%;max-width:612px;margin:0 auto;border:0;
  border-radius:13px;padding:14px 0;font-size:17px;font-weight:800;
  background:var(--deepred);color:#fff;box-shadow:0 4px 14px rgba(176,28,27,.35)}
/* ── [v1.58.0 시안 v4 제안 1] 기사 화면 아래 탭 · 긴급은 탭 위 오른쪽 · 오늘 할 일 · 운행기록 입력창 ── */
body.hastabs{padding-bottom:calc(164px + env(safe-area-inset-bottom))}
.tabbar{position:fixed;left:0;right:0;bottom:0;z-index:31;display:flex;background:var(--card);
  border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
.tabbar a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
  min-height:56px;padding:6px 0;font-size:12.5px;font-weight:700;color:var(--muted)}
.tabbar a .ti{font-size:20px;line-height:1.15}
.tabbar a.on{color:var(--deepred)}
.tabbar a.on .ti{transform:scale(1.08)}
.hastabs .emergbar{left:auto;right:12px;bottom:calc(78px + env(safe-area-inset-bottom));padding:0;background:none;z-index:32}
/* [v1.60.3 사용자 지적 "긴급이 아직도 살짝 짤리는 느낌"] 아래 탭 줄(59px, z-index 31)이 버튼(바닥 66px, z-index 30) 아래 3px와
   둘레 테두리 4px를 덮고 있었다 → 탭 줄 위 12px 띄우고(78px) 탭 줄보다 위 층(32) — 그림자·테두리까지 다 보이게 */
/* [v1.60.1 사용자 지시 "긴급버튼 크기 좀 키워주세요"] 44px 알약 → 64px — 장갑·떨리는 손으로도 한 번에 */
.hastabs .emergbtn{width:auto;min-width:132px;min-height:64px;padding:14px 28px;border-radius:999px;
  font-size:21px;font-weight:900;letter-spacing:.02em;box-shadow:0 6px 18px rgba(176,28,27,.45),0 0 0 4px rgba(217,32,31,.18)}
.todo{padding:10px 12px}
.todoline{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;
  text-align:left;background:none;border:0;border-top:1px solid var(--line);padding:12px 2px;
  font:inherit;font-size:15px;font-weight:600;color:var(--ink);cursor:pointer}
.todo .row + .todoline{margin-top:6px}
.todoline.red{color:var(--deepred)}
.todoline.warn{color:var(--warn)}
div.todoline{cursor:default}
.todoline .go{color:var(--muted);font-size:20px;line-height:1;flex:none}
.todo.done{border-left:4px solid var(--ok)}
.todonone{text-align:center;margin:12px 0;color:var(--muted)}
.logsheet{max-height:92vh;overflow-y:auto;overscroll-behavior:contain}
.seg{display:flex;gap:6px;margin-bottom:10px}
.seg a{flex:1;text-align:center;padding:9px 0;border-radius:10px;font-weight:700;font-size:14px;
  background:var(--soft);color:var(--muted)}
.seg a.on{background:var(--char);color:#fff}
.morelist{padding:0;overflow:hidden}
.morelist a,.morelist .mi{display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:14px 14px;border-top:1px solid var(--line);font-size:15px;font-weight:600}
.morelist > :first-child{border-top:0}
.morelist .go{color:var(--muted)}
.sheetback{position:fixed;inset:0;background:rgba(42,34,32,.55);z-index:40;
  display:flex;align-items:flex-end}
.sheet{background:var(--card);border-radius:18px 18px 0 0;padding:18px 16px
  calc(18px + env(safe-area-inset-bottom));width:100%;max-width:640px;margin:0 auto}
.sheet h3{font-size:16px;font-weight:800;margin-bottom:12px}
.kindgrid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:10px}
.kindgrid .kbtn{border:1.5px solid var(--line);border-radius:11px;background:var(--card);
  padding:14px 0;font-size:15px;font-weight:700}
.kindgrid .kbtn.on{border-color:var(--deepred);background:var(--chip);color:var(--deepred)}
.telbtn{display:flex;align-items:center;justify-content:center;gap:6px;
  border:1.5px solid var(--char);border-radius:11px;background:var(--card);
  padding:11px 0;font-size:15px;font-weight:700;margin-top:8px}

/* ── 관리자: 신호등 보드 (§8) ── */
.counts{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin-bottom:10px}
.counts .c{background:var(--card);border:1px solid var(--line);border-radius:10px;
  text-align:center;padding:8px 2px}
.counts .c .small{font-size:12px}
.bignum{font-size:22px;font-weight:800;letter-spacing:-.5px}
.lamp{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:7px;flex:none}
.lamp.gray{background:#C9C0BE}
.lamp.charcoal{background:var(--char)}
.lamp.amber{background:var(--warn)}
.lamp.green{background:var(--ok)}
.lamp.red{background:var(--red)}
/* [v1.42.0 사용자 지시] 지원배송 중인 기사는 **파란불** — 상태색(회색·차콜·주황·
   초록·빨강)과 겹치지 않는 유일한 색이라, 명단에서 지원 인원만 바로 짚힌다.
   상태 자체는 옆 pill 글자가 계속 알려준다(불 색과 글자가 각자 다른 일을 한다). */
/* v1.42.0에서는 --info(#3D4C63, 짙은 청회색)를 썼는데 10px 점에서는 출근의
   차콜과 거의 같아 보였다(사용자 지적) — 채도가 분명한 파랑으로 바꾼다. */
.lamp.blue{background:#2F6BD8;box-shadow:0 0 0 2px rgba(47,107,216,.2)}
/* [v1.42.1] 추가근무 중(퇴근 뒤 [추가근무 시작]으로 연 세션) = 보라.
   기존 6색(회색·차콜·주황·초록·빨강·파랑) 어느 것과도 겹치지 않는다. */
.lamp.purple{background:#7B4FD6;box-shadow:0 0 0 2px rgba(123,79,214,.2)}
.list .item{display:flex;align-items:center;gap:8px;padding:9px 2px;
  border-bottom:1px solid var(--softline);font-size:14.5px}
.list .item:last-child{border-bottom:0}
.list .item .grow{flex:1;min-width:0}
.list .item .tm{font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}
/* 40px — 주행 장갑 낀 손 기준 탭 타깃 확대 (rev.7, 종전 30px) */
.tel{width:40px;height:40px;border:1.5px solid var(--char);border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:15px;flex:none}
.secttl{font-size:14px;font-weight:800;color:var(--deepred);margin:14px 0 6px}

/* ── [rev.9] 대시보드 KPI 카드 8장 (5상태 램프색 + 미제출·긴급·승인대기) ──
   .counts(5칸 요약)는 다른 화면이 계속 쓰므로 건드리지 않는다 — 별도 클래스. */
.kpigrid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-bottom:12px}
@media (min-width:620px){.kpigrid{grid-template-columns:repeat(4,1fr)}}
/* [v1.36.0] 카드가 8 → 10장(지원배송·추가근무)이 되면서 한 줄에 8칸이면 두 줄째가
   2칸만 남아 어색하다. 5칸 × 2줄로 떨어지게 한다(대시보드 높이도 줄인다). */
@media (min-width:1180px){.kpigrid{grid-template-columns:repeat(5,1fr)}}
.kpicard{display:block;background:var(--card);border:1px solid var(--line);
  border-radius:12px;padding:9px 11px 8px}
.kpicard .kl{display:flex;align-items:center;font-size:12px;font-weight:700;
  color:var(--muted);white-space:nowrap}
.kpicard .bignum{font-size:26px;line-height:1.15;margin-top:1px}
a.kpicard:active{background:var(--paper)}
.n-muted{color:var(--muted)} .n-warn{color:var(--warn)} .n-ok{color:var(--ok)}
.n-red{color:var(--red)} .n-deep{color:var(--deepred)} .n-info{color:var(--info)}
/* [v1.42.1] KPI 숫자색 = 카드 점 색 (상태 5칸과 같은 규칙) */
.n-blue{color:#2F6BD8} .n-purple{color:#7B4FD6}

/* ── [rev.9] 대시보드 2컬럼(좌 본문 + 우 위젯 스택) ── */
.bdgrid{display:grid;grid-template-columns:1fr;gap:10px;align-items:start}
@media (min-width:1080px){.bdgrid{grid-template-columns:minmax(0,1fr) 330px}}
.bdside{display:flex;flex-direction:column;gap:10px}
.widget{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px}
.widget h3{font-size:13.5px;font-weight:800;color:var(--deepred);margin-bottom:6px}
.wline{display:flex;justify-content:space-between;align-items:center;gap:8px;
  font-size:13.5px;padding:6px 0;border-bottom:1px solid var(--softline)}
.wline:last-child{border-bottom:0}
.wline>span{color:var(--muted);white-space:nowrap}
.wline b{font-weight:700;font-variant-numeric:tabular-nums;text-align:right;min-width:0}
.cardttl{font-size:13.5px;font-weight:800;color:var(--deepred);margin-bottom:4px}
/* sticky GNB 아래로 앵커가 숨지 않게 (KPI 카드·위젯 → 하단 섹션 이동) */
.secttl[id]{scroll-margin-top:104px}

/* ── [rev.9] 신호등 명단 테이블형 (도크·이름 | 상태 | 마지막 전이 | ☎) ── */
table.bdtable{width:100%;border-collapse:collapse;font-size:14.5px}
table.bdtable td{border-bottom:1px solid var(--softline);padding:6px 2px;
  vertical-align:middle}
table.bdtable tr:last-child td{border-bottom:0}
table.bdtable td.nm{width:auto}
table.bdtable td.st{width:112px;text-align:center;white-space:nowrap}
table.bdtable td.tmc{width:60px;text-align:right;font-size:13px;color:var(--muted);
  font-variant-numeric:tabular-nums}
table.bdtable td.tlc{width:48px}
table.bdtable td.tlc .tel{margin-left:auto}
/* 좁은 화면(관리자는 PC 전제)에서는 상태 pill을 접는다 — 램프+aria-label이 상태를
   그대로 전하고, 이름이 줄바꿈으로 뭉개지지 않는다 (종전 모바일 배치와 동일) */
@media (max-width:620px){table.bdtable td.st{display:none}}

/* ── 관리자 광폭 레이아웃 + 주간 브리핑 표 (PC 전제 — 사용자 지시) ── */
/* [rev.9] ERP 프레임: 1160 → 1400 (좌 명단 + 우 위젯 2컬럼 전제) */
@media (min-width: 900px){ main.wide{max-width:1400px} }
.briefwrap{overflow-x:auto;background:var(--card);border:1px solid var(--line);
  border-radius:12px;padding:8px;margin-bottom:12px}
table.brief{width:100%;border-collapse:collapse;font-size:12.5px;background:var(--card)}
table.brief th{background:var(--char);color:#fff;padding:6px 6px;font-weight:700;
  font-size:11.5px;white-space:nowrap}
table.brief td{border:1px solid var(--softline);padding:5px 6px;text-align:center;
  white-space:nowrap;font-variant-numeric:tabular-nums}
table.brief td.name{text-align:left;font-weight:700}
table.brief td.miss{color:var(--deepred);font-weight:700;background:var(--chip)}
table.brief td.off{color:var(--muted);background:var(--offbg)}
/* [v1.57.4] 아직 낼 수 있는 날(오늘·어제) — 빨간 '미제출'이 아니라 회색 '입력 전' */
table.brief td.pending{color:var(--muted);background:var(--soft)}
table.brief .dedmark{color:var(--deepred);font-weight:700}
table.brief .edmark{color:var(--warn);font-weight:700}
table.brief .rcmark{cursor:help}
/* [rev.32] 주유 내역 — 영수증 작은 사진 */
.rcthumb{width:34px;height:34px;object-fit:cover;border-radius:5px;border:1px solid var(--line);
  vertical-align:middle;margin-right:4px}

table.mini{width:100%;border-collapse:collapse;font-size:13.5px;background:var(--card)}
table.mini th{background:var(--red);color:#fff;font-weight:700;padding:6px 4px;font-size:12px}
table.mini td{border-bottom:1px solid var(--softline);padding:6px 4px;text-align:center}
table.mini td.l{text-align:left}

details.admform{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:10px 12px;margin-bottom:10px}
details.admform summary{font-size:14.5px;font-weight:700;cursor:pointer}
details.admform .inner{padding-top:10px}

.ackline{display:flex;align-items:flex-start;gap:9px;background:var(--card);
  border:1.5px solid var(--warn);border-radius:11px;padding:12px;margin-bottom:10px;
  font-size:14px;line-height:1.5;cursor:pointer}
.ackline input{width:19px;height:19px;flex:none;margin-top:1px;accent-color:var(--red)}

.appver{text-align:center;font-size:10.5px;color:#CDBFBC;margin-top:22px;
  user-select:none}

/* ── [rev.9] 관리자 ERP 프레임: 아이콘 GNB (종전 .topnav 드롭다운·타일 그리드 대체) ──
   appbar + gnb를 한 덩어리로 sticky — 두 요소가 각각 top:0이면 겹친다. */
.topwrap{position:sticky;top:0;z-index:20;background:var(--card)}
.topwrap .appbar{position:static}
.gnb{display:flex;align-items:center;gap:10px;padding:0 8px 0 10px;
  background:var(--card);border-bottom:1px solid var(--line)}
.gnb-menu{display:flex;gap:0;flex:1;min-width:0;overflow-x:auto;
  scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.gnb-menu::-webkit-scrollbar{height:5px}
.gnb-menu::-webkit-scrollbar-thumb{background:var(--line);border-radius:99px}
.gmi{display:flex;align-items:center;gap:5px;flex:none;white-space:nowrap;
  padding:9px 10px 7px;font-size:13px;font-weight:700;color:var(--muted);
  border-bottom:3px solid transparent}
.gmi .gi{font-size:15px;line-height:1}
.gmi:hover{color:var(--ink);background:var(--paper)}
.gmi.on{color:var(--deepred);border-bottom-color:var(--red);background:var(--offbg)}
.gnb-right{display:flex;align-items:center;gap:8px;flex:none}
.gnb-right form{display:inline}
.gnb-right .who{font-size:12px;color:var(--muted);white-space:nowrap}
.gnb-right .out{background:none;border:1px solid var(--line);border-radius:8px;
  padding:5px 8px;font-size:13px;color:var(--muted);white-space:nowrap}
.gnb-badge{display:inline-block;border-radius:99px;padding:4px 11px;font-size:12.5px;
  font-weight:800;background:var(--soft);color:var(--ink);white-space:nowrap}
.gnb-badge.hot{background:var(--chip);color:var(--deepred)}
/* [rev.29] 사용설명서 링크 — 로그아웃과 같은 테두리 버튼 톤 */
.gnb-help{border:1px solid var(--line);border-radius:8px;padding:5px 8px;font-size:13px;
  color:var(--ink);white-space:nowrap;font-weight:600}
.gnb-help:hover{background:var(--paper)}
/* GNB가 이름·역할을 상시 표기하므로 화면별 appbar의 중복 표기는 감춘다 */
body.hasgnb .appbar .who{display:none}
@media (max-width:620px){.appbar .who{display:none}
  .gnb-right .who{display:none}
  .gmi{font-size:12px;padding:8px 8px 6px}}

/* ── 행 액션 버튼 (시범 피드백 9/8: 텍스트 나열 → 버튼 통일) ── */
.abtn{display:inline-flex;align-items:center;justify-content:center;gap:5px;
  border:1px solid var(--line);background:var(--card);border-radius:9px;
  padding:8px 12px;font-size:13px;font-weight:700;color:var(--ink);
  line-height:1.2;white-space:nowrap;cursor:pointer;min-height:38px}
.abtn:active{background:var(--paper)}
.abtn.primary{border-color:#E2B4B2;background:#FDF7F6;color:var(--deepred)}
.abtn.danger{color:var(--deepred)}

/* 폼 하단 버튼 행 — 가운데 정렬 + 동일 크기 (시범 피드백 9/8) */
.btnrow{display:flex;gap:8px;justify-content:center;margin-top:14px}
.btnrow>*{flex:1 1 0;max-width:270px}

/* ── 상태 필터 칩 (시범 피드백 9/8: 텍스트 나열 → 톤앤매너 통일) ── */
.chips{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.chip{display:inline-flex;align-items:center;border:1px solid var(--line);background:var(--card);
  border-radius:99px;padding:7px 14px;font-size:13.5px;font-weight:700;
  color:var(--muted);line-height:1;min-height:36px}
.chip.on{background:var(--char);color:#fff;border-color:var(--char)}

/* ── 반응형: PC에서 더 PC답게 (시범 피드백 9/8) ── */
@media (min-width: 1024px){
  main{max-width:720px}   /* 기사 화면도 데스크톱에서 여유 폭 (wide는 별도 규칙) */
  /* PC 전용 글자 확대 (피드백 9/8 — 모바일 기본값은 그대로) */
  .t-lg{font-size:20px}
  .small{font-size:14px}
  .kv{font-size:15.5px}
  .list .item{font-size:15.5px}
  .list .item .tm{font-size:14px}
  .banner{font-size:14.5px}
  .pill{font-size:13.5px}
  .secttl{font-size:15.5px}
  .fld label{font-size:14px}
  .fld input,.fld select,.fld textarea{font-size:16px}
  details.admform summary{font-size:15.5px}
  table.brief{font-size:13.5px}
  table.brief th{font-size:13px}
  table.mini{font-size:14.5px}
  .abtn{font-size:14px}
  .chip{font-size:14.5px}
  .btn{font-size:17px}
  .btn.ghost{font-size:15px}
  .gmi{font-size:14px}
  .gnb-right .who{font-size:13px}
  .gnb-badge{font-size:13.5px}
  table.bdtable{font-size:15.5px}
  .wline{font-size:14.5px}
  .widget h3{font-size:14.5px}
  .cardttl{font-size:14.5px}
  .kpicard .kl{font-size:13px}
  .appbar .logo{font-size:17px}
  .appbar .out{font-size:14px}
  .appbar .who{font-size:13px}
}
@media (min-width: 1000px){
  main.wide .cols2{display:grid;grid-template-columns:1fr 1fr;gap:10px;
    align-items:start}
  main.wide .cols2>.card,main.wide .cols2>details.admform{margin-bottom:0}
  /* 입력폼: PC에서 화면 전체 폭 사용 — 필드를 3열 그리드로 배치 (피드백 9/8).
     .row는 display:contents로 풀어 내부 필드도 같은 그리드에 정렬된다. */
  main.wide details.admform:not(.fullform) .inner form{
    display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
    gap:0 16px;align-items:end}
  main.wide details.admform:not(.fullform) .inner form .row{display:contents}
  /* 긴 입력(제목·메모·사유·본문)은 열을 넓게 차지해 빈칸 없이 줄을 채운다 */
  main.wide details.admform:not(.fullform) .inner form .fld:has(input[name=title]),
  main.wide details.admform:not(.fullform) .inner form .fld:has(input[name=memo]),
  main.wide details.admform:not(.fullform) .inner form .fld:has(input[name=note]),
  main.wide details.admform:not(.fullform) .inner form .fld:has(input[name=adjust_note]){
    grid-column:span 2}
  main.wide details.admform:not(.fullform) .inner form .fld:has(textarea),
  main.wide details.admform:not(.fullform) .inner form .fld:has(input[name=reason]),
  main.wide details.admform:not(.fullform) .inner form .fld:has(input[name=deduct_reason_detail]){
    grid-column:1/-1}
  main.wide details.admform:not(.fullform) .inner form .btn{
    grid-column:1/-1;max-width:300px;justify-self:center;margin:4px 0 12px}
}

/* ── [rev.9 2단계] 차량·기사 통합 대장 (/admin/fleet) ──
   마스터-디테일: 좌 리스트 패널(고정 폭) + 우 ERP 조밀 폼. 관리자는 PC 전제라
   좁은 화면에서는 리스트가 위로 쌓인다(모바일에서도 열람은 가능). */
.fleetwrap{display:grid;grid-template-columns:1fr;gap:10px;align-items:start}
@media (min-width:900px){.fleetwrap{grid-template-columns:290px minmax(0,1fr)}}
.fleetside{background:var(--card);border:1px solid var(--line);border-radius:12px;
  padding:10px}
@media (min-width:900px){.fleetside{position:sticky;top:104px;
  max-height:calc(100vh - 120px);display:flex;flex-direction:column}}
.fleetside .filters{display:grid;gap:6px;margin-bottom:8px}
.fleetside .filters select,.fleetside .filters input{width:100%;border:1px solid var(--line);
  border-radius:8px;background:var(--card);padding:8px 9px;font-size:14px;color:var(--ink)}
.fleetlist{overflow-y:auto;min-height:0;margin:0 -4px}
.fleetrow{display:block;padding:8px 8px;border-bottom:1px solid var(--softline);
  font-size:14px;border-radius:8px}
.fleetrow:last-child{border-bottom:0}
.fleetrow b{display:block;font-weight:700}
.fleetrow .sub{font-size:12.5px;color:var(--muted)}
.fleetrow:hover{background:var(--paper)}
.fleetrow.on{background:var(--chip)}
.fleetrow.on b{color:var(--deepred)}
.fleetrow.off b{color:var(--muted)}

/* ERP 조밀 폼: 라벨 셀 배경 + 1px 격자. 한 줄 높이 34px로 정보 밀도를 올린다. */
.erpsec{margin:0 0 12px}
.erpsec>h3{font-size:13.5px;font-weight:800;color:var(--deepred);margin:0 0 5px}
/* 격자선은 셀의 우/하 테두리로 그린다 — gap+배경색 방식은 줄 끝의 빈 칸이
   선 색 덩어리로 보인다(마지막 줄이 딱 안 떨어지는 섹션에서 눈에 띔). */
.erpgrid{display:grid;grid-template-columns:1fr;gap:0;background:var(--card);
  border:1px solid var(--line);border-right:0;border-bottom:0;
  border-radius:8px;overflow:hidden}
@media (min-width:700px){.erpgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1150px){.erpgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.erpf{display:flex;align-items:stretch;background:var(--card);min-height:34px;
  border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.erpf>span{flex:0 0 104px;display:flex;align-items:center;padding:0 8px;
  background:var(--soft);color:var(--muted);font-size:12px;font-weight:700;
  line-height:1.2}
.erpf>input,.erpf>select{flex:1;min-width:0;border:0;background:transparent;
  padding:6px 8px;font-size:14px;color:var(--ink);font-family:inherit}
.erpf>input:focus,.erpf>select:focus{outline:2px solid var(--red);outline-offset:-2px}
.erpf>.ro{flex:1;min-width:0;display:flex;align-items:center;padding:6px 8px;
  font-size:14px;color:var(--muted);background:var(--offbg);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.erpf.req>span{background:var(--chip);color:var(--deepred)}
.erpf.req>input,.erpf.req>select{background:var(--reqbg)}
.erpf.wide{grid-column:1/-1}
/* [v1.41.0] 정산서 항목 격자 — 항목명이 길어서(예: "지원배송금액 (3+4+5+6+7+8번
   열합계금액)") .erpf의 104px 라벨 칸에 넣으면 칸마다 높이가 달라져 표가 깨진다.
   여기서는 **라벨을 입력칸 위로** 올려 셀 폭을 통째로 쓰고, 모든 칸의 높이를
   같게 고정한다. 금액은 우측 정렬 + tabular-nums라 자릿수가 눈으로 맞는다. */
.itemgrid{display:grid;grid-template-columns:1fr;gap:0;background:var(--card);
  border:1px solid var(--line);border-right:0;border-bottom:0;
  border-radius:8px;overflow:hidden}
@media (min-width:560px){.itemgrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:980px){.itemgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (min-width:1340px){.itemgrid{grid-template-columns:repeat(4,minmax(0,1fr))}}
.itemf{display:flex;flex-direction:column;justify-content:space-between;gap:5px;
  padding:7px 9px 8px;background:var(--card);
  border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.itemf>.lab{display:flex;gap:5px;align-items:flex-start;font-size:11.5px;
  color:var(--muted);font-weight:700;line-height:1.32;
  /* 두 줄까지만 — 그 이상은 말줄임하고 전체 문구는 title로 띄운다 */
  height:2.64em;overflow:hidden}
.itemf>.lab>b{flex:0 0 auto;min-width:17px;text-align:right;color:var(--deepred);
  font-weight:800}
.itemf>.lab>span{flex:1;min-width:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* 입력칸과 소계칸의 높이를 같은 값으로 못박는다 — 한쪽만 몇 px 크면
   줄마다 격자가 어긋나 보인다(꼬리표 글자 크기 차이로 실제 그랬다). */
.itemf>input,.itemf>.ro{height:32px;box-sizing:border-box;line-height:1.35}
.itemf>input{width:100%;border:1px solid var(--line);border-radius:7px;
  padding:0 8px;font-size:14px;font-family:inherit;color:var(--ink);
  text-align:right;font-variant-numeric:tabular-nums;background:var(--card)}
.itemf>input:focus{outline:2px solid var(--red);outline-offset:-1px}
.itemf>input::placeholder{color:#C9C0BE;font-weight:400}
/* 값이 든 칸을 옅게 물들여, 58칸 중 어디에 금액이 있는지 한눈에 보이게 */
.itemf.on{background:var(--chip)}
.itemf.on>input{border-color:var(--red);font-weight:700}
.itemf.on>.lab{color:var(--deepred)}
/* 소계처럼 계산으로 채워지는 칸 — 입력이 아니라 결과라는 걸 색으로 구분 */
.itemf.calc{background:var(--offbg)}
/* 소계 칸 — 입력칸과 **같은 높이 한 줄**이어야 격자가 어긋나지 않는다.
   'ㅈ동' 꼬리표를 왼쪽에 붙이고 숫자를 오른쪽에 두어 줄바꿈을 없앤다. */
.itemf>.ro{width:100%;display:flex;align-items:center;justify-content:space-between;
  gap:6px;white-space:nowrap;overflow:hidden;
  border:1px dashed var(--line);border-radius:7px;padding:0 8px;font-size:14px;
  color:var(--muted);font-variant-numeric:tabular-nums;background:var(--soft)}
.itemf>.ro>i{flex:0 0 auto;font-style:normal;font-size:10.5px;font-weight:700;
  color:var(--muted);background:var(--card);border-radius:4px;padding:1px 5px}
.itemf>.ro>b{flex:1;min-width:0;text-align:right;overflow:hidden;text-overflow:ellipsis}
.itemsec{margin:0 0 14px}
.itemsec>h3{display:flex;align-items:baseline;gap:8px;font-size:13.5px;
  font-weight:800;color:var(--deepred);margin:0 0 5px}
.itemsec>h3 .cnt{font-size:11.5px;font-weight:700;color:var(--muted)}

/* [v1.44.0] 파일 올리기 칸 — [📷 촬영] + [📁 선택]을 섞어 최대 3개 (filepick.js).
   실제 input은 화면에서 숨기되 display:none은 쓰지 않는다 — iOS 일부 버전은
   display:none인 파일 칸을 label로 열지 못한다. */
.filepick .fp-src,.filepick .fp-out{position:absolute;width:1px;height:1px;
  opacity:0;overflow:hidden;pointer-events:none}
.fp-btns{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.fp-btn{display:flex;align-items:center;justify-content:center;gap:6px;
  border:1.5px solid var(--line);border-radius:11px;background:var(--card);
  padding:12px 6px;font-size:14.5px;font-weight:700;color:var(--ink);cursor:pointer}
.fp-btn:active{background:var(--chip)}
.fp-full .fp-btn,.fp-off .fp-btn{opacity:.45;pointer-events:none}
/* [rev.32] 운행기록 주유 영수증 — 이미 올린 사진(탭별) + 지우기 체크 */
.rcpts{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.rcpt{display:flex;flex-direction:column;align-items:center;gap:2px}
.rcpt img{width:64px;height:64px;object-fit:cover;border-radius:8px;border:1px solid var(--line);display:block}
.fp-list{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px}
.fp-list li{display:flex;align-items:center;gap:8px;border:1px solid var(--line);
  border-radius:9px;padding:6px 8px;background:var(--card)}
.fp-list img,.fp-list .fp-ico{width:44px;height:44px;border-radius:6px;flex:none}
.fp-list img{object-fit:cover}
.fp-list .fp-ico{display:flex;align-items:center;justify-content:center;
  font-size:22px;background:var(--soft)}
.fp-list .fp-name{flex:1;min-width:0;font-size:13px;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
.fp-list button{border:0;background:none;color:var(--deepred);font-size:18px;padding:4px 8px}

.erpchecks{display:flex;flex-wrap:wrap;gap:14px;background:var(--card);
  border:1px solid var(--line);border-top:0;border-radius:0 0 8px 8px;padding:9px 10px}
.erpchecks label{display:flex;align-items:center;gap:6px;font-size:13.5px}
.erpchecks input{width:17px;height:17px;accent-color:var(--red)}

/* 하단 관련내역 탭 13종 — 서버가 전부 렌더하고 JS는 display만 토글한다 */
.tabbar{display:flex;gap:2px;overflow-x:auto;border-bottom:2px solid var(--line);
  margin-bottom:10px;scrollbar-width:thin}
.tabbar::-webkit-scrollbar{height:5px}
.tabbar::-webkit-scrollbar-thumb{background:var(--line);border-radius:99px}
.tabbtn{flex:none;border:0;background:none;padding:8px 12px 6px;font-size:13.5px;
  font-weight:700;color:var(--muted);border-bottom:3px solid transparent;
  white-space:nowrap;margin-bottom:-2px}
.tabbtn.on{color:var(--deepred);border-bottom-color:var(--red)}
.tabbtn .cnt{font-size:11.5px;color:var(--muted);margin-left:3px}

/* ── 게이지 막대 (설계서 9번 — rev.8 복원) ── */
.gauge{height:10px;border-radius:99px;background:var(--soft);overflow:hidden;margin:8px 0 4px}
.gauge>i{display:block;height:100%;background:var(--ok);border-radius:99px}
.gauge>i.warn{background:var(--warn)}

/* ── 배송스케줄 날짜 칩 (설계서 5번 — rev.7 복원) ── */
.daychips{display:flex;gap:6px;overflow-x:auto;padding:2px 0 8px;margin-bottom:6px;
  -webkit-overflow-scrolling:touch}
.daychips .dchip{flex:none;width:46px;text-align:center;border:1px solid var(--line);
  border-radius:10px;background:var(--card);padding:6px 0 5px;font-size:15px;font-weight:800;
  color:var(--muted);line-height:1.2}
.daychips .dchip span{display:block;font-size:11px;font-weight:600;margin-top:1px}
.daychips .dchip.has{border-color:var(--red);color:var(--deepred);background:var(--chip)}
.daychips .dchip:not(.has):not(.off){opacity:.5;pointer-events:none}
/* [v1.38.0 ⑰] 휴무일 칩 — 코스가 없어도 눌러서 볼 수 있게 (회색 톤) */
.daychips .dchip.off{border-color:var(--line);color:var(--muted);background:var(--bg2, transparent)}

/* ── 교육·안내문 사진 + 외부 링크 (시범 피드백 9/8) ── */
.noticepics{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.noticepics img{width:86px;height:86px;object-fit:cover;border-radius:8px;
  border:1px solid var(--line);background:var(--card)}
.trainpics{display:flex;flex-direction:column;gap:8px;margin:0 0 10px}
.trainpics img{width:100%;border-radius:10px;border:1px solid var(--line)}
.extlink{color:#155A9C;text-decoration:underline;word-break:break-all}

.errpage{text-align:center;padding:60px 20px}
.errpage .code{font-size:40px;font-weight:800;color:var(--red)}

/* ── 가로 막대 (rev.8 — 손익 등 표-only 화면의 최소 차트) ── */
.hbar{position:relative;height:18px;border-radius:6px;background:var(--soft);
  overflow:hidden;margin:3px 0}
.hbar>i{display:block;height:100%;background:var(--char)}
.hbar.pay>i{background:var(--red)}
.hbar>span{position:absolute;left:8px;top:0;line-height:18px;font-size:11.5px;
  color:#fff;mix-blend-mode:difference}

/* ── [rev.9 3단계] 유가 정보 위젯 (오피넷) — 표면·글자색 전부 토큰이라
   다크 팔레트(아래)가 그대로 적용된다. 등락은 ▲빨강 / ▼파랑(--info). ── */
table.fueltbl{width:100%;border-collapse:collapse;font-size:13.5px;
  font-variant-numeric:tabular-nums}
table.fueltbl th{font-size:11.5px;font-weight:700;color:var(--muted);
  padding:0 4px 3px;text-align:right}
table.fueltbl th:first-child{text-align:left}
table.fueltbl td{border-top:1px solid var(--softline);padding:5px 4px;
  text-align:right;white-space:nowrap;line-height:1.25}
table.fueltbl td.a{text-align:left;color:var(--muted);font-weight:700}
table.fueltbl tr.local{background:var(--offbg)}
table.fueltbl b{font-weight:800}
table.fueltbl i{display:block;font-style:normal;font-size:11px;font-weight:700}
table.fueltbl i.up{color:var(--deepred)}
table.fueltbl i.down{color:var(--info)}
table.fueltbl i.flat{color:var(--muted)}

/* ── [rev.9 4단계] 관리자 ERP 공통 레이아웃 ──
   /admin/fleet의 조밀 폼(.erpgrid·.erpf)과 짝이 되는 목록·툴바·패널 세트.
   관리자 전 화면이 이 클래스만 쓰면 톤이 통일된다(색은 전부 토큰 → 다크 자동). */

/* 화면 머리: 제목 + 부제 + 우측 액션. 종전 .t-lg 단독 제목을 대체한다. */
.pagehead{display:flex;align-items:baseline;gap:8px 10px;flex-wrap:wrap;
  padding-bottom:8px;margin-bottom:10px;border-bottom:2px solid var(--line)}
.pagehead h1{font-size:17px;font-weight:800;margin:0;letter-spacing:-.2px}
.pagehead .sub{font-size:12.5px;color:var(--muted);font-weight:400}
.pagehead .acts{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap;align-items:center}

/* 필터·검색 툴바 (표 바로 위) */
.erptools{display:flex;flex-wrap:wrap;gap:6px;align-items:center;
  background:var(--soft);border:1px solid var(--line);border-radius:10px;
  padding:8px 10px;margin-bottom:10px}
.erptools form{display:contents}
.erptools select,.erptools input{border:1px solid var(--line);border-radius:8px;
  background:var(--card);padding:7px 9px;font-size:13.5px;color:var(--ink);
  font-family:inherit}
.erptools input[type=search],.erptools input[name=q]{min-width:190px}
.erptools .sp{flex:1 1 auto}
.erptools .cnt{font-size:12.5px;color:var(--muted);font-weight:700}

/* 조밀 데이터 표 — 목록 화면의 기본형(.card>.list>.item 대체) */
.erptablewrap{border:1px solid var(--line);border-radius:10px;overflow:auto;
  background:var(--card);margin-bottom:12px}
table.erptable{width:100%;border-collapse:collapse;font-size:13.5px;
  font-variant-numeric:tabular-nums}
table.erptable th{position:sticky;top:0;z-index:1;background:var(--soft);
  color:var(--muted);font-size:11.5px;font-weight:800;text-align:left;
  padding:7px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
table.erptable td{padding:7px 10px;border-bottom:1px solid var(--softline)}
table.erptable tbody tr:last-child td{border-bottom:0}
table.erptable tbody tr:hover td{background:var(--paper)}
table.erptable td.num,table.erptable th.num{text-align:right}
table.erptable td.mid,table.erptable th.mid{text-align:center}
table.erptable td.nw{white-space:nowrap}
table.erptable td b{font-weight:700}
table.erptable td .sub,table.erptable td .small{font-size:12px;color:var(--muted)}
table.erptable tr.off td{color:var(--muted)}
table.erptable tr.group td{background:var(--offbg);font-weight:800;font-size:12.5px;
  color:var(--deepred)}
table.erptable td.acts{white-space:nowrap;text-align:right}
table.erptable td.acts>*{margin-left:4px}
/* 표 안의 버튼·전화는 조밀하게 — 행 높이가 터치 타깃(38·40px)에 끌려가면
   ERP 표가 아니라 모바일 리스트처럼 보인다(관리자 화면은 PC 전제). */
table.erptable .abtn{min-height:0;padding:4px 9px;font-size:12.5px;border-radius:7px}
table.erptable .tel{display:inline-flex;width:auto;height:auto;min-height:0;
  border:0;border-radius:7px;padding:4px 7px;font-size:15px;vertical-align:middle}
table.erptable .pill{font-size:11.5px;padding:2px 7px}
table.erptable input,table.erptable select{border:1px solid var(--line);
  border-radius:7px;background:var(--card);padding:4px 7px;font-size:13px;
  color:var(--ink);font-family:inherit}
table.erptable .btn{min-height:0;padding:5px 10px;font-size:12.5px;border-radius:8px}

/* 패널 — 입력 폼·보조 블록을 감싸는 틀(제목 줄 + 본문) */
.erppanel{background:var(--card);border:1px solid var(--line);border-radius:12px;
  margin-bottom:12px;overflow:hidden}
.erppanel>h3{font-size:13px;font-weight:800;color:var(--deepred);margin:0;
  padding:9px 12px;background:var(--soft);border-bottom:1px solid var(--line)}
.erppanel>.body{padding:12px}
.erppanel>.body>:last-child{margin-bottom:0}
.erpempty{padding:22px 12px;text-align:center;color:var(--muted);font-size:13px}

/* 종전 접이식 입력폼(details.admform)도 패널 톤으로 — 미변환 화면 대비 */
details.admform>summary{font-weight:800;color:var(--deepred)}

/* ── [2026-09-09 사용자 지시] 대시보드 명단 박스 축소 ──
   신호등 명단(상온·저온)과 미제출·미출근 목록이 세로로 너무 길다는 지적.
   ① 신호등 카드·행 여백을 조이고 ② 명단 3종은 광폭에서 3열로 나란히 두고
   각자 스크롤한다. 마크업·id는 admin.js 폴링 계약이라 CSS로만 줄인다. */
.bdmain>#sections>.card{padding:8px 10px;margin-bottom:8px}
.bdmain .cardttl{font-size:12.5px;margin-bottom:2px}
table.bdtable td{padding:3px 6px;font-size:13px}
table.bdtable td.nm{line-height:1.25}
table.bdtable .pill{font-size:11px;padding:1px 6px}
table.bdtable .tel{width:auto;height:auto;min-height:0;border:0;padding:2px 6px;
  font-size:15px;display:inline-flex}

/* [v1.39.0 ⑳] 배송용역료 업로드 카드 — 운송사 × 상온/저온 한 장씩 */
.poutgrid{display:grid;gap:10px;margin-bottom:10px}
@media (min-width:900px){.poutgrid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}}
.poutcard{display:block;border:1px solid var(--line);border-radius:12px;padding:10px 12px;
  background:var(--card);color:inherit}
.poutcard.on{border-color:var(--red);box-shadow:0 0 0 2px var(--chip) inset}
.poutcard .kv{padding:2px 0;font-size:12.5px}
.poutcard .kv b{font-variant-numeric:tabular-nums}

/* [v1.38.0 ⑪] 대시보드 클레임 스트립 — 한 줄 = 한 건. 명단 위에 놓이므로
   높이를 아끼되(행 6줄), 30분 경과 pill은 눈에 걸리게 둔다. */
.claimstrip{padding:4px 10px;margin-bottom:8px}
/* 제목 줄 + 오른쪽 버튼 — flex로 한 줄에 두고 버튼만 오른쪽 끝으로(float 금지: 부모 높이에
   안 들어가 버튼이 아래 박스 위로 삐져나온다) */
.secttl.withact{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.secttl.withact>.abtn{margin-left:auto}
.claimrow{display:flex;align-items:center;gap:8px;padding:5px 2px;font-size:13px;
  border-bottom:1px solid var(--line);color:inherit}
.claimrow:last-child{border-bottom:0}
.claimrow.done{opacity:.55}
.claimrow .ck{flex:none;background:var(--chip);border-radius:6px;padding:1px 7px;
  font-size:11.5px;color:var(--deepred)}
.claimrow .cn{flex:none}
.claimrow .cc{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;
  white-space:nowrap;color:var(--muted)}
.claimrow .cs,.claimrow .ct{flex:none}
.claimrow .ct{color:var(--muted);font-size:11.5px}
@media (max-width:700px){.claimrow .ct{display:none}}

.misgrid{display:grid;gap:10px 12px;margin-bottom:6px}
@media (min-width:1000px){.misgrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.misgrid .secttl{margin:0 0 5px;font-size:13px}
.misgrid>section>.card{padding:6px 10px;max-height:230px;overflow-y:auto;
  margin-bottom:6px}
.misgrid .list .item{padding:4px 2px;font-size:13px;gap:6px}
.misgrid .list .item .pill{font-size:11px;padding:1px 6px;flex:none}
.misgrid .list .item .tel{width:auto;height:auto;min-height:0;border:0;
  padding:2px 6px;font-size:15px}
.misgrid .btn.ghost{padding:7px 0;font-size:13px;margin:0}

/* ── [rev.9 6단계] 그룹 화면 섹션 탭 (GNB 아래 2차 내비) ──
   GNB(그룹 7개)와 구분되게 알약형. 서버가 섹션을 전부 렌더해 두고 JS가 보이기만
   바꾸므로 전환에 요청이 없다 — 링크(href)는 종전 URL이라 JS 없이도 동작한다. */
.sectabs{display:flex;gap:6px;flex-wrap:wrap;margin:-2px 0 12px}
.sectab{border:1px solid var(--line);background:var(--card);border-radius:99px;
  padding:6px 13px;font-size:13.5px;font-weight:700;color:var(--muted);
  white-space:nowrap}
.sectab:hover{background:var(--paper)}
.sectab.on{background:var(--chip);border-color:var(--chip);color:var(--deepred)}
.secpane>.pagehead{display:none}  /* 파셜이 자체 머리를 갖고 있어도 그룹 머리만 쓴다 */

/* ── rev.8 다크모드 — 새벽 차 안(05:30 출근) 눈부심 완화. 시스템 설정 따름.
   토큰 재정의가 본체 — 파일 맨 끝에 두어 동일 특이성 규칙을 이긴다. ── */
@media (prefers-color-scheme: dark){
  :root{
    color-scheme:dark;
    --paper:#191211; --card:#241C1A; --ink:#F1E7E4; --muted:#B5A49F;
    --line:#453633; --chip:#4A2523; --deepred:#F08B8A;
    --ok:#7FC79A; --okbg:#1E3527; --warn:#E5A75F; --warnbg:#3D2D12;
    --info:#AFC3E0; --infobg:#25303E;
    --soft:#332A28; --softline:#39302D; --offbg:#201816;
    --reqbg:#3A3320;                 /* [rev.9] 필수 칸 — 밝은 노랑은 야간에 눈부시다 */
  }
  .emergbtn{background:#B01C1B}      /* --deepred가 텍스트용으로 밝아진 보정 */
  .clockbtn.done{background:#4A403E}
  .abtn.primary{background:#33231F;border-color:#5C3835}
  /* [rev.9] ERP 프레임 표면색 — 전부 토큰 위에서만 보정 */
  .gmi.on{background:#2B211F}        /* --offbg(어두운 종이)는 카드와 구분이 약하다 */
  .gnb-badge{background:var(--soft);color:var(--ink)}
  a.kpicard:active{background:#2B211F}
  .lamp.charcoal{background:#CDBFBC}
  .lamp.gray{background:#5E4F4B}
  .lamp.blue{background:#6E9BEA;box-shadow:0 0 0 2px rgba(110,155,234,.25)}
  .lamp.purple{background:#B195F0;box-shadow:0 0 0 2px rgba(177,149,240,.25)}
  .n-blue{color:#8DB1F0} .n-purple{color:#C2AEF4}
  .extlink{color:#7FB3E8}
  .appver{color:#5E4F4B}
  .fleetrow:hover{background:#2B211F}
  .fleetrow.on{background:#3A2422}
  table.fueltbl tr.local{background:#2B211F}  /* --offbg는 카드와 구분이 약하다 */
}

/* [rev.25 요청사항 ②] 기사 홈 지원배송 달력 — 7열, 375px에서 칸 44px */
.calgrid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin-top:6px}
.calgrid .h{font-size:11px;color:var(--muted);text-align:center;padding:2px 0}
.calcell{min-height:44px;border:1px solid var(--line);border-radius:6px;padding:3px 4px;font-size:11px;background:var(--card);display:flex;flex-direction:column;gap:1px}
.calcell.blank{border-color:transparent;background:transparent}
.calcell.off{background:var(--paper);color:var(--muted)}
.calcell.future{opacity:.55}
.calcell.today{outline:2px solid var(--red);outline-offset:-1px}
.calcell .day{font-weight:700}
.calcell .sup{font-weight:700;color:#2F6BD8}
.calcell .man{margin-left:2px;font-weight:700;color:var(--muted)}  /* [rev.30] 관리자 수기 입력한 날 */
.calcell .main{color:var(--muted)}
.calcell .offtxt{color:var(--muted)}

/* [rev.26] 배차 지도 — 좌 코스/SM 패널 · 중 T맵 · 우 선택 점포/추천/오늘 이동 */
.dmtabs{display:flex;gap:4px}
.dmtab{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:5px 12px;font-size:13px;cursor:pointer}
.dmtab.on{background:var(--red);border-color:var(--red);color:#fff;font-weight:700}
.dmsearchwrap{position:relative}
.dmsearchlist{position:absolute;top:100%;left:0;z-index:30;min-width:260px;background:var(--card);border:1px solid var(--line);border-radius:8px;box-shadow:0 6px 18px rgba(0,0,0,.12);padding:4px}
.dmsearchlist button{display:flex;align-items:center;gap:6px;width:100%;text-align:left;background:none;border:0;padding:6px 8px;border-radius:6px;font-size:13px;color:var(--ink);cursor:pointer}
.dmsearchlist button:hover{background:var(--paper)}
.dmwrap{display:grid;grid-template-columns:320px minmax(0,1fr) 340px;gap:8px;height:calc(100vh - 250px);min-height:520px}
.dmside,.dmpanel{border:1px solid var(--line);border-radius:10px;background:var(--card);display:flex;flex-direction:column;min-height:0}
.dmside-h{padding:8px 10px;font-weight:700;border-bottom:1px solid var(--line);font-size:13px}
.dmside-h .small{font-weight:400;color:var(--muted);margin-left:4px}
.dmlist{overflow:auto;flex:1}
.dmrow{display:flex;gap:8px;align-items:flex-start;padding:6px 8px;border-bottom:1px solid var(--line);font-size:13px}
.dmrow:hover{background:var(--paper)}
.dmrow-main{flex:1;min-width:0;cursor:pointer}
.dmrow-acts{display:flex;gap:3px;flex-direction:row;align-items:center;flex-wrap:wrap;justify-content:flex-end;max-width:112px}
.dmrow-acts .abtn{padding:1px 6px;font-size:11px;min-height:0;line-height:1.6}
.dot{display:inline-block;width:12px;height:12px;border-radius:50%;flex:0 0 12px;margin-top:3px;border:1px solid rgba(0,0,0,.2)}
.dmrow .lamp{width:10px;height:10px;display:inline-block;border-radius:50%;margin-right:4px;vertical-align:middle}
.dmmapwrap{position:relative;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--paper)}
.dmmap{width:100%;height:100%}
.dmnomap{padding:24px;color:var(--muted);text-align:center}
.dmtoast{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);background:var(--char);color:#fff;padding:8px 14px;border-radius:999px;font-size:13px;opacity:0;pointer-events:none;transition:opacity .2s;z-index:20;max-width:90%}
.dmtoast.show{opacity:1}
.dmtoast.bad{background:var(--deepred)}
.dmsel{overflow:auto;flex:1;min-height:120px}
.dmsel-head{display:flex;gap:8px;padding:10px;border-bottom:1px solid var(--line)}
.dmcand{display:flex;gap:8px;align-items:center;padding:8px 10px;border-bottom:1px solid var(--line);font-size:13px}
.dmcand-main{flex:1;min-width:0}
.dmcand .btn{width:auto;flex:0 0 auto;margin:0;padding:6px 10px;font-size:12px;white-space:nowrap}
.dmassignopts{display:flex;gap:6px;padding:8px 10px;border-top:1px solid var(--line)}
.dmassignopts input{flex:1;min-width:0;font-size:13px;padding:6px 8px}
.dmmoves{overflow:auto;max-height:200px;padding:4px 10px 8px;font-size:13px}
.dmmove{display:flex;justify-content:space-between;align-items:center;gap:6px;padding:5px 0;border-bottom:1px dashed var(--line)}
.dmdialog{border:1px solid var(--line);border-radius:12px;padding:14px;max-width:560px;width:92vw;background:var(--card);color:var(--ink);margin:auto}   /* [v1.62.0] 전역 *{margin:0}이 dialog 가운데 정렬을 지워 왼쪽 위에 붙던 것 */
.dmdialog::backdrop{background:rgba(0,0,0,.35)}
.dmerp{white-space:pre-wrap;font-size:13px;margin-top:8px;max-height:60vh;overflow:auto;background:var(--paper);padding:10px;border-radius:8px}
@media (max-width:1100px){.dmwrap{grid-template-columns:1fr;height:auto}.dmmap,.dmmapwrap{height:60vh}.dmside,.dmpanel{max-height:40vh}}

.dmpick{display:block;width:100%;text-align:left;background:var(--card);border:0;border-bottom:1px solid var(--line);padding:8px 10px;font-size:13px;color:var(--ink);cursor:pointer}
.dmpick:hover{background:var(--paper)}

/* ── [v1.59.0 시안 v4 제안 2] 관리자 — 확인할 일 · 기사 패널 · 오늘 배차 · 월말 체크리스트 · 바로 찾기 ── */
.todochips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px}
.todochips .tc{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--card);
  border-radius:10px;padding:7px 10px;font-size:13.5px;font-weight:600;color:var(--ink)}
.todochips .tc b{font-size:15px;font-variant-numeric:tabular-nums}
.todochips .tc.hot{border-color:var(--deepred);background:var(--chip);color:var(--deepred)}
.todochips .tc.warn{border-color:var(--warn)}
.todochips .tc .go{color:var(--muted)}
.todochips .ttl{align-self:center;font-weight:800;font-size:14px;margin-right:4px}
.kpigrid.k7{grid-template-columns:repeat(4,minmax(0,1fr))}  /* [v1.60.2] 좁은 화면에서 칸이 글자 폭 때문에 넘치지 않게 */
@media (min-width:900px){.kpigrid.k7{grid-template-columns:repeat(7,1fr)}}
.bdtable td.nm .drv{cursor:pointer;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}
.bdtable td.nm .drv:hover{color:var(--deepred)}
.drvpanel{position:fixed;top:0;right:0;bottom:0;width:min(460px,100%);z-index:45;background:var(--card);
  border-left:1px solid var(--line);box-shadow:-12px 0 32px rgba(42,34,32,.18);overflow-y:auto;
  padding:14px 14px calc(18px + env(safe-area-inset-bottom))}
.drvpanel .dp-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:6px}
.drvpanel .dp-head h3{font-size:17px;font-weight:800;margin:0}
.drvpanel .dp-links{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0 10px}
.drvpanel .dp-tabs{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:10px}
.drvpanel .dp-tabs button{border:0;background:none;padding:8px 10px;font:inherit;font-size:14px;font-weight:700;
  color:var(--muted);border-bottom:2.5px solid transparent;cursor:pointer}
.drvpanel .dp-tabs button.on{color:var(--deepred);border-bottom-color:var(--deepred)}
.drvpanel .dp-pane .fld label{font-size:13px}
.dtsteps{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 10px}
.dtsteps .dts{border:1px solid var(--line);border-radius:999px;padding:5px 12px;font-size:13px;font-weight:700;color:var(--muted);background:var(--card)}
.dtsteps .dts.done{border-color:var(--ok);color:var(--ok);background:var(--okbg)}
.erptable tr.rowwarn td{background:var(--chip)}
pre.erplist{white-space:pre-wrap;margin:8px 12px;padding:10px;background:var(--soft);border-radius:8px;font:inherit;font-size:13.5px;line-height:1.6}
.ck2{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);background:var(--card);border-radius:12px;padding:12px;margin-bottom:8px}
.ck2.done{border-color:var(--ok)}
.ck2 .ckn{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:800;background:var(--soft);color:var(--muted)}
.ck2.done .ckn{background:var(--okbg);color:var(--ok)}
.ck2 .bd{flex:1;min-width:0}
.ck2 .acts{display:flex;flex-direction:column;gap:6px;align-items:flex-end}
.ck2 .cklist{margin:6px 0;display:grid;gap:3px;font-size:13.5px}
@media (max-width:720px){.ck2{flex-wrap:wrap}.ck2 .acts{width:100%;align-items:stretch}}
.gsearch{position:relative;flex:1;max-width:340px;min-width:160px}
.gsearch input{width:100%;border:1px solid var(--line);border-radius:9px;padding:6px 10px;font:inherit;font-size:13.5px;background:var(--card);color:var(--ink)}
.gsearch .gdrop{position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:60;background:var(--card);border:1px solid var(--line);
  border-radius:10px;box-shadow:0 10px 28px rgba(42,34,32,.18);max-height:60vh;overflow-y:auto}
.gsearch .gdrop .h{padding:6px 10px 2px;font-size:11.5px;font-weight:800;color:var(--muted)}
.gsearch .gdrop a{display:flex;justify-content:space-between;gap:10px;padding:7px 10px;font-size:13.5px}
.gsearch .gdrop a:hover,.gsearch .gdrop a.on{background:var(--soft)}
.gsearch .gdrop .sub{color:var(--muted);font-size:12px}

/* [v1.59.0] 표 일괄 편집 — 바뀐 줄 표시 */
tr.dirty > td { background: var(--reqbg); }
[data-row].dirty select, [data-row].dirty input:not([type=hidden]) { border-color: var(--warn); }

/* [v1.59.0] 오늘 코스 = 길안내판 — 순번 · 점포(주소) · 점착 · [T맵][☎] */
.stoprow { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto auto; gap: 8px; align-items: center;
  padding: 8px 0; border-bottom: 1px solid var(--softline); }
.stoprow .sq { width: 24px; height: 24px; border-radius: 50%; background: var(--chip); color: var(--deepred);
  display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; }
.stoprow .nm { min-width: 0; }
.stoprow .nm .ad { display: block; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.stoprow .tm { font-variant-numeric: tabular-nums; }
.stoprow .go { display: inline-flex; gap: 4px; }
.stoprow .go .abtn { min-height: 36px; min-width: 40px; justify-content: center; }
.stoprow.gone .nm b, .stoprow.gone .tm { text-decoration: line-through; color: var(--muted); }
.stoprow.gone .sq { background: var(--soft); color: var(--muted); }
/* [v1.66.0 A안] 다음 점포 · 지난 점포 · 🧭 바로 안내 · 카드 안 코스 지도 */
.stoprow.st-next .sq { background: var(--red); color: #fff; }
.stoprow.st-done .sq { background: var(--soft); color: var(--muted); }
.stoprow.st-done .nm b { color: var(--muted); }
.stoprow .go .abtn.navgo { background: #2F6BD8; border-color: #2F6BD8; color: #fff; font-weight: 800; white-space: nowrap; }
.stoprow .go .abtn.navgo.dim { background: var(--soft); border-color: var(--line); color: var(--muted); font-weight: 700; }
.stoprow.flash { animation: stopflash 1.6s ease-out; }
@keyframes stopflash { 0% { background: #FFF1C9; } 100% { background: transparent; } }
#movesCard .abtn.navgo { background: #2F6BD8; border-color: #2F6BD8; color: #fff; font-weight: 800; white-space: nowrap; }
.cmapbtn { white-space: nowrap; font-weight: 700; }
.cmapbtn.on { background: var(--char); border-color: var(--char); color: #fff; }
.cmapbox { margin-top: 8px; }
.cmapframe { display: block; width: 100%; height: 230px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); }
.cmaplegend { margin-top: 5px; }
.cmaplegend .dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; margin: 0 3px 0 4px; vertical-align: -1px; }
.cmaplegend .dot.next { background: var(--red); } .cmaplegend .dot.done { background: #B5AAA8; } .cmaplegend .dot.got { background: #2F6BD8; }

/* [v1.59.0 시안 v4 제안 3-①] 기사 화면 글자 · 누르는 곳 키우기 — 장갑 낀 손·햇빛 아래·노안.
   기사 화면(아래 탭이 있는 body.hastabs)에만 — 관리자 PC 화면은 그대로. 손가락 대상 최소 44px. */
body.hastabs { font-size: 16px; }
body.hastabs .small { font-size: 14px; }
body.hastabs .kv { font-size: 15.5px; padding: 6px 0; }
body.hastabs .btn { min-height: 52px; font-size: 17px; }
body.hastabs .btn.ghost { min-height: 46px; font-size: 15px; }
body.hastabs .abtn { min-height: 40px; padding-left: 12px; padding-right: 12px; font-size: 14px; }
body.hastabs .fld label { font-size: 14px; }
body.hastabs .fld input, body.hastabs .fld select { min-height: 48px; font-size: 17px; }
body.hastabs .statuschip { font-size: 14px; padding: 5px 13px; }
body.hastabs .sheet .kbtn { min-height: 56px; font-size: 17px; }
body.hastabs .linkline { font-size: 15px; padding: 10px 0; }

/* [v1.59.0] 메뉴 묶음 뱃지 — 처리할 건수 */
.gmi .gcnt { margin-left: 4px; min-width: 18px; padding: 0 5px; border-radius: 99px; background: var(--red); color: #fff;
  font-size: 11px; font-weight: 800; line-height: 18px; text-align: center; font-variant-numeric: tabular-nums; }
/* [v1.59.0] 처음 설정 3단계 — 끝낸 단계 */
.todoline.ok { color: var(--ok); }

/* ── [v1.60.0] 기사 일상점검(/check) — 11항목 ○/× 두 버튼, 엄지로 누르기 쉬운 크기 ── */
.vcinfo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:10px 12px}
.vcinfo div{display:flex;flex-direction:column;gap:2px;min-width:0}
.vcinfo span{font-size:11.5px;color:var(--muted)}
.vcinfo b{font-size:13.5px;overflow-wrap:anywhere}
.vcitem{background:var(--card);border:1px solid var(--line);border-radius:11px;padding:10px 12px;margin-bottom:6px}
.vcitem.miss{outline:2px solid var(--red);outline-offset:-1px}
.vclabel{font-size:14px;font-weight:600;line-height:1.4;margin-bottom:8px}
.vcno{display:inline-block;min-width:20px;height:20px;line-height:20px;border-radius:99px;background:var(--soft);
  color:var(--muted);font-size:11.5px;font-weight:800;text-align:center;margin-right:6px}
.vcopts{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.vco{position:relative;display:block;cursor:pointer}
.vco input{position:absolute;opacity:0;width:1px;height:1px}
.vco span{display:block;text-align:center;padding:10px 0;border-radius:9px;border:1px solid var(--line);
  font-weight:800;font-size:14.5px;color:var(--muted);background:var(--paper)}
.vco.ok input:checked + span{background:var(--okbg);border-color:var(--ok);color:var(--ok)}
.vco.bad input:checked + span{background:var(--chip);border-color:var(--deepred);color:var(--deepred)}
.vco input:focus-visible + span{outline:2px solid var(--red);outline-offset:1px}
.vcconfirm{display:flex;gap:10px;align-items:flex-start;background:var(--card);border:1px solid var(--line);
  border-radius:11px;padding:12px;margin:12px 0}
.vcconfirm input{width:22px;height:22px;flex:0 0 auto;margin-top:1px;accent-color:var(--red)}
.vcdone{border-left:4px solid var(--ok)}
.vcdone.bad{border-left-color:var(--deepred)}
.vccal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
.vcd{border:1px solid var(--line);border-radius:6px;padding:3px 0;text-align:center;font-size:11px;background:var(--card)}
.vcd .dd{display:block;color:var(--muted)}
.vcd .mm{display:block;font-weight:800;font-size:13px}
.vcd.ok .mm{color:var(--ok)}
.vcd.bad{background:var(--chip)} .vcd.bad .mm{color:var(--deepred)}
.vcd.off{background:var(--paper)} .vcd.off .mm{color:var(--muted)}
/* [v1.65.0] 일상점검 확인서(PDF) 기간 고르기 */
.vccert .vcpre{margin:10px 0 8px}
.vcrange{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:6px;align-items:center}
.vcrange input{width:100%;min-width:0;min-height:46px;font-size:15px}
.vcrange span{color:var(--muted);font-weight:700}
.vccertinfo{margin:6px 0 8px;font-weight:700;color:var(--char)}
.vccertinfo.err{color:var(--deepred)}
.vcd.missed .mm{color:var(--deepred)}
.vcd.future{opacity:.5}
.vcd.today{outline:2px solid var(--red);outline-offset:-1px}

/* ── [v1.60.0] 관리자 일상점검 월 점검표(서식 격자) · 일간보고 입력표 ── */
.vcgridwrap{overflow-x:auto}
table.vcgrid{border-collapse:collapse;font-size:12px;min-width:980px}
table.vcgrid th,table.vcgrid td{border:1px solid var(--line);padding:3px 2px;text-align:center}
table.vcgrid td.lb{text-align:left;padding:4px 6px;min-width:240px}
table.vcgrid td.cat{font-weight:700;background:var(--paper);min-width:56px}
table.vcgrid th{background:var(--paper);font-weight:700}
table.vcgrid td.x{color:var(--deepred);font-weight:800}
table.vcgrid td.na,table.vcgrid th.na{background:var(--soft)}
table.vcgrid td.miss{background:var(--warnbg)}
table.drt{border-collapse:collapse;width:100%;font-size:13px}
table.drt th,table.drt td{border:1px solid var(--line);padding:4px 5px;vertical-align:middle}
table.drt th{background:var(--paper);font-weight:700;white-space:nowrap;text-align:center}
table.drt td.c{text-align:center}
/* [v1.66.3] 일간보고 줄 삭제 — 줄 끝 작은 ✕(누르면 아래 줄이 올라옴) */
table.drt th.drdelh,table.drt td.drdelc{width:30px;padding:2px}
table.drt .drdel{width:26px;height:26px;padding:0;border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--muted);font:inherit;font-size:12px;line-height:1;cursor:pointer}
table.drt .drdel:hover,table.drt .drdel:focus-visible{color:var(--red);border-color:var(--red)}
/* [v1.66.3] 일간보고 코스 줄 거르기(상온 6 · 저온 6·7) — 숨긴 줄도 폼에 남아 저장된다 */
.drfilt{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;margin:0 0 8px}
.drfilt .chips{gap:4px}
.drfilt .chip{min-height:30px;padding:5px 12px;font:inherit;font-size:13px;font-weight:700;cursor:pointer}
.drfilt select,.drfilt input[type=search]{border:1px solid var(--line);border-radius:7px;padding:5px 8px;font:inherit;font-size:13px;background:var(--card);color:var(--ink)}
.drfilt input[type=search]{width:150px}
.drfchk{display:inline-flex;align-items:center;gap:5px;font-size:13px;color:var(--ink);white-space:nowrap;cursor:pointer}
.drfchk input{width:auto;margin:0}
.drfn{font-size:12.5px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap}
.drfn b{color:var(--ink)}
.drfilt .abtn[data-freset]{min-height:30px;padding:4px 10px;font-size:12.5px}
table.drt tr.drfhide{display:none}
table.drt td.calc{text-align:center;color:var(--muted);background:var(--paper);white-space:nowrap;font-variant-numeric:tabular-nums}
table.drt input,table.drt select,table.drt textarea{width:100%;min-width:0;border:1px solid var(--line);border-radius:6px;
  padding:5px 6px;font:inherit;background:var(--card);color:var(--ink);box-sizing:border-box}
table.drt input.n{text-align:right;font-variant-numeric:tabular-nums}
/* [v1.64.0] 전일 칸 = 앞 보고서에서 자동(고칠 수 없음) — 계산 칸과 같은 바탕 */
table.drt input[readonly]{background:var(--paper);color:var(--muted);border-style:dashed;cursor:default}
table.drt tr.t35 td{background:var(--soft)}
table.drt tr.auto td.lbl::after{content:" ⚙";color:var(--muted);font-size:11px}
.drsec{margin-bottom:14px}
.drsec h3{margin:0;padding:10px 12px;font-size:14.5px}
.drsec .body{padding:0 12px 12px}
.drkv{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px 10px}
.drkv label{display:flex;flex-direction:column;gap:3px;font-size:12.5px;color:var(--muted)}
.drkv label.w2{grid-column:span 2}
.drkv input,.drkv select{border:1px solid var(--line);border-radius:7px;padding:6px 8px;font:inherit;font-size:13.5px;
  background:var(--card);color:var(--ink)}
.drkv .calcv{padding:7px 8px;border-radius:7px;background:var(--paper);color:var(--ink);font-weight:700;font-size:13.5px}
.drauto{font-size:11.5px;color:var(--muted)}
.drdays{display:flex;flex-wrap:wrap;gap:4px}
.drdays a{border:1px solid var(--line);border-radius:6px;padding:2px 7px;font-size:12px;color:var(--muted);background:var(--card)}
.drdays a.on{background:var(--chip);border-color:var(--chip);color:var(--deepred);font-weight:800}
@media (max-width:700px){.drkv label.w2{grid-column:span 1}}
@media (min-width:900px){.kpigrid.k4{grid-template-columns:repeat(4,1fr)}}
.drpair{display:flex;gap:8px}
.drpair label,.drinl{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);white-space:nowrap;flex:1;min-width:0}
.drinl select{flex:1}
table.drt td.c{text-align:center}
table.drt td.n,table.drt th.n{width:90px}

/* ── [v1.60.1] 홈 일상점검 카드 — 큰 버튼 바로 아래 ── */
.vccard{display:flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);
  border-radius:14px;padding:14px 14px;margin:12px 0;color:var(--ink);text-decoration:none}
.vccard .vcic{font-size:26px;line-height:1}
.vccard .vct{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.vccard .vct b{font-size:17px}
.vccard .go{color:var(--muted);font-size:20px}
.vccard.need{border:2px solid var(--warn);background:var(--warnbg)}
.vccard.need .vct b{color:var(--warn)}
.vccard.done{border-left:4px solid var(--ok)}
.vccard.done .vct b{color:var(--ok)}
.vccard.done.bad{border-left-color:var(--deepred)}
.vccard.done.bad .vct b{color:var(--deepred)}

/* ── [v1.60.2 사용자 지적 "화면이 엉키는 거 같은데"] 휴대폰 폭 관리자 메뉴 줄 ──
   검색칸(최소 160px)·긴급 뱃지·설명서·로그아웃이 한 줄에 붙어 화면보다 넓어지면, 메뉴(오늘·코스·배정…)는
   폭 0으로 줄어 사라지고 화면 전체가 옆으로 밀렸다(360px 화면에 내용 513px). 좁은 화면에서는 두 줄로 나눈다:
   위 = 메뉴(옆으로 밀어 보기), 아래 = 검색 · 뱃지 · 설명서 · 로그아웃(검색칸이 남는 폭을 채움). */
@media (max-width:760px){
  .gnb{flex-wrap:wrap;gap:0;padding:0 8px}
  .gnb-menu{flex:1 1 100%;order:1}
  .gnb-right{flex:1 1 100%;order:2;flex-wrap:wrap;gap:6px;padding:6px 0 8px;border-top:1px solid var(--line)}
  .gsearch{flex:1 1 140px;min-width:0;max-width:none}
}
/* 기사 화면(아래 탭)은 기사가 보는 그대로 — 관리자 계정으로 열어도 관리자 메뉴 줄을 두지 않는다
   (위 오른쪽 [대시보드]로 돌아간다). 기사 화면 위에 관리자 줄이 겹쳐 엉켜 보이던 것. */
body.hastabs.hasgnb .gnb{display:none}

/* ── [v1.61.0 사용자 지시 2026-10-10] 대시보드 숫자 카드 = 누르면 그 사람만 · 관리구분 칸 접기 ── */
button.kpicard{font:inherit;color:inherit;text-align:left;cursor:pointer;width:100%}
button.kpicard:hover{border-color:var(--char)}
button.kpicard.on{border-color:var(--red);box-shadow:0 0 0 2px rgba(217,32,31,.18)}
.lamp.pre{background:transparent;border:2.5px solid var(--warn);box-sizing:border-box}
.kpfbar{display:flex;align-items:center;gap:8px;margin:-4px 0 10px;font-size:13px;font-weight:700;color:var(--deepred)}
button.bdfold,button.bffold{display:flex;align-items:center;gap:6px;width:100%;background:none;border:0;padding:4px 0;
  font-family:inherit;text-align:left;cursor:pointer}
/* [v1.61.1 사용자 지적 "화살표가 작다"] 누르기 쉬운 크기로 — 둥근 칸 안의 큰 화살표 */
button.bdfold .fold,button.bffold .fold{display:inline-flex;align-items:center;justify-content:center;flex:none;
  width:26px;height:26px;border-radius:7px;font-size:17px;line-height:1;color:var(--deepred);
  background:var(--chip);border:1px solid var(--line)}
.bdsec.folded .bdtable{display:none}
.bdsec.folded{padding-top:8px;padding-bottom:8px}
.foldbar{display:flex;align-items:center;gap:6px;justify-content:flex-end;margin:0 0 6px}
.foldbar .small{margin-right:auto}
/* 브리핑 = 명단과 같은 카드(제목 버튼 · 펼치면 표). 카드 안의 표는 테두리 없이 */
.bfsec{padding-bottom:10px}
.bfsec.folded{padding-top:8px;padding-bottom:8px}
.bfsec.folded .briefwrap{display:none}
.bfsec .briefwrap{margin:6px 0 0;border:0;border-radius:0;box-shadow:none;padding:0}
/* 상온 / 저온 큰 제목 — 묶음들 위에 한 번 */
.parthead{display:flex;align-items:baseline;gap:8px;margin:14px 0 6px;padding:2px 0 4px 10px;
  border-left:4px solid var(--red);border-bottom:1px solid var(--line)}
.parthead b{font-size:17px;font-weight:900;color:var(--ink)}
.parthead span{font-size:13px;color:var(--muted);font-weight:700}
#sections .parthead:first-child,.foldbar+#sections .parthead:first-child{margin-top:4px}
/* ── [v1.61.0] 오늘 › 지원배송 (배차 지도 틀 재사용) ── */
.spwrap .dmside{overflow:hidden}
/* [v1.61.3 사용자 지적 "지원기사는 많아봐야 3~4명 — 아래로"] 지원기사 칸 = 내용만큼(4명까지 보이고 넘치면 스크롤), 맨 아래에 붙이고
   기사·코스 목록이 나머지 높이를 다 쓴다(종전 6:4로 나눠 지원기사가 사이드 절반 높이에서 시작했다) */
.spwrap #spGivers{flex:1 1 auto;min-height:0}
.spwrap .sphelpers{flex:0 0 auto;max-height:148px;border-top:0}          /* 한 줄 34px × 4명 */
.sphrow{align-items:center}
.sphrow .dot{margin-top:0}
.sph1{display:flex;align-items:center;gap:6px;white-space:nowrap;overflow:hidden;min-height:21px}
.sph1 b{overflow:hidden;text-overflow:ellipsis}
.sph1 .pill{padding:1px 7px;font-size:11px;line-height:1.5;flex:none}
.sph1 .sphst{margin-left:auto;flex:none;font-size:12px}
.spwrap .dmside-h.sphelpers-h{border-top:1px solid var(--line);margin-top:0!important}
.spgrp{padding:4px 8px;font-size:11.5px;font-weight:800;color:var(--muted);background:var(--paper);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:1}
.sprow.on,.sphrow.on{background:rgba(217,32,31,.07);box-shadow:inset 3px 0 0 var(--red)}
.dmrow .dot,.dmsel-head .dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none;margin-top:4px}
.spstores{border-top:1px solid var(--line)}
.spst{display:flex;gap:8px;align-items:center;padding:6px 10px;border-bottom:1px solid var(--line);font-size:13px;cursor:pointer}
.spst:hover{background:var(--paper)}
.spst.done{cursor:default;background:rgba(47,107,216,.06)}
.spst input{width:18px;height:18px;flex:none;margin:0}
.spst .sq{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;border-radius:50%;background:var(--char);color:#fff;font-size:11px;font-weight:700;flex:none}
.spst-m{flex:1;min-width:0}
.spst .abtn{flex:none}
.spgive{padding:8px 10px;border-top:2px solid var(--line);display:flex;flex-direction:column;gap:6px;position:sticky;bottom:0;background:var(--card)}
.spgive .dmassignopts{padding:0;border:0}
.spgive select{width:100%}
.spgive .btn{margin:0}
/* ── [v1.61.0] 근무 달력(기사 × 날짜) ── */
.wcwrap{max-height:70vh}
table.wcal{border-collapse:separate;border-spacing:0;font-size:12px;min-width:100%}
table.wcal th,table.wcal td{border-bottom:1px solid var(--line);border-right:1px solid var(--line);padding:0;text-align:center;height:26px}
table.wcal thead th{position:sticky;top:0;background:var(--card);z-index:2;font-weight:700;line-height:1.1;padding:3px 0;min-width:26px}
table.wcal thead th span{font-size:10px;color:var(--muted);font-weight:400}
table.wcal th.sun{color:var(--red)} table.wcal th.sat{color:#2F6BD8}
table.wcal th.hol{background:#F3EEEC} table.wcal th.today{box-shadow:inset 0 -3px 0 var(--red)}
table.wcal .wcname{position:sticky;left:0;background:var(--card);z-index:1;text-align:left;padding:0 8px;white-space:nowrap;font-weight:700;min-width:96px}
table.wcal thead .wcname{z-index:3}
table.wcal tr.wcgrp td{background:var(--paper);text-align:left;padding:3px 8px;font-weight:800;color:var(--muted);font-size:11.5px;position:sticky;left:0}
table.wcal td.wc{cursor:pointer;min-width:26px}
table.wcal td.wc:hover{background:rgba(217,32,31,.08)}
table.wcal td.off{background:#FCE3E1;color:var(--deepred);font-weight:800}
table.wcal td.hol{background:#ECE6E4;color:var(--muted);cursor:not-allowed}
table.wcal td.sun{background:#F4F1F0;color:#B7ACA9;cursor:not-allowed}
table.wcal td.work{color:var(--ok);font-size:10px}
table.wcal td.busy{opacity:.4}
table.wcal tfoot td{position:sticky;bottom:0;background:var(--card);font-weight:700;color:var(--deepred)}
table.wcal .wcsum{color:var(--deepred);font-weight:700;min-width:26px}
@media (prefers-color-scheme: dark){table.wcal td.off{background:#4A2220;color:#FFB4AE}
  table.wcal td.hol,table.wcal td.sun,table.wcal th.hol{background:#2B211F}}

/* ── [v1.61.0] 코스 입력 · 점포 등록 · 점포코드 관리 지도(storemap.js) ── */
/* 지도는 표 위에(표가 넓어 옆에 두면 칸이 좁아진다) — DOM은 표 다음이라 order로 올린다 */
.smapgrid{display:flex;flex-direction:column;gap:10px}
.smapgrid .smapbox{order:-1}
.smapbox{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--card)}
.smapbox .smap{height:380px;background:var(--paper)}
.smapbox.smpick .smap{height:340px}
.smapbox .smapinfo{padding:6px 10px;border-top:1px solid var(--line);min-height:20px}
.smapbox .smpickform{padding:6px 10px 10px}
.smapbox .smpickform .btn{margin:0}
tr.smrow{cursor:pointer}
tr.smhl td{background:rgba(217,32,31,.08)!important}
.spwrap{height:calc(100vh - 200px);min-height:600px}
.spwrap .dmmoves{max-height:110px}
/* [v1.61.1] 명단·브리핑 묶음 카드 = 같은 크기·같은 제목 글자 */
.bfsec{padding:8px 10px;margin-bottom:8px}
button.bdfold,button.bffold{font-size:14px;font-weight:800;color:var(--deepred)}
button.bdfold .bdn,button.bffold span{font-variant-numeric:tabular-nums}
.bdmain #sections button.bdfold{font-size:14px}           /* .bdmain .cardttl(12.5px)보다 우선 — 브리핑 제목과 같은 크기 */
.bdmain>#sections>.card.bdsec,.bfsec{padding:6px 10px}
.secttl.withact>.abtn+.abtn{margin-left:0}

/* ── [v1.61.1 사용자 지시 "점포 등록·점포코드 관리는 표를 줄여 지도와 좌우로"] ── */
@media (min-width:1100px){
  /* [v1.61.2 사용자 지적] 표 상자와 지도 상자의 위·아래 줄을 맞춘다 — 같은 높이, 표는 그 안에서 스크롤 */
  .smapgrid.side{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(400px,1fr);gap:10px;
    height:calc(100vh - 190px);min-height:520px}
  .smapgrid.side>.smscroll{height:100%;max-height:none;overflow:auto;margin:0}
  .smapgrid.side>.smapbox{order:0;height:100%;display:flex;flex-direction:column}
  .smapgrid.side>.smapbox .smap{flex:1 1 auto;height:auto;min-height:300px}
  .smapgrid.side .smscroll thead th{position:sticky;top:0;z-index:1}
}
table.smcompact th,table.smcompact td{padding:5px 7px;font-size:12.5px}
table.smcompact td.nm{max-width:130px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
table.smcompact td.addr{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}
table.smcompact td.addr .rg{color:var(--ink);font-weight:700}
table.smcompact td.memo{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
table.smcompact td.crs{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11.5px}
table.smcompact td.ph{text-align:center}
table.smcompact .abtn{padding:2px 8px;min-height:0;font-size:12px}

/* ── [v1.61.2 사용자 지시] 대시보드: 오른쪽 위젯 옆 빈자리에 시각 수정 신청, 명단을 펼치면 아래는 전체 폭 ── */
.bdflow>.bdmain{order:1}.bdflow>.bdafter{order:2}.bdflow>.bdside{order:3}   /* 휴대폰 폭(그리드 한 줄): 종전 순서 */
@media (min-width:1080px){
  .bdgrid.bdflow{display:block}
  .bdflow>.bdside{float:right;width:330px;margin:0 0 10px 12px}
  .bdflow::after{content:"";display:block;clear:both}
  .bdflow .card,.bdflow .secttl{display:flow-root}         /* 띄운 위젯과 겹치지 않고 옆에선 좁게, 아래에선 전체 폭 */
  .bdflow .secttl.withact{display:flex}
  .bdflow>.bdafter{margin-top:6px}
}

/* ── [v1.61.2 사용자 지적] 점포 표: 칸 너비 고정(스크롤바에 [수정]이 가리지 않게) · 줄 높이 통일(☎ 줄만 높던 것) · 하이라이트 진하게 ── */
table.smcompact{width:100%;table-layout:fixed}
table.smcompact th.w-ct{width:44px}
table.smcompact th.w-code{width:64px}
table.smcompact th.w-name{width:22%}
table.smcompact th.w-ph{width:34px;text-align:center}
table.smcompact th.w-memo{width:13%}
table.smcompact th.w-crs{width:17%}
table.smcompact th.w-st{width:62px}
table.smcompact th.w-act{width:62px}
table.smcompact td{height:34px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}
table.smcompact td.nm,table.smcompact td.addr,table.smcompact td.memo,table.smcompact td.crs{max-width:none}
table.smcompact a.tel{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;
  padding:0;margin:0;border:0;min-height:0;font-size:14px;line-height:1;vertical-align:middle}
table.smcompact .pill{padding:1px 7px;font-size:11px;line-height:1.5}
table.smcompact td.acts{padding-right:10px}
table.smcompact td.acts form{display:inline}
tr.smhl td{background:#FFE9A8!important;font-weight:800}
tr.smhl td:first-child{box-shadow:inset 5px 0 0 var(--red)}
@media (prefers-color-scheme: dark){tr.smhl td{background:#5A4410!important}}
table.smcompact th.w-ph{width:40px}
table.smcompact td.ph{padding:0;text-overflow:clip}

/* ── [v1.61.2] 저온 일간보고 — 사유 3줄 · 출고원가 표 · 온도 준수 O/X ── */
.drstack{display:flex;flex-direction:column;gap:4px}
.drstack label{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);white-space:nowrap}
.drstack label input{flex:1}
table.drperf input.n{min-width:64px}
table.drperf th{font-size:12px}
table.drtemp th{font-size:12px}
table.drt select.ox{width:52px;text-align:center;font-weight:700}
table.drt select.ox.x{color:var(--red);border-color:var(--red);font-weight:900}

/* ── [v1.61.5] 로컬 테스트 서버 띠(SITE_BANNER) — 운영엔 없다 ── */
.sitebanner{background:#FFE066;color:#3A2E00;font-size:12.5px;font-weight:800;text-align:center;padding:4px 10px;
  border-bottom:1px solid #E6C200;letter-spacing:.02em}

/* ── [v1.62.0] 배차 보드 — 기사 카드 사이로 점포 칩 끌어 놓기 (dboard.js) ── */
/* [v1.62.1 사용자 지적 "좌우 여백이 왜 이렇게 많아"] 배차 보드가 보이는 동안은 관리자 최대 폭(1400px)을 풀고 화면 폭 전부 */
.dbhint{margin:0 0 6px}
/* [v1.62.4 사용자 지적 "아직도 직관적이지 않다"] 안내 = 번호 3단계 + 실제 모양 범례(문단을 읽지 않아도 보이게) */
.dbguide{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px;margin:0 0 8px;padding:7px 10px;border:1px solid var(--line);border-radius:10px;background:var(--offbg);font-size:13px}
.dbsteps{display:flex;flex-wrap:wrap;gap:4px 16px;margin:0;padding:0;list-style:none;counter-reset:dbs}
.dbsteps li{counter-increment:dbs;display:flex;align-items:baseline;gap:5px}
.dbsteps li::before{content:counter(dbs);display:inline-grid;place-items:center;width:19px;height:19px;border-radius:50%;background:var(--ink);color:var(--card);font-size:11px;font-weight:700;flex:none;align-self:center}
.dbsteps li span{color:var(--muted);font-size:12px}
.dblegend{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center;color:var(--muted);font-size:12px;width:100%;padding-top:6px;border-top:1px dashed var(--line)}
.dblegend>span{display:inline-flex;align-items:center;gap:4px}
.dblegend i{font-style:normal}
.dblegend .dbchip,.dblegend .dwchip{cursor:default;color:var(--ink)}
.dblegend .dwchip{color:#fff}
.dblegend .dwchip.sub{color:#fff}
.lgbar{display:inline-block;width:70px}
.lgbar .dbbar{display:block}
.lgchg{display:inline-block;width:22px;height:14px;outline:2px dashed #2F6BD8;outline-offset:-2px;border-radius:2px}
.dbbwarn{width:100%;font-weight:600}
.dbbwarn span{font-weight:400;font-size:12px}
.dbwrap{display:grid;grid-template-columns:minmax(0,960px) minmax(420px,1fr);gap:8px;height:calc(100vh - 270px);min-height:560px}   /* [v1.62.1 사용자 지시 "카드는 4개까지, 지도를 키워"] 카드 칸 최대 960px(카드 220px 이상 × 4장) · 남는 폭 전부 지도 · 높이는 dboard.js가 화면 끝까지 */
.dbwrap.nomap{grid-template-columns:minmax(0,1fr)}
.dbwrap.nomap .dbside{display:none}
.dbmain{overflow:auto;border:1px solid var(--line);border-radius:10px;background:var(--paper);padding:8px;min-height:0}
.dbsec-h{display:flex;align-items:center;gap:6px;font-weight:700;font-size:13px;margin:2px 0 6px}
.dbsec-h .small{font-weight:400}
.dbsec-h select{margin-left:auto;height:28px;font-size:12px;max-width:240px;padding:0 6px}
.dbsec-h #dbAddBtn2{height:28px;font-size:12px;padding:0 10px}
.dbgrid,.dbhelpers{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;align-items:start}
.dbhelpers{margin-bottom:10px}
/* [v1.62.4] 지원기사 줄 = 카드 영역 위에 고정(아래 카드에서도 바로 끌어 놓게) · 너무 길면 그 안에서 스크롤 */
.dbhelpzone{position:sticky;top:-8px;z-index:5;background:var(--paper);margin:-8px -8px 6px;padding:8px 8px 2px;border-bottom:1px solid var(--line);max-height:42vh;overflow:auto}
.dbx{margin-left:auto;border:0;background:none;color:var(--muted);font-size:14px;cursor:pointer;padding:0 4px;line-height:1}
.dbx:hover{color:var(--deepred)}
.dbsend{position:fixed;z-index:1200;width:300px;background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.18);padding:8px;font-size:13px}
.dbsend .h{display:flex;align-items:center;gap:6px}
.dbsend>button{display:flex;justify-content:space-between;width:100%;text-align:left;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:6px;padding:5px 8px;margin-top:4px;cursor:pointer;font:inherit}
.dbsend>button:hover:not([disabled]){background:var(--infobg)}
.dbsend>button[disabled]{opacity:.5;cursor:not-allowed}
.dbsend>button i{font-style:normal;color:var(--muted);font-size:12px}
.dbsend select{flex:1;min-width:0;height:30px;font-size:12px}
.dbsend .row button{border:1px solid var(--line);background:var(--card);border-radius:6px;padding:0 10px;height:30px;cursor:pointer}
.dbsendsec{margin:8px 0;padding:8px 10px;border:1.5px solid #2F6BD8;border-radius:8px;background:var(--infobg)}
.dbsendsec h4{margin:0 0 6px;font-size:14px}
.dbsendsec h4 .small{font-weight:400}
.dbsendsec select{height:32px;font-size:13px;max-width:320px}
.dbsendlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:2px 10px;margin-top:6px;max-height:180px;overflow:auto}
.dbsendlist label{font-size:13px;display:flex;align-items:center;gap:4px}
.dbsendlist label.moved{opacity:.55}
/* [v1.62.4 사용자 지적 "정렬 꼭 이따위로"] 빈 지원기사 칸 = 카드 칸 하나가 아니라 줄 전체 폭 한 줄(가운데) */
.dbhelpempty{grid-column:1/-1;display:block;padding:10px 12px;line-height:1.4;border:1.5px dashed var(--line);border-radius:10px;color:var(--muted);font-size:13px;text-align:center}
.dbhelpempty b{color:var(--ink);font-weight:600;margin:0 3px}
.dbcard{position:relative;background:var(--card);border:1px solid var(--line);border-left:4px solid var(--cc,#999);border-radius:10px;padding:7px 8px;min-width:0}
.dbcard.helper{border-left-color:#2F6BD8;background:var(--infobg)}
.dbcard.st-absent{background:var(--chip);border-color:var(--red);border-left-color:var(--red)}
.dbcard.st-rest,.dbcard.st-nodrv{background:var(--offbg)}
.dbcard.over{border-color:var(--red)}
.dbcard.rec{outline:2px solid #2F6BD8;outline-offset:1px}
.dbcard.rec::after{content:attr(data-rank);position:absolute;top:-9px;right:8px;background:#2F6BD8;color:#fff;font-size:11px;padding:0 7px;border-radius:999px;line-height:17px}
.dbcard.hov{background:var(--infobg);outline:3px solid #2F6BD8;outline-offset:1px}
.dbcard{cursor:pointer}
.dbcard.pinned{box-shadow:0 0 0 3px var(--cc,#2F6BD8);background:var(--card)}
.dbcard.helper.pinned{box-shadow:0 0 0 3px #2F6BD8}
.dbcard.nodrop{opacity:.45}
.dbcard.src{outline:2px dashed var(--muted)}
.dbch{display:flex;align-items:center;gap:4px;font-size:14px;min-width:0}
.dbch b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:none;max-width:45%}
.dbch .lamp{margin-right:2px}
.dbcode{color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
.dbbadge{font-size:11px;padding:0 6px;border-radius:999px;white-space:nowrap;flex:none;line-height:17px}
.dbbadge.b-absent,.dbbadge.b-over{background:var(--red);color:#fff}
.dbbadge.b-rest,.dbbadge.b-nodrv{background:var(--soft);color:var(--muted)}
.dbbadge.b-sup{background:#2F6BD8;color:#fff}
.dbload{display:flex;align-items:center;gap:6px;margin:5px 0 4px}
.dbbar{position:relative;flex:1;height:6px;background:var(--soft);border-radius:3px}
.dbbar i{position:absolute;left:0;top:0;bottom:0;background:var(--ok);border-radius:3px}
.dbbar i.over{background:var(--red)}
.dbbar s{position:absolute;left:65%;top:-3px;bottom:-3px;width:2px;background:var(--ink);opacity:.55}
.dbpct{font-size:13px;font-variant-numeric:tabular-nums;min-width:50px;text-align:right}
.dbpct.over{color:var(--deepred);font-weight:700}
input.dberp{width:78px;padding:2px 5px;font-size:12px;height:24px;min-height:0}
.dbneed{font-size:12px;color:var(--deepred);margin:4px 0 5px;font-weight:600}
.dbchips{display:flex;flex-wrap:wrap;gap:3px}
.dbchip{display:inline-flex;align-items:center;gap:3px;font-size:13px;line-height:1.3;padding:2px 7px;border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--ink);cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;max-width:100%}
.dbchip b{color:var(--muted);font-weight:600;font-size:12px}
.dbchip em{font-style:normal;color:var(--muted);font-size:12px;font-variant-numeric:tabular-nums}
.dbchip.in{background:var(--infobg)}
.dbchip.sup{background:var(--card);border-color:#2F6BD8}
.dbchip.draft{border:1.5px dashed #2F6BD8}
.dbchip.need{border-color:var(--red);color:var(--deepred)}
.dbchip.sel{box-shadow:0 0 0 3px #FFD400}
.dbchip.fail{border-color:var(--red);background:var(--chip)}
.dbhelpbtn{font-weight:700;color:var(--deepred);text-decoration:underline}   /* [v1.62.4] 남은 점포 → 지원기사 배정 */
#dbHelperAdd.flash{outline:3px solid #FFD400;outline-offset:1px}
/* [v1.62.4 사용자 지적 "체크 버튼을 좀 가까이 붙여야지"] 문자 보내기 체크 = 글자 바로 옆(.row의 space-between이 양 끝으로 벌려 놓았다) */
.smsbox{display:inline-flex;align-items:center;justify-content:flex-start;gap:6px;margin-top:8px;font-size:14px;cursor:pointer}
.smsbox input{width:18px;height:18px;margin:0;flex:none}
/* [v1.62.4] 결근 분배·자동 배차안 팝업 · 분배 도우미 팝업 */
table.dbpop td,table.dbpop th{padding:6px 8px;font-size:13px;vertical-align:middle}
table.dbpop td.num.bad{color:var(--deepred);font-weight:700}
.dbplanleft{margin-top:8px;padding:8px 10px;border:1.5px solid var(--red);border-radius:8px;background:var(--chip);color:var(--deepred);font-size:13px;line-height:1.5}
.dbhelpsec{margin-top:10px}
.dbhelpsec h4{margin:0 0 6px;font-size:14px}
.dbhelpsec h4 .small{font-weight:400}
.dbwd{display:flex;flex-wrap:wrap;gap:4px;margin:2px 0 4px}
.dbwd span{font-size:12px;padding:1px 7px;border-radius:10px;background:var(--offbg);color:var(--muted)}
.dbwd span.over{background:var(--chip);color:var(--deepred);font-weight:700}
.dbchip.lifted{opacity:.3}
.dbdot{width:8px;height:8px;border-radius:50%;flex:none}
.dbghost{position:fixed;z-index:1000;pointer-events:none;flex-wrap:wrap;max-width:360px;box-shadow:0 6px 18px rgba(0,0,0,.28);cursor:grabbing}
.dbghost-i{flex-basis:100%;font-size:12px;color:#2F6BD8;font-weight:700;margin-top:3px;white-space:normal}
.dbghost-i.bad{color:var(--deepred)}
body.dbdragging,body.dbdragging *{cursor:grabbing!important;user-select:none!important}
.dbside{display:grid;grid-template-rows:minmax(0,7fr) minmax(0,3fr);gap:8px;min-height:0}
.dbmapwrap{min-height:0}
.dbchanges{border:1px solid var(--line);border-radius:10px;background:var(--card);display:flex;flex-direction:column;min-height:0}
/* [v1.62.4] 변경 목록 = 보드 아래 전체 폭 띠(높이 고정 · 안에서 스크롤 · 여러 줄로) — 지도는 오른쪽 칸 전체 */
.dbchbar{margin-top:8px;height:150px}
.dbwrap,.dbbwrap{min-height:420px}

/* ── [v1.62.4 사용자 지시 "배차 보드 전체적으로 여백이 왜 이렇게 커 — 아예 여백 거의 없게"] 배차 보드가 보이는 동안만 ── */
.dbchbar .dbchlist{display:grid;grid-template-columns:repeat(auto-fill,minmax(420px,1fr));align-content:start}
.dbwrap .dbside{grid-template-rows:minmax(0,1fr)}
.dbchlist{overflow:auto;flex:1}
.dbchrow{display:flex;align-items:center;gap:6px;padding:5px 8px;border-bottom:1px solid var(--softline);font-size:12px;cursor:pointer}
.dbchrow.draft{background:var(--infobg)}
.dbchrow.fail{background:var(--chip)}
.dbwhat{flex:none;font-size:11px;padding:0 6px;border-radius:999px;background:var(--okbg);color:var(--ok);line-height:17px}
.dbchrow.draft .dbwhat{background:#2F6BD8;color:#fff}
.dbchtxt{flex:1;min-width:0}
.dbchrow .abtn{padding:2px 8px;font-size:12px;flex:none}
.dbfail{color:var(--deepred)}
ul.dbconfirm{max-height:50vh;overflow:auto;font-size:13px;padding-left:18px;margin:6px 0}
#dbOk.pulse{animation:dbpulse 1.6s infinite}
@keyframes dbpulse{50%{box-shadow:0 0 0 5px rgba(217,32,31,.28)}}
@media (max-width:1100px){.dbwrap{grid-template-columns:1fr;height:auto}.dbmain{overflow:visible}.dbside{grid-template-rows:auto auto}.dbmapwrap{height:50vh}.dbchanges{max-height:40vh}}
@media (prefers-color-scheme: dark){.dbchip.sel{box-shadow:0 0 0 3px #C9A400}}

/* ── [v1.62.2] 배차 보드 위 탭 3개 · 옮긴 기능 · 주간 배정(dweek.js) · 기본 코스(dbase.js) ── */
.dbmodes{display:flex;gap:6px;margin:0 0 8px;flex-wrap:wrap}
.dbmode{display:flex;flex-direction:column;gap:1px;padding:7px 14px;border:1px solid var(--line);border-radius:10px;background:var(--card);color:var(--ink);text-decoration:none;font-weight:700;font-size:14px}
.dbmode span{font-weight:400;font-size:11px;color:var(--muted)}
.dbmode.on{border-color:var(--red);box-shadow:inset 0 -3px 0 var(--red)}
.dbmode.base.on{border-color:#8A5A00;box-shadow:inset 0 -3px 0 #B77700}
.dbmore{position:relative}
.dbmore>summary{list-style:none;cursor:pointer}
.dbmore>summary::-webkit-details-marker{display:none}
.dbmenu{position:absolute;right:0;top:calc(100% + 4px);z-index:40;background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.14);padding:4px;min-width:220px;display:flex;flex-direction:column}
.dbmenu button{background:none;border:0;text-align:left;padding:8px 10px;border-radius:7px;font-size:13px;color:var(--ink);cursor:pointer}
.dbmenu button:hover{background:var(--offbg)}
.dbfoot{display:flex;align-items:center;gap:6px;margin-top:5px;font-size:11px;min-height:18px}
.dbfoot .sp{flex:1}
.dbod{color:var(--muted)}
.dbod.hot{color:var(--deepred);font-weight:700}
.dblink{background:none;border:0;padding:0;color:var(--info);font-size:11px;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.dbinfo{display:inline-flex;gap:4px;margin-left:6px}
.dbinfo input{height:22px;min-height:0;padding:1px 4px;font-size:11px}
.dbinfo input.dbbox{width:46px}
.dbinfo input.dbnote{width:110px}
.dmdialog.wide{max-width:920px}
.dmdialog{max-width:640px}
.dmdialog.big{max-width:720px}
.dmdialog .erpgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
.dmdialog .erpf>span{flex-basis:96px}
.dwcellh{font-size:17px}
.dwsec{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin-top:10px}
.dwsec h4{margin:0 0 8px;font-size:14px}
.dwsec h4 i,.dwfld i{font-style:normal;font-weight:400;color:var(--muted);font-size:12px}
.dwform{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 12px}
.dwfld{display:flex;flex-direction:column;gap:4px;font-size:13px;font-weight:600;min-width:0}
.dwfld.wide{grid-column:1/-1}
.dwfld>input,.dwfld>select{height:40px;font-size:15px;padding:0 10px;width:100%}
.dwfld.check{flex-direction:row;align-items:center;gap:8px;font-size:14px;flex-wrap:wrap}
.dwfld.check input{width:20px;height:20px}
@media (max-width:640px){.dwform{grid-template-columns:1fr}}
.dbdlgscroll{max-height:60vh;overflow:auto}
.dwtoast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:60}
/* 주간 배정 */
.dwwrap{overflow:auto;border:1px solid var(--line);border-radius:10px;background:var(--card);max-height:calc(100vh - 300px);min-height:360px}
table.dwgrid{border-collapse:separate;border-spacing:0;font-size:13px;width:100%;table-layout:fixed}
table.dwgrid.month{font-size:12px}
table.dwgrid.month{table-layout:fixed}   /* 한 달 = 칸마다 60px 고정(폭은 dweek.js가 날짜 수로) — 내용이 많아도 칸이 늘지 않고 줄바꿈 */
table.dwgrid.month td.dwcell{white-space:normal;word-break:break-all}
table.dwgrid th,table.dwgrid td{border-bottom:1px solid var(--softline);border-right:1px solid var(--softline);padding:3px 4px;vertical-align:middle}
table.dwgrid td{text-align:center}   /* [v1.62.4 사용자 지적 "1주·한 달 다 가운데 정렬이 안 돼 있다"] 칸 내용 = 가운데(종전 왼쪽 위) */
.dwin{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2px 4px;min-height:28px}
td.dwcell.today,td.dwtop.today{box-shadow:inset 2px 0 0 var(--red),inset -2px 0 0 var(--red)}   /* 오늘 세로줄 */
table.dwgrid thead th{position:sticky;top:0;z-index:3;background:var(--offbg);text-align:center;font-weight:700}
table.dwgrid.month thead th{min-width:46px}
table.dwgrid thead th.today{background:var(--chip);color:var(--deepred)}
table.dwgrid thead th.sun{color:var(--deepred)}
table.dwgrid thead th.sat{color:var(--info)}
table.dwgrid th.dwname{position:sticky;left:0;z-index:2;background:var(--card);text-align:left;width:180px;min-width:160px;max-width:190px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
table.dwgrid thead th.dwname{z-index:4;background:var(--offbg);cursor:default}
.dwhol{font-size:10px;color:var(--deepred);font-weight:400}
td.dwcell{min-height:38px;height:40px;cursor:pointer}
td.dwcell:hover{background:var(--offbg)}
td.dwcell.st-off{background:var(--chip)}
td.dwcell.st-hol,td.dwcell.st-sun{background:var(--soft)}
td.dwcell.chg{outline:2px dashed #2F6BD8;outline-offset:-2px}
td.dwcell.candrop{background:var(--infobg)}
td.dwcell.nodrop{opacity:.4}
td.dwcell.hov{outline:3px solid #2F6BD8;outline-offset:-3px}
.dwchip{display:inline-block;padding:2px 8px;margin:0;border-radius:5px;font-weight:700;font-size:13px;line-height:1.35;cursor:grab;touch-action:none;user-select:none;border:2px solid var(--cc,#999);background:var(--cc,#999);color:#fff}
.dwchip.sub{border:2px dashed var(--ink);box-shadow:0 0 0 1px var(--card) inset}   /* ⇄ 원래 담당이 아닌 기사가 가는 날 */
.dwchip.free{background:var(--card);color:var(--ink);border-style:dashed}
.dwghost{position:fixed;z-index:1000;pointer-events:none;box-shadow:0 4px 12px rgba(0,0,0,.25)}
.dwoff{display:inline-block;font-size:13px;font-weight:700;color:var(--deepred)}
table.dwgrid.month .dwchip{font-size:12px;padding:1px 5px}
table.dwgrid.month .dwoff{font-size:12px}
.dwoff.hol,.dwoff.sun{color:var(--muted)}
.dwother{display:inline-block;font-size:12px;color:var(--info)}
.dwign{display:inline-block;font-size:11px;font-weight:600;color:var(--warn)}
.dwwork{color:var(--ok);font-size:12px}
/* [v1.62.4 사용자 지적 "지1 글자가 너무 작다"] 10px 글자 → 12px 알약 */
.dwsup{display:inline-block;font-size:12px;font-weight:700;color:#2F6BD8;background:var(--infobg);border-radius:4px;padding:0 5px;line-height:19px;white-space:nowrap}
.dwsup.man{color:#7B4FD6;background:#EEE6FB}
.dwsupn{font-size:11px;font-weight:700;color:#2F6BD8}
tr.dwtoprow td{background:var(--offbg);cursor:pointer;height:28px}
tr.dwgrouprow th.dwgroup{background:var(--offbg);text-align:left;padding:0;border-bottom:1px solid var(--line)}
.dwfold{position:sticky;left:0;border:0;background:none;padding:5px 10px;font:inherit;font-size:13px;font-weight:700;color:var(--ink);cursor:pointer}
.dwfold .small{font-weight:400}
/* [v1.62.4 사용자 지시 "001에 마우스를 올리면 그 코스 점포명을 쭉"] 코스 말풍선 */
.dwtip{position:fixed;z-index:1100;max-width:480px;min-width:240px;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.18);padding:10px 12px;font-size:13px;pointer-events:none}
.dwtip .h{display:flex;align-items:center;gap:6px;font-size:14px}
.dwtip .h b{background:var(--cc,#999);color:#fff;border-radius:5px;padding:1px 8px}
.dwtip .sp{flex:1}
.dwtip .who{margin:5px 0 1px}
.dwtip .who b.sub{color:var(--deepred)}
.dwtip .bad{color:var(--deepred);font-weight:700}
.dwtip .meta{color:var(--muted);font-size:12px;margin-bottom:6px}
.dwtip ol{margin:0;padding:6px 0 0 22px;border-top:1px solid var(--softline)}
.dwtip ol.two{columns:2;column-gap:22px}
.dwtip li{break-inside:avoid;padding:1px 0}
.dwtip li i{font-style:normal;color:var(--muted);font-size:12px;margin-left:6px;font-variant-numeric:tabular-nums}
.dwconfirm{list-style:none;margin:0;padding:0;max-height:55vh;overflow:auto;border-top:1px solid var(--line)}
.dwconfirm li{display:flex;align-items:center;gap:10px;padding:7px 4px;border-bottom:1px solid var(--softline);font-size:14px}
.dwconfirm li .d{flex:none;width:76px;font-weight:700;font-variant-numeric:tabular-nums}
.dwconfirm li .t{flex:1;min-width:0}
.dwconfirm li.bad{background:var(--chip)}
.dwconfirm li .abtn{flex:none}
tr.dwtoprow td:hover{background:var(--soft)}
tr.dwtoprow th.dwname{background:var(--offbg)}
tr.dwtoprow.duty td{font-size:12px}
tr.dwtoprow.toplast td,tr.dwtoprow.toplast th{border-bottom:3px solid var(--line)}
.dwmgr{display:inline-block;margin:0 2px;font-weight:600}
.dwsched{display:inline-block;padding:0 5px;margin:1px 3px 1px 0;border-radius:4px;font-size:11px;font-weight:600;background:var(--infobg);color:var(--info)}
.dwsched.k-대차{background:var(--warnbg);color:var(--warn)}
.dwsched.k-신규점{background:var(--okbg);color:var(--ok)}
.dwsched.k-리뉴얼{background:#EEE6FB;color:#6B3FC4}
.dwsched.k-코드변경{background:var(--chip);color:var(--deepred)}
.dwpin{font-size:13px}
.dwschedrow{display:flex;align-items:center;gap:6px;padding:4px 0;border-bottom:1px solid var(--softline);font-size:13px;flex-wrap:wrap}
.dwschedrow .abtn{padding:2px 8px;font-size:12px;margin-left:auto}
tr.dwfree td,tr.dwfree th.dwname{background:var(--offbg)}
tr.dwcnt td{text-align:center;color:var(--muted);font-size:11px}
/* 기본 코스 — 영구 변경이라 바탕색을 다르게 */
.dbbhint{background:#FFF7E6;border:1px solid #F0D9A8;border-radius:8px;padding:6px 10px;color:#5C4300}
.dbbwrap .dbmain{background:#FFFBF2}
.dbbbin{margin-left:auto;border:2px dashed var(--red);color:var(--deepred);border-radius:8px;padding:3px 10px;font-size:12px;font-weight:600}
.dbbbin.hov,#dbbFree.hov{background:var(--chip)}
.dbbfree{min-height:30px;padding:6px;border:1px dashed var(--line);border-radius:8px;margin-bottom:10px;background:var(--card);max-height:120px;overflow:auto}
.dbchip.free{border-style:dashed}
.dbchip.nogeo{box-shadow:inset 0 -2px 0 var(--warn)}
.dbchip i.dbt{font-style:normal;font-size:11px;color:var(--info)}
.dbcname{background:none;border:0;padding:0;font-weight:700;font-size:14px;color:var(--ink);cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:55%}
.dbcname:hover{text-decoration:underline}
td.ell{max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (prefers-color-scheme: dark){
  .dbbhint{background:#3A2E12;border-color:#5C4A1E;color:#F0D9A8}
  .dbbwrap .dbmain{background:#221B12}
  .dbmode.base.on{border-color:#E5A75F;box-shadow:inset 0 -3px 0 #E5A75F}
  .dwsup{color:#8FB5FF}
  .dwsup.man{background:#33284A;color:#C9B2F5}
  .dwsched.k-리뉴얼{background:#33284A;color:#C9B2F5}
}
.movedbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:var(--warnbg);color:var(--warn);border:1px solid var(--warn);border-radius:10px;padding:8px 12px;margin:0 0 10px;font-size:14px}
.movedbar .abtn{margin-left:auto}

/* ══ [v1.62.5 사용자 지시 2026-10-12] 배차 보드 시안(/admin/dispatch-board-lab — 테스트 서버 전용) ══════════════
   ② 색: 선택 = 차콜 · 넘침(ERP 65% 이상)만 빨강 · 평소 기준 초과(ERP 미입력) = 주황 빗금 · 여유 = 초록 · 지원 = 파랑.
   이 블록은 전부 .v2(시안) 아래에서만 — 배차 보드(.db*)는 그대로다. */
.v2{--v2red:#D32F2F;--v2redbg:#FDECEC;--v2amber:#B86E00;--v2amberbg:#FFF3DF;--v2green:#2E7D4F;--v2greenbg:#E7F3EC;
  --v2blue:#2F6BD8;--v2bluebg:#EAF1FD;--v2sel:var(--char)}
@media (prefers-color-scheme: dark){
  .v2{--v2red:#F08B8A;--v2redbg:#4A2220;--v2amber:#E5A75F;--v2amberbg:#3D2D12;--v2green:#7FC79A;--v2greenbg:#1E3527;
    --v2blue:#8DB1F0;--v2bluebg:#22314A;--v2sel:#E9DEDB}
}
@media (min-width:900px){main.wide:has(section.secpane[data-sec="dboard"]:not([hidden])){max-width:none}}
main.wide:has(section.secpane[data-sec="dboard"]:not([hidden])){padding:4px 6px 0}
main.wide:has(section.secpane[data-sec="dboard"]:not([hidden])) .appver{display:none}
body:has(main.wide section.secpane[data-sec="dboard"]:not([hidden])){padding-bottom:0}
/* [v1.63.0 사용자 지적 "배차 보드 들어가면 현황판·일상점검… 탭이 아예 안 보인다, 메뉴바까지 없애면 어떡하냐"]
   종전(시안)엔 보드를 위로 올리려고 묶음 제목·탭 줄을 숨겼다 — 머리가 한 줄로 낮아졌으니 다른 화면과 같이 늘 보인다. */
main.wide:has(section.secpane[data-sec="dboard"]:not([hidden])) .pagehead.xhead{margin:0 0 4px}
main.wide:has(section.secpane[data-sec="dboard"]:not([hidden])) .dwwrap{max-height:calc(100vh - 190px)}
main.wide:has(section.secpane[data-sec="dboard"]:not([hidden])) .dbtools{margin:0 0 4px;gap:5px;padding:4px 6px}
main.wide:has(section.secpane[data-sec="dboard"]:not([hidden])) .dbguide{margin:0 0 4px}

/* ③ 위 한 줄 */
.v2bar{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding:4px 6px;margin:0 0 4px;background:var(--card);border:1px solid var(--line);border-radius:10px}
.v2bar .sp,.v2sec-h .sp,.v2cart-h .sp,.v2helpfoot .sp{flex:1}
.v2seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--card);flex:none;vertical-align:middle}
.v2seg>a,.v2seg>button,.v2seg a.dbmode{display:inline-block;border:0;border-right:1px solid var(--line);border-radius:0;box-shadow:none;background:transparent;color:var(--ink);
  padding:5px 10px;font:inherit;font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer;text-decoration:none;line-height:1.4}
.v2seg>:last-child{border-right:0}
.v2seg>.on,.v2seg a.dbmode.on{background:var(--v2sel);color:var(--card);box-shadow:none;border-color:var(--line)}
.v2seg.sm>button{padding:2px 8px;font-size:12px}
.v2bar input[type=date]{height:32px;width:138px;min-height:0;padding:0 6px;font-size:13px}
.v2find input{height:32px;width:140px;min-height:0;font-size:13px}
.v2bar .abtn{height:32px;min-height:0;padding:0 10px;font-size:13px}
.v2bar .abtn b{font-variant-numeric:tabular-nums}
.v2q{font-weight:800}
.v2cartbtn{height:34px;border:0;border-radius:8px;background:var(--char);color:#fff;font:inherit;font-weight:700;font-size:13.5px;padding:0 12px;cursor:pointer;white-space:nowrap}
.v2cartbtn b{display:inline-block;min-width:22px;padding:0 6px;margin-left:4px;border-radius:999px;background:rgba(255,255,255,.22);text-align:center}
.v2cartbtn.has{box-shadow:0 0 0 3px rgba(255,212,0,.5)}
.v2cartbtn.has b{background:#FFD400;color:#2A2220}
.v2cartbtn.fail b{background:#D32F2F;color:#fff}
@media (prefers-color-scheme: dark){.v2cartbtn{background:#F1E7E4;color:#241C1A}.v2cartbtn b{background:rgba(0,0,0,.15)}}
.v2 .dbmenu button small{display:block;color:var(--muted);font-size:11px;font-weight:400}
.v2 .dbmenu button.v2danger{color:var(--deepred);border-top:1px solid var(--line);border-radius:0 0 7px 7px;margin-top:2px}

/* ③ 사용법(처음 한 번 · 이후 [?]) */
.v2guide{display:flex;gap:8px 22px;flex-wrap:wrap;align-items:flex-start;padding:7px 12px;margin:0 0 4px;border:1.5px solid var(--v2blue);border-radius:10px;background:var(--v2bluebg);font-size:13px}
.v2guide ol{margin:0 0 0 18px;padding:0;display:grid;gap:1px;flex:1 1 520px}
.v2legend{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;flex:1 1 300px}
.v2legend span{display:inline-flex;align-items:center;gap:5px}
.v2sw{width:22px;height:8px;border-radius:4px;display:inline-block}
.v2sw.red{background:var(--v2red)}
.v2sw.amber{background:repeating-linear-gradient(135deg,var(--v2amber) 0 4px,#E9B868 4px 7px)}
.v2sw.green{background:var(--v2green)}

/* ① 오늘 할 일 줄 */
.v2todo{display:flex;align-items:center;gap:6px 14px;flex-wrap:wrap;padding:5px 8px;margin:0 0 4px;background:var(--card);border:1px solid var(--line);border-radius:10px}
.v2todo-l{display:flex;align-items:center;gap:5px;flex-wrap:wrap;flex:1 1 auto;min-width:0}
.v2todo-t{font-size:14px;margin-right:4px;white-space:nowrap}
.v2todo-t span{font-weight:500;color:var(--muted);font-size:12.5px}
.v2tc{border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:2px 11px;font:inherit;font-size:13px;cursor:pointer;white-space:nowrap;line-height:1.5}
.v2tc b{font-weight:800}
.v2tc.red{border-color:var(--v2red);color:var(--v2red);background:var(--v2redbg)}
.v2tc.amber{border-color:var(--v2amber);color:var(--v2amber);background:var(--v2amberbg)}
.v2tc.green{border-color:var(--v2green);color:var(--v2green);background:var(--v2greenbg)}
.v2tc.blue{border-color:var(--v2blue);color:var(--v2blue);background:var(--v2bluebg)}
.v2tc.gray{color:var(--muted)}
.v2tc.on{background:var(--v2sel);color:var(--card);border-color:var(--v2sel)}
.v2next{display:flex;align-items:center;gap:8px;font-size:13.5px;flex-wrap:wrap}
.v2nxb{border:0;border-radius:8px;padding:5px 12px;font:inherit;font-weight:700;font-size:13px;cursor:pointer;color:#fff;white-space:nowrap}
.v2nxb.red{background:#D32F2F}.v2nxb.amber{background:#B86E00}.v2nxb.blue{background:#2F6BD8}.v2nxb.dark{background:var(--char)}
.v2nx.ok{color:var(--v2green);font-weight:800}.v2nx.gray{color:var(--muted)}

/* 보드 · 지도 · 폭 조절 */
.v2wrap{display:grid;grid-template-columns:minmax(0,1fr) 10px var(--mapw,38%);min-height:420px;height:calc(100vh - 230px)}
.v2wrap.nomap{grid-template-columns:minmax(0,1fr)}
.v2wrap.nomap .v2split,.v2wrap.nomap .v2side{display:none}
.v2main{overflow:auto;border:1px solid var(--line);border-radius:10px;background:var(--paper);padding:0 6px 6px;min-height:0;position:relative}
.v2split{cursor:col-resize;position:relative;touch-action:none}
.v2split::after{content:"";position:absolute;left:4px;top:50%;width:2px;height:44px;margin-top:-22px;background:var(--line);border-radius:2px;transition:height .15s}
.v2split:hover::after{background:var(--muted);height:90px;margin-top:-45px}
body.v2splitting,body.v2splitting *{cursor:col-resize!important;user-select:none!important}
.v2side{min-height:0;display:flex}
.v2side .dmmapwrap{flex:1;min-height:0}
.v2maplg{position:absolute;left:8px;top:8px;z-index:5;background:rgba(255,255,255,.93);border:1px solid #E5D9D7;border-radius:8px;padding:3px 9px;font-size:11.5px;display:flex;gap:10px;color:#2A2220;pointer-events:none}
.v2maplg i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:4px;vertical-align:-1px}
.v2 .dmtoast{position:fixed;bottom:74px;z-index:1200;max-width:min(760px,92vw);white-space:normal;text-align:center;border-radius:12px;line-height:1.45;padding:9px 16px;box-shadow:0 8px 24px rgba(0,0,0,.25)}
.v2 .dmtoast.v2t-ok{background:#1F6B43}
.v2 .dmtoast.v2t-warn{background:#9A5B00}
.v2 .dmtoast.v2t-bad{background:#B01C1B}

/* 지원기사 줄(위 고정) */
.v2helpzone{position:sticky;top:0;z-index:6;background:var(--paper);margin:0 -6px 4px;padding:5px 6px 5px;border-bottom:1px solid var(--line);max-height:40vh;overflow:auto}
.v2sec-h{display:flex;align-items:center;gap:6px;font-size:13px;margin:0 0 4px;flex-wrap:wrap}
.v2sec-h select{height:28px;min-height:0;font-size:12px;max-width:220px;padding:0 6px}
.v2sec-h .abtn{height:28px;min-height:0;font-size:12px;padding:0 10px}

/* ④ 줄 보기(레인) · 카드 보기 — 같은 마크업 */
.v2list.lane,.v2helpers.lane{display:flex;flex-direction:column;gap:3px}
.v2row{position:relative;background:var(--card);border:1px solid var(--line);border-radius:8px;cursor:pointer;min-width:0}
.lane .v2row{display:grid;grid-template-columns:minmax(140px,185px) minmax(200px,255px) minmax(0,1fr) 28px;align-items:center;gap:3px 10px;padding:4px 2px 4px 8px;min-height:36px}
.v2who{display:flex;align-items:center;gap:5px;min-width:0;font-size:14px}
.v2who b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:none;max-width:62%}
.v2who .lamp{margin-right:0}
.v2sub{color:var(--muted);font-size:11.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.v2cc{width:4px;height:18px;border-radius:2px;background:var(--cc,#999);flex:none}
.v2ld{display:flex;align-items:center;gap:3px 6px;flex-wrap:wrap;min-width:0}
.v2bar2{position:relative;display:inline-block;width:64px;height:7px;background:var(--soft);border-radius:4px;flex:none}
.v2bar2 i{position:absolute;left:0;top:0;bottom:0;border-radius:4px;background:var(--v2green)}
.v2bar2 i.red{background:var(--v2red)}
.v2bar2 i.amber{background:repeating-linear-gradient(135deg,var(--v2amber) 0 4px,#E9B868 4px 7px)}
.v2bar2 i.gray{background:#C9C0BE}
.v2bar2 s{position:absolute;left:65%;top:-3px;bottom:-3px;width:2px;background:var(--ink);opacity:.5}
.v2pct{font-size:13px;font-weight:700;font-variant-numeric:tabular-nums;min-width:44px}
.v2pct.red{color:var(--v2red)}.v2pct.amber{color:var(--v2amber)}
.v2pct sup{font-size:9px;font-weight:800;color:var(--v2blue);margin-left:2px;letter-spacing:.02em}
.v2tag{font-size:12px;font-weight:700;padding:1px 8px;border-radius:999px;white-space:nowrap;line-height:1.5}
.v2tag.red{background:var(--v2redbg);color:var(--v2red)}
.v2tag.amber{background:var(--v2amberbg);color:var(--v2amber)}
.v2tag.green{background:var(--v2greenbg);color:var(--v2green)}
.v2tag.blue{background:var(--v2bluebg);color:var(--v2blue)}
.v2tag.gray{background:var(--soft);color:var(--muted)}
.v2tag.done{background:var(--v2greenbg);color:var(--v2green)}
.v2od{font-size:11px;color:var(--muted);white-space:nowrap}
.v2act{border:0;border-radius:6px;padding:2px 9px;font:inherit;font-size:12px;font-weight:700;color:#fff;cursor:pointer;white-space:nowrap;line-height:1.6}
.v2act.red{background:#D32F2F}.v2act.amber{background:#B86E00}.v2act.blue{background:#2F6BD8}
.v2chips{display:flex;flex-wrap:wrap;gap:3px;min-width:0}
.v2more{border:0;background:transparent;color:var(--muted);font-size:17px;line-height:1;width:26px;height:26px;border-radius:6px;cursor:pointer;align-self:center;padding:0}
.v2more:hover{background:var(--soft);color:var(--ink)}
.v2row.s-absent{background:var(--v2redbg);border-color:var(--v2red)}
.v2row.s-over{border-color:var(--v2red)}
.v2row.s-rest{background:var(--offbg)}
.v2row.helper{background:var(--v2bluebg);border-color:#BFD2F5}
@media (prefers-color-scheme: dark){.v2row.helper{border-color:#36507D}}
.v2row.pinned{box-shadow:0 0 0 2px var(--cc,#2F6BD8)}
.v2row.rec{outline:2px solid var(--v2blue);outline-offset:1px}
.v2row.rec::after{content:attr(data-rank);position:absolute;top:-8px;right:34px;background:#2F6BD8;color:#fff;font-size:11px;padding:0 7px;border-radius:999px;line-height:16px;z-index:2}
.v2row.hov{outline:3px solid var(--v2blue);background:var(--v2bluebg)}
.v2row.nodrop{opacity:.38}
.v2row.src{outline:2px dashed var(--muted)}
.v2grp-h{font-size:12px;font-weight:800;color:var(--muted);margin:9px 2px 2px;display:flex;gap:6px;align-items:center}
.v2grp-h span{background:var(--soft);border-radius:999px;padding:0 7px;font-size:11px;color:var(--ink)}
.v2grp-h.g-absent,.v2grp-h.g-over{color:var(--v2red)}
.v2grp-h.g-usual{color:var(--v2amber)}
.v2grp-h.g-ok{color:var(--v2green)}
.v2list .v2grp-h:first-child{margin-top:5px}
.v2 .dbchip{font-size:12.5px;padding:1px 6px}
.v2 .dbchip em{font-size:11px}
.v2 .dbchip.msel{box-shadow:0 0 0 2px var(--v2sel);background:#FFF2A8;color:#2A2220}
.v2list.card,.v2helpers.card{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:5px;align-items:start}
.v2list.card .v2grp-h{grid-column:1/-1}
.card .v2row{display:flex;flex-direction:column;gap:4px;padding:6px 8px 7px}
.card .v2more{position:absolute;top:3px;right:3px}
.card .v2who{padding-right:24px}
.card .v2bar2{flex:1;width:auto;min-width:60px}
.v2helpers .dbhelpempty{grid-column:1/-1}

/* 보내기·[⋯] 메뉴 · 여러 개 고르기 바 */
.v2pop>button{align-items:center;gap:8px}
.v2pop>button span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.v2warnline{font-size:12px;color:var(--v2red);margin:5px 2px}
.v2molink{display:block;font-size:12px;margin:6px 2px 2px;color:var(--v2blue)}
.v2selbar{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:1100;display:flex;align-items:center;gap:8px;background:var(--card);border:1.5px solid var(--v2sel);border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.25);padding:8px 12px;font-size:13px;max-width:96vw;flex-wrap:wrap}
.v2selbar select{height:32px;min-height:0;max-width:300px;font-size:13px}
.v2selbar .btn,.v2helpfoot .btn{width:auto;padding:0 16px;height:34px;display:inline-flex;align-items:center}
.v2selbar .abtn{height:32px;min-height:0}

/* ③ 장바구니(오른쪽 서랍) */
.v2cart{position:fixed;right:0;top:0;bottom:0;width:min(440px,96vw);z-index:1050;background:var(--card);border-left:1px solid var(--line);box-shadow:-10px 0 30px rgba(0,0,0,.2);display:flex;flex-direction:column}
.v2cart-h{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line);font-size:15px}
.v2cart-l{flex:1;overflow:auto;padding:4px 10px}
.v2crow{display:grid;grid-template-columns:62px minmax(0,1fr) auto;gap:8px;align-items:start;padding:7px 2px;border-bottom:1px dashed var(--line);font-size:13px;cursor:pointer}
.v2cw{font-size:11px;font-weight:700;border-radius:999px;padding:1px 6px;text-align:center;white-space:nowrap}
.v2cw.d{background:var(--v2bluebg);color:var(--v2blue);border:1px dashed var(--v2blue)}
.v2cw.c{background:var(--soft);color:var(--muted)}
.v2crow .dbinfo{display:flex;margin:4px 0 0}
.v2crow .dbinfo input.dbnote{flex:1;width:auto;min-width:0}
.v2crow.fail{background:var(--v2redbg)}
.v2crow .abtn{height:28px;min-height:0;font-size:12px;padding:0 8px}
.v2cart-f{border-top:1px solid var(--line);padding:10px 12px;display:grid;gap:6px}

/* 대화상자 */
.v2paste{margin:4px 0 8px;font-size:13px}
.v2paste summary{cursor:pointer;color:var(--v2blue);font-weight:700}
.v2paste textarea{width:100%;font:inherit;font-size:13px;padding:6px;border:1px solid var(--line);border-radius:6px;background:var(--card);color:var(--ink)}
input.v2erpin{width:86px;height:30px;min-height:0;text-align:right;font-variant-numeric:tabular-nums;font-size:14px;padding:0 6px}
tr.v2flash td{background:#FFF6C2}
@media (prefers-color-scheme: dark){tr.v2flash td{background:#4A4010}}
.v2ccdot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px}
.v2helpsum{display:flex;align-items:center;gap:6px 10px;flex-wrap:wrap;font-size:13.5px;margin:6px 0}
.v2bulk{margin-left:auto;font-size:12.5px;color:var(--muted)}
.v2bulk select{height:28px;min-height:0;font-size:12px;max-width:240px}
#v2HelpT select{height:30px;min-height:0;font-size:12.5px;max-width:270px}
.v2helpfoot{display:flex;align-items:center;gap:8px;margin-top:8px}
.v2why{margin:4px 0 6px;font-size:13px}
.v2why summary{cursor:pointer;color:var(--muted)}

/* ⑦ 주간 배정 시안 — 평소(원래 담당대로)인 칸은 흐리게, 바뀐 칸(⇄)·빈 코스만 진하게 · 안내는 [? 사용법] */
.v2wk:not(.guideon) .dbguide{display:none}
.v2wk .dbtools .v2seg{margin-right:4px}
.v2wk .dwchip:not(.sub):not(.free){background:transparent;color:var(--muted);border-color:var(--line);font-weight:600}
.v2wk .dwchip:not(.sub):not(.free):hover{background:var(--cc);color:#fff;border-color:var(--cc)}
.v2wk .dwchip.sub{box-shadow:0 0 0 2px #FFD400}
.v2basetag{font-size:13px;font-weight:800;color:#8A5A00;background:#FFF3C4;border:1px solid #E0B44A;border-radius:999px;padding:3px 10px;white-space:nowrap}
@media (prefers-color-scheme: dark){.v2basetag{background:#3A3320;color:#E5C46F;border-color:#6B5A2A}}
.v2bm:not(.guideon) .dbguide{display:block}
.v2bm:not(.guideon) .dbguide .dbsteps,.v2bm:not(.guideon) .dbguide .dblegend{display:none}
/* [v1.62.5 시안 다듬기] ④ 줄 보기의 칩 = 한 줄(넘치면 [+N곳]) — 1366 화면에서 한 줄이 6줄로 늘어 2코스만 보이던 것 */
.v2wrap{grid-template-columns:minmax(0,1fr) 10px var(--mapw,clamp(320px,34%,820px))}
.lane .v2row:not(.open) .v2chips{position:relative;flex-wrap:nowrap;overflow:hidden}
.lane .v2chips{position:relative}
.v2plus{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:6px;padding:0 8px;font:inherit;font-size:12px;font-weight:700;line-height:20px;cursor:pointer;white-space:nowrap}
.lane .v2row:not(.open) .v2plus{position:absolute;right:0;top:50%;transform:translateY(-50%);box-shadow:-14px 0 10px var(--card)}
.v2row.helper:not(.open) .v2plus{box-shadow:-14px 0 10px var(--v2bluebg)}
.v2plus:hover{background:var(--v2sel);color:var(--card);border-color:var(--v2sel)}
.v2plus.in{color:var(--muted);font-weight:600}
/* ② '확인해 보세요' 버튼은 테두리만(빨강 채움 = 해야 할 일만) */
.v2act.amber{background:transparent;color:var(--v2amber);box-shadow:inset 0 0 0 1px var(--v2amber)}
.v2act.amber:hover{background:var(--v2amberbg)}
/* ② 주간·기본 시안 — 선택·확정 = 차콜(빨강은 경고에만) */
.v2wk .dmtab.on{background:var(--v2sel);color:var(--card);border-color:var(--v2sel)}
.v2wk .abtn.primary{background:var(--char);color:#fff;border-color:var(--char)}
@media (prefers-color-scheme: dark){.v2wk .abtn.primary{background:#F1E7E4;color:#241C1A;border-color:#F1E7E4}}
.v2 .dbchip{white-space:nowrap;flex:none}
.v2 .v2row.open .dbchip{max-width:100%}
/* [v1.62.5 시안 다듬기] 줄 = 이름 | 적재·상태 | 칩 | 할 일 버튼 | ⋯ — 한 줄 38px 안팎(지난달 초과 일수는 이름 툴팁) */
.lane .v2row{grid-template-columns:minmax(130px,175px) minmax(175px,225px) minmax(0,1fr) auto 28px;gap:3px 8px}
.lane .v2ld{flex-wrap:nowrap}
.lane .v2od{display:none}
.v2a{display:flex;align-items:center}
.card .v2a:empty{display:none}
/* [v1.62.5 시안] 펼친 줄 = 이름·적재 아래 빈자리에 [▲ 접기](종전: 칩 맨 끝에 작게 붙거나, 줄을 눌러 열면 아예 없었다) */
.v2who{grid-area:who}.v2ld{grid-area:ld}.v2chips{grid-area:chips}.v2a{grid-area:act}.v2more{grid-area:more}.v2rowbar{grid-area:bar}
.lane .v2row{grid-template-areas:"who ld chips act more"}
.lane .v2row.open{grid-template-areas:"who ld chips act more" "bar bar chips act more";grid-template-rows:auto 1fr;align-items:start}
.lane .v2row.open .v2who,.lane .v2row.open .v2ld{min-height:28px}
.lane .v2row.open .v2a,.lane .v2row.open .v2more{align-self:start;margin-top:1px}
.v2rowbar{display:flex;flex-wrap:wrap;gap:4px;align-items:center;align-self:end;padding:2px 0}
.v2fold{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:6px;padding:0 9px;font:inherit;font-size:12px;font-weight:700;line-height:24px;cursor:pointer;white-space:nowrap}
.v2fold:hover{background:var(--v2sel);color:var(--card);border-color:var(--v2sel)}
/* [v1.62.5 시안] 펼친 줄 버튼 줄(분배 도우미 · 결근 분배 · 지도에서 보기 · ERP 값 · 접기) — 테두리 버튼, 빨강 채움은 '지금 할 일'만 */
.v2rb{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:6px;padding:0 8px;font:inherit;font-size:12px;font-weight:600;line-height:24px;cursor:pointer;white-space:nowrap}
.v2rb:hover{border-color:var(--v2sel)}
.v2rb.on{background:var(--v2sel);color:var(--card);border-color:var(--v2sel)}
.v2rb.danger{color:var(--deepred)}
.v2rb.fold{color:var(--muted)}
.v2rb.fold:hover{background:var(--v2sel);color:var(--card)}
.card .v2rowbar{border-top:1px dashed var(--line);padding-top:5px;margin-top:2px}
/* ══ [v1.62.5 시안] 📅 주간 배정(dweek2.js) — 할 일 줄 · 휴무 회색/코스 빔 빨강 · 기사 줄 34px · 작은 메뉴 · 기사 없는 코스 맨 위 ══ */
.w2wrap{overflow:auto;border:1px solid var(--line);border-radius:10px;background:var(--card);min-height:360px}
.w2nav{display:inline-flex;align-items:center;gap:3px}
.v2bar .w2nav .abtn{width:32px;padding:0}
.v2 table.w2grid th.dwname{width:150px;min-width:130px;max-width:170px;padding:2px 6px}
.v2 table.w2grid th.dwname b{font-size:13.5px}
.w2dock{font-size:11px;color:var(--muted);font-weight:500}
.v2 table.w2grid thead th{padding:4px 3px;font-size:13px}
.v2 table.w2grid td.dwcell{height:34px;min-height:0;padding:1px 3px}
.v2 table.w2grid .dwin{min-height:24px}
.v2 td.dwcell.st-off{background:var(--soft)}
.v2 td.dwcell.has-gap{background:var(--v2redbg)}
.v2 td.dwcell.chg{outline:2px dashed #C9A100;outline-offset:-2px;background:#FFFBE0}
@media (prefers-color-scheme: dark){.v2 td.dwcell.chg{background:#3A3320}}
.w2off{display:inline-block;font-size:12.5px;font-weight:700;color:var(--muted)}
.w2off.gap{color:var(--v2red)}
tr.w2free th.dwname{color:var(--muted);font-weight:700}
tr.w2free.has th.dwname{color:var(--v2red)}
tr.w2free td.dwcell{height:34px}
tr.w2free td.has-free:not(.past){background:var(--v2redbg)}
tr.w2free td.past .dwin{opacity:.5}
tr.w2free td.has-free:not(.past) .dwchip.free{border-color:var(--v2red);color:var(--v2red)}
tr.w2free td,tr.w2free th{border-bottom:2px solid var(--line)}
/* 할 일 칩 = 그 칸만 진하게 */
.w2wrap.hl td.dwcell .dwin{opacity:.18}
.w2wrap.hl-free tr.w2free td.has-free .dwin,.w2wrap.hl-sub td.has-sub .dwin,.w2wrap.hl-off td.has-off .dwin,
.w2wrap.hl-gap td.has-gap .dwin,.w2wrap.hl-sup td.has-sup .dwin,.w2wrap.hl-sched td.has-sched .dwin{opacity:1}
.w2wrap.hl-free tr.w2free td.has-free,.w2wrap.hl-sub td.has-sub,.w2wrap.hl-off td.has-off,
.w2wrap.hl-gap td.has-gap,.w2wrap.hl-sup td.has-sup,.w2wrap.hl-sched td.has-sched{box-shadow:inset 0 0 0 2px var(--v2sel)}
td.dwcell.popon{outline:3px solid var(--v2sel);outline-offset:-3px}
td.flash,.b2free.flash{animation:v2flash 1.6s}
@keyframes v2flash{0%,100%{box-shadow:none}25%,75%{box-shadow:inset 0 0 0 3px #FFD400,0 0 0 3px #FFD400}}
/* 칸 작은 메뉴 */
.w2pop{width:340px}
.w2now{display:flex;flex-wrap:wrap;gap:4px;align-items:center;margin:4px 0 6px;font-size:13px}
.w2pr{display:flex;align-items:center;gap:6px;margin:5px 0;font-size:13px}
.w2pr>span:first-child{flex:none;width:56px;color:var(--muted);font-weight:600}
.w2pr select,.w2pr input{flex:1;min-width:0;height:30px;min-height:0;font-size:13px;padding:0 6px}
.w2pr .abtn{height:30px;min-height:0;padding:0 9px;font-size:12.5px;flex:none}
.w2pr .abtn.sq{width:30px;padding:0;font-weight:800}
.w2supn{min-width:20px;text-align:center;font-variant-numeric:tabular-nums}
.w2pr.end{justify-content:flex-end;border-top:1px solid var(--softline);padding-top:6px;margin-top:6px}
.w2pr.end small{color:var(--muted);font-weight:400;font-size:11px}

/* ══ [v1.62.5 시안] 🛠 기본 코스(dbase2.js) — 노란 영구 띠 · 미편성·🗑 위 고정 · 줄 보기 · 노란 장바구니 ══ */
.b2warn{display:block;padding:3px 10px;margin:0 0 4px;border:1px solid #E0B44A;background:#FFF8DC;color:#6B4E00;border-radius:8px;font-size:12.5px}
.b2warn span{color:#8A6A1A}
@media (prefers-color-scheme: dark){.b2warn{background:#3A3320;color:#E5C46F;border-color:#6B5A2A}.b2warn span{color:#C9AD5E}}
.v2cartbtn.base{background:#8A5A00}
.v2cartbtn.base.has{box-shadow:0 0 0 3px rgba(224,180,74,.6)}
@media (prefers-color-scheme: dark){.v2cartbtn.base{background:#E5C46F;color:#2A2220}}
.b2bin{border:1.5px dashed var(--v2red);color:var(--v2red);border-radius:8px;padding:2px 10px;font-size:12px;font-weight:700;white-space:nowrap}
.b2bin.hov{background:var(--v2redbg);outline:2px solid var(--v2red)}
.b2free{min-height:30px;padding:4px;border:1px dashed var(--line);border-radius:8px;background:var(--card);max-height:84px;overflow:auto}
.b2free.hov{outline:3px solid var(--v2blue)}
.b2freezone{max-height:none}
.v2row.s-empty{background:var(--offbg)}
.v2grp-h.g-empty{color:var(--muted)}
.b2cart{border-left:4px solid #E0B44A}
.b2cartwarn{font-size:12.5px;line-height:1.5;padding:7px 9px;border:1px solid #E0B44A;background:#FFF8DC;color:#6B4E00;border-radius:8px}
@media (prefers-color-scheme: dark){.b2cartwarn{background:#3A3320;color:#E5C46F;border-color:#6B5A2A}}
.b2pop{width:350px}
.b2pop input[data-addq]{width:100%;height:30px;min-height:0;margin:4px 0;font-size:13px}
.b2addlist{max-height:300px;overflow:auto}
.b2addlist button{display:flex;justify-content:space-between;align-items:center;width:100%;text-align:left;border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:6px;padding:4px 8px;margin-top:3px;cursor:pointer;font:inherit;font-size:12.5px;gap:8px}
.b2addlist button:hover{background:var(--infobg)}
.b2addlist small{color:var(--muted);font-size:11px}
.b2addlist i{font-style:normal;color:var(--muted);font-size:11.5px;white-space:nowrap}
/* [v1.62.5 시안] 용차 등 기본 담당 없는 코스 = 회색(할 일 아님) · 재편 후보 버튼 = 테두리만(9개가 같은 창이라 채움은 소음) */
.v2wk .dwchip.free.nodef{border-color:var(--line);color:var(--muted);background:var(--card)}
.v2act.redline{background:transparent;color:var(--v2red);box-shadow:inset 0 0 0 1px var(--v2red)}
.v2act.redline:hover{background:var(--v2redbg)}
tr.w2free td.has-free:not(.past) .dwchip.free.nodef{border-color:var(--line);color:var(--muted)}
/* [v1.62.5 시안] 사용법을 접으면 [📖 사용법] 버튼이 두 번 깜빡여 다시 펴는 자리를 알려 준다 */
.v2q.flash{animation:v2qflash 1.3s 2}
@keyframes v2qflash{0%,100%{box-shadow:none}40%,60%{box-shadow:0 0 0 4px #FFD400;background:#FFF6C2}}
.v2guide .abtn small{color:var(--muted);font-weight:400}
.v2tc.gopen{border-style:dashed;color:var(--v2blue);border-color:var(--v2blue);background:var(--card)}
/* [v1.62.5 시안] 사용법 = 할 일 줄 위 제자리에서 머리 줄로 접고 펴기(별도 버튼·칩 없음) — 접으면 점선 한 줄 */
.v2guide{display:block;padding:0}
.v2gh{display:block;width:100%;text-align:left;border:0;background:transparent;padding:4px 12px;font:inherit;font-size:13px;font-weight:700;color:var(--v2blue);cursor:pointer;border-radius:10px}
.v2gh small{font-weight:400;color:var(--muted)}
.v2gh .v2gi{display:inline-block;width:12px}
.v2gbody{display:flex;gap:8px 22px;flex-wrap:wrap;align-items:flex-start;padding:0 12px 7px}
.v2guide.fold{border-style:dashed;background:var(--card)}
.v2guide.fold .v2gbody{display:none}
.v2guide.fold .v2gh{padding:2px 12px;font-size:12.5px}

/* ═══ [v1.63.0 사용자 지시 2026-10-12 "나머지들도 모두 다 시안 형태로"] 관리자 공용 — 배차 보드 시안의 형태를 전 화면에 ═══
   ① 머리 한 줄(로고 + 메뉴 + 오른쪽) ② 묶음 제목 + 탭 한 줄 ③ 기본 버튼 = 차콜, 빨강 = 경보·삭제에만
   ④ 툴바·표·칩을 조밀하게 ⑤ 사용법 상자(머리 줄 접기) ⑥ 할 일 줄 ⑦ 줄 펼치기(📌 고정) ⑧ 등록 서랍.
   부품 = templates/admin/_x.html, 동작 = static/xui.js. 기사 화면(body.hastabs)은 건드리지 않는다. */
:root{--v2red:#D32F2F;--v2redbg:#FDECEC;--v2amber:#B86E00;--v2amberbg:#FFF3DF;--v2green:#2E7D4F;--v2greenbg:#E7F3EC;
  --v2blue:#2F6BD8;--v2bluebg:#EAF1FD;--v2sel:var(--char)}
@media (prefers-color-scheme: dark){:root{--v2red:#F08B8A;--v2redbg:#4A2220;--v2amber:#E5A75F;--v2amberbg:#3D2D12;
  --v2green:#7FC79A;--v2greenbg:#1E3527;--v2blue:#8DB1F0;--v2bluebg:#22314A;--v2sel:#E9DEDB}}

/* ① 머리 한 줄 — 로고 | 메뉴 | 찾기 · 설명서 · 이름 · 화면 버튼 · 로그아웃 (휴대폰 폭은 두 줄) */
body.hasgnb:not(.hastabs) .topwrap{display:flex;align-items:center;flex-wrap:wrap;border-bottom:1px solid var(--line)}
body.hasgnb:not(.hastabs) .topwrap>.appbar{flex:none;border-bottom:0;padding:4px 4px 4px 10px;background:transparent}
body.hasgnb:not(.hastabs) .topwrap>.appbar .logo{font-size:14.5px}
body.hasgnb:not(.hastabs) .topwrap>.appbar .backbtn{width:32px;height:30px;border-radius:8px}
body.hasgnb:not(.hastabs) .topwrap>.gnb{flex:1 1 640px;min-width:0;border-bottom:0;padding-left:4px}
body.hasgnb:not(.hastabs) .gmi{padding:10px 10px 8px}
body.hasgnb:not(.hastabs) .gmi.on{color:var(--ink);border-bottom-color:var(--red);background:transparent}
.gnb-page{display:inline-flex;gap:6px;align-items:center}
.gnb-page:empty{display:none}
.gnb-page .out{background:none;border:1px solid var(--line);border-radius:8px;padding:5px 8px;font-size:13px;color:var(--ink);white-space:nowrap;font-weight:600}
.gnb-page .out:hover{background:var(--paper)}
@media (max-width:760px){body.hasgnb:not(.hastabs) .topwrap>.gnb{flex-basis:100%}}

/* ② 묶음 제목 + 탭 한 줄(밑줄 탭 — 종전 알약 탭 줄 + 제목 줄 두 줄) */
.pagehead.xhead{display:flex;align-items:flex-end;gap:2px 14px;flex-wrap:wrap;margin:0 0 8px;padding:0;border-bottom:1px solid var(--line)}
.pagehead.xhead h1{font-size:15px;padding:0 2px 7px;white-space:nowrap;cursor:default}
.xhead .sectabs{display:flex;gap:0;flex-wrap:nowrap;margin:0;flex:1 1 auto;min-width:0;overflow-x:auto;scrollbar-width:thin}
.xhead .sectab{border:0;border-radius:0;background:transparent;padding:6px 12px 7px;font-size:13.5px;font-weight:700;color:var(--muted);
  border-bottom:3px solid transparent;margin-bottom:-1px;white-space:nowrap;box-shadow:none}
.xhead .sectab:hover{color:var(--ink);background:var(--offbg)}
.xhead .sectab.on{color:var(--ink);background:transparent;border-color:transparent;border-bottom-color:var(--char)}
@media (prefers-color-scheme: dark){.xhead .sectab.on{border-bottom-color:var(--ink)}}
body.hasgnb main.wide{padding-top:8px}

/* ③ 기본 버튼 = 차콜(종전 연분홍·빨강) — 빨강은 경보·삭제 버튼(.danger·.btn.red)에만 */
body.hasgnb:not(.hastabs) .abtn.primary{background:var(--char);border-color:var(--char);color:#fff}
body.hasgnb:not(.hastabs) .abtn.primary:active{opacity:.85}
@media (prefers-color-scheme: dark){
  body.hasgnb:not(.hastabs) .abtn.primary,body.hasgnb:not(.hastabs) .btn.dark{background:#F1E7E4;border-color:#F1E7E4;color:#241C1A}
}

/* ④ 툴바·표·칩·버튼을 조밀하게(배차 보드 위 한 줄과 같은 높이 32px) */
body.hasgnb:not(.hastabs) .erptools{background:var(--card);padding:4px 6px;gap:5px;margin-bottom:6px}
body.hasgnb:not(.hastabs) .erptools select,body.hasgnb:not(.hastabs) .erptools input:not([type=checkbox]):not([type=radio]){height:32px;padding:0 8px;font-size:13px}
body.hasgnb:not(.hastabs) .erptools .abtn,body.hasgnb:not(.hastabs) .xbar .abtn{min-height:32px;height:32px;padding:0 10px}
body.hasgnb:not(.hastabs) .erptools .chip,body.hasgnb:not(.hastabs) .xbar .chip{min-height:30px;padding:5px 12px;font-size:13px}
body.hasgnb:not(.hastabs) table.erptable th{padding:6px 9px}
body.hasgnb:not(.hastabs) table.erptable td{padding:6px 9px}
body.hasgnb:not(.hastabs) .erptablewrap{margin-bottom:8px}
body.hasgnb:not(.hastabs) .erppanel{margin-bottom:8px}
.xbar{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding:4px 6px;margin:0 0 6px;background:var(--card);border:1px solid var(--line);border-radius:10px}
.xbar .sp{flex:1}
.xbar select,.xbar input:not([type=checkbox]):not([type=radio]){height:32px;min-height:0;border:1px solid var(--line);border-radius:8px;background:var(--card);padding:0 8px;font:inherit;font-size:13px;color:var(--ink)}
.xbar .cnt{font-size:12.5px;color:var(--muted);font-weight:700}
.xbar form{display:contents}

/* ⑤ 사용법 상자 — 화면 설명 문단을 한 곳에(머리 줄을 누르면 접힘) */
.xguide .xgbody{display:block;padding:0 12px 8px;font-size:13px;line-height:1.6}
.xguide .xgbody p+p{margin-top:2px}
.xguide .xgbody ol,.xguide .xgbody ul{margin:0 0 0 18px}
.xguide{display:block;margin:0 0 6px}

/* ⑥ 할 일 줄 — .v2todo 그대로(칩 = 0이면 안 그림) */
.xtodo{margin:0 0 6px}
.xhide{display:none!important}

/* ⑦ 줄 펼치기 — 줄을 누르면 그 줄 아래에 자세히 + 버튼 줄. 📌 고정한 줄만 다른 줄을 눌러도 펼친 채 */
.xr{cursor:pointer}
table.erptable tr.xr.open td{background:var(--offbg)}
table.erptable tr.xr.kept td:first-child{box-shadow:inset 3px 0 0 var(--char)}
table.erptable tr.xd>td{background:var(--paper);padding:8px 12px 10px;border-bottom:2px solid var(--line)}
table.erptable tbody tr.xd:hover td{background:var(--paper)}
.xdbar{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:8px}
.xdbar form{display:inline-flex;gap:5px;align-items:center;flex-wrap:wrap}
.xdbar input:not([type=checkbox]),.xdbar select{height:30px;border:1px solid var(--line);border-radius:7px;padding:0 7px;font:inherit;font-size:13px;background:var(--card);color:var(--ink)}
.xdbar .abtn{min-height:30px;height:30px;padding:0 10px}
.xrb-sp{flex:1}
.xdgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:4px 16px;font-size:13px}
.xdgrid>div>span{color:var(--muted);margin-right:6px}
.xmore{color:var(--muted);font-size:12px;white-space:nowrap}
tr.xr .xchev{color:var(--muted);font-size:11px;display:inline-block;width:12px;transition:transform .12s}
tr.xr.open .xchev{transform:rotate(90deg)}

/* ⑧ 등록 서랍 — 목록 아래 늘 펼쳐 두던 등록 폼을 오른쪽 서랍으로 */
.xdrawer{position:fixed;top:0;right:0;bottom:0;width:min(560px,96vw);z-index:60;background:var(--card);
  border-left:1px solid var(--line);box-shadow:-12px 0 32px rgba(0,0,0,.18);display:flex;flex-direction:column}
.xdrawer.wide{width:min(880px,96vw)}
.xdrawer-h{display:flex;align-items:center;gap:8px;padding:8px 10px 8px 14px;border-bottom:1px solid var(--line);font-size:15px}
.xdrawer-h .sp{flex:1}
.xdrawer-h .abtn{min-height:30px;height:30px;padding:0 10px}
.xdrawer-b{flex:1;overflow:auto;padding:12px 14px}
.xdrawer-b .erpgrid{grid-template-columns:1fr!important}
.xback{position:fixed;inset:0;z-index:59;background:rgba(20,12,10,.35)}

/* 상태 알약 — 경보가 아닌 상태(제출 전·접수 대기)는 회색·주황, 빨강은 진짜 문제에만 */
.pill.amber{background:var(--v2amberbg);color:var(--v2amber)}
.pill.blue{background:var(--v2bluebg);color:var(--v2blue)}
.pill.redx{background:var(--v2redbg);color:var(--v2red);box-shadow:inset 0 0 0 1px var(--v2red)}
.xhead .sectabs{overflow-y:hidden}
.xbar select{max-width:300px}
/* [v1.63.0] 현황판 — 확인할 일 = 할 일 줄 모양(칩 둥글게·작게), 숫자 카드 낮게 */
.todochips.v2todo{gap:5px 6px;padding:5px 8px;margin:0 0 6px;align-items:center}
.todochips.v2todo .ttl{font-size:14px;white-space:nowrap}
.todochips.v2todo .ttl small{font-weight:500;color:var(--muted);font-size:12.5px;margin-left:2px}
.todochips.v2todo .tc{border-radius:999px;padding:2px 11px;font-size:13px;line-height:1.5;border-width:1.5px}
.todochips.v2todo .tc b{font-size:13.5px}
.todochips.v2todo .tc.hot{border-color:var(--v2red);background:var(--v2redbg);color:var(--v2red)}
.todochips.v2todo .tc.warn{border-color:var(--v2amber);background:var(--v2amberbg);color:var(--v2amber)}
.todochips.v2todo .tc .go{display:none}
.todochips .tcnext{margin-left:auto}
body.hasgnb:not(.hastabs) .kpigrid.k7{gap:6px;margin-bottom:8px}
body.hasgnb:not(.hastabs) .kpigrid.k7 .kpicard{padding:5px 10px}
body.hasgnb:not(.hastabs) .kpigrid.k7 .kpicard .bignum{font-size:21px;line-height:1.1}
.xbar .drdays{align-items:center}
.drdays a.on{background:var(--char);border-color:var(--char);color:#fff}
/* [v1.63.0] 체크리스트 — 지금 할 단계만 진하게(차콜 테두리), 끝난 단계는 한 줄로 낮게 */
.ck2.cur{border:2px solid var(--char);box-shadow:0 2px 10px rgba(0,0,0,.06)}
.ck2.cur .ckn{background:var(--char);color:#fff}
.ck2.done{padding:7px 12px;opacity:.85}
.ck2{scroll-margin-top:110px}
@media (prefers-color-scheme: dark){.ck2.cur{border-color:var(--ink)}.ck2.cur .ckn{background:var(--ink);color:var(--card)}}
/* [v1.63.0] 체크리스트 '빠진 날' — ☎를 이름 옆 작은 버튼으로, 목록은 여러 칸(종전: ☎ 원이 한 줄씩 차지해 61명이 화면 6장) */
.ck2 .cklist{grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:2px 16px}
.ck2 .cklist>div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ck2 .cklist .tel{display:inline-flex;width:24px;height:24px;font-size:12px;vertical-align:middle;margin-left:4px}
/* [v1.63.0 사용자 지적 "대리 입력 버튼이 왜 찌그러져 있어"] 버튼 줄(.btnrow>*)은 칸마다 최대 270px로 나누는데,
   글자 길이만큼 서라고 width:auto를 준 버튼까지 270px에 묶여 두 줄로 접혔다(현황판 「✍ 대리 입력 (출퇴근 · 운행기록 · 전일상차)」 등 11곳).
   width:auto 버튼은 자기 글자 폭 그대로 한 줄. */
.btnrow>.btn[style*="width:auto"]{flex:0 0 auto;max-width:none;white-space:nowrap}
/* [v1.63.0] 머리 한 줄에서 메뉴가 잘리던 것(1071px에서 '설정'이 가로 스크롤 뒤로) — 메뉴는 줄이지 않고, 바로 찾기 칸이 줄어든다.
   1400px보다 좁으면 이름·역할 표시를 숨긴다(이름은 메뉴 오른쪽 로그아웃 옆에 늘 있을 필요가 없다). 휴대폰 폭(760px 이하)은 종전 두 줄. */
@media (min-width:761px){
  body.hasgnb:not(.hastabs) .gnb-menu{flex:0 0 auto;overflow:visible}
  body.hasgnb:not(.hastabs) .gnb-right{flex:1 1 auto;min-width:0;justify-content:flex-end}
  body.hasgnb:not(.hastabs) .gsearch{flex:1 1 140px;min-width:110px}
}
@media (min-width:761px) and (max-width:1400px){body.hasgnb:not(.hastabs) .gnb-right .who{display:none}}
@media (min-width:761px) and (max-width:1180px){body.hasgnb:not(.hastabs) .gmi{padding:10px 7px 8px}}
/* [v1.63.0 사용자 지적 "대리 입력 닫기 버튼만 따로 논다"] 기사 패널 = 등록 서랍(.xdrawer)과 같은 머리·닫기·탭 색.
   머리 = 위에 붙은 한 줄(아래 줄) · 닫기 = 오른쪽 위 [✕] 30px · 지금 탭 = 차콜 밑줄(종전 빨강 — 빨강은 경보에만) */
.drvpanel{padding-top:0}
.drvpanel .dp-head{position:sticky;top:0;z-index:2;background:var(--card);align-items:center;margin:0 -14px 8px;padding:8px 10px 8px 14px;border-bottom:1px solid var(--line)}
.drvpanel .dp-head h3{font-size:15px}
.drvpanel .dp-head #dpClose{min-height:30px;height:30px;padding:0 10px;flex:none}
.drvpanel .dp-tabs button.on{color:var(--ink);border-bottom-color:var(--char)}
@media (prefers-color-scheme: dark){.drvpanel .dp-tabs button.on{border-bottom-color:var(--ink)}}
/* 기사 패널 = 서랍 구조(머리 고정 · 몸통만 스크롤) — [✕]가 스크롤바 안쪽으로 밀려 다른 서랍보다 15px 안에 있던 것 */
.drvpanel{display:flex;flex-direction:column;overflow:hidden;padding:0}
.drvpanel .dp-head{position:static;margin:0;flex:none}
.drvpanel .dp-body{flex:1;min-height:0;overflow-y:auto;padding:4px 14px calc(18px + env(safe-area-inset-bottom))}
.drvpanel .dp-head{align-items:flex-start}