.staff-body { min-height: 100vh; background: var(--gray-100); }
.staff-app { min-height: 100vh; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
.ops-gate { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: linear-gradient(135deg,var(--cream) 0 56%,var(--blue-050) 56%); }
.ops-gate-card { width: min(720px,100%); border: 1px solid var(--gray-300); border-radius: 0; background: var(--white); padding: 34px; box-shadow: var(--shadow); }
.ops-gate-card .brand { margin-block-end: 28px; }
.ops-gate-card h1 { font-size: clamp(34px,6vw,56px); }
.ops-gate-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-block-start: 22px; }
.role-choice-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin-block: 22px; }
.role-choice { min-height: 145px; border: 1px solid var(--gray-300); border-radius: 0; background: var(--white); color: var(--navy-900); padding: 16px; text-align: start; cursor: pointer; }
.role-choice:hover,.role-choice:focus-visible,.role-choice.active { border-color: var(--blue-600); background: var(--blue-050); box-shadow: inset 5px 0 0 var(--blue-600); }
.role-choice strong,.role-choice small { display: block; }
.role-choice small { color: var(--gray-700); margin-block-start: 8px; }
.ops-field { display: grid; gap: 6px; }
.ops-field label { color: var(--gray-700); font-size: 11px; font-weight: 750; }
.ops-field input,.ops-field select,.ops-field textarea { width: 100%; min-height: 44px; border: 1px solid var(--gray-300); border-radius: 2px; background: var(--white); color: var(--navy-900); padding: 10px 11px; }
.ops-field textarea { min-height: 86px; resize: vertical; }
.ops-field input:focus,.ops-field select:focus,.ops-field textarea:focus { outline: 3px solid var(--blue-100); border-color: var(--blue-600); }
.ops-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 13px; }
.ops-form-grid .full { grid-column: 1/-1; }
.ops-check { display: flex; align-items: flex-start; gap: 9px; color: var(--gray-700); font-size: 12px; }
.ops-check input { width: 18px; height: 18px; flex: 0 0 auto; }
.ops-toast { position: fixed; z-index: 120; inset-inline-end: 22px; inset-block-end: 22px; width: min(390px,calc(100% - 44px)); display: none; border-inline-start: 5px solid var(--blue-500); background: var(--navy-950); color: var(--white); padding: 15px 17px; box-shadow: var(--shadow); }
.ops-toast.show { display: block; }
.ops-toast.error { border-color: #ca7777; }
.ops-badge { display: inline-flex; align-items: center; min-height: 25px; width: fit-content; border: 1px solid var(--gray-300); border-radius: 0; color: var(--gray-700); background: var(--white); padding: 3px 7px; font-size: 9px; font-weight: 780; letter-spacing: .05em; text-transform: uppercase; }
.ops-badge.assigned,.ops-badge.enRoute,.ops-badge.arrived,.ops-badge.collected,.ops-badge.handover,.ops-badge.delivered,.ops-badge.completed,.ops-badge.active,.ops-badge.available,.ops-badge.onRoute,.ops-badge.scanning,.ops-badge.quality,.ops-badge.ready { border-color: var(--blue-500); color: var(--blue-700); background: var(--blue-050); }
.ops-badge.exception,.ops-badge.high,.ops-badge.offline { border-color: #c98b8b; color: var(--danger); background: #fff5f5; }
.ops-card { border: 1px solid var(--gray-300); border-radius: 0; background: var(--white); padding: 19px; }
.ops-card.flush { padding: 0; }
.ops-card.navy { background: var(--navy-900); border-color: var(--navy-900); color: var(--white); }
.ops-card.blue { background: var(--blue-050); }
.ops-card h2,.ops-card h3 { margin-block-end: 8px; }
.ops-card h2 { font-size: 19px; }
.ops-card p { color: var(--gray-700); font-size: 13px; }
.ops-card.navy p { color: #c5d4df; }
.ops-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; border-block-end: 1px solid var(--gray-200); }
.ops-card-head h2 { margin: 0; font-size: 16px; }
.ops-card-body { padding: 18px; }
.ops-grid { display: grid; gap: 15px; }
.ops-grid.two { grid-template-columns: repeat(2,minmax(0,1fr)); }
.ops-grid.three { grid-template-columns: repeat(3,minmax(0,1fr)); }
.ops-grid.four { grid-template-columns: repeat(4,minmax(0,1fr)); }
.ops-metric { min-height: 125px; display: flex; flex-direction: column; justify-content: space-between; }
.ops-metric small { color: var(--gray-700); text-transform: uppercase; letter-spacing: .07em; }
.ops-metric strong { font-size: 29px; }
.ops-metric span { color: var(--blue-700); font-size: 11px; }
.ops-list { display: grid; }
.ops-row { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; gap: 13px; padding: 13px 0; border-block-end: 1px solid var(--gray-200); }
.ops-row:last-child { border: 0; }
.ops-row strong,.ops-row small { display: block; }
.ops-row small { color: var(--gray-700); margin-block-start: 3px; }
.ops-inline { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ops-progress { height: 7px; background: var(--gray-200); overflow: hidden; }
.ops-progress span { display: block; height: 100%; background: var(--blue-600); }
.ops-divider { border: 0; border-block-start: 1px solid var(--gray-200); margin-block: 18px; }

.ops-app-icon { width: 22px; height: 22px; display: block; flex: 0 0 auto; }
.courier-stage { min-height: 100vh; display: grid; place-items: center; background: #d8e2e8; padding: 20px; }
.courier-phone { width: min(440px,100%); height: calc(100vh - 40px); min-height: 680px; margin: 0 auto; position: relative; display: flex; flex-direction: column; overflow: hidden; border: 1px solid #9fb1bd; border-radius: 32px; background: var(--gray-100); box-shadow: 0 26px 70px rgba(9,40,61,.22); }
.courier-header { position: relative; z-index: 20; flex: 0 0 auto; color: var(--white); background: linear-gradient(135deg,var(--navy-950) 0%,var(--navy-800) 48%,var(--blue-700) 100%); padding: calc(12px + env(safe-area-inset-top,0px)) 14px 13px; }
.courier-topline { min-height: 44px; display: flex; align-items: center; gap: 10px; }
.courier-header .brand { width: 104px; margin-inline-end: auto; border-radius: 13px; background: var(--white); padding: 5px 7px; }
.courier-header .brand-inline-mark { width: 30px; height: 30px; border-radius: 9px; }
.courier-header .brand-inline strong { font-size: 19px; }
.courier-header-actions { display: flex; align-items: center; gap: 7px; }
.courier-header .language-select { width: 55px; min-height: 42px; border-color: rgba(255,255,255,.38); border-radius: 13px; background: rgba(255,255,255,.12); color: var(--white); padding-inline: 7px; }
.courier-header .language-select option { color: var(--navy-950); background: var(--white); }
.courier-profile-shortcut { width: 42px; min-height: 42px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.38); border-radius: 13px; background: rgba(255,255,255,.1); color: var(--white); padding: 0; cursor: pointer; }
.courier-commandbar { display: grid; grid-template-columns: minmax(0,1fr) minmax(145px,.85fr); gap: 8px; margin-block-start: 12px; }
.courier-task-search { min-width: 0; min-height: 50px; display: flex; align-items: center; gap: 9px; border: 1px solid rgba(255,255,255,.3); border-radius: 16px; background: rgba(255,255,255,.12); color: #d9e7ef; padding: 8px 11px; text-align: start; cursor: pointer; }
.courier-task-search span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.courier-identity { min-width: 0; display: grid; grid-template-columns: 8px minmax(0,1fr); align-items: center; gap: 7px; border: 1px solid rgba(255,255,255,.3); border-radius: 16px; background: rgba(255,255,255,.12); padding: 7px 9px; }
.courier-live-dot { width: 8px; height: 8px; background: var(--blue-100); box-shadow: 0 0 0 3px rgba(220,238,247,.16); }
.courier-identity strong,.courier-identity small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.courier-identity strong { font-size: 10px; }
.courier-identity small { color: #c6d9e5; font-size: 8px; }
.courier-profile-shortcut:hover,.courier-profile-shortcut:focus-visible,.courier-task-search:hover,.courier-task-search:focus-visible { background: rgba(255,255,255,.2); outline: 2px solid var(--white); outline-offset: 2px; }
.courier-content { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior-y: contain; scrollbar-width: thin; scrollbar-color: var(--gray-300) transparent; padding: 14px 14px calc(92px + env(safe-area-inset-bottom,0px)); }
.courier-view-head { margin: 0 0 14px; border: 1px solid var(--gray-200); border-radius: 22px; background: var(--white); padding: 18px; box-shadow: 0 8px 24px rgba(9,40,61,.06); }
.courier-view-head h1 { margin: 0 0 5px; font-size: 27px; line-height: 1.12; }
.courier-view-head p { margin: 0; color: var(--gray-700); font-size: 12px; }
.courier-content .ops-card { border-color: var(--gray-200); border-radius: 22px; box-shadow: 0 8px 24px rgba(9,40,61,.06); }
.courier-content .ops-field input,.courier-content .ops-field select,.courier-content .ops-field textarea { border-radius: 13px; }
.courier-shift-hero { position: relative; overflow: hidden; min-height: 248px; color: var(--white); border-radius: 26px; background: radial-gradient(circle at 85% 12%,rgba(126,196,232,.42),transparent 34%),linear-gradient(145deg,var(--navy-950) 0%,var(--blue-700) 100%); padding: 22px; box-shadow: 0 16px 36px rgba(9,40,61,.2); }
.courier-shift-hero::after { content:""; position:absolute; width:230px; height:230px; inset-block-start:-90px; inset-inline-end:-95px; border:42px solid rgba(255,255,255,.08); transform:rotate(35deg); pointer-events:none; }
.courier-shift-hero .courier-view-head { position: relative; z-index: 1; max-width: 330px; border: 0; border-radius: 0; background: transparent; padding: 0; box-shadow: none; }
.courier-shift-hero .courier-view-head h1 { color: var(--white); font-size: 32px; line-height: 1.04; }
.courier-shift-hero .courier-view-head p { color: #dceaf2; }
.courier-shift-status { position: relative; z-index: 1; min-height: 72px; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 3px 12px; align-items: center; margin-block-start: 22px; border: 1px solid rgba(255,255,255,.42); border-radius: 18px; background: rgba(255,255,255,.14); padding: 11px 13px; backdrop-filter: blur(10px); }
.courier-shift-status > span { display: flex; align-items: center; gap: 8px; }
.courier-shift-status small { color: #dceaf2; font-size: 9px; }
.courier-shift-status > small { grid-column: 1/-1; padding-inline-start: 30px; }
.courier-shift-status strong { font-size: 18px; }
.courier-section-head { min-height: 42px; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-block-start: 15px; }
.courier-section-head h2 { margin: 0; font-size: 18px; }
.courier-section-head button { min-height: 40px; border: 0; background: transparent; color: var(--blue-700); padding-inline: 0; font-size: 11px; font-weight: 800; cursor: pointer; }
.courier-bottom-nav { position: absolute; z-index: 30; inset-inline: 0; inset-block-end: 0; min-height: calc(78px + env(safe-area-inset-bottom,0px)); display: grid; grid-template-columns: repeat(4,1fr); border-block-start: 1px solid var(--gray-200); border-radius: 24px 24px 0 0; background: rgba(255,255,255,.98); padding-block-end: env(safe-area-inset-bottom,0px); box-shadow: 0 -10px 30px rgba(9,40,61,.08); backdrop-filter: blur(12px); }
.courier-bottom-nav button { position: relative; min-width: 0; min-height: 74px; border: 0; background: transparent; color: var(--gray-500); padding: 9px 3px 6px; font-size: 9px; cursor: pointer; }
.courier-bottom-nav button::before { content:""; position:absolute; inset-block-start:0; inset-inline:28%; height:3px; background:transparent; }
.courier-bottom-nav button b { width: 25px; height: 25px; display: grid; place-items: center; color: inherit; margin: 0 auto 4px; }
.courier-bottom-nav button b .ops-app-icon { width: 23px; height: 23px; }
.courier-bottom-nav button span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.courier-bottom-nav button.active { color: var(--blue-700); font-weight: 800; }
.courier-bottom-nav button.active::before { background: var(--blue-600); }
.courier-metrics { display: grid; grid-auto-flow: column; grid-auto-columns: 135px; gap: 8px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: inline mandatory; scrollbar-width: none; margin-block: 13px 0; padding-block: 2px 5px; }
.courier-metrics::-webkit-scrollbar { display:none; }
.courier-metric { min-height: 105px; display: flex; flex-direction: column; justify-content: space-between; scroll-snap-align: start; border: 1px solid var(--gray-200); border-radius: 20px; background: var(--white); padding: 13px; box-shadow: 0 8px 22px rgba(9,40,61,.07); }
.courier-metric small,.courier-metric strong { display: block; }
.courier-metric small { min-height: 29px; color: var(--gray-700); font-size: 8px; letter-spacing: .04em; text-transform: uppercase; }
.courier-metric strong { font-size: 22px; }
.courier-task-list { display: grid; gap: 10px; }
.courier-task-card { width: 100%; min-height: 158px; display: grid; gap: 10px; border: 1px solid var(--gray-200); border-inline-start: 5px solid var(--blue-500); border-radius: 22px; background: var(--white); color: var(--navy-900); padding: 15px; text-align: start; cursor: pointer; box-shadow: 0 8px 24px rgba(9,40,61,.07); }
.courier-task-card.high { border-inline-start-color: #bd6f6f; }
.courier-task-card:hover,.courier-task-card:focus-visible { background: var(--blue-050); border-color: var(--blue-600); outline: 2px solid var(--blue-100); }
.courier-task-top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.courier-task-card h2 { margin: 0; font-size: 16px; }
.courier-task-card p { margin: 0; color: var(--gray-700); font-size: 11px; }
.courier-task-meta { display: flex; justify-content: space-between; gap: 8px; color: var(--gray-700); font-size: 10px; }
.courier-map-preview { height: 190px; position: relative; overflow: hidden; margin-block-end: 12px; border: 1px solid var(--gray-200); border-radius: 24px; background-color: #dce6ec; background-image: linear-gradient(25deg,transparent 47%,rgba(83,102,117,.13) 48% 52%,transparent 53%),linear-gradient(115deg,transparent 47%,rgba(83,102,117,.12) 48% 52%,transparent 53%); background-size: 78px 78px,96px 96px; box-shadow: 0 10px 26px rgba(9,40,61,.08); }
.map-road { position:absolute; display:block; background:var(--white); border:1px solid #b8c7d0; }
.road-one { width:130%; height:18px; inset-block-start:76px; inset-inline-start:-15%; transform:rotate(-11deg); }
.road-two { width:18px; height:130%; inset-block-start:-15%; inset-inline-start:62%; transform:rotate(18deg); }
.map-marker,.map-current { position:absolute; z-index:2; display:grid; place-items:center; border:3px solid var(--white); background:var(--blue-700); color:var(--white); font-size:10px; font-weight:850; box-shadow:0 4px 12px rgba(9,40,61,.2); }
.map-marker { width:34px; height:34px; }
.marker-1 { inset-block-start:35px; inset-inline-start:19%; }
.marker-2 { inset-block-start:104px; inset-inline-start:46%; }
.marker-3 { inset-block-start:54px; inset-inline-end:12%; }
.map-current { width:44px; height:44px; inset-block-end:14px; inset-inline-start:14px; background:var(--navy-900); }
.map-current .ops-app-icon { width:23px; height:23px; }
.route-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 7px; margin-block-end: 12px; }
.route-summary .ops-card { min-height: 86px; padding: 11px; }
.route-summary small,.route-summary strong { display: block; }
.route-summary small { color: var(--gray-700); font-size: 8px; text-transform: uppercase; }
.route-summary strong { margin-block-start: 5px; font-size: 16px; }
.route-line { position: relative; display: grid; gap: 0; }
.route-stop { position: relative; display: grid; grid-template-columns: 34px 1fr; gap: 10px; padding-block-end: 13px; }
.route-stop::before { content:""; position:absolute; inset-block:34px 0; inset-inline-start:16px; width:2px; background:var(--gray-300); }
.route-stop:last-child::before { display:none; }
.route-index { width: 34px; height: 34px; z-index: 1; display: grid; place-items: center; background: var(--navy-900); color: var(--white); font-size: 10px; font-weight: 800; }
.route-stop-body { min-height: 76px; border: 1px solid var(--gray-200); border-radius: 18px; background: var(--white); color: var(--navy-900); padding: 12px; text-align: start; cursor: pointer; box-shadow: 0 7px 20px rgba(9,40,61,.06); }
.route-stop-body strong,.route-stop-body small { display: block; }
.route-stop-body small { color: var(--gray-700); margin-block-start: 3px; }
.task-detail-head { display: flex; justify-content: space-between; gap: 12px; margin-block-end: 14px; border: 1px solid var(--gray-200); border-radius: 20px; background: var(--white); padding: 15px; box-shadow: 0 8px 24px rgba(9,40,61,.06); }
.task-detail-head h1 { margin: 3px 0 4px; font-size: 25px; }
.task-fact { display: grid; grid-template-columns: 105px 1fr; gap: 10px; padding: 11px 0; border-block-end: 1px solid var(--gray-200); }
.task-fact span { color: var(--gray-700); font-size: 10px; }
.task-fact strong { font-size: 12px; line-height: 1.5; }
.task-actions { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; margin-block-start: 15px; }
.task-actions .full { grid-column: 1/-1; }
.privacy-box { border-inline-start: 5px solid var(--blue-600); background: var(--blue-050); padding: 13px; color: var(--blue-700); font-size: 11px; margin-block: 14px; }
.chain-list { display: grid; margin-block-start: 12px; }
.chain-row { display: grid; grid-template-columns: 9px 1fr auto; gap: 9px; align-items: start; padding: 8px 0; }
.chain-dot { width: 9px; height: 9px; margin-block-start: 4px; background: var(--blue-600); }
.chain-row small { color: var(--gray-700); font-size: 9px; }
.courier-form-section { margin-block-start: 12px; }

.admin-shell { min-height: 100vh; display: grid; grid-template-columns: 246px minmax(0,1fr); }
.admin-sidebar { position: sticky; inset-block-start: 0; height: 100vh; display: flex; flex-direction: column; background: var(--navy-950); color: var(--white); padding: 21px 14px; }
.admin-sidebar .brand { width: 124px; border-radius: 13px; background: var(--white); padding: 5px 7px; margin: 0 8px 28px; }
.admin-nav { display: grid; gap: 3px; }
.admin-nav button { width: 100%; min-height: 44px; display: grid; grid-template-columns: 29px 1fr; align-items: center; gap: 8px; border: 0; border-inline-start: 3px solid transparent; border-radius: 0; background: transparent; color: #c6d5df; padding: 9px 11px; text-align: start; cursor: pointer; }
.admin-nav button:hover,.admin-nav button:focus-visible { background: rgba(255,255,255,.08); color: var(--white); }
.admin-nav button.active { border-inline-start-color: var(--blue-500); background: rgba(80,164,209,.16); color: var(--white); }
.admin-nav button b { width: 24px; height: 24px; display: grid; place-items: center; color: var(--blue-500); }
.admin-app-icon { width: 21px; height: 21px; display: block; }
.admin-sidebar-foot { margin-block-start: auto; border-block-start: 1px solid rgba(255,255,255,.14); padding: 15px 9px 0; }
.admin-sidebar-foot a { display: block; color: #c6d5df; font-size: 11px; text-decoration: none; margin-block-end: 6px; }
.admin-sidebar-foot small { color: #8fa6b5; }
.admin-main { min-width: 0; }
.admin-topbar { min-height: 72px; position: sticky; inset-block-start: 0; z-index: 30; display: flex; align-items: center; gap: 10px; border-block-end: 1px solid var(--gray-300); background: rgba(255,255,255,.96); padding: 10px 25px; backdrop-filter: blur(10px); }
.admin-title { min-width: 0; margin-inline-end: auto; }
.admin-title strong,.admin-title small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-title small { color: var(--gray-700); }
.admin-role { border: 1px solid var(--blue-500); background: var(--blue-050); color: var(--blue-700); padding: 7px 10px; font-size: 10px; font-weight: 780; text-transform: uppercase; }
.admin-user { min-height: 40px; display: flex; align-items: center; gap: 8px; border: 1px solid var(--gray-300); background: var(--white); padding: 4px 9px 4px 4px; }
.admin-avatar { width: 30px; height: 30px; display: grid; place-items: center; background: var(--navy-900); color: var(--white); font-size: 9px; font-weight: 850; }
.admin-user span { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; font-weight: 750; }
.admin-content { padding: 27px; }
.admin-view-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-block-end: 23px; }
.admin-view-head h1 { margin: 0 0 7px; font-size: clamp(29px,3vw,42px); }
.admin-view-head p { margin: 0; color: var(--gray-700); }
.alert-list { display: grid; }
.alert-row { display: grid; grid-template-columns: 5px 1fr auto; gap: 11px; align-items: center; padding: 13px 0; border-block-end: 1px solid var(--gray-200); }
.alert-row:last-child { border: 0; }
.alert-severity { width: 5px; height: 100%; min-height: 34px; background: var(--blue-500); }
.alert-severity.high { background: #ba6a6a; }
.alert-row p { margin: 0; color: var(--navy-900); }
.alert-row small { color: var(--gray-700); }
.task-board { display: grid; grid-template-columns: repeat(4,minmax(210px,1fr)); gap: 10px; overflow-x: auto; padding-block-end: 6px; }
.task-column { min-height: 360px; border: 1px solid var(--gray-300); background: var(--gray-100); }
.task-column-head { display: flex; justify-content: space-between; gap: 8px; padding: 12px; border-block-end: 1px solid var(--gray-300); background: var(--white); }
.task-column-head h2 { margin: 0; font-size: 13px; }
.dispatch-card { margin: 9px; border: 1px solid var(--gray-300); background: var(--white); padding: 12px; cursor: pointer; }
.dispatch-card:hover,.dispatch-card.active { border-color: var(--blue-600); background: var(--blue-050); }
.dispatch-card strong,.dispatch-card small { display: block; }
.dispatch-card small { color: var(--gray-700); margin-block-start: 4px; font-size: 10px; }
.data-table-wrap { overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; min-width: 760px; }
.data-table th,.data-table td { padding: 12px 10px; border-block-end: 1px solid var(--gray-200); text-align: start; vertical-align: middle; }
.data-table th { color: var(--gray-700); font-size: 9px; letter-spacing: .06em; text-transform: uppercase; }
.data-table td { font-size: 12px; }
.data-table tr:last-child td { border: 0; }
.customer-cards,.courier-cards,.product-cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.customer-card,.courier-card,.product-card { border: 1px solid var(--gray-300); background: var(--white); padding: 17px; }
.customer-card h2,.courier-card h2,.product-card h2 { font-size: 16px; margin-block-end: 5px; }
.customer-card p,.courier-card p,.product-card p { font-size: 11px; color: var(--gray-700); }
.courier-card-head { display: flex; justify-content: space-between; gap: 10px; }
.courier-load { display: grid; grid-template-columns: 1fr auto; gap: 7px; align-items: center; margin-block: 13px; }
.courier-load .ops-progress { grid-column: 1/-1; }
.lead-pipeline { display: grid; grid-template-columns: repeat(5,minmax(180px,1fr)); gap: 9px; overflow-x: auto; }
.lead-column { min-height: 240px; border: 1px solid var(--gray-300); background: var(--gray-100); padding: 9px; }
.lead-column h3 { font-size: 12px; }
.lead-card { border: 1px solid var(--gray-300); background: var(--white); padding: 11px; margin-block-end: 8px; }
.lead-card strong,.lead-card small { display: block; }
.lead-card small { color: var(--gray-700); font-size: 9px; margin-block-start: 3px; }
.price-row { display: grid; grid-template-columns: minmax(0,1fr) 110px auto; align-items: end; gap: 10px; padding: 13px 0; border-block-end: 1px solid var(--gray-200); }
.price-row:last-child { border: 0; }
.price-row strong,.price-row small { display: block; }
.price-row small { color: var(--gray-700); }
.report-bars { display: grid; gap: 11px; }
.report-bar { display: grid; grid-template-columns: 110px 1fr 38px; gap: 9px; align-items: center; }
.report-bar span,.report-bar strong { font-size: 11px; }
.zone-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; padding: 13px 0; border-block-end: 1px solid var(--gray-200); }
.zone-row:last-child { border: 0; }
.zone-row strong,.zone-row small { display: block; }
.zone-row small { color: var(--gray-700); }

@media (max-width: 1120px) {
  .admin-shell { grid-template-columns: 205px minmax(0,1fr); }
  .ops-grid.four { grid-template-columns: repeat(2,1fr); }
  .customer-cards,.courier-cards,.product-cards { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 820px) {
  .staff-body { background: var(--gray-100); }
  .admin-shell { display: block; padding-block-end: calc(82px + env(safe-area-inset-bottom,0px)); }
  .admin-sidebar { position: sticky; inset-block-start: 0; z-index: 70; width: 100%; height: auto; min-height: calc(70px + env(safe-area-inset-top,0px)); display: flex; flex-direction: row; align-items: flex-end; padding: calc(10px + env(safe-area-inset-top,0px)) 14px 10px; background: linear-gradient(135deg,var(--navy-950),var(--navy-800) 58%,var(--blue-700)); box-shadow: 0 8px 26px rgba(9,40,61,.16); }
  .admin-sidebar .brand { width: 112px; margin: 0; border-radius: 14px; padding: 5px 7px; }
  .admin-sidebar .brand-inline-mark { width: 30px; height: 30px; border-radius: 9px; }
  .admin-sidebar .brand-inline strong { font-size: 20px; }
  .admin-nav { position: fixed; z-index: 90; inset-inline: 0; inset-block-end: 0; min-height: calc(78px + env(safe-area-inset-bottom,0px)); display: grid; grid-auto-flow: column; grid-auto-columns: minmax(82px,1fr); grid-template-columns: none; gap: 0; overflow-x: auto; overscroll-behavior-inline: contain; scrollbar-width: none; border-block-start: 1px solid var(--gray-200); border-radius: 24px 24px 0 0; background: rgba(255,255,255,.98); padding-block-end: env(safe-area-inset-bottom,0px); box-shadow: 0 -10px 30px rgba(9,40,61,.1); backdrop-filter: blur(14px); }
  .admin-nav::-webkit-scrollbar { display: none; }
  .admin-nav button { position: relative; min-width: 82px; min-height: 76px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; border: 0; background: transparent; color: var(--gray-500); padding: 8px 5px 6px; text-align: center; font-size: 9px; }
  .admin-nav button::before { content:""; position:absolute; inset-block-start:0; inset-inline:28%; height:3px; border-radius:0 0 3px 3px; background:transparent; }
  .admin-nav button:hover,.admin-nav button:focus-visible { background: var(--blue-050); color: var(--blue-700); }
  .admin-nav button.active { border: 0; background: transparent; color: var(--blue-700); }
  .admin-nav button.active::before { background: var(--blue-600); }
  .admin-nav button b { width: 25px; height: 25px; color: inherit; }
  .admin-nav button .admin-app-icon { width: 23px; height: 23px; }
  .admin-nav button span { width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .admin-sidebar-foot { display: none; }
  .admin-topbar { min-height: 60px; position: sticky; inset-block-start: calc(70px + env(safe-area-inset-top,0px)); z-index: 60; border-block-end-color: var(--gray-200); background: rgba(255,255,255,.96); padding: 9px 14px; box-shadow: 0 5px 18px rgba(9,40,61,.05); }
  .admin-title { display: none; }
  .admin-role { margin-inline-end: auto; border: 0; border-radius: 999px; background: var(--blue-100); padding: 8px 12px; }
  .admin-topbar .language-select { min-height: 40px; border-radius: 12px; }
  .admin-user { min-height: 40px; border: 0; border-radius: 999px; background: var(--blue-050); padding: 4px; }
  .admin-user span:not(.admin-avatar) { display: none; }
  .admin-avatar { border-radius: 50%; }
  .admin-content { padding: 20px 14px calc(28px + env(safe-area-inset-bottom,0px)); }
  .admin-view-head { display: block; margin-block-end: 18px; }
  .admin-view-head h1 { font-size: clamp(30px,8vw,38px); line-height: 1.08; }
  .admin-view-head p { max-width: 620px; font-size: 14px; line-height: 1.55; }
  .admin-content .ops-card,.customer-card,.courier-card,.product-card,.task-column,.lead-column { border-color: var(--gray-200); border-radius: 22px; background: var(--white); box-shadow: 0 8px 24px rgba(9,40,61,.06); }
  .admin-content .ops-card.flush,.admin-content .data-table-wrap,.task-column { overflow: hidden; }
  .admin-content .ops-badge { border-radius: 999px; }
  .admin-content .ops-field input,.admin-content .ops-field select,.admin-content .ops-field textarea { border-radius: 13px; }
  .admin-content .ops-grid.four { display: grid; grid-auto-flow: column; grid-auto-columns: 158px; grid-template-columns: none; gap: 10px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-snap-type: inline mandatory; scrollbar-width: none; padding-block-end: 6px; }
  .admin-content .ops-grid.four::-webkit-scrollbar { display: none; }
  .admin-content .ops-grid.four .ops-metric { min-height: 142px; scroll-snap-align: start; }
  .ops-grid.two,.ops-grid.three { grid-template-columns: 1fr; }
  .customer-cards,.courier-cards,.product-cards { grid-template-columns: 1fr; }
  .dispatch-card,.lead-card { border-color: var(--gray-200); border-radius: 16px; }
  .task-column-head { border-radius: 22px 22px 0 0; }
}
@media (max-width: 600px) {
  .role-choice-grid { grid-template-columns: 1fr; }
  .role-choice,.ops-gate-card { border-radius: 22px; }
  .ops-form-grid { grid-template-columns: 1fr; }
  .ops-form-grid .full { grid-column: auto; }
  .admin-content .ops-grid.four { grid-template-columns: none; }
}
@media (max-width: 480px) {
  .courier-stage { padding: 0; }
  .courier-phone { width: 100%; height: 100vh; min-height: 0; border: 0; border-radius: 0; box-shadow: none; }
  .courier-header { gap: 6px; padding-inline: 12px; }
  .courier-header .brand { width: 102px; }
  .courier-identity { max-width: none; }
  .courier-metrics { grid-template-columns: repeat(2,1fr); }
  .admin-content { padding-inline: 13px; }
  .admin-view-head h1 { font-size: 31px; }
}
