/*
 * v1.3.216 — UI_FINAL_REFERENCE.md 전용 최종 화면.
 * 기능/API/권한은 app.js 기존 연결을 사용하고, 화면 배치만 이 파일에서 전면 재구성한다.
 */
:root{
  --final-navy:#082b4d;
  --final-navy-2:#0b365f;
  --final-blue:#0784f8;
  --final-blue-2:#eaf5ff;
  --final-bg:#f2f6fa;
  --final-card:#ffffff;
  --final-line:#dbe5ef;
  --final-text:#10233c;
  --final-muted:#6c7d90;
  --final-green:#12a867;
  --final-green-soft:#e9f8f1;
  --final-red:#ee3f4b;
  --final-red-soft:#fff0f1;
  --final-orange:#f59b23;
  --final-purple:#8c35d7;
  --final-sidebar:196px;
  --final-topbar:58px;
  --final-radius:12px;
  --final-shadow:0 1px 2px rgba(24,48,76,.05),0 7px 20px rgba(30,67,105,.05);
}
html,body{background:var(--final-bg)!important;color:var(--final-text)!important;}
body:not(.carwash-mode){overflow:hidden!important;}
body:not(.carwash-mode) #appView{min-height:100vh!important;background:var(--final-bg)!important;}

/* ── 상단 바 ───────────────────────────────────────── */
body:not(.carwash-mode) .topbar{
  position:fixed!important;z-index:1000!important;left:0!important;right:0!important;top:0!important;
  height:var(--final-topbar)!important;min-height:var(--final-topbar)!important;
  padding:0 14px 0 18px!important;margin:0!important;box-sizing:border-box!important;
  background:linear-gradient(90deg,#082d51 0%,#0a3156 70%,#082844 100%)!important;
  border:0!important;border-bottom:1px solid #0f456f!important;box-shadow:0 2px 10px rgba(5,28,51,.16)!important;
  color:#fff!important;display:flex!important;align-items:center!important;gap:14px!important;
}
body:not(.carwash-mode) .topbar-brand-v119{display:flex!important;align-items:center!important;gap:8px!important;min-width:max-content!important;color:#fff!important;}
body:not(.carwash-mode) .topbar-brand-v119 .topbar-brand-drop{font-size:20px!important;width:29px!important;height:29px!important;border-radius:9px!important;display:grid!important;place-items:center!important;background:#0d83ee!important;color:#fff!important;font-weight:900!important;}
body:not(.carwash-mode) .topbar-brand-v119 strong{font-size:20px!important;font-weight:900!important;letter-spacing:-.6px!important;color:#fff!important;}
body:not(.carwash-mode) .topbar-brand-v119 small{font-size:12px!important;color:#9fc8eb!important;font-weight:800!important;}
body:not(.carwash-mode) .topbar-left{display:none!important;}
body:not(.carwash-mode) .top-actions{margin-left:auto!important;display:flex!important;align-items:center!important;gap:6px!important;min-width:0!important;}
body:not(.carwash-mode) .ui-setting-cluster,
body:not(.carwash-mode) #briefThemeToggle,
body:not(.carwash-mode) .app-install-button.desktop-top-action,
body:not(.carwash-mode) .carwash-install-button.desktop-top-action,
body:not(.carwash-mode) #passwordButton{display:none!important;}
body:not(.carwash-mode) #notificationButton,
body:not(.carwash-mode) #globalSearchButton,
body:not(.carwash-mode) #logoutButton{
  min-height:34px!important;height:34px!important;padding:0 11px!important;border:1px solid #ffffff2a!important;border-radius:8px!important;
  background:#ffffff12!important;color:#fff!important;font-size:12px!important;font-weight:800!important;box-shadow:none!important;
}
body:not(.carwash-mode) #notificationButton:hover,
body:not(.carwash-mode) #globalSearchButton:hover,
body:not(.carwash-mode) #logoutButton:hover{background:#ffffff22!important;}
body:not(.carwash-mode) .topbar-user-v119{height:34px!important;display:flex!important;align-items:center!important;gap:6px!important;padding:0 9px!important;border-left:1px solid #ffffff28!important;color:#fff!important;}
body:not(.carwash-mode) .topbar-user-v119 span{font-size:12px!important;color:#9fc7ea!important;}
body:not(.carwash-mode) .topbar-user-v119 strong{font-size:12px!important;color:#fff!important;}

/* 관리자: 관리자 / 대표 / 소장 화면을 항상 한 번에 전환 */
body:not(.carwash-mode) .admin-role-preview{
  margin-left:auto!important;display:flex!important;align-items:center!important;gap:7px!important;height:40px!important;padding:4px 6px!important;
  border:1px solid #ffffff26!important;border-radius:10px!important;background:#ffffff0d!important;color:#fff!important;
}
body:not(.carwash-mode) .admin-role-preview>span{font-size:12px!important;font-weight:900!important;color:#b9d8f2!important;white-space:nowrap!important;}



body:not(.carwash-mode) #adminPreviewViewport,
body:not(.carwash-mode) #adminPreviewStation{height:29px!important;min-height:29px!important;border:1px solid #ffffff2b!important;border-radius:7px!important;background:#0b3559!important;color:#fff!important;font-size:12px!important;font-weight:800!important;padding:0 24px 0 7px!important;}

/* ── 좌측 메뉴 (PC 전용 — .sidebar-nav 는 원래 "기본은 숨김", 960px 이상에서만 보인다.
   v1.3.222: 이 블록이 미디어쿼리 없이 걸려 있어서 폰에서도 항상 position:fixed 로
   켜져 있었다 — 아래 317행 부근의 "좌측 아래 빠른 사진/파일" 블록도 같은 문제였다.
   그 결과 실제 폰에서 이 PC 메뉴가 화면 내용 위에 그대로 겹쳐 보이는 회귀가 있었다
   (아래 mainContent 규칙은 760px 이하에서 이미 올바르게 폭 100%로 돌아가므로, 메뉴만
   숨었어야 했는데 못 숨었다). 960px 이상(PC)에서만 적용되게 감쌌다 — 값은 전혀 안
   바꿨다. */
@media(min-width:960px){
body:not(.carwash-mode) .sidebar-nav{
  position:fixed!important;z-index:900!important;left:0!important;top:var(--final-topbar)!important;bottom:0!important;
  width:var(--final-sidebar)!important;height:auto!important;margin:0!important;padding:10px 9px 12px!important;box-sizing:border-box!important;
  background:linear-gradient(180deg,var(--final-navy) 0%,#072944 100%)!important;border:0!important;box-shadow:4px 0 16px rgba(6,31,55,.10)!important;
  overflow-y:auto!important;overflow-x:hidden!important;color:#fff!important;
}
body:not(.carwash-mode) .sidebar-nav .sidebar-brand{display:none!important;}
body:not(.carwash-mode) #roleMenuRoot{display:block!important;}















body:not(.carwash-mode) .quick-upload{display:none!important;}

}

/* ── 본문: 남는 공간 없이 100% 사용 ───────────────── */
body:not(.carwash-mode) #mainContent{
  position:fixed!important;left:var(--final-sidebar)!important;right:0!important;top:var(--final-topbar)!important;bottom:0!important;
  width:auto!important;height:auto!important;max-width:none!important;margin:0!important;padding:10px 12px 30px!important;box-sizing:border-box!important;
  overflow:auto!important;overflow-x:hidden!important;background:var(--final-bg)!important;
}
body:not(.carwash-mode) #mainContent>*{zoom:1!important;max-width:none!important;box-sizing:border-box!important;}
body:not(.carwash-mode) #mainContent>.view{width:100%!important;max-width:none!important;margin:0!important;padding:0!important;}
body:not(.carwash-mode) #mainContent>.global-period-bar,
body:not(.carwash-mode) #mainContent>.menu-context-strip{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important;}
body:not(.carwash-mode) #mainContent .view>.form-card,
body:not(.carwash-mode) #mainContent .view>.table-wrap,
body:not(.carwash-mode) #mainContent .view>.card-list,
body:not(.carwash-mode) #mainContent .view>.panel,
body:not(.carwash-mode) #mainContent .view>.overview-panel,
body:not(.carwash-mode) #mainContent .view>.inventory-shell,
body:not(.carwash-mode) #mainContent .view>.manage-shell{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important;}
body:not(.carwash-mode) .page-title{width:100%!important;max-width:none!important;margin:0 0 8px!important;padding:10px 12px!important;min-height:52px!important;border:1px solid var(--final-line)!important;border-radius:10px!important;background:#fff!important;box-shadow:var(--final-shadow)!important;}
body:not(.carwash-mode) .page-title h1{font-size:19px!important;letter-spacing:-.5px!important;color:#0d2947!important;}
body:not(.carwash-mode) .page-title p{font-size:12px!important;color:var(--final-muted)!important;}
body:not(.carwash-mode) .form-card,
body:not(.carwash-mode) .panel,
body:not(.carwash-mode) .table-card,
body:not(.carwash-mode) .overview-panel,
body:not(.carwash-mode) .station-head,
body:not(.carwash-mode) .card{border-color:var(--final-line)!important;border-radius:10px!important;box-shadow:var(--final-shadow)!important;background:#fff!important;}
body:not(.carwash-mode) table{width:100%!important;max-width:none!important;border-collapse:separate!important;border-spacing:0!important;}
body:not(.carwash-mode) th{background:#edf5fc!important;color:#24415f!important;font-size:12px!important;font-weight:900!important;border-color:#dbe6ef!important;}
body:not(.carwash-mode) td{font-size:12px!important;border-color:#e3eaf1!important;color:#263d55!important;}
body:not(.carwash-mode) input,body:not(.carwash-mode) select,body:not(.carwash-mode) textarea{border-color:#cfdce8!important;border-radius:7px!important;background:#fff!important;color:#1a334d!important;}
body:not(.carwash-mode) button.primary{background:#0788f5!important;border-color:#0788f5!important;color:#fff!important;border-radius:8px!important;}
body:not(.carwash-mode) button.quiet{border-color:#cad8e6!important;background:#fff!important;color:#28445f!important;border-radius:8px!important;}

/* 역할 대시보드의 옛 바깥 제목은 제거하고, 시안 전용 헤드만 사용 */



body:not(.carwash-mode) .v119-dashboard-host{width:100%!important;max-width:none!important;margin:0!important;}
body:not(.carwash-mode) .v1321-dashboard{width:100%!important;max-width:none!important;margin:0!important;padding:0!important;}
body:not(.carwash-mode) .v1321-head,
body:not(.carwash-mode) .final-role-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;padding:10px 12px!important;margin:0 0 8px!important;border:1px solid var(--final-line)!important;border-radius:10px!important;background:#fff!important;box-shadow:var(--final-shadow)!important;}
body:not(.carwash-mode) .v1321-head h2,
body:not(.carwash-mode) .final-role-head h2{margin:2px 0!important;font-size:20px!important;color:#0a2846!important;letter-spacing:-.6px!important;}
body:not(.carwash-mode) .v1321-head small,
body:not(.carwash-mode) .final-role-head small{font-size:12px!important;color:#697d92!important;font-weight:800!important;}
body:not(.carwash-mode) .final-role-head p{margin:3px 0 0!important;font-size:12px!important;color:#708298!important;}
body:not(.carwash-mode) .final-refresh,
body:not(.carwash-mode) .v1321-head-status button{min-height:34px!important;padding:0 11px!important;border:1px solid #bcd8ef!important;border-radius:8px!important;background:#eef7ff!important;color:#0877d1!important;font-size:12px!important;font-weight:900!important;}

/* ── 소장 화면: 시안의 4칸만 중심 ─────────────────── */
.final-field-home{display:block!important;}
.final-field-station{background:#fff!important;border:1px solid var(--final-line)!important;border-radius:12px!important;padding:12px!important;margin:0 0 8px!important;box-shadow:var(--final-shadow)!important;}
.final-field-station-head{display:flex!important;justify-content:space-between!important;align-items:end!important;gap:16px!important;margin-bottom:10px!important;}
.final-field-station-head h3{margin:2px 0 0!important;font-size:16px!important;color:#0d2947!important;}
.final-field-station-head small{font-size:12px!important;color:#6f8194!important;font-weight:900!important;}
.final-field-progress{display:flex!important;align-items:center!important;gap:8px!important;min-width:190px!important;}
.final-field-progress>span{flex:1!important;height:7px!important;border-radius:99px!important;background:#e9eef3!important;overflow:hidden!important;}
.final-field-progress>span i{display:block!important;height:100%!important;background:#0dad70!important;border-radius:99px!important;}
.final-field-progress>b{font-size:12px!important;color:#314a64!important;white-space:nowrap!important;}
.final-field-task-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:9px!important;}
.final-field-task{min-height:150px!important;border:0!important;border-radius:12px!important;padding:15px 10px 12px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:7px!important;text-align:center!important;cursor:pointer!important;box-shadow:inset 0 0 0 1px #0000000c,0 5px 12px #15334d0a!important;transition:transform .12s ease,box-shadow .12s ease!important;}
.final-field-task:hover{transform:translateY(-2px)!important;box-shadow:0 8px 18px #163b5f18!important;}
.final-field-task.done{background:linear-gradient(180deg,#10b86f,#079b5c)!important;color:#fff!important;}
.final-field-task.pending{background:linear-gradient(180deg,#ff4f59,#e93b47)!important;color:#fff!important;}
.final-field-task-icon{width:48px!important;height:48px!important;border-radius:14px!important;display:grid!important;place-items:center!important;background:#ffffffee!important;font-size:26px!important;box-shadow:0 3px 9px #0002!important;}
.final-field-task strong{font-size:17px!important;color:#fff!important;line-height:1.15!important;letter-spacing:-.5px!important;}
.final-field-task-state{padding:4px 10px!important;border-radius:99px!important;background:#fff!important;color:#188458!important;font-size:12px!important;font-weight:900!important;}
.final-field-task.pending .final-field-task-state{color:#d82635!important;}
.final-field-task small{font-size:12px!important;color:#fff!important;opacity:.92!important;font-weight:700!important;}
.final-auto-process{background:#fff!important;border:1px solid var(--final-line)!important;border-radius:12px!important;margin:0 0 8px!important;padding:12px!important;box-shadow:var(--final-shadow)!important;}
.final-auto-process header{margin-bottom:10px!important;}
.final-auto-process h3{margin:0!important;font-size:15px!important;color:#0d2947!important;}
.final-auto-process header small{font-size:12px!important;color:#74869a!important;}
.final-process-steps{display:grid!important;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr!important;align-items:center!important;gap:8px!important;}
.final-process-steps>span{min-height:92px!important;border-radius:10px!important;background:#f4f9fd!important;border:1px solid #dbe9f4!important;padding:10px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;}
.final-process-steps>span i{font-style:normal!important;font-size:28px!important;margin-bottom:4px!important;}
.final-process-steps>span b{font-size:12px!important;color:#123858!important;}
.final-process-steps>span small{font-size:12px!important;color:#6d8194!important;margin-top:3px!important;}
.final-process-steps>em{font-style:normal!important;color:#1688e7!important;font-size:22px!important;font-weight:900!important;}
.final-field-tips{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:8px!important;}
.final-field-tips>div{min-height:76px!important;border:1px solid var(--final-line)!important;border-radius:12px!important;background:#fff!important;padding:10px!important;display:grid!important;grid-template-columns:42px 1fr!important;grid-template-rows:auto auto!important;column-gap:9px!important;align-items:center!important;box-shadow:var(--final-shadow)!important;}
.final-field-tips i{grid-row:1/3!important;width:42px!important;height:42px!important;border-radius:50%!important;display:grid!important;place-items:center!important;background:#eaf6ff!important;font-style:normal!important;font-size:21px!important;}
.final-field-tips b{font-size:12px!important;color:#123858!important;}
.final-field-tips small{font-size:12px!important;color:#6f8194!important;}

/* ── 관리자 화면 ──────────────────────────────────── */
.v55-admin-home .v1321-kpis,.v55-admin-home .v55-admin-tiles{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important;margin:0 0 8px!important;}
.v55-admin-home .v1321-kpi,.v55-admin-home .v1200-kpi{min-height:88px!important;border:1px solid var(--final-line)!important;border-radius:10px!important;background:#fff!important;padding:10px!important;box-shadow:var(--final-shadow)!important;}
.v55-admin-home .v1321-card{border:1px solid var(--final-line)!important;border-radius:11px!important;background:#fff!important;padding:11px!important;box-shadow:var(--final-shadow)!important;}
.v55-admin-home .v1321-card>header{display:flex!important;justify-content:space-between!important;align-items:end!important;margin-bottom:9px!important;}
.v55-admin-home .v1321-card>header h3{margin:0!important;font-size:15px!important;color:#102f50!important;}
.v55-admin-home .v1321-card>header small{font-size:12px!important;color:#73859a!important;}
.v55-quick-tiles{display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:8px!important;}
.v55-qt{min-height:104px!important;border:1px solid #dce6ef!important;border-radius:10px!important;background:#f7fbff!important;padding:10px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:5px!important;color:#163c5e!important;}
.v55-qt:hover{border-color:#9bc9ee!important;background:#eef8ff!important;}
.v55-qt:nth-child(1) .v55-qt-ic{background:#e5f8ef!important;color:#08a55f!important;}
.v55-qt:nth-child(2) .v55-qt-ic{background:#eaf4ff!important;color:#0b83e8!important;}
.v55-qt:nth-child(3) .v55-qt-ic{background:#f4eaff!important;color:#8537ce!important;}
.v55-qt:nth-child(4) .v55-qt-ic{background:#fff0df!important;color:#e97800!important;}
.v55-qt:nth-child(5) .v55-qt-ic{background:#e9f4ff!important;color:#1b72c5!important;}
.v55-qt:nth-child(6) .v55-qt-ic{background:#edf4ff!important;color:#195ea9!important;}
.v55-qt-ic{width:43px!important;height:43px!important;border-radius:50%!important;display:grid!important;place-items:center!important;font-size:22px!important;font-weight:900!important;}
.v55-qt b{font-size:12px!important;color:#173a5a!important;}
.v55-qt small{font-size:12px!important;color:#718398!important;text-align:center!important;}
.v55-admin-home .v1321-grid{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important;margin:8px 0 0!important;}
.v55-ap-grid{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:8px!important;}
.v55-ap-item{min-height:96px!important;border:1px solid #e0e8f0!important;border-radius:10px!important;background:#f9fbfd!important;padding:9px!important;text-align:center!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:4px!important;}
.v55-ap-item i{font-style:normal!important;font-size:22px!important;}.v55-ap-item b{font-size:12px!important;color:#1d405f!important;}.v55-ap-item span{font-size:12px!important;color:#6f8093!important;line-height:1.35!important;}

/* ── 대표 화면 ───────────────────────────────────── */
.v55-ceo-home .v1321-card{border:1px solid var(--final-line)!important;border-radius:11px!important;background:#fff!important;padding:10px!important;margin:0 0 8px!important;box-shadow:var(--final-shadow)!important;}
.v55-ceo-home .v1321-card>header{display:flex!important;align-items:end!important;justify-content:space-between!important;gap:10px!important;margin:0 0 8px!important;}
.v55-ceo-home .v1321-card>header h3{margin:0!important;font-size:15px!important;color:#0d2947!important;}
.v55-ceo-home .v1321-card>header small{font-size:12px!important;color:#73859a!important;}
.v55-ceo-fuel-tiles{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important;}
.v55-ceo-fuel-tile{min-height:98px!important;border:1px solid #dbe5ef!important;border-radius:10px!important;background:#fff!important;padding:10px!important;text-align:left!important;box-shadow:none!important;}
.v55-ceo-fuel-tile:nth-child(1){border-top:4px solid #1aa866!important;background:#f5fcf8!important;}
.v55-ceo-fuel-tile:nth-child(2){border-top:4px solid #1a7de0!important;background:#f4f9ff!important;}
.v55-ceo-fuel-tile:nth-child(3){border-top:4px solid #f28d20!important;background:#fff9f1!important;}
.v55-ceo-fuel-tile:nth-child(4){border-top:4px solid #8c36d9!important;background:#fbf7ff!important;}
.v55-ceo-fuel-tile header{display:flex!important;align-items:center!important;gap:6px!important;}.v55-ceo-fuel-tile header b{font-size:12px!important;color:#34516d!important;}.v55-ceo-fuel-tile strong{display:block!important;margin-top:5px!important;font-size:18px!important;color:#0f2e4e!important;}.v55-ceo-fuel-tile small{display:block!important;margin-top:3px!important;font-size:12px!important;color:#718499!important;}
.final-matrix{border:1px solid #dbe5ef!important;border-radius:9px!important;overflow:hidden!important;}
.final-matrix-row{display:grid!important;grid-template-columns:minmax(125px,1.25fr) repeat(6,minmax(76px,1fr))!important;width:100%!important;min-height:35px!important;padding:0!important;margin:0!important;border:0!important;border-bottom:1px solid #e5edf4!important;background:#fff!important;align-items:center!important;text-align:center!important;color:#27415b!important;}
.final-matrix-row:last-child{border-bottom:0!important;}.final-matrix-row.head{background:#edf5fb!important;}.final-matrix-row.head b{font-size:12px!important;color:#36526d!important;}.final-matrix-row strong{padding-left:9px!important;text-align:left!important;font-size:12px!important;color:#153a5b!important;}.final-matrix-state{font-size:12px!important;font-weight:900!important;white-space:nowrap!important;}.final-matrix-state.done{color:#0b9e5c!important;}.final-matrix-state.miss{color:#e13e46!important;}.final-matrix-state.wait{color:#e98b16!important;}.final-matrix-state.muted{color:#94a4b2!important;}
.v55-ceo-margin-tiles{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:7px!important;margin-bottom:8px!important;}
.v55-ceo-margin-row{display:grid!important;grid-template-columns:58px 1.25fr .8fr .8fr 1fr 58px!important;gap:5px!important;align-items:center!important;width:100%!important;min-height:34px!important;border:0!important;border-bottom:1px solid #e7edf3!important;background:#fff!important;padding:4px 6px!important;text-align:left!important;}
.v55-ceo-margin-row span,.v55-ceo-margin-row em{font-size:12px!important;}.v55-ceo-margin-row em{font-style:normal!important;color:#087bd8!important;font-weight:900!important;text-align:right!important;}
.v55-ceo-trend{min-height:210px!important;}

/* ── 주유소별 현황 카드(막대그래프) — v1.3.225 사장님 지시 ───────── */
.v55-sb-grid{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))!important;gap:8px!important;}
.v55-sb-card{border:1px solid var(--final-line)!important;border-radius:10px!important;background:#fff!important;padding:9px!important;text-align:left!important;display:flex!important;flex-direction:column!important;gap:6px!important;}
.v55-sb-card.has-problem{border-color:#f3c1c5!important;background:#fffbfb!important;}
.v55-sb-card>header{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:6px!important;}
.v55-sb-card>header strong{font-size:13px!important;color:#102f50!important;}
.v55-sb-card>header em{font-style:normal!important;font-size:12px!important;font-weight:900!important;color:#0b9e5c!important;}
.v55-sb-card.has-problem>header em{color:#e13e46!important;}
.v55-sb-chips{display:flex!important;flex-wrap:wrap!important;gap:4px!important;}
.v55-sb-chip{font-size:12px!important;font-weight:800!important;border-radius:5px!important;padding:2px 6px!important;background:#f1f5f9!important;color:#8391a2!important;}
.v55-sb-chip.ok{background:#e6f8ef!important;color:#0b9e5c!important;}
.v55-sb-chip.miss{background:#fdeaec!important;color:#e13e46!important;}
.v55-sb-bars{display:flex!important;flex-direction:column!important;gap:3px!important;}
.v55-sb-bar-row{display:grid!important;grid-template-columns:10px 40px 1fr 34px!important;align-items:center!important;gap:5px!important;}
.v55-sb-bar-row b{font-size:12px!important;font-weight:700!important;color:#42596f!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;}
.v55-sb-bar-track{display:block!important;height:7px!important;border-radius:4px!important;background:#eef2f6!important;overflow:hidden!important;}
.v55-sb-bar-track i{display:block!important;height:100%!important;border-radius:4px!important;}
.v55-sb-bar-row small{font-size:12px!important;color:#8391a2!important;text-align:right!important;}
.v55-sb-bar-empty{font-size:12px!important;color:#8391a2!important;}

.final-field-bars{margin-top:8px!important;padding-top:8px!important;border-top:1px dashed var(--final-line)!important;}

/* 공통 대시보드 카드/그래프를 시안처럼 낮고 촘촘하게 */
.v1321-kpis{gap:7px!important;}.v1321-kpi,.v1200-kpi{border-radius:9px!important;box-shadow:none!important;}.v1321-grid{gap:8px!important;}.v1321-foot,.v55-ceo-pane-note{font-size:12px!important;color:#77899b!important;}
.workflow-data-warning{border-radius:9px!important;margin-bottom:8px!important;font-size:12px!important;}
.demo-warn-strip{border-radius:9px!important;margin-bottom:8px!important;}
.brief-strip-wrap{display:none!important;}

/* ── 모바일: 같은 시안 언어, 한 손 조작 ────────────── */
@media(max-width:760px){
  :root{--final-topbar:52px;}
  body:not(.carwash-mode){overflow:auto!important;}
  body:not(.carwash-mode) .topbar{height:var(--final-topbar)!important;min-height:var(--final-topbar)!important;padding:0 8px!important;}
  body:not(.carwash-mode) .topbar-brand-v119 strong{font-size:14px!important;}
  body:not(.carwash-mode) .topbar-brand-v119 small,body:not(.carwash-mode) .topbar-user-v119,body:not(.carwash-mode) #globalSearchButton{display:none!important;}
  body:not(.carwash-mode) .sidebar-nav{display:none!important;}
  body:not(.carwash-mode) #mainContent{position:relative!important;left:0!important;right:auto!important;top:0!important;bottom:auto!important;width:100%!important;height:auto!important;margin:var(--final-topbar) 0 0!important;padding:8px 8px 82px!important;overflow:visible!important;}
  body:not(.carwash-mode) .admin-role-preview{position:fixed!important;left:6px!important;right:6px!important;top:55px!important;z-index:920!important;width:auto!important;background:#082b4df2!important;}
  body:not(.carwash-mode) .admin-role-preview>span,body:not(.carwash-mode) #adminPreviewViewport{display:none!important;}
  
  body.admin-phone-preview #mainContent{display:none!important;}
  .final-field-task-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important;}.final-field-task{min-height:120px!important;padding:10px 7px!important;}.final-field-task strong{font-size:14px!important;}
  .final-field-progress{min-width:130px!important;}.final-field-station-head{align-items:center!important;}
  .final-process-steps{grid-template-columns:1fr 1fr!important;gap:7px!important;}.final-process-steps>em{display:none!important;}.final-process-steps>span{min-height:82px!important;}
  .final-field-tips{grid-template-columns:1fr!important;}
  .v55-admin-home .v1321-kpis,.v55-admin-home .v55-admin-tiles{grid-template-columns:repeat(2,1fr)!important;}
  .v55-quick-tiles{grid-template-columns:repeat(3,1fr)!important;}.v55-qt{min-height:92px!important;padding:8px 4px!important;}.v55-admin-home .v1321-grid{grid-template-columns:1fr!important;}.v55-ap-grid{grid-template-columns:repeat(2,1fr)!important;}
  .v55-ceo-fuel-tiles{grid-template-columns:repeat(2,1fr)!important;}.final-matrix{overflow-x:auto!important;}.final-matrix-row{min-width:720px!important;}.v55-ceo-margin-tiles{grid-template-columns:repeat(2,1fr)!important;}.v55-ceo-margin-list{overflow-x:auto!important;}.v55-ceo-margin-row{min-width:660px!important;}
  .v55-sb-grid{grid-template-columns:1fr!important;}
  .final-role-head,.v1321-head{align-items:flex-start!important;}.final-role-head h2,.v1321-head h2{font-size:17px!important;}
}

/* ========================================================================
 * v1.3.216 — 새 시안 회귀보호 레이어
 * ------------------------------------------------------------------------
 * 중요: 과거 theme-vXXXX.css 를 다시 활성화하지 않는다.
 * 아래 규칙은 이전 릴리스에서 검증된 '기능적 보호'만 새 시안 구조에 맞춰 재작성한 것이다.
 * semantic-contract:v13216 nav-history quick-upload appearance readable mobile dark no-clip
 * ======================================================================== */
:root{
  --final-blue:#0784f8;
  --final-focus:0 0 0 3px color-mix(in srgb,var(--final-blue) 26%,transparent);
}

/* 상단 홈/뒤로/앞으로 — 새 시안에서도 항상 보이는 탐색 수단 */
body:not(.carwash-mode) .topbar-left{
  display:flex!important;align-items:center!important;min-width:0!important;gap:8px!important;
}
body:not(.carwash-mode) .topbar-left>.topbar-title,
body:not(.carwash-mode) .topbar-left>.crumb,
body:not(.carwash-mode) .topbar-left>.app-runtime-message{display:none!important;}
body:not(.carwash-mode) .history-nav{display:flex!important;align-items:center!important;gap:5px!important;}
body:not(.carwash-mode) #navHome,
body:not(.carwash-mode) #navBack,
body:not(.carwash-mode) #navForward{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  min-height:34px!important;padding:0 10px!important;border:1px solid #ffffff35!important;border-radius:8px!important;
  background:#fff!important;color:#183c5d!important;font-size:12px!important;font-weight:900!important;line-height:1!important;
  box-shadow:none!important;white-space:nowrap!important;
}
body:not(.carwash-mode) #navHome:hover,
body:not(.carwash-mode) #navBack:hover,
body:not(.carwash-mode) #navForward:hover{background:#eaf5ff!important;border-color:#9bc9ef!important;}
body:not(.carwash-mode) #navHome:focus-visible,
body:not(.carwash-mode) #navBack:focus-visible,
body:not(.carwash-mode) #navForward:focus-visible{outline:0!important;box-shadow:var(--final-focus)!important;}


/* 좌측 아래 빠른 사진/파일 — 메뉴를 길게 늘리지 않고 항상 접근 (PC 전용, v1.3.222: 위와 같은
   이유로 960px 이상에서만 적용되게 감쌌다 — 폰은 이 사이드바 자체가 없고 화면 맨 아래
   quick-upload-bar 를 그대로 쓴다) */
@media(min-width:960px){
body:not(.carwash-mode) .sidebar-nav{display:flex!important;flex-direction:column!important;}
body:not(.carwash-mode) #roleMenuRoot{flex:1 0 auto!important;}
body:not(.carwash-mode) .quick-upload{
  display:grid!important;grid-template-columns:1fr!important;gap:6px!important;
  position:sticky!important;bottom:-12px!important;margin:10px -2px -12px!important;padding:10px 2px 12px!important;
  background:linear-gradient(180deg,rgba(7,41,68,0),#072944 20%)!important;z-index:3!important;
}
body:not(.carwash-mode) .quick-upload .quick-btn{
  min-height:46px!important;border:1px solid #ffffff20!important;border-radius:9px!important;background:#ffffff0d!important;color:#fff!important;
  padding:6px 8px!important;display:flex!important;align-items:center!important;gap:8px!important;text-align:left!important;box-shadow:none!important;
}
body:not(.carwash-mode) .quick-upload .quick-btn:hover{background:#ffffff19!important;}
body:not(.carwash-mode) .quick-upload .quick-icon{width:30px!important;height:30px!important;display:grid!important;place-items:center!important;border-radius:8px!important;background:#0d83ee!important;font-size:17px!important;}
body:not(.carwash-mode) .quick-upload .quick-btn.file .quick-icon{background:#18a36b!important;}
body:not(.carwash-mode) .quick-upload strong{display:block!important;font-size:12px!important;color:#fff!important;}
body:not(.carwash-mode) .quick-upload small{display:block!important;margin-top:2px!important;font-size:12px!important;color:#a9c8df!important;line-height:1.25!important;}
}

/* 역할 공통 '오늘 할 일' — 단순한 4칸, 상세는 클릭 후 */
.final-role-today{border:1px solid var(--final-line)!important;border-radius:12px!important;background:#fff!important;padding:12px!important;margin:0 0 10px!important;box-shadow:var(--final-shadow)!important;}
.final-role-today>header{display:flex!important;align-items:flex-end!important;justify-content:space-between!important;gap:12px!important;margin-bottom:10px!important;}
.final-role-today>header h3{margin:0!important;font-size:17px!important;line-height:1.25!important;color:#102d4b!important;}
.final-role-today>header small{display:block!important;margin-top:4px!important;font-size:12px!important;line-height:1.4!important;color:#61758a!important;}
.final-inline-link{min-height:36px!important;border:1px solid #b8d5ec!important;border-radius:8px!important;background:#f5faff!important;color:#156aa9!important;font-size:12px!important;font-weight:900!important;padding:0 10px!important;white-space:nowrap!important;}
.final-role-task-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:9px!important;}
.final-role-task{
  min-height:126px!important;padding:12px!important;border:1px solid #dbe5ef!important;border-radius:12px!important;background:#fff!important;
  display:grid!important;grid-template-columns:42px 1fr!important;grid-template-rows:auto auto!important;column-gap:10px!important;row-gap:6px!important;
  align-items:center!important;text-align:left!important;box-shadow:none!important;overflow:hidden!important;
}
.final-role-task:hover{transform:translateY(-1px)!important;box-shadow:0 8px 18px rgba(31,67,103,.09)!important;}
.final-role-task.done{border-color:#b9e7d2!important;background:#f4fcf8!important;}
.final-role-task.pending{border-color:#f0c4c8!important;background:#fff7f7!important;}
.final-role-task.info{border-color:#bdd9f3!important;background:#f5faff!important;}
.final-role-task-icon{grid-row:1 / span 2!important;width:42px!important;height:42px!important;border-radius:11px!important;display:grid!important;place-items:center!important;background:#e8f4ff!important;font-size:23px!important;}
.final-role-task.pending .final-role-task-icon{background:#ffe9ea!important;}.final-role-task.done .final-role-task-icon{background:#e7f8f0!important;}
.final-role-task-copy{min-width:0!important;display:block!important;}.final-role-task-copy strong{display:block!important;font-size:14px!important;color:#163a5a!important;line-height:1.25!important;}.final-role-task-copy b{display:block!important;margin-top:6px!important;font-size:18px!important;color:#0c2743!important;line-height:1.15!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;}.final-role-task-copy small{display:block!important;margin-top:5px!important;font-size:12px!important;color:#62768b!important;line-height:1.35!important;}
.final-role-task>em{grid-column:2!important;font-style:normal!important;color:#1475ba!important;font-size:12px!important;font-weight:900!important;justify-self:end!important;}

/* 확인함은 소장/관리자/대표 어디서나 같은 의미와 크기 */
.v1334-pending{border:1px solid #f0d29d!important;border-radius:12px!important;background:#fffaf0!important;padding:12px!important;margin:0 0 10px!important;box-shadow:var(--final-shadow)!important;}
.v1334-pending>header h3{font-size:16px!important;color:#5b3a05!important;}.v1334-pending>header small,.v1334-foot{font-size:12px!important;color:#735a31!important;}
.v1334-row{min-height:62px!important;border-radius:9px!important;}.v1334-main b{font-size:14px!important;}.v1334-main small,.v1334-main em{font-size:12px!important;line-height:1.35!important;}

/* 읽기 쉬운 글자: 9~11px로 몰리던 새 시안 초안을 실제 운영 크기로 올림 */
body:not(.carwash-mode) #mainContent{font-size:14px!important;}
body:not(.carwash-mode) .v1321-card>header h3,
body:not(.carwash-mode) .v55-admin-home .v1321-card>header h3,
body:not(.carwash-mode) .v55-ceo-home .v1321-card>header h3{font-size:16px!important;line-height:1.3!important;}
body:not(.carwash-mode) .v1321-card>header small,
body:not(.carwash-mode) .v55-admin-home .v1321-card>header small,
body:not(.carwash-mode) .v55-ceo-home .v1321-card>header small,
body:not(.carwash-mode) .v1321-foot,
body:not(.carwash-mode) .v55-ceo-pane-note{font-size:12px!important;line-height:1.4!important;color:#60768c!important;opacity:1!important;}
body:not(.carwash-mode) .data-table td,
body:not(.carwash-mode) .data-table th{font-size:.84rem!important;line-height:1.35!important;}
body:not(.carwash-mode) .data-table thead th{color:#29445f!important;background:#edf4fa!important;font-weight:900!important;}
body:not(.carwash-mode) .v1321-kpis{grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr))!important;gap:8px!important;}
body:not(.carwash-mode) .v1321-kpis .v1200-kpi{overflow:visible!important;min-width:0!important;padding:13px 14px 12px!important;}
body:not(.carwash-mode) .v1321-kpis .v1200-kpi>strong{white-space:normal!important;word-break:keep-all!important;overflow:visible!important;font-variant-numeric:tabular-nums!important;line-height:1.18!important;}
body:not(.carwash-mode) .v1321-kpis .v1200-kpi::before{right:11px!important;left:auto!important;}
body:not(.carwash-mode) .work-stat strong{line-height:1.28!important;overflow:visible!important;}
body:not(.carwash-mode) .cal-kpi strong{overflow:visible!important;}
body:not(.carwash-mode) .goods-overview-panel>.station-head h2{font-size:1.05rem!important;}


/* 대표 표/그래프의 상태글자도 노년층 기준으로 최소 12px */
.final-matrix-row{min-height:42px!important;}.final-matrix-row.head b,.final-matrix-row strong,.final-matrix-state{font-size:12px!important;}
.v55-ceo-fuel-tile header b,.v55-ceo-fuel-tile small,.v55-ceo-margin-row span,.v55-ceo-margin-row em{font-size:12px!important;}
.v55-ceo-fuel-tile strong{font-size:20px!important;}.v55-ap-item b{font-size:13px!important;}.v55-ap-item span{font-size:12px!important;}

/* 확대/좁은 화면에서 단어·숫자 잘림 방지 */
body:not(.carwash-mode) .closing-auto-block{display:block!important;white-space:normal!important;overflow:visible!important;font-size:12px!important;line-height:1.4!important;color:#8b3e12!important;}
body:not(.carwash-mode) [data-view="closing"] .reason,
body:not(.carwash-mode) .closing-reason{white-space:normal!important;word-break:keep-all!important;overflow-wrap:anywhere!important;}

/* dark: 새 화면 토큰만 바꾼다. 예전 theme 파일에 의존하지 않는다. */
html[data-theme="dark"]{
  --final-bg:#101820;--final-card:#17222d;--final-line:#30404f;--final-text:#edf4fa;--final-muted:#a8b7c6;
}
html[data-theme="dark"] body:not(.carwash-mode),
html[data-theme="dark"] body:not(.carwash-mode) #mainContent{background:var(--final-bg)!important;color:var(--final-text)!important;}
html[data-theme="dark"] body:not(.carwash-mode) .v1321-card,
html[data-theme="dark"] body:not(.carwash-mode) .final-role-today,
html[data-theme="dark"] body:not(.carwash-mode) .final-role-task,
html[data-theme="dark"] body:not(.carwash-mode) .v55-ceo-fuel-tile,
html[data-theme="dark"] body:not(.carwash-mode) .v55-sb-card{background:#17222d!important;border-color:#344657!important;color:#edf4fa!important;}
html[data-theme="dark"] body:not(.carwash-mode) .v55-sb-card.has-problem{background:#2b1a1c!important;border-color:#6b3238!important;}
html[data-theme="dark"] body:not(.carwash-mode) .v55-sb-card>header strong{color:#f2f7fb!important;}
html[data-theme="dark"] body:not(.carwash-mode) .v55-sb-card>header em{color:#4ddb96!important;}
html[data-theme="dark"] body:not(.carwash-mode) .v55-sb-card.has-problem>header em{color:#ff8a90!important;}
html[data-theme="dark"] body:not(.carwash-mode) .v55-sb-chip{background:#20303e!important;color:#a8b7c6!important;}
html[data-theme="dark"] body:not(.carwash-mode) .v55-sb-chip.ok{background:#123a2c!important;color:#4ddb96!important;}
html[data-theme="dark"] body:not(.carwash-mode) .v55-sb-chip.miss{background:#3b2024!important;color:#ff8a90!important;}
html[data-theme="dark"] body:not(.carwash-mode) .v55-sb-bar-row b,
html[data-theme="dark"] body:not(.carwash-mode) .v55-sb-bar-row small,
html[data-theme="dark"] body:not(.carwash-mode) .v55-sb-bar-empty{color:#a8b7c6!important;}
html[data-theme="dark"] body:not(.carwash-mode) .v55-sb-bar-track{background:#25333f!important;}
html[data-theme="dark"] body:not(.carwash-mode) .final-role-task-copy strong,
html[data-theme="dark"] body:not(.carwash-mode) .final-role-task-copy b,
html[data-theme="dark"] body:not(.carwash-mode) .v1321-card>header h3{color:#f2f7fb!important;}
html[data-theme="dark"] body:not(.carwash-mode) .final-role-task-copy small,
html[data-theme="dark"] body:not(.carwash-mode) .v1321-card>header small{color:#b7c5d2!important;}
html[data-theme="dark"] body:not(.carwash-mode) .data-table thead th{background:#20303e!important;color:#e6f0f8!important;}
html[data-theme="dark"] body:not(.carwash-mode) .data-table td{color:#e1eaf2!important;border-color:#334554!important;}
html[data-theme="dark"] body:not(.carwash-mode) .today-badge,
html[data-theme="dark"] body:not(.carwash-mode) .badge.today{background:#123e67!important;color:#d9efff!important;border-color:#2b6d9f!important;}
html[data-theme="dark"] body:not(.carwash-mode) .closing-auto-block{color:#ffd7b0!important;background:#3b2718!important;}

/* hidden 은 어떤 flex 규칙보다 우선한다 */
body:not(.carwash-mode) .topbar [hidden]{display:none!important;}

@media (max-width:1100px) and (min-width:761px){
  :root{--final-sidebar:184px;}
  .final-role-task-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .v55-ceo-fuel-tiles{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  body:not(.carwash-mode) .topbar-brand-v119 small{display:none!important;}
}

/* v1.3.223 — 위 블록은 761px부터 --final-sidebar 를 184px로 줄이고, 122행 #mainContent 는 이 값만큼
   항상 왼쪽으로 비켜난다. 그런데 .sidebar-nav 자체는 (styles.css 원래 계약대로, 86행 미디어쿼리도)
   960px 이상에서만 보인다 — 761~959px 사이에는 "옆에 없는 사이드바 자리"만큼 본문 왼쪽에 빈 칸이
   생겼다(Chromium 900px 폭 실제 렌더링으로 재현 확인, 사이드바 없이 본문만 184px 밀려 있었다).
   사이드바가 실제로 보이는 960px 이상에서만 본문을 비키게 하고, 761~959px는 본문이 왼쪽 0부터
   전체 폭을 쓰게 되돌린다 — 자료·메뉴·960px 이상 PC 화면은 전혀 안 바꿈. */
@media (min-width:761px) and (max-width:959px){
  body:not(.carwash-mode) #mainContent{left:0!important;right:0!important;width:auto!important;}
}

/* v1.3.238 — 사진·파일 올리기 바(.quick-upload-bar)를 폰(≤760)과 태블릿(761~959)이 같은 모양으로 쓴다.
   예전에는 폰에서 bottom:56px(숨겨진 옛 .bottom-nav 자리)로 화면 중간에 떠서 카드·입력칸을 덮었고,
   태블릿은 styles.css 의 다른 규칙(보라색 전폭 바)이 이겼다. 이제 둘 다 화면 맨 아래 8px 위에 붙는다. */
@media(max-width:959px){
  .quick-upload-bar{display:grid!important;grid-template-columns:1fr 1fr!important;position:fixed!important;left:8px!important;right:8px!important;bottom:calc(8px + env(safe-area-inset-bottom,0px))!important;height:auto!important;min-height:0!important;z-index:970!important;gap:6px!important;padding:6px!important;border:1px solid #dbe5ef!important;border-radius:12px!important;background:#ffffffee!important;box-shadow:0 7px 24px rgba(10,38,65,.18)!important;}
  .quick-upload-bar .quick-bar-btn{min-height:48px!important;height:auto!important;border:0!important;border-radius:9px!important;background:#0b82e8!important;color:#fff!important;font-size:14px!important;font-weight:900!important;}
  .quick-upload-bar .quick-bar-btn.camera{background:#0b82e8!important;}
  .quick-upload-bar .quick-bar-btn.file{background:#159961!important;}
  body:not(.carwash-mode) #mainContent{padding-bottom:148px!important;}
}

/* v1.3.238 — hidden 인 조회기간 막대·소장 홈 옛 머리가 폰 규칙(display:grid/flex !important)에 져서 그대로 보였다
   (통합 검색에서 hidden 인 조회기간 막대가 폰에서 183px 그대로 뜨는 것을 실제 렌더링으로 확인). */
.global-period-bar[hidden]{display:none!important;}
[data-view="dashboard"]>.field-home-title-off{display:none!important;}

/* v1.3.238 — 마감일지 화면: 소장이 매일 쓰는 4개(마감일지 입력·사진 찍기·파일 올리기·현금마감)만 크게 두고,
   자주 안 쓰는 POS·카드사 엑셀, 재고·유외상품, 자동 비교 결과는 한 줄로 접어 둔다(단추·동작은 그대로). */
.closing-actions>.closing-more{grid-column:1/-1;border:1px solid var(--line,#dbe5ef);border-radius:12px;background:var(--panel,#fff);}
.closing-more>summary{cursor:pointer;padding:12px 14px;font-weight:800;font-size:14px;}
.closing-more .closing-actions-more{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;padding:0 12px 12px;}
.closing-more .closing-actions-more .closing-action{grid-column:auto!important;min-height:0!important;}

@media(max-width:760px){
  /* v1.3.238 — 폰 첫 화면 정리: 위 [⌂ 홈] 단추와 같은 일을 하고 제목이 세 번 반복되던 '← 홈' 줄, 조회기간 안내문,
     요약 띠의 [⌂ 대시보드]를 접어 본문이 첫 화면에 보이게 한다. 조회기간 칸(년·월/일)과 [가장 최근 자료]는 그대로 둔다. */
  .mobile-view-bar{display:none!important;}
  body:not(.carwash-mode) .closing-station{grid-template-columns:1fr 1fr!important;gap:6px!important;padding:8px 10px!important;}
  body:not(.carwash-mode) #globalPeriodBar{grid-template-columns:1fr 1fr!important;gap:6px!important;padding:8px!important;margin-bottom:6px!important;}
  body:not(.carwash-mode) #globalPeriodBar .global-period-copy{display:none!important;}
  body:not(.carwash-mode) #globalPeriodBar label{grid-column:auto!important;}
  body:not(.carwash-mode) #globalPeriodBar button{grid-column:1/-1!important;min-height:36px!important;}
  body:not(.carwash-mode) #menuContextStrip .menu-context-home{display:none!important;}
  body:not(.carwash-mode) #mainContent{font-size:16px!important;padding-bottom:148px!important;}
  body:not(.carwash-mode) .topbar-brand-v119{display:none!important;}
  /* v1.3.238 — styles.css 여러 겹의 .topbar-left{max-width:45~52%;overflow:hidden} 때문에 360~390px 폰에서 [앞으로 →] 가 잘렸다(실제 렌더링 확인). 폭 제한·잘림을 여기서 푼다. */
  body:not(.carwash-mode) .topbar-left{display:flex!important;flex:1!important;max-width:none!important;min-width:0!important;overflow:visible!important;}
  body:not(.carwash-mode) .history-nav{width:100%!important;justify-content:flex-start!important;}
  body:not(.carwash-mode) #navHome,
  body:not(.carwash-mode) #navBack,
  body:not(.carwash-mode) #navForward{min-height:44px!important;height:44px!important;padding:0 9px!important;font-size:13px!important;}
  body:not(.carwash-mode) .top-actions{gap:4px!important;}
  body:not(.carwash-mode) #notificationButton,
  body:not(.carwash-mode) #logoutButton{min-height:44px!important;height:44px!important;padding:0 9px!important;}
    body:not(.carwash-mode) #globalSearchButton,
  body:not(.carwash-mode) .app-install-button{display:none!important;}
  .final-role-today{padding:10px!important;}.final-role-today>header{align-items:flex-start!important;flex-direction:column!important;}
  .final-role-task-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;}
  .final-role-task{min-height:142px!important;grid-template-columns:1fr!important;grid-template-rows:auto!important;text-align:center!important;justify-items:center!important;padding:11px 8px!important;}
  .final-role-task-icon{grid-row:auto!important;}.final-role-task>em{grid-column:auto!important;justify-self:center!important;font-size:12px!important;}
  .final-role-task-copy strong{font-size:15px!important;}.final-role-task-copy b{font-size:18px!important;white-space:normal!important;}.final-role-task-copy small{font-size:13px!important;}
  .final-field-task{min-height:140px!important;}.final-field-task small,.final-field-task-state{font-size:13px!important;}
  .bottom-nav{justify-content:flex-start!important;overflow-x:auto!important;gap:4px!important;scrollbar-width:none!important;}
  .bottom-nav::-webkit-scrollbar{display:none!important;}
  .bottom-nav button{flex:0 0 auto!important;min-width:72px!important;padding:0 8px!important;}
  .bottom-nav button span{display:flex!important;flex-direction:column!important;align-items:center!important;gap:2px!important;}
  .bottom-nav button span em{font-style:normal!important;font-size:.68rem!important;font-weight:850!important;white-space:nowrap!important;}
  .bottom-nav button,button,input,select,textarea{min-height:44px;}
  input,select,textarea{font-size:16px!important;}
  .data-table td,.data-table th{font-size:14px!important;}
  .final-matrix-row{min-width:760px!important;}
  .v55-ceo-margin-row{min-width:700px!important;}
}

/* ========================================================================
 * v1.3.221 — 홈 화면 아이콘·그래픽 다듬기(소장님 지시: "그래픽이 안좋다, 사진처럼")
 * ------------------------------------------------------------------------
 * 이모지 아이콘을 index.html 공용 SVG 심볼(<symbol id="i-...">)로 바꾸고, 관리자 KPI·
 * 대표 실마진 KPI에 유종 타일과 같은 방식의 색 강조선을 더하고, 대표 홈 "주유소별 업무
 * 현황"에 표에 이미 찍힌 완료/미도착 점을 다시 센 도넛 그래프 1개를 추가했다. 자료·계산·
 * 메뉴 이동은 전혀 바꾸지 않았다. 과거 theme-vXXXX.css 는 여전히 쓰지 않는다.
 * semantic-contract:v13221 icon-system kpi-accent donut-chart
 * ======================================================================== */
.ic{width:1em;height:1em;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:inline-block;vertical-align:-.125em;flex:none;}

/* 소장: 흰 배지 위 아이콘은 짙은 남색으로(카드 배경색과 무관하게 항상 보임) */
.final-field-task-icon{color:#0d2947!important;}
.final-process-steps>span i{color:#1688e7!important;display:inline-flex!important;}
.final-field-tips i{color:#1688e7!important;display:inline-flex!important;}

/* 관리자 KPI 4칸 — 유종 타일과 같은 색 강조선 방식으로 통일 */
.v55-admin-tiles .v1200-kpi:nth-child(1){border-top:4px solid var(--final-blue)!important;}
.v55-admin-tiles .v1200-kpi:nth-child(2){border-top:4px solid var(--final-purple)!important;}
.v55-admin-tiles .v1200-kpi:nth-child(3){border-top:4px solid var(--final-orange)!important;}
.v55-admin-tiles .v1200-kpi:nth-child(4){border-top:4px solid #0f9aa4!important;}
.v55-ceo-margin-tiles .v1200-kpi:nth-child(1){border-top:4px solid var(--final-blue)!important;}
.v55-ceo-margin-tiles .v1200-kpi:nth-child(2){border-top:4px solid var(--final-purple)!important;}
.v55-ceo-margin-tiles .v1200-kpi:nth-child(3){border-top:4px solid var(--final-orange)!important;}
.v55-ceo-margin-tiles .v1200-kpi:nth-child(4){border-top:4px solid var(--final-green)!important;}

/* 적용 원칙 카드 아이콘도 항목마다 다른 색으로 */
.v55-ap-item:nth-child(1) i{color:var(--final-blue)!important;}
.v55-ap-item:nth-child(2) i{color:var(--final-orange)!important;}
.v55-ap-item:nth-child(3) i{color:var(--final-purple)!important;}
.v55-ap-item:nth-child(4) i{color:var(--final-green)!important;}
.v55-ap-item i{display:inline-flex!important;}

/* 대표 홈 "주유소별 업무 현황" 완료율 도넛 — 표에 이미 있는 점을 다시 센 값(새 계산 아님) */
.v55-ceo-matrix header{align-items:center!important;}
.v55-donut-wrap{display:flex!important;align-items:center!important;gap:8px!important;flex:none!important;}
.v55-donut{width:40px!important;height:40px!important;transform:rotate(-90deg)!important;flex:none!important;}
.v55-donut-track{fill:none!important;stroke:#e3eaf1!important;stroke-width:4!important;}
.v55-donut-fill{fill:none!important;stroke-width:4!important;stroke-linecap:round!important;transition:stroke-dasharray .2s ease!important;}
.v55-donut-wrap b{font-size:15px!important;color:#0d2947!important;}
.v55-donut-wrap small{display:block!important;font-size:12px!important;color:#73859a!important;}
html[data-theme="dark"] .v55-donut-track{stroke:#30404f!important;}
html[data-theme="dark"] .v55-donut-wrap b{color:#f2f7fb!important;}

@media(max-width:760px){
  .v55-donut-wrap small{display:none!important;}
}


/* v1.3.229 — 상단/메뉴 체계 정리 */
body:not(.carwash-mode) #versionChip{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:34px!important;height:34px!important;padding:0 10px!important;border:1px solid #73b8ee!important;border-radius:8px!important;background:#e8f5ff!important;color:#0b4f82!important;font-size:12px!important;font-weight:950!important;line-height:1!important;white-space:nowrap!important;}
body:not(.carwash-mode) .history-nav,body:not(.carwash-mode) .admin-role-preview,body:not(.carwash-mode) .top-actions{align-items:center!important;}
body:not(.carwash-mode) #navHome,body:not(.carwash-mode) #navBack,body:not(.carwash-mode) #navForward,body:not(.carwash-mode) .admin-role-tabs button,body:not(.carwash-mode) #adminPreviewViewport,body:not(.carwash-mode) #adminPreviewStation,body:not(.carwash-mode) #notificationButton,body:not(.carwash-mode) #globalSearchButton,body:not(.carwash-mode) #logoutButton,body:not(.carwash-mode) #versionChip{height:36px!important;min-height:36px!important;line-height:1!important;}
body:not(.carwash-mode) .admin-role-preview{height:44px!important;padding:4px 6px!important;}
body:not(.carwash-mode) .admin-role-preview>span{display:flex!important;align-items:center!important;height:36px!important;line-height:1!important;}







@media(max-width:760px){
  body:not(.carwash-mode) #versionChip{display:none!important;}
  .phone-nav{overflow-x:auto!important;overscroll-behavior-x:contain!important;}
  .phone-nav-row{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;scrollbar-width:none!important;gap:5px!important;}
  .phone-nav-row::-webkit-scrollbar{display:none!important;}
  
}
/* v1.3.239 — 통합검색 CSS(v1.3.230 에 줄바꿈 대신 역슬래시+n 글자째 한 줄로 저장돼 규칙이 전부 무효였음)는 ui/vnext-screens.css 로 새로 작성했다. */
/* v1.3.231 — 실마진 화면 + 대표/관리자 홈의 월말 재고·손익 요약 */
.profit-stockadj-panel{overflow:hidden}
.profit-stockadj-actions{justify-content:flex-end;flex-wrap:wrap}
.button-link{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
.profit-stockadj-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:10px 0}
.profit-stockadj-summary article{border:1px solid #dbe6ef;border-radius:12px;background:#f8fbfe;padding:12px;min-height:92px}
.profit-stockadj-summary small,.dashboard-stockadj-card small{display:block;color:#73859a;font-size:12px}
.profit-stockadj-summary strong{display:block;margin:4px 0;font-size:22px;color:#173f69}
.profit-stockadj-summary span{font-size:12px;color:#637789}
.profit-stockadj-summary .bad,.dashboard-stockadj-card .bad{color:#c53b35!important}.profit-stockadj-summary .warn,.dashboard-stockadj-card .warn{color:#a56c12!important}.profit-stockadj-summary .ok,.dashboard-stockadj-card .ok{color:#147846!important}
.profit-stockadj-bars{display:grid;grid-template-columns:1fr 1fr;gap:12px}.profit-stockadj-bars>div{border:1px solid #e0e8f0;border-radius:12px;padding:11px;background:#fff}.profit-stockadj-bars h3{margin:0 0 9px;font-size:14px;color:#173f69}
.profit-stockadj-barlist{display:grid;gap:7px}.profit-stockadj-bar{display:grid;grid-template-columns:minmax(90px,1fr) minmax(100px,1.8fr) 72px;gap:8px;align-items:center;font-size:12px}.profit-stockadj-bar>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profit-stockadj-bar>i{display:block;height:9px;background:#eef3f7;border-radius:999px;overflow:hidden}.profit-stockadj-bar>i>em{display:block;height:100%;border-radius:999px}.profit-stockadj-bar>b{text-align:right;font-variant-numeric:tabular-nums}
.dashboard-stockadj-card{margin-top:12px}.dashboard-stockadj-card>header{display:flex;justify-content:space-between;gap:12px;align-items:center}.dashboard-stockadj-body{display:grid;grid-template-columns:220px minmax(0,1fr) 220px;gap:12px;align-items:stretch}.dashboard-stockadj-total,.dashboard-stockadj-fuels,.dashboard-stockadj-watch{border:1px solid #dce7ef;border-radius:12px;background:#f8fbfe;padding:12px}.dashboard-stockadj-total strong{display:block;font-size:26px;margin:6px 0}.dashboard-stockadj-total span,.dashboard-stockadj-watch span,.dashboard-stockadj-watch em{display:block;font-size:12px;color:#60758a}.dashboard-stockadj-watch strong{display:block;margin:6px 0;color:#173f69}.dashboard-stockadj-fuels{display:grid;gap:7px}.dashboard-stockadj-fuels>span{display:grid;grid-template-columns:10px 1fr auto;gap:8px;align-items:center}.dashboard-stockadj-fuels i{width:10px;height:10px;border-radius:999px}.dashboard-stockadj-fuels b{font-size:13px}.dashboard-stockadj-fuels em{font-style:normal;font-weight:850}
html[data-theme="dark"] .profit-stockadj-summary article,html[data-theme="dark"] .profit-stockadj-bars>div,html[data-theme="dark"] .dashboard-stockadj-total,html[data-theme="dark"] .dashboard-stockadj-fuels,html[data-theme="dark"] .dashboard-stockadj-watch{background:#13283a;border-color:#2e475b;color:#eef6fd}html[data-theme="dark"] .profit-stockadj-summary strong,html[data-theme="dark"] .profit-stockadj-bars h3,html[data-theme="dark"] .dashboard-stockadj-watch strong{color:#f2f7fb}
@media(max-width:900px){.profit-stockadj-summary{grid-template-columns:1fr 1fr}.profit-stockadj-bars{grid-template-columns:1fr}.dashboard-stockadj-body{grid-template-columns:1fr 1fr}.dashboard-stockadj-fuels{grid-column:1/-1}}
@media(max-width:600px){.profit-stockadj-summary{grid-template-columns:1fr}.dashboard-stockadj-body{grid-template-columns:1fr}.dashboard-stockadj-fuels{grid-column:auto}.profit-stockadj-actions{justify-content:flex-start}.profit-stockadj-bar{grid-template-columns:minmax(80px,1fr) minmax(80px,1.2fr) 70px}}
.profit-stockadj-embed{margin-top:12px;border:1px solid #dbe6ef;border-radius:12px;background:#fbfdff;overflow:hidden}.profit-stockadj-embed>summary{cursor:pointer;padding:11px 13px;font-weight:900;color:#173f69;list-style:none}.profit-stockadj-embed>summary::-webkit-details-marker{display:none}.profit-stockadj-embed>summary::after{content:'펼치기';float:right;color:#6b7f92;font-size:12px}.profit-stockadj-embed[open]>summary::after{content:'접기'}.profit-stockadj-embed iframe{display:block;width:100%;height:820px;border:0;border-top:1px solid #dbe6ef;background:#eef3f8}html[data-theme="dark"] .profit-stockadj-embed{background:#102437;border-color:#2d465b}html[data-theme="dark"] .profit-stockadj-embed>summary{color:#eef6fd}@media(max-width:760px){.profit-stockadj-embed iframe{height:980px}}

/* v1.3.232 — 대표 메뉴 정리: 매입 주문·배분 화면 안에 재고 현황을 합치고, 월말 재고정산은 제공 HTML을 그대로 우선 표시 */
.ceo-order-stock-panel{margin:0 0 14px;border:1px solid #d9e5ef;border-radius:14px;background:#fff;padding:12px;box-shadow:0 4px 14px rgba(15,23,42,.05)}
.ceo-order-stock-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-bottom:10px}.ceo-order-stock-summary span{display:grid;gap:4px;padding:10px 12px;border:1px solid #e1e8ef;border-radius:11px;background:#f8fbfe}.ceo-order-stock-summary small{font-size:11px;color:#71849a}.ceo-order-stock-summary b{font-size:20px;color:#173f69}.ceo-order-stock-summary span.bad b{color:#bd3b34}.ceo-order-stock-summary span.warn b{color:#a56c12}.ceo-order-stock-summary span.ok b{color:#147846}
.ceo-order-stock-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.ceo-order-stock-row{border:1px solid #e0e7ee;border-radius:11px;padding:10px;background:#fff}.ceo-order-stock-row.warning{box-shadow:inset 3px 0 #e0a020}.ceo-order-stock-row header{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:7px}.ceo-order-stock-row header strong{font-size:14px;color:#173f69}.ceo-order-stock-row>div{display:grid;gap:4px}.ceo-order-stock-fuel{display:flex;justify-content:space-between;gap:8px;font-size:12px}.ceo-order-stock-fuel b{font-weight:850;color:#263b4e}.ceo-order-stock-row footer{margin-top:7px;padding-top:6px;border-top:1px dashed #e3e8ee;color:#6d7e8d;font-size:11px}
.stockadj-exact-shell{width:100%;border:1px solid #d7e1ea;border-radius:14px;overflow:hidden;background:#eef3f8;box-shadow:0 4px 14px rgba(15,23,42,.05)}.stockadj-exact-frame{display:block;width:100%;height:1180px;border:0;background:#eef3f8}.stockadj-official-details{margin-top:12px;border:1px solid #dce5ed;border-radius:12px;background:#fff;overflow:hidden}.stockadj-official-details>summary{cursor:pointer;padding:12px 14px;font-weight:900;color:#173f69;background:#f7fafc}.stockadj-official-details[open]>summary{border-bottom:1px solid #e1e8ef}.stockadj-official-details> :not(summary){margin-left:12px;margin-right:12px}.stockadj-official-details>.v55-bar{margin-top:12px}
html[data-theme="dark"] .ceo-order-stock-panel,html[data-theme="dark"] .ceo-order-stock-row,html[data-theme="dark"] .stockadj-official-details{background:#112638;border-color:#2d465b;color:#eef6fd}html[data-theme="dark"] .ceo-order-stock-summary span{background:#132b3f;border-color:#2f4a60}html[data-theme="dark"] .ceo-order-stock-summary b,html[data-theme="dark"] .ceo-order-stock-row header strong,html[data-theme="dark"] .stockadj-official-details>summary{color:#eef6fd}html[data-theme="dark"] .stockadj-official-details>summary{background:#142d42}
@media(max-width:900px){.ceo-order-stock-summary{grid-template-columns:1fr 1fr}.ceo-order-stock-grid{grid-template-columns:1fr}.stockadj-exact-frame{height:1380px}}
@media(max-width:600px){.ceo-order-stock-summary{grid-template-columns:1fr}.stockadj-exact-frame{height:1650px}}


/* v1.3.233 — 간단 예상마진 + 카드수수료(호환 규칙). v1.3.234에서 고밀도 통합표로 재배치. */
.simple-margin-panel{border:1px solid #d8e3ef;background:linear-gradient(180deg,#fbfdff,#fff)}
.simple-margin-panel .station-head{align-items:flex-end;gap:14px;flex-wrap:wrap}
.simple-margin-fee-box{display:flex;align-items:flex-end;gap:8px;flex-wrap:wrap;margin-left:auto}
.simple-margin-fee-box label{display:flex;align-items:center;gap:7px;font-weight:800;color:#27425f;white-space:nowrap}
.simple-margin-fee-box input{width:86px;height:36px;text-align:right;border:1px solid #c9d7e6;border-radius:9px;padding:0 9px;font:inherit;background:#fff}
.simple-margin-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0}
.simple-margin-summary article{min-height:94px;border:1px solid #dce6f0;border-radius:13px;background:#fff;padding:12px;display:flex;flex-direction:column;gap:5px}
.simple-margin-summary article small{font-weight:800;color:#667b91}.simple-margin-summary article strong{font-size:22px;color:#193b5d}.simple-margin-summary article span{font-size:12px;color:#6a7888;line-height:1.4}
.simple-margin-summary article.problem strong{color:#b42318}

@media(max-width:900px){.simple-margin-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.simple-margin-fee-box{width:100%;margin-left:0;justify-content:flex-start}}
@media(max-width:560px){.simple-margin-summary{grid-template-columns:1fr}.simple-margin-panel .station-head{align-items:stretch}.simple-margin-fee-box label{flex:1 1 auto}.simple-margin-fee-box input{min-width:80px}}


/* v1.3.234 — 오른쪽 업무영역 고밀도 원칙. 왼쪽 주메뉴 크기/구조는 건드리지 않는다. */
@media (min-width:901px){
  body:not(.carwash-mode) #mainContent .panel,
  body:not(.carwash-mode) #mainContent .form-card{padding:8px 10px!important;margin-bottom:8px!important;border-radius:10px!important}
  body:not(.carwash-mode) #mainContent .station-head{min-height:0!important;margin-bottom:6px!important;gap:8px!important}
  body:not(.carwash-mode) #mainContent .station-head h2{font-size:15px!important;line-height:1.25!important;margin:0!important}
  body:not(.carwash-mode) #mainContent .station-head small,
  body:not(.carwash-mode) #mainContent .form-help{font-size:12px!important;line-height:1.4!important}
  body:not(.carwash-mode) #mainContent .data-table th,
  body:not(.carwash-mode) #mainContent .data-table td{padding:5px 7px!important;font-size:12px!important;line-height:1.22!important;vertical-align:middle!important}
  body:not(.carwash-mode) #mainContent .data-table th{position:sticky;top:0;z-index:2;white-space:nowrap!important}
  body:not(.carwash-mode) #mainContent .data-table input,
  body:not(.carwash-mode) #mainContent .data-table select{height:29px!important;min-height:29px!important;padding:2px 6px!important;font-size:12px!important;border-radius:6px!important}
  body:not(.carwash-mode) #mainContent .button-row button,
  body:not(.carwash-mode) #mainContent .fuel-margin-bar button{min-height:30px!important;padding:4px 9px!important;font-size:12px!important}
  body:not(.carwash-mode) #mainContent .metric-grid{gap:7px!important;grid-template-columns:repeat(auto-fit,minmax(135px,1fr))!important}
  body:not(.carwash-mode) #mainContent .metric-grid>*{min-height:64px!important;padding:8px 10px!important}
}

/* 실마진: 중복 큰 표를 없애고 작은 대시보드 + 한 줄 엑셀형 입력·분석표 */
.margin-dense-dashboard{margin-bottom:6px!important}
.dense-kpi-row{display:grid;grid-template-columns:repeat(6,minmax(125px,1fr));gap:7px;margin:7px 0!important}
.dense-kpi-row article{min-height:70px!important;padding:8px 10px!important;border-radius:9px!important;gap:2px!important}
.dense-kpi-row article small{font-size:12px!important}.dense-kpi-row article strong{font-size:17px!important;line-height:1.15!important}.dense-kpi-row article span{font-size:12px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.simple-margin-breakdown{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:7px}
.margin-mini-table{border:1px solid #dce6ef;border-radius:9px;background:#fff;overflow:hidden}.margin-mini-table h3{margin:0;padding:6px 8px;background:#f4f8fc;border-bottom:1px solid #dce6ef;font-size:12px;color:#173f69}.margin-mini-table>div{max-height:175px;overflow:auto}.margin-mini-table table{width:100%;border-collapse:collapse;font-size:11px}.margin-mini-table th,.margin-mini-table td{padding:4px 6px;border-bottom:1px solid #edf1f5;white-space:nowrap}.margin-mini-table th{position:sticky;top:0;background:#f8fbfe;z-index:1}.margin-mini-table .num{text-align:right;font-variant-numeric:tabular-nums}
.fuel-margin-panel{margin-top:0!important}.fuel-margin-panel>.station-head{margin-bottom:4px!important}.dense-help{margin:2px 0 6px!important}
.fuel-margin-bar{gap:5px!important;margin:4px 0!important}.fuel-margin-bar label{font-size:12px!important}.fuel-margin-bar select,.fuel-margin-bar input{height:30px!important;font-size:12px!important;padding:2px 6px!important}
.fuel-margin-advanced{margin:5px 0;border:1px solid #dce6ef;border-radius:8px;background:#f8fbfe}.fuel-margin-advanced>summary{cursor:pointer;padding:6px 9px;font-size:11px;font-weight:850;color:#395a78;list-style:none}.fuel-margin-advanced>summary::-webkit-details-marker{display:none}.fuel-margin-advanced[open]>summary{border-bottom:1px solid #dce6ef}.fuel-margin-advanced>.fuel-margin-bar{padding:5px 7px;margin:0!important}
.fuel-margin-summary{margin:4px 0!important;font-size:12px!important}.fuel-margin-summary>span{padding:4px 7px!important;min-height:0!important}.fuel-margin-warn{margin:4px 0!important;padding:5px 7px!important;font-size:12px!important}
.fuel-margin-scroll{max-height:calc(100vh - 300px);min-height:300px;overflow:auto!important;border:1px solid #dce6ef;border-radius:8px}
.fuel-margin-table{min-width:1880px!important}.fuel-margin-table th,.fuel-margin-table td{white-space:nowrap!important}.fuel-margin-table .margin-station,.fuel-margin-table .margin-supplier,.fuel-margin-table .margin-fuel{white-space:nowrap!important;overflow:visible!important;text-overflow:clip!important}
.margin-buy-inline,.margin-fee-inline{display:flex;align-items:center;gap:4px;white-space:nowrap}.margin-buy-inline input{width:92px!important;text-align:right;font-weight:800}.margin-buy-inline small{font-size:10px;color:#6e8194}.margin-fee-inline input{width:58px!important;text-align:right}.margin-fee-inline span{font-size:10px;color:#6e8194}.margin-fee-inline button{min-height:27px!important;padding:2px 6px!important;font-size:12px!important}
.margin-qty-basis{width:72px!important}.margin-fixed-basis{display:inline-flex;align-items:center;height:28px;padding:0 7px;border-radius:6px;background:#f3f6f9;color:#66798b;font-size:11px;font-weight:800}
.fuel-margin-row-advanced{display:inline-block;margin-left:5px;vertical-align:middle;position:relative}.fuel-margin-row-advanced>summary{cursor:pointer;display:inline-flex;align-items:center;min-height:24px;padding:2px 5px;border:1px solid #d9e3ed;border-radius:5px;background:#f8fbfe;color:#60758a;font-size:9.5px;list-style:none}.fuel-margin-row-advanced>summary::-webkit-details-marker{display:none}.fuel-margin-row-advanced[open]>div{position:absolute;z-index:20;left:0;top:28px;display:grid;grid-template-columns:repeat(2,130px);gap:6px;padding:8px;border:1px solid #cfdbe7;border-radius:8px;background:#fff;box-shadow:0 8px 24px rgba(15,23,42,.16)}.fuel-margin-row-advanced label{display:grid;gap:3px;font-size:10px;color:#536b82}.fuel-margin-row-advanced select,.fuel-margin-row-advanced input{width:100%!important}
.margin-simple-per-l,.margin-net-per-l,.margin-expected-profit{font-weight:900!important}.margin-compat-hidden{display:none!important}
html[data-theme="dark"] .margin-mini-table,html[data-theme="dark"] .fuel-margin-row-advanced[open]>div{background:#14283a;border-color:#31506a;color:#edf5fb}html[data-theme="dark"] .margin-mini-table h3,html[data-theme="dark"] .margin-mini-table th{background:#193149;color:#edf5fb}
@media(max-width:1200px) and (min-width:901px){.dense-kpi-row{grid-template-columns:repeat(3,minmax(130px,1fr))}.simple-margin-breakdown{grid-template-columns:1fr 1fr}.simple-margin-breakdown .margin-mini-table:last-child{grid-column:1/-1}}
@media(max-width:900px){.dense-kpi-row{grid-template-columns:repeat(2,minmax(0,1fr))}.simple-margin-breakdown{grid-template-columns:1fr}.fuel-margin-scroll{max-height:none}.fuel-margin-table{min-width:1760px!important}.fuel-margin-row-advanced[open]>div{position:fixed;left:10px;right:10px;top:auto;bottom:80px;grid-template-columns:1fr 1fr}}

/* v1.3.235 — 실마진 확정행 정정은 팝업 없이 같은 행에서 최초 입력 형태로 다시 연다. */
.fuel-margin-correction-tools{display:inline-flex;align-items:center;gap:4px;margin-left:4px;vertical-align:middle}
.fuel-margin-correction-tools[hidden]{display:none!important}
.fuel-margin-correction-reason{width:120px!important;min-width:120px;height:28px!important;padding:2px 6px!important;border:1px solid #d3dee8;border-radius:6px;font-size:11px!important;background:#fff;color:#19354f}
.fuel-margin-correcting{background:#fffdf3!important;box-shadow:inset 3px 0 #e6a521}
.fuel-margin-correcting .fuel-margin-input,.fuel-margin-correcting .fuel-margin-row-qty,.fuel-margin-correcting .fuel-margin-row-freight,.fuel-margin-correcting .fuel-margin-row-amount,.fuel-margin-correcting .fuel-margin-mode,.fuel-margin-correcting .fuel-margin-transport{border-color:#e1aa3f!important;background:#fffef8!important}
html[data-theme="dark"] .fuel-margin-correction-reason{background:#13283b;border-color:#36546d;color:#eef6fd}
html[data-theme="dark"] .fuel-margin-correcting{background:#2b281c!important}


/* v1.3.236 — 실마진 별도 수송료 입력 + 긴 표 상단 가로 스크롤 */
.fuel-margin-scroll-assist{position:sticky;top:52px;z-index:12;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:6px;margin:4px 0 5px;padding:4px 5px;border:1px solid #d7e3ee;border-radius:8px;background:rgba(248,251,254,.97);box-shadow:0 2px 7px rgba(20,54,82,.08)}
.fuel-margin-scroll-assist[hidden]{display:none!important}
.fuel-margin-scroll-top{height:14px;overflow-x:auto;overflow-y:hidden;scrollbar-width:auto;overscroll-behavior-x:contain}
.fuel-margin-scroll-top-spacer{height:1px;min-width:100%}
.fuel-margin-scroll-start,.fuel-margin-scroll-end{min-height:27px!important;height:27px!important;padding:2px 7px!important;font-size:11px!important;white-space:nowrap}
.fuel-margin-transport.transport-inactive{opacity:.68;background:#f6f8fa!important;border-style:dashed!important;cursor:text}
.fuel-margin-transport.transport-inactive:focus{opacity:1;background:#fffef8!important;border-style:solid!important}
html[data-theme="dark"] .fuel-margin-scroll-assist{background:rgba(19,40,59,.97);border-color:#36546d}
html[data-theme="dark"] .fuel-margin-transport.transport-inactive{background:#16293a!important;color:#e9f2f9!important}
@media(max-width:900px){.fuel-margin-scroll-assist{position:sticky;top:0;grid-template-columns:auto minmax(120px,1fr) auto}.fuel-margin-scroll-top{height:16px}}


/* v1.3.237 — 실마진 엑셀형 표: 글자 크기는 유지하고 행 높이만 줄인다. */
.fuel-margin-table th,.fuel-margin-table td{padding-top:4px!important;padding-bottom:4px!important;line-height:1.2!important}
.fuel-margin-table input,.fuel-margin-table select{height:27px!important;min-height:27px!important;padding-top:1px!important;padding-bottom:1px!important}
.fuel-margin-table .margin-fixed-basis{height:25px!important}
.fuel-margin-table .fuel-margin-row-advanced>summary{min-height:22px!important;padding-top:1px!important;padding-bottom:1px!important}
.fuel-margin-table .margin-fee-inline button,.fuel-margin-table .fuel-margin-correct,.fuel-margin-table .fuel-margin-correction-cancel{min-height:25px!important;height:25px!important;padding-top:1px!important;padding-bottom:1px!important}
.fuel-margin-table .fuel-margin-correction-reason{height:26px!important}
@media(max-width:900px){
  .fuel-margin-table input,.fuel-margin-table select{height:30px!important;min-height:30px!important}
  .fuel-margin-table th,.fuel-margin-table td{padding-top:4px!important;padding-bottom:4px!important}
}