/* R98 — 오늘 업무의 팝업창: 종류별 색 · 유종 색 · 엑셀형 표 · 좁은 간격. (오늘 업무 홈 화면은 원래대로 둔다. 달력 메뉴·세차장·실마진도 그대로.) */
:root{
  --fuel-regular:#e8890c;   /* 무연 휘발유 */
  --fuel-diesel:#0f9a74;    /* 경유 */
  --fuel-premium:#c2255c;   /* 고급휘발유 */
  --fuel-kerosene:#2b7de9;  /* 등유 */
  --fuel-urea:#14a9c4;      /* 요소수 */
  --k-order:#7c3aed; --k-purchase:#0f8a8a; --k-delivery:#2563eb; --k-stockadj:#d97706; --k-expense:#059669; --k-calendar:#4f46e5;
}

/* ───────── 팝업: 종류별 색 · 엑셀형 표 · 좁은 간격 ───────── */
.pw-dialog{--k:#2563eb;padding:10px 12px!important;border-radius:14px!important;width:min(900px,97vw)!important}
.pw-dialog[data-kind="order"]{--k:var(--k-order)}
.pw-dialog[data-kind="purchase"]{--k:var(--k-purchase)}
.pw-dialog[data-kind="delivery"]{--k:var(--k-delivery)}
.pw-dialog[data-kind="stockadj"]{--k:var(--k-stockadj)}
.pw-dialog[data-kind="expense"]{--k:var(--k-expense)}
.cp-dialog,.cp-day-dialog{--k:var(--k-calendar)}
.pw-head{margin:0 0 8px!important;padding:6px 8px 6px 12px;border-radius:10px;border-left:5px solid var(--k);background:linear-gradient(90deg,color-mix(in srgb,var(--k) 16%,#fff),#fff 85%)}
.pw-head h2{font-size:1.08rem!important;color:color-mix(in srgb,var(--k) 70%,#10213a)}
.pw-head button{min-height:36px;padding:4px 12px}
.pw-dialog .pw-help{margin:4px 0!important;font-size:.82rem!important}
.pw-dialog .pw-controls{gap:8px!important}
.pw-dialog .pw-controls input,.pw-dialog .pw-controls select{font-size:1rem!important;padding:5px 8px!important}
.pw-dialog .pw-quick button,.pw-dialog .pw-chips button{font-size:.9rem!important;padding:5px 10px!important;min-height:34px}
.pw-dialog .pw-submit,.pw-dialog button.primary{background:var(--k)!important;border-color:var(--k)!important;color:#fff!important}
.pw-dialog .pw-submit{font-size:1.02rem!important;padding:9px 18px!important}
.pw-dialog .pw-actions{margin-top:6px!important;gap:8px!important}
.pw-dialog .pw-actions .quiet{font-size:.9rem!important;padding:7px 12px!important}
.pw-dialog .pw-form{gap:8px!important;margin:6px 0!important;grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.pw-dialog .pw-f{gap:2px!important;font-size:.82rem!important}
.pw-dialog .pw-f input,.pw-dialog .pw-f select{font-size:1rem!important;padding:6px 8px!important}
/* 표: 엑셀처럼 칸 선, 머리줄 색, 줄무늬 */
.pw-table{font-size:.92rem!important;border:1px solid #cfd9e6;border-radius:8px;overflow:hidden}
.pw-table thead th{background:color-mix(in srgb,var(--k) 12%,#f3f6fb);color:#23364f;font-size:.8rem;padding:5px 8px!important;border-bottom:1px solid #cfd9e6}
.pw-table th,.pw-table td{padding:4px 8px!important;border:1px solid #e3e9f2!important}
.pw-table tbody tr:nth-child(even){background:#fafcff}
.pw-table tbody th{font-weight:800}
.pw-table small{font-size:.74rem}
.pw-qty{gap:2px!important}
.pw-qty input{width:120px!important;font-size:1rem!important;padding:4px 8px!important}
.pw-qty span button{min-height:30px!important;padding:2px 8px!important;font-size:.8rem!important}
/* 유종 색 */
[data-fuel="REGULAR"]{--fc:var(--fuel-regular)} [data-fuel="DIESEL"]{--fc:var(--fuel-diesel)} [data-fuel="PREMIUM"]{--fc:var(--fuel-premium)} [data-fuel="KEROSENE"]{--fc:var(--fuel-kerosene)} [data-fuel="UREA"]{--fc:var(--fuel-urea)}
.pw-table tr[data-fuel]>th:first-child{border-left:5px solid var(--fc,#94a3b8)!important;background:color-mix(in srgb,var(--fc,#94a3b8) 12%,#fff)!important;color:color-mix(in srgb,var(--fc,#475569) 80%,#10213a)}
.pc-ev[data-fuel]{border-left:4px solid var(--fc,#94a3b8);padding-left:6px;background:color-mix(in srgb,var(--fc,#94a3b8) 8%,#fff);border-radius:6px}
/* 물량 요약 */
.pw-trucks{gap:6px!important;margin:8px 0!important;padding:8px 10px!important;border:1px solid color-mix(in srgb,var(--k) 45%,#fff)!important;border-radius:10px!important;background:color-mix(in srgb,var(--k) 7%,#fff)!important}
.pw-trucks strong{font-size:1.08rem!important;color:color-mix(in srgb,var(--k) 75%,#10213a)!important}
.pw-trucks span{font-size:.74rem!important}
.pw-fill b{font-size:.9rem}
.pw-truck-edit input{width:70px!important;font-size:1rem!important;padding:3px 6px!important}
/* 매입발주 달력 부분 */
.pc-cal{margin-bottom:8px!important}
.pc-head{margin-bottom:4px!important}
.pc-head button{min-height:36px!important}
.pc-head strong{font-size:1.05rem!important}
.pc-legend{margin:2px 0 4px!important;font-size:.8rem!important}
.pc-week span{font-size:.8rem!important}
.pc-day{min-height:48px!important;padding:3px 4px!important;border-radius:7px!important}
.pc-day.sel{background:color-mix(in srgb,var(--k) 12%,#fff)!important;border-color:var(--k)!important}
.pc-day.today{border-color:var(--k)!important;box-shadow:inset 0 0 0 1px var(--k)!important}
.pc-chip{font-size:.72rem!important}
.pc-detail{margin-top:6px!important;padding:6px 10px!important;border-radius:8px!important;background:color-mix(in srgb,var(--k) 5%,#fff)!important;border-color:color-mix(in srgb,var(--k) 30%,#fff)!important}
.pc-detail h4{margin:0 0 3px!important;font-size:.95rem}
.pc-detail ul{margin:0 0 4px!important;gap:3px!important}
.pc-ev{font-size:.9rem!important}
.pc-order{border-top:2px solid color-mix(in srgb,var(--k) 35%,#fff)!important;padding-top:6px!important}
.pc-order h3{margin:0 0 4px!important;font-size:1rem;color:color-mix(in srgb,var(--k) 75%,#10213a)}
.ps-reqs label{padding:5px 8px!important;font-size:.9rem!important}
/* 달력 팝업(오늘 업무) */
.cp-dialog{padding:10px 12px!important;width:min(980px,97vw)!important}
.cp-bar{margin-bottom:4px!important}
.cp-bar button,.cp-station select{min-height:38px!important}
.cp-bar strong{font-size:1.1rem!important}
.cp-day{min-height:clamp(50px,9.2vh,80px)!important}
.cp-legend{margin:4px 0 0!important}
.cp-dialog .pw-help{margin:2px 0 0!important}
@media (max-width:640px){
  .pw-dialog{width:98vw!important;padding:8px!important}
  .pw-table td[data-label]{padding:2px 4px!important}
  .pw-table tr{margin:0 0 6px!important;padding:4px 6px!important}
  .pw-table th{font-size:1rem!important}
  .pw-dialog .pw-form{grid-template-columns:1fr 1fr!important}
  .pw-dialog .pw-f.pw-wide{grid-column:1 / -1}
}
/* R98 — 폰에서도 발주 표를 카드가 아니라 엑셀 표로(칸 5개: 유종·지금·그날·필요·신청) */
@media (max-width:680px){
  .pw-dialog .pw-table{display:table!important;width:100%!important;table-layout:fixed}
  .pw-dialog .pw-table thead{display:table-header-group!important}
  .pw-dialog .pw-table tbody{display:table-row-group!important}
  .pw-dialog .pw-table tr{display:table-row!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important}
  .pw-dialog .pw-table th,.pw-dialog .pw-table td,.pw-dialog .pw-table td[data-label]{display:table-cell!important;width:auto!important;padding:4px 5px!important;font-size:.82rem!important;text-align:right;vertical-align:middle}
  .pw-dialog .pw-table th:first-child{text-align:left;width:22%!important}
  .pw-dialog .pw-table td[data-label]::before{content:none!important}
  .pw-dialog .pw-table thead th{font-size:.7rem!important;padding:3px 4px!important;line-height:1.1}
  .pw-dialog .pw-table th small{font-size:.66rem}
  .pw-dialog .pw-table td .pw-warn{display:block;font-size:.66rem;padding:2px 4px;margin-top:2px}
  .pw-dialog .pw-qty{justify-items:end}
  .pw-dialog .pw-qty input{width:88px!important;font-size:.95rem!important}
  .pw-dialog .pw-qty span{flex-direction:column;gap:2px}
  .pw-dialog .pw-qty span button{font-size:.68rem!important;min-height:24px!important;padding:1px 6px!important}
  .pw-dialog .pw-trucks{grid-template-columns:1fr 1fr!important}
}
.pw-dialog .pw-submit,.pw-dialog button.primary{background-image:none!important;box-shadow:0 2px 8px color-mix(in srgb,var(--k) 35%,transparent)!important}
@media (max-width:680px){
  .pw-dialog .pw-table td:last-child{width:34%!important}
  .pw-dialog .pw-qty{width:100%}
  .pw-dialog .pw-qty input{width:100%!important}
  .pw-dialog .pw-qty span{flex-direction:row;justify-content:flex-end}
}
html.vn dialog.pw-dialog .pw-submit,html.vn dialog.pw-dialog button.primary,html.vn dialog.pw-dialog .pw-actions .primary{background:var(--k)!important;background-image:none!important;border-color:var(--k)!important;color:#fff!important}

/* R98b — 발주 신청 팝업 간격 더 줄이기: 날짜·빠른선택·탱크로리 한 줄, 수량 칸과 단추 한 줄, 물량 요약 한 줄 */
.pw-head{margin:0 0 4px!important;padding:4px 6px 4px 10px!important}
.pw-dialog .pw-controls{display:flex!important;flex-wrap:wrap;align-items:flex-end;gap:4px 8px!important;margin:0!important}
.pw-dialog .pw-controls label{flex:0 1 auto;gap:1px!important;font-size:.78rem!important;margin:0}
.pw-dialog .pw-controls input,.pw-dialog .pw-controls select{padding:3px 8px!important;min-height:34px;font-size:.95rem!important}
.pw-dialog .pw-quick{gap:4px!important}
.pw-dialog .pw-quick button{min-height:34px!important;padding:3px 9px!important;font-size:.82rem!important}
.pw-dialog .pw-help{margin:3px 0!important;font-size:.78rem!important;line-height:1.3}
.pw-table th,.pw-table td{padding:2px 8px!important}
.pw-table thead th{padding:3px 8px!important}
.pw-table tbody th small{display:inline;margin-left:4px}
.pw-qty{display:flex!important;align-items:center;justify-content:flex-end;gap:6px!important}
.pw-qty input{width:104px!important;padding:2px 8px!important;min-height:30px}
.pw-qty span{display:flex;gap:4px}
.pw-qty span button{min-height:28px!important;padding:1px 8px!important}
.pw-table .pw-warn{display:inline-block;margin:0 0 0 6px;padding:1px 6px;font-size:.72rem}
.pw-trucks{display:flex!important;flex-wrap:wrap;align-items:center;gap:2px 16px!important;margin:5px 0!important;padding:5px 10px!important}
.pw-trucks>div,.pw-trucks>label{display:flex!important;align-items:baseline;gap:6px;margin:0}
.pw-trucks span{display:inline!important;font-size:.74rem!important}
.pw-trucks strong{font-size:.98rem!important}
.pw-truck-edit input{width:56px!important;padding:2px 6px!important;min-height:28px}
.pw-dialog .pw-actions{margin-top:4px!important}
.pw-dialog .pw-submit{padding:7px 16px!important;font-size:.98rem!important}
#pwMessage,.pw-dialog [role="status"]{margin:3px 0 0;font-size:.82rem}
@media (max-width:680px){
  .pw-dialog .pw-controls label{flex:1 1 140px}
  .pw-dialog .pw-quick{flex:0 0 auto}
  .pw-dialog .pw-quick button{padding:3px 7px!important}
  .pw-dialog .pw-qty{flex-wrap:nowrap}
  .pw-dialog .pw-qty input{width:100%!important;min-width:0}
  .pw-dialog .pw-qty span{display:none}
  .pw-dialog .pw-trucks{gap:2px 10px!important}
}
@media (max-width:680px){
  .pw-dialog .pw-qty{flex-wrap:wrap;justify-content:flex-end;gap:2px 4px!important}
  .pw-dialog .pw-qty span{display:flex!important;gap:3px}
  .pw-dialog .pw-qty span button{font-size:.66rem!important;min-height:22px!important;padding:0 6px!important}
  .pw-dialog .pw-qty input{width:100%!important}
}
@media (max-width:680px){
  .pw-dialog .pw-qty{display:grid!important;justify-items:end;gap:2px!important}
  .pw-dialog .pw-qty span{flex-wrap:nowrap}
  .pw-dialog .pw-qty span button{white-space:nowrap!important}
  .pw-dialog .pw-table th:first-child{width:19%!important}
  .pw-dialog .pw-table td:last-child{width:38%!important}
  .pw-dialog .pw-table tbody th small{display:block;margin:0}
}
@media (max-width:680px){
  .pw-dialog .pw-table td:last-child{overflow:hidden}
  .pw-dialog .pw-qty{width:100%!important;min-width:0!important;justify-items:stretch}
  .pw-dialog .pw-qty input{width:100%!important;min-width:0!important;text-align:right}
  .pw-dialog .pw-qty span{width:100%;display:flex!important;gap:3px}
  .pw-dialog .pw-qty span button{flex:1 1 0;min-width:0;padding:0 2px!important;font-size:.6rem!important}
  .pw-dialog .pw-table td .pw-warn{white-space:normal;word-break:keep-all;font-size:.62rem;line-height:1.15}
}
@media (max-width:680px){
  .pw-dialog .pw-table th:first-child{width:18%!important}
  .pw-dialog .pw-table th:nth-child(2),.pw-dialog .pw-table th:nth-child(3){width:15%!important}
  .pw-dialog .pw-table th:nth-child(4){width:18%!important}
  .pw-dialog .pw-table th:last-child{width:34%!important}
}

/* R99 — 폰 팝업: 입력칸·단추·글씨를 더 작게, 간격 줄이기 (PC는 그대로) */
@media (max-width:680px){
  .pw-dialog{padding:6px 8px!important}
  .pw-head{padding:3px 4px 3px 8px!important;margin:0 0 3px!important}
  .pw-head h2{font-size:.92rem!important;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
  .pw-head button{min-height:30px!important;padding:2px 10px!important;font-size:.8rem!important}
  .pw-dialog input,.pw-dialog select,.pw-dialog textarea{min-height:34px!important;height:auto!important;padding:3px 8px!important;font-size:.9rem!important;border-radius:8px!important}
  .pw-dialog label,.pw-dialog .pw-f,.pw-dialog .pw-controls label{font-size:.72rem!important;gap:1px!important}
  .pw-dialog .pw-help{font-size:.72rem!important;line-height:1.25!important;margin:2px 0!important}
  .pw-dialog .pw-controls{gap:3px 6px!important}
  .pw-dialog .pw-controls label{flex:1 1 120px}
  .pw-dialog .pw-quick button,.pw-dialog .pw-chips button,.pw-dialog .quiet{min-height:30px!important;padding:2px 8px!important;font-size:.78rem!important}
  .pw-dialog .pw-chips{flex-wrap:nowrap;gap:4px;margin-top:2px}
  .pw-dialog .pw-form{grid-template-columns:1fr 1fr!important;gap:4px 6px!important;margin:3px 0!important}
  .pw-dialog .pw-actions{gap:6px!important;margin-top:3px!important}
  .pw-dialog .pw-actions .quiet{font-size:.78rem!important;padding:5px 8px!important}
  .pw-dialog .pw-submit{padding:6px 12px!important;font-size:.9rem!important}
  .pw-dialog .pw-table th{font-size:.9rem!important}
  .pw-dialog .pw-table td,.pw-dialog .pw-table th{padding:3px 4px!important}
  .pw-dialog .pw-trucks{padding:4px 8px!important;margin:4px 0!important}
  .pw-dialog .pw-trucks strong{font-size:.9rem!important}
  .pw-dialog .pw-trucks span{font-size:.68rem!important}
  /* 매입발주 달력 */
  .pc-cal{margin-bottom:4px!important}
  .pc-head{gap:4px!important;margin-bottom:2px!important}
  .pc-head button{min-height:30px!important;min-width:36px!important;padding:2px 8px!important;font-size:.8rem}
  .pc-head strong{font-size:.95rem!important}
  .pc-legend{font-size:.68rem!important;margin:1px 0 2px!important;gap:2px 6px!important}
  .pc-week span{font-size:.7rem!important}
  .pc-day{min-height:36px!important;padding:2px 3px!important}
  .pc-day b{font-size:.82rem!important}
  .pc-chip{font-size:.62rem!important;padding:0 4px!important}
  .pc-detail{padding:4px 8px!important;margin-top:3px!important}
  .pc-detail h4{font-size:.85rem!important}
  .pc-ev{font-size:.8rem!important}
  .pc-order h3{font-size:.9rem!important}
  .pc-order{padding-top:3px!important}
  .ps-reqs label{font-size:.8rem!important;padding:3px 6px!important}
  /* 달력 팝업 */
  .cp-dialog{padding:6px 8px!important}
  .cp-bar{gap:4px!important}
  .cp-bar button,.cp-station select{min-height:32px!important;padding:2px 8px!important;font-size:.8rem!important}
  .cp-bar strong{font-size:.95rem!important;min-width:0}
  .cp-day{min-height:clamp(42px,7.6vh,62px)!important;padding:2px 3px!important}
  .cp-day>b{font-size:.85rem!important}
  .cp-legend{font-size:.68rem!important;gap:2px 5px!important}
  .cp-legend span{padding:1px 6px!important}
  .cp-row{font-size:.82rem!important;min-height:30px!important}
  .cp-formbox>summary{min-height:34px!important;padding:6px 10px!important}
}

/* R100 — 오늘 업무 홈: 원래의 네모 카드 모양은 그대로 두고 색을 입히고 간격만 줄인다.
   카드 윗줄·연한 바탕은 업무 색, 단추는 세 개(사진·파일 / 원본서식 / 직접 입력) 모두 그대로 — 작게 모아 둔다. 칸 수(PC 4칸·폰 2칸)는 그대로. */
html.vn .vh-field .vh-ftasks{padding:10px!important}
html.vn .vh-field .vh-fgrid{gap:8px!important}
html.vn .vh-field .vh-fgrid-period{margin-top:8px!important}
html.vn .vh-field .vh-ftask,html.vn .vh-field .vh-fperiod{
  --rc:#94a3b8;
  display:flex!important;flex-wrap:wrap;align-content:flex-start;align-items:center;justify-items:unset;gap:4px 6px;
  min-height:0!important;padding:8px 9px 9px!important;border-radius:12px;
  border:1px solid color-mix(in srgb,var(--rc) 30%,#e3eaf3)!important;border-top:5px solid var(--rc)!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--rc) 11%,#fff),#fff 62%)!important;box-shadow:0 1px 3px rgba(20,40,80,.07)!important;
}
html.vn .vh-field .vh-ftask:has([style*="#e5484d"]),html.vn .vh-field .vh-fperiod:has([style*="#e5484d"]){--rc:#e5484d}
html.vn .vh-field .vh-ftask:has([style*="#2f7bff"]){--rc:#2f7bff}
html.vn .vh-field .vh-ftask:has([style*="#16a34a"]){--rc:#16a34a}
html.vn .vh-field .vh-ftask:has([style*="#f59e0b"]){--rc:#f59e0b}
html.vn .vh-field .vh-fperiod:has([style*="#8b5cf6"]){--rc:#8b5cf6}
html.vn .vh-field .vh-fperiod:has([style*="#0ea5e9"]){--rc:#0ea5e9}
html.vn .vh-field .vh-ftask .vh-ftask-ic,html.vn .vh-field .vh-fperiod .vh-ftask-ic{flex:0 0 28px;width:28px!important;height:28px!important;border-radius:8px!important;margin:0!important}
html.vn .vh-field .vh-ftask .vh-ftask-ic svg,html.vn .vh-field .vh-fperiod .vh-ftask-ic svg{width:16px;height:16px}
html.vn .vh-field .vh-ftask>strong,html.vn .vh-field .vh-fperiod>strong{flex:1 1 0;min-width:0;font-size:1rem!important;font-weight:800;margin:0}
html.vn .vh-field .vh-ftask .vh-pill,html.vn .vh-field .vh-fperiod .vh-pill{flex:0 0 auto;margin:0;padding:0 8px;font-size:.7rem}
html.vn .vh-field .vh-ftask>small,html.vn .vh-field .vh-fperiod>small,html.vn .vh-field .vh-fmini{flex:1 1 100%;margin:0!important;font-size:.76rem;line-height:1.25;color:#5b6b82;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html.vn .vh-field .vh-fmini{display:flex!important;flex-wrap:wrap;gap:1px 10px;padding:0!important;list-style:none;-webkit-line-clamp:unset}
html.vn .vh-field .tw-task-download{display:contents!important}
html.vn .vh-field .tw-task-download p:empty{display:none}
html.vn .vh-field .tw-task-download p:not(:empty){flex:1 1 100%;margin:0;font-size:.72rem}
html.vn .vh-field .vh-fbtns{display:flex!important;flex-wrap:wrap;gap:4px;margin:0!important;flex:1 1 100%}
html.vn .vh-field .vh-fbtn{width:auto!important;min-height:32px!important;margin:0!important;padding:3px 8px!important;font-size:.78rem!important;font-weight:700;border-radius:8px!important;line-height:1.15;text-align:center;flex:1 1 calc(50% - 3px)}
html.vn .vh-field .vh-ftask>.vh-fbtn:first-of-type{flex:1 1 100%}
html.vn .vh-field .vh-ftask .vh-fbtn:not([data-form-download]):not([data-today-manual]),html.vn .vh-field .vh-fperiod .vh-fbtn:not(.alt){background:var(--rc)!important;color:#fff!important;border:1px solid var(--rc)!important}
html.vn .vh-field .vh-fbtn.alt,html.vn .vh-field .vh-fbtn[data-form-download],html.vn .vh-field .vh-fbtn[data-today-manual]{background:#fff!important;color:#25405f!important;border:1px solid color-mix(in srgb,var(--rc) 45%,#c9d6e6)!important}
html.vn .vh-field .vh-fbtns .vh-fbtn:only-child{flex:1 1 100%}
@media (max-width:640px){
  html.vn .vh-field .vh-ftasks{padding:8px!important}
  html.vn .vh-field .vh-fgrid{gap:6px!important}
  html.vn .vh-field .vh-ftask,html.vn .vh-field .vh-fperiod{padding:7px 7px 8px!important;gap:3px 5px}
  html.vn .vh-field .vh-ftask>strong,html.vn .vh-field .vh-fperiod>strong{font-size:.92rem!important}
  html.vn .vh-field .vh-fbtn{min-height:30px!important;padding:2px 5px!important;font-size:.7rem!important}
  html.vn .vh-field .vh-ftask>small,html.vn .vh-field .vh-fperiod>small{-webkit-line-clamp:1}
}

/* R102 — 매입발주 달력(여러 날 선택 · 날짜별 수량표 · 자동 계산) */
.pcx-dialog{width:min(1020px,98vw)!important}
.pcx-body{display:grid;gap:6px;overflow:auto;max-height:calc(94vh - 56px)}
.pcx-body section:empty{display:none}
.pcx-bar{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.pcx-bar strong{font-size:1.1rem;min-width:8.5ch;text-align:center}
.pcx-bar .quiet{min-height:34px;padding:2px 10px}
.pcx-sp{flex:1 1 8px}
.pcx-auto{min-height:36px;padding:3px 16px;border-radius:999px;border:0;font-weight:800;color:#3b2a00;background:linear-gradient(180deg,#ffe27a,#ffbf2e);box-shadow:0 2px 6px rgba(200,140,0,.35);cursor:pointer}
.pcx-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px}
.pcx-blank{display:block}
.pcx-day{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:1px;min-height:50px;padding:3px 4px;border:1px solid #d3dce8;border-radius:8px;background:#fff;color:#17283c;text-align:left;cursor:pointer;overflow:hidden}
.pcx-day b{font-size:.95rem}
.pcx-day.sun b{color:#d92d20}.pcx-day.sat b{color:#175cd3}
.pcx-day.past{background:#f6f8fb;color:#7a8799}
.pcx-day.today{box-shadow:inset 0 0 0 2px #2f7bff}
.pcx-day.on{background:color-mix(in srgb,var(--k) 18%,#fff);border-color:var(--k);box-shadow:inset 0 0 0 2px var(--k)}
.pcx-day em{position:absolute;right:4px;top:2px;font-style:normal;font-weight:900;color:#fff;background:var(--k);border-radius:50%;width:18px;height:18px;line-height:18px;text-align:center;font-size:.72rem}
.pcx-keyon{display:inline-block;font-weight:900;color:#fff;background:var(--k);border-radius:50%;width:16px;height:16px;line-height:16px;text-align:center;font-size:.66rem}
.pcx-stock{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center;padding:4px 8px;border:1px solid color-mix(in srgb,var(--k) 30%,#fff);border-radius:8px;background:color-mix(in srgb,var(--k) 5%,#fff);font-size:.82rem}
.pcx-st{padding:1px 8px;border-radius:999px;border-left:4px solid var(--fc,#94a3b8);background:color-mix(in srgb,var(--fc,#94a3b8) 12%,#fff)}
.pcx-st small{color:#5b6b82}.pcx-asof{color:#6b7a8d;margin-left:auto}
.pcx-hintline{padding:6px 8px;border-radius:8px;background:color-mix(in srgb,var(--k) 7%,#fff);margin:2px 0!important}
.pcx-scroll{overflow-x:auto}
.pcx-tbl input{width:84px;text-align:right;font-weight:800;padding:2px 6px!important;min-height:30px!important}
.pcx-tbl td.pcx-sup input{width:80px;text-align:left;font-weight:700}
.pcx-tbl th[data-fuel],.pcx-tbl td[data-fuel]{border-top:3px solid var(--fc,#94a3b8)}
.pcx-tbl td[data-fuel]{background:color-mix(in srgb,var(--fc,#94a3b8) 6%,#fff)}
.pcx-tbl td{vertical-align:top;text-align:right;white-space:nowrap}
.pcx-tbl th[scope="row"]{text-align:left;white-space:nowrap}
.pcx-past{color:#b45309;font-weight:600}
.pcx-fill{display:block;margin:1px 0 0 auto;padding:0 6px;min-height:20px;border:1px dashed color-mix(in srgb,var(--fc,#94a3b8) 60%,#fff);border-radius:6px;background:#fff;color:#3a4b63;font-size:.7rem;cursor:pointer}
.pcx-more{min-height:30px;padding:2px 8px;border:1px solid #b9c8dc;border-radius:7px;background:#fff;font-size:.78rem;cursor:pointer}
.pcx-x{min-height:28px;min-width:28px;border:0;border-radius:50%;background:#fde4e4;color:#a30f1f;font-weight:900;cursor:pointer}
.pcx-sum{font-weight:800}
.pcx-plan{padding:6px 10px;border:1px solid #f0d28a;border-radius:10px;background:#fffbea;font-size:.86rem}
.pcx-plan ul{list-style:none;margin:4px 0;padding:0;display:grid;gap:3px}
.pcx-plan li{display:flex;flex-wrap:wrap;gap:2px 8px;align-items:baseline;padding:2px 6px;border-left:4px solid var(--fc,#94a3b8);background:color-mix(in srgb,var(--fc,#94a3b8) 10%,#fff);border-radius:6px}
.pcx-plan li small{color:#5b6b82;font-size:.74rem}.pcx-plan em{color:#b42318;font-style:normal;font-weight:800}
.pcx-plan>small{display:block;color:#6b5a1a;font-size:.74rem}
.pcx-h{margin:4px 0 2px;font-size:.95rem}.pcx-h small{font-weight:500;color:#6b7a8d}
.pcx-exist td{white-space:nowrap}.pcx-exist td.r{text-align:right}
.pcx-ev.rc td:first-child{border-left:4px solid #1ab87a}.pcx-ev.ex td:first-child{border-left:4px solid #2563eb}.pcx-ev.rq td:first-child{border-left:4px solid #e08a00}
.pcx-ac{display:flex;gap:4px;flex-wrap:wrap}.pcx-ac button,.pcx-ed button{min-height:30px;padding:2px 9px;border:1px solid #b9c8dc;border-radius:7px;background:#fff;font-size:.78rem;font-weight:700;cursor:pointer}
.pcx-ac button.danger,.pcx-ed button.danger{color:#a30f1f;border-color:#e5b3b9}
.pcx-ed{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:flex-end;padding:6px;background:#f4f8ff;border-radius:8px}
.pcx-ed label{display:grid;gap:1px;font-size:.72rem;font-weight:700}.pcx-ed input,.pcx-ed select{min-height:32px;padding:2px 6px;font-size:.9rem}
#pcxMsg{margin:2px 0;min-height:1.2em;font-size:.86rem;font-weight:600}#pcxMsg.ok{color:#067647}#pcxMsg.bad{color:#b42318}
.pcx-other{width:min(520px,96vw)!important}
.pcx-other input{width:100%;text-align:right;font-weight:800}
@media (max-width:680px){
  .pcx-bar strong{font-size:.98rem;min-width:0}.pcx-bar .quiet{min-height:30px;padding:1px 8px;font-size:.78rem}.pcx-auto{min-height:32px;padding:2px 12px;font-size:.82rem}
  .pcx-day{min-height:40px;padding:2px 3px}.pcx-day b{font-size:.82rem}.pcx-day .pc-chip{font-size:.58rem!important;padding:0 3px!important}.pcx-day em{width:15px;height:15px;line-height:15px;font-size:.6rem}
  .pcx-stock{font-size:.74rem}.pcx-st small{display:none}
  .pcx-tbl input{width:64px;font-size:.9rem!important;min-height:28px!important}
  .pw-dialog .pcx-tbl{display:table!important;table-layout:auto!important;width:auto!important}
  .pw-dialog .pcx-tbl th,.pw-dialog .pcx-tbl td,.pw-dialog .pcx-tbl td[data-label]{width:auto!important;font-size:.8rem!important;padding:2px 3px!important}
  .pw-dialog .pcx-tbl th:first-child{width:auto!important}
  .pw-dialog .pcx-exist{display:table!important;table-layout:auto!important;width:auto!important}
  .pw-dialog .pcx-exist th,.pw-dialog .pcx-exist td{width:auto!important;font-size:.76rem!important;padding:2px 4px!important}
}

/* R102 — 오늘 업무 달력 팝업: 보여줄 종류 선택(칩) */
.cp-cats{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin:2px 0 6px}
.cp-cat{display:inline-flex;align-items:center;gap:4px;min-height:30px;padding:2px 10px;border-radius:999px;border:1.5px solid color-mix(in srgb,var(--c) 55%,#fff);background:#fff;color:#5b6b82;font-size:.8rem;font-weight:700;cursor:pointer}
.cp-cat small{font-size:.7rem;opacity:.8}
.cp-cat.on{background:color-mix(in srgb,var(--c) 22%,#fff);color:#14233b;border-color:var(--c);box-shadow:inset 0 0 0 1px var(--c)}
.cp-cat.on::before{content:"✓";font-weight:900;color:var(--c)}
.cp-catact{display:inline-flex;gap:4px;margin-left:auto}
.cp-catact .quiet{min-height:30px;padding:2px 10px;font-size:.78rem}
@media (max-width:640px){.cp-cat{min-height:28px;padding:1px 8px;font-size:.72rem}.cp-catact .quiet{min-height:28px;padding:1px 8px;font-size:.72rem}}
/* R102 — 폰에서 표가 넓어도 팝업 전체가 옆으로 밀리지 않게(표만 안에서 좌우로 넘김) */
.pcx-body{grid-template-columns:minmax(0,1fr);overflow-x:hidden}
.pcx-body>section{min-width:0}
.pcx-scroll{max-width:100%}

/* R102b — 폰 누르기 쉬운 크기(어르신): 닫기·종류 칩·✕·기타·표의 수량 칸은 최소 34~36px */
.pcx-idle{opacity:.55}
@media (max-width:680px){
  .pw-head button,.pw-dialog .pw-head .quiet{min-height:36px!important;min-width:56px}
  .cp-cat{min-height:34px!important}.cp-catact .quiet{min-height:34px!important}
  .pcx-bar .quiet,.pcx-auto{min-height:36px!important}
  .pcx-x,.pcx-more{min-height:34px!important;min-width:34px}
  .pcx-tbl input,.pcx-tbl td.pcx-sup input{min-height:36px!important}
  .pcx-fill{min-height:26px}
  .cp-bar button,.cp-station select{min-height:36px!important}
  .pw-dialog .quiet{min-height:34px!important}
}

/* R102c — 누르기 쉬운 크기: 달·종류 단추는 폭도 40px 이상, 표 안 보조 단추는 높이 32px 이상 */
.pcx-bar .quiet,.cp-bar .quiet,.pc-head .quiet{min-width:40px}
.cp-cat{min-height:32px}
.cp-catact .quiet{min-height:32px}
.pcx-fill{min-height:32px;min-width:52px;font-size:.74rem}
.pcx-ac button,.pcx-ed button{min-height:34px}
@media (max-width:680px){
  .pcx-bar .quiet,.cp-bar .quiet{min-width:40px!important}
  .pcx-ac button,.pcx-ed button{min-height:36px!important}
  .pcx-fill{min-height:32px!important}
  .pcx-body button,.cp-body button{min-height:34px}
}
.pcx-buf{display:inline-flex;align-items:center;gap:4px;font-size:.8rem;font-weight:700}.pcx-buf select{min-height:34px;padding:2px 6px}

/* R102d — 홈을 불러오는 동안 안내(빈 화면 방지) */
.vh-loading{display:flex;align-items:center;gap:10px;margin:8px;padding:14px 16px;border:1px solid #cfdcf2;border-radius:12px;background:#f2f7ff;color:#25405f;font-weight:700}
.vh-loading i{width:18px;height:18px;border-radius:50%;border:3px solid #b9cdf0;border-top-color:#2f7bff;animation:vhspin .9s linear infinite}
@keyframes vhspin{to{transform:rotate(360deg)}}
/* R103 — 옛 발주 신청 팝업(폰)의 [필요한 만큼]·[가득]도 누르기 쉬운 높이로 */
@media (max-width:680px){
  .pw-dialog .pw-qty span button{min-height:32px!important;font-size:.7rem!important}
}

/* ── R110 대표 홈: 보고 받는 표 · 주유소 설명창 · 주변단가 비교 ── */
html.vn .vh-ceo .vh-rtable th, html.vn .vh-ceo .vh-rtable td { padding: 5px 8px; font-size: .95rem; white-space: nowrap; }
html.vn .vh-ceo .vh-rtable thead th { background: #eef3fa; color: #34455c; }
html.vn .vh-ceo .vh-rtable td { text-align: center; font-weight: 700; }
html.vn .vh-ceo .vh-rtable td.ok { background: #e9f8ef; color: #0b6b3a; }
html.vn .vh-ceo .vh-rtable td.warn { background: #fff4dc; color: #8a5a00; }
html.vn .vh-ceo .vh-rtable td.bad { background: #ffe9e9; color: #a30f1f; }
html.vn .vh-ceo .vh-rtable td.na { background: #f3f5f8; color: #8793a3; font-weight: 400; }
html.vn .vh-ceo .vh-rtable tr.open th { box-shadow: inset 4px 0 0 #e5484d; }
html.vn .vh-ceo .vh-rtable tr.done th { box-shadow: inset 4px 0 0 #16a34a; }
html.vn .vh-ceo .vh-rtable th[scope="row"] { text-align: left; }
.vh-sname { cursor: help; border-bottom: 1px dotted #6b7a8d; padding: 2px 0; }
.vh-rtable td[data-vh-hover] { cursor: help; }
.vh-hover { position: fixed; z-index: 9999; width: min(340px, calc(100vw - 16px)); max-height: 70vh; overflow: auto; padding: 10px 12px; border: 1px solid #b9c7da; border-radius: 10px; background: #fff; color: #1d2b3c; box-shadow: 0 10px 28px rgba(20, 40, 70, .22); font-size: .9rem; pointer-events: none; }
.vh-hover[hidden] { display: none; }
.vh-hover h4 { margin: 0 0 6px; font-size: 1rem; }
.vh-hover h5 { margin: 8px 0 4px; font-size: .9rem; color: #34455c; }
.vh-hv-l { list-style: none; margin: 0 0 6px; padding: 0; display: grid; gap: 2px; }
.vh-hv-l li { display: flex; justify-content: space-between; gap: 10px; }
.vh-hv-l b.ok { color: #0b6b3a; } .vh-hv-l b.warn { color: #8a5a00; } .vh-hv-l b.bad { color: #a30f1f; }
.vh-hv-t { width: 100%; border-collapse: collapse; }
.vh-hv-t th, .vh-hv-t td { padding: 2px 6px; border-bottom: 1px solid #e3e9f1; text-align: left; font-weight: 600; }
.vh-hv-t th small { display: block; font-weight: 400; color: #6b7a8d; }
.vh-hv-t .r { text-align: right; }
.vh-hv-t tr.risk th, .vh-hv-t tr.risk td { background: #ffe9e9; color: #a30f1f; }
.vh-hv-t .up { color: #b42318; } .vh-hv-t .down { color: #0b6b3a; }
.vh-hv-na, .vh-hv-n { margin: 4px 0 0; color: #6b7a8d; font-size: .82rem; }
.vh-dlg { width: min(560px, calc(100vw - 16px)); max-height: 86vh; padding: 12px 14px; border: 1px solid #b9c7da; border-radius: 12px; }
.vh-dlg::backdrop { background: rgba(15, 30, 55, .45); }
.vh-dlg-h { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.vh-dlg-h h3 { margin: 0; }
.vh-dlg .na { color: #6b7a8d; text-align: center; }
@media (max-width: 720px) {
  html.vn .vh-ceo .vh-rtable th, html.vn .vh-ceo .vh-rtable td { padding: 6px 5px; font-size: .86rem; }
  .vh-hover { pointer-events: auto; }
}

/* R127 — 읽기 쉬움: ① 오늘 할 일 단추(주황·초록·하늘 등)의 흰 글자 대비를 4.5 이상으로(주황 2.1 → 4.6) */
html.vn .vh-field .vh-ftask,html.vn .vh-field .vh-fperiod{--rcd:color-mix(in srgb,var(--rc) 88%,#000)}
html.vn .vh-field .vh-ftask:has([style*="#f59e0b"]){--rcd:#a36a07}
html.vn .vh-field .vh-ftask:has([style*="#16a34a"]){--rcd:#128038}
html.vn .vh-field .vh-fperiod:has([style*="#0ea5e9"]){--rcd:#0a7cb0}
html.vn .vh-field .vh-ftask:has([style*="#e5484d"]),html.vn .vh-field .vh-fperiod:has([style*="#e5484d"]){--rcd:#cf3a3f}
html.vn .vh-field .vh-ftask:has([style*="#2f7bff"]){--rcd:#2a6fe8}
html.vn .vh-field .vh-fperiod:has([style*="#8b5cf6"]){--rcd:#7a4fe0}
html.vn .vh-field .vh-ftask .vh-fbtn:not([data-form-download]):not([data-today-manual]),html.vn .vh-field .vh-fperiod .vh-fbtn:not(.alt){background:var(--rcd)!important;border-color:var(--rcd)!important}
/* ② 직원 오늘 업무: 8~10px 보조 글자를 11px 이상, 연한 회색을 진하게(대비 3.2 → 5) */
html[data-ui-role="STAFF"] .work-stat small,html[data-ui-role="STAFF"] .role-alert-copy small,html[data-ui-role="STAFF"] .role-alert-copy strong,html[data-ui-role="STAFF"] .role-panel-kicker,html[data-ui-role="STAFF"] .role-panel-head .text-link,html[data-ui-role="STAFF"] .mini-calendar-week span,html[data-ui-role="STAFF"] .role-alert-time,html[data-ui-role="STAFF"] .staff-today em{font-size:11px!important;color:#43566d!important}
html[data-ui-role="STAFF"] .mini-calendar-day b{font-size:11px!important}
html[data-ui-role="STAFF"] .role-panel-head .text-link{color:#0b57d0!important}
/* 바로가기·현장요약 칸은 높이가 빠듯한 1024px 태블릿에서는 키우지 않는다(줄이 늘어 아래가 잘림) — 1200px 이상에서만 */
@media (min-width:1200px){html[data-ui-role="STAFF"] .v120-staff-board small{font-size:11px!important;color:#43566d!important}html[data-ui-role="STAFF"] .v120-staff-board button strong{font-size:11.5px!important}}
html[data-ui-role="STAFF"] .role-comms button strong,html[data-ui-role="STAFF"] .role-comms button span{font-size:11.5px!important}
.v120-staff-board .nodata{color:#a34a00!important}
html .v120-staff-board .staff-summary b.nodata{font-size:13px!important;color:#a34a00!important;line-height:1.2}
html[data-ui-role="STAFF"] .v119-empty{color:#506379!important}

/* R151 — 오늘 업무 카드: "사이트에서 직접 입력"·"송장사진 등록" 단추는 사진 등록 단추와 같은 색을 약하게(연한 바탕·같은 색 글씨·테두리) */
html.vn .vh-field .vh-ftask .vh-fbtn.vh-fsoft.vh-fsoft.vh-fsoft{background:color-mix(in srgb,var(--rc) 11%,#fff)!important;color:var(--rcd)!important;border:1px solid color-mix(in srgb,var(--rc) 42%,#fff)!important}
html.vn .vh-field .vh-ftask .vh-fbtn.vh-fsoft.vh-fsoft.vh-fsoft:hover{background:color-mix(in srgb,var(--rc) 20%,#fff)!important}

/* R154 — 오늘 업무 현금마감 팝업: 엑셀형 표 + 색감(포스쪽 파랑 · 마감쪽 초록 · 차이 0 초록/아니면 빨강) */
html.vn .today-entry-dialog .tc-sheet{display:grid;gap:8px}
html.vn .today-entry-dialog .tc-note{margin:0;font-size:.84rem;line-height:1.45;color:#40536a}
html.vn .today-entry-dialog .tc-table{width:100%;border-collapse:collapse;border:1px solid #b7c6d8;font-size:.9rem}
html.vn .today-entry-dialog .tc-table th,html.vn .today-entry-dialog .tc-table td{border:1px solid #cdd8e5;padding:0 8px;height:38px;text-align:left;vertical-align:middle}
html.vn .today-entry-dialog .tc-table thead th{background:#1f3b5c;color:#fff;font-weight:700;height:34px;font-size:.82rem}
html.vn .today-entry-dialog .tc-table tbody th{width:64px;font-weight:800;text-align:center;font-size:.85rem}
html.vn .today-entry-dialog .tc-pos th,html.vn .today-entry-dialog .tc-pos td{background:#eaf2ff}
html.vn .today-entry-dialog .tc-close th,html.vn .today-entry-dialog .tc-close td{background:#e8f6ec}
html.vn .today-entry-dialog .tc-pos th{color:#1d4ea8}html.vn .today-entry-dialog .tc-close th{color:#177a3c}
html.vn .today-entry-dialog .tc-item{width:96px;font-weight:700}
html.vn .today-entry-dialog .tc-amt{width:170px;padding:2px 4px}
html.vn .today-entry-dialog .tc-amt input{width:100%;min-height:34px!important;height:34px;text-align:right;font-weight:700;font-size:1rem;border:1px solid #9fb3cc;border-radius:4px;padding:0 8px;background:#fff}
html.vn .today-entry-dialog .tc-hint{font-size:.74rem;color:#4d6178;line-height:1.3}
html.vn .today-entry-dialog .tc-sum td,html.vn .today-entry-dialog .tc-sum th{font-weight:800;height:34px}
html.vn .today-entry-dialog .tc-sum.tc-pos td{background:#cfe0fb}html.vn .today-entry-dialog .tc-sum.tc-close td{background:#c9ecd3}
html.vn .today-entry-dialog .tc-num{text-align:right!important;font-variant-numeric:tabular-nums;font-size:1rem}
html.vn .today-entry-dialog .tc-diff th,html.vn .today-entry-dialog .tc-diff td{background:#fff7e0;font-weight:800;height:42px;font-size:1rem}
html.vn .today-entry-dialog .tc-diff.ok th,html.vn .today-entry-dialog .tc-diff.ok td{background:#d9f4e0;color:#0c6b2e}
html.vn .today-entry-dialog .tc-diff.bad th,html.vn .today-entry-dialog .tc-diff.bad td{background:#fde4e4;color:#a4262c}
html.vn .today-entry-dialog .tc-memo{font-size:.84rem}
html.vn .today-entry-dialog .tc-memo textarea{min-height:52px;font-size:.9rem}
html.vn .today-entry-dialog .tc-actions{display:flex;flex-wrap:wrap;gap:8px}
html.vn .today-entry-dialog .tc-actions button{min-height:44px;padding:0 16px;border-radius:8px;font-weight:800;border:1px solid #9fb3cc;background:#fff;color:#25405f}
html.vn .today-entry-dialog .tc-actions .tc-save{background:#177a3c;color:#fff;border-color:#177a3c;flex:1 1 180px}
html.vn .today-entry-dialog .tc-actions .tc-talk{background:#fee500;border-color:#e6cf00;color:#241c00}
html.vn .today-entry-dialog .tc-sent{margin:0;font-size:.82rem;color:#25405f}
@media(max-width:560px){html.vn .today-entry-dialog .tc-table .tc-hint{display:none}html.vn .today-entry-dialog .tc-amt{width:auto}html.vn .today-entry-dialog .tc-table thead th:last-child{display:none}html.vn .today-entry-dialog .tc-table th[colspan="2"]{width:auto}}
.tc-sheet .tc-date{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 6px;padding:6px 8px;background:#1f3b5c;color:#fff;font-weight:700}
.tc-sheet .tc-date input{font:inherit;padding:3px 6px;color:#12263f}
.tc-sheet .tc-date small{font-weight:400;opacity:.85}
.tc-sheet .tc-rdate{font:inherit;padding:1px 4px;margin-top:2px}
html.vn .today-entry-dialog .tc-actions .tc-next{background:#e8f6ec;border-color:#9fd3ad;color:#14532d}
.tc-sheet .tc-rcheck{display:block;margin-top:2px;font-size:.82rem;font-weight:700;color:#44566f}
.tc-sheet .tc-rcheck:empty{display:none}
.tc-sheet .tc-rcheck.ok{color:#14532d;background:#e8f6ec;padding:1px 4px}
.tc-sheet .tc-rcheck.warn{color:#7a4b00;background:#fff3c4;padding:1px 4px}
.tc-sheet .tc-rcheck.bad{color:#b42318;background:#fde8e6;padding:1px 4px}
/* R336 — '기타(마감 도우미)' 카드: 다른 카드처럼 색(청록)과 색 있는 단추를 준다 */
html.vn .vh-field .vh-fperiod:has([style*="#0f766e"]){--rc:#0f766e;--rcd:#0b5f58}