:root {
  --paper: #f4f1e9;
  --ink: #17231f;
  --muted: #6b746f;
  --line: #dcd8ce;
  --red: #e42f36;
  --green: #173e35;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: Arial, Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
}
button, select { font: inherit; }
button { cursor: pointer; }

main { min-height: 100vh; overflow: hidden; }
.topbar {
  height: 82px;
  max-width: 1180px;
  padding: 0 28px;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid var(--line);
}
.brand { display: flex; align-items: center; gap: 11px; color: inherit; text-decoration: none; font-weight: 850; font-size: 18px; letter-spacing: -.5px; }
.brand-mark { display: grid; place-items: center; width: 36px; height: 36px; color: white; background: var(--red); border-radius: 10px 10px 10px 2px; font-weight: 900; }
.brand small { display: block; margin-top: 2px; color: var(--muted); font: 600 8px/1 var(--font-geist-mono), monospace; letter-spacing: 1.8px; }
.profile { width: 39px; height: 39px; border: 1px solid #c9c6bd; border-radius: 50%; background: #fff; color: var(--green); font: 700 12px var(--font-geist-mono), monospace; }

.hero { max-width: 1180px; margin: 0 auto; padding: 68px 28px 42px; }
.eyebrow, .section-title > div > span { font: 700 11px/1 var(--font-geist-mono), monospace; letter-spacing: 2.2px; color: var(--red); }
.eyebrow span { display: inline-block; width: 24px; height: 2px; margin-right: 9px; vertical-align: middle; background: var(--red); }
.hero h1 { margin: 18px 0; font-size: clamp(48px, 7vw, 84px); line-height: .94; letter-spacing: -5px; max-width: 780px; }
.hero h1 em { color: var(--red); font-family: Georgia, serif; font-weight: 400; }
.hero p { max-width: 540px; margin: 0; color: var(--muted); font-size: 17px; line-height: 1.6; }

.tracker-card { max-width: 1124px; margin: 0 auto 80px; background: #fff; border: 1px solid #d8d5cc; border-radius: 22px; box-shadow: 0 26px 70px rgba(31, 45, 39, .12); overflow: hidden; display: grid; grid-template-columns: 1.45fr 1fr; }
.map-shell { position: relative; min-height: 580px; background: #dae0db; }
.map { position: absolute; inset: 0; overflow: hidden; background: #dfe5df; cursor: grab; touch-action: none; user-select: none; }
.map.is-dragging { cursor: grabbing; }
.tiles { position: absolute; inset: 0; }
.tiles img { position: absolute; width: 256px; height: 256px; max-width: none; user-select: none; pointer-events:none; -webkit-user-drag:none; filter: saturate(.45) contrast(.92) brightness(1.04); }
.route-layer { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.route-line, .route-shadow { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.route-shadow { stroke: rgba(255,255,255,.92); stroke-width: 3.4; }
.route-line { stroke: var(--red); stroke-width: 1.7; vector-effect: non-scaling-stroke; }
.multi-driver-route { stroke-width: 1.8; vector-effect: non-scaling-stroke; }
.workday-route{fill:none;opacity:.88}.workday-route.movement-walking{stroke-width:1.2;stroke-dasharray:4 4}.workday-route.movement-vehicle{stroke-width:1.2;stroke-dasharray:10 5;opacity:.72}.workday-route.movement-idle{stroke-width:1;stroke-dasharray:2 6;opacity:.5}
.multi-driver-pin { z-index: 5; width: 26px; height: 26px; border-width: 4px; }
.multi-driver-pin span { margin: 6px; }
.driver-pin { position: absolute; left: 50%; top: 50%; width: 30px; height: 30px; transform: translate(-50%, -50%); border: 5px solid white; background: var(--red); border-radius: 50%; box-shadow: 0 2px 10px rgba(0,0,0,.32); }
.driver-pin::after { content: ""; position: absolute; inset: -11px; border: 2px solid rgba(228,47,54,.25); border-radius: 50%; animation: pulse 2s infinite; }
.driver-pin span { display: block; width: 6px; height: 6px; margin: 7px; background: white; border-radius: 50%; }
@keyframes pulse { 50% { transform: scale(1.25); opacity: .3; } }
.live-pill { position: absolute; left: 18px; top: 18px; padding: 9px 12px; background: rgba(255,255,255,.94); border-radius: 999px; box-shadow: 0 2px 12px rgba(0,0,0,.11); font: 700 10px var(--font-geist-mono), monospace; letter-spacing: .8px; }
.live-pill i { display: inline-block; width: 7px; height: 7px; margin-right: 6px; background: var(--red); border-radius: 50%; }
.map-credit { position: absolute; right: 5px; bottom: 4px; background: rgba(255,255,255,.76); color: #59615d; font-size: 8px; padding: 2px 4px; }
.map-zoom-controls{position:absolute;right:14px;top:14px;z-index:8;display:grid;overflow:hidden;border:1px solid rgba(20,33,29,.16);border-radius:11px;background:rgba(255,255,255,.96);box-shadow:0 3px 14px rgba(0,0,0,.16)}
.map-zoom-controls button{width:40px;height:40px;padding:0;border:0;border-radius:0;background:transparent;color:var(--green);font:700 24px/1 Arial,sans-serif;cursor:pointer}
.map-zoom-controls button+button{border-top:1px solid #dedbd2}
.map-zoom-controls button:hover,.map-zoom-controls button:focus-visible{background:#f0eee7;outline:none}
.map-actions { position: absolute; right: 16px; top: 108px; display: grid; gap: 8px; }
.map-actions button { width: 39px; height: 39px; background: #fff; border: 0; border-radius: 10px; box-shadow: 0 2px 12px rgba(0,0,0,.14); font-size: 20px; color: var(--green); }

.controls { padding: 38px 34px; display: flex; flex-direction: column; }
.control-head { display: flex; align-items: flex-start; justify-content: space-between; padding-bottom: 28px; margin-bottom: 27px; border-bottom: 1px solid #e7e4dc; }
.control-head > div:first-child { display: grid; grid-template-columns: 12px 1fr; column-gap: 7px; }
.status-dot { width: 9px; height: 9px; margin-top: 5px; border: 2px solid #9aa19d; border-radius: 50%; }
.status-dot.active { background: var(--red); border-color: var(--red); box-shadow: 0 0 0 4px rgba(228,47,54,.12); }
.control-head strong { font-size: 15px; }
.control-head small { grid-column: 2; margin-top: 4px; color: var(--muted); font-size: 11px; }
.timer { font: 700 20px var(--font-geist-mono), monospace; letter-spacing: -1px; }
.controls > label { margin-bottom: 9px; font: 700 10px var(--font-geist-mono), monospace; letter-spacing: 1.4px; color: var(--muted); text-transform: uppercase; }
.select-wrap { position: relative; }
.select-wrap > span { position: absolute; left: 15px; top: 13px; font-weight: 900; color: var(--red); }
select { appearance: none; width: 100%; height: 48px; padding: 0 42px; color: var(--ink); background: #f8f7f3; border: 1px solid #dcd9d0; border-radius: 11px; font-weight: 700; outline: none; }
.select-wrap::after { content: "⌄"; position: absolute; right: 16px; top: 12px; color: var(--muted); }
.stats { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 7px; margin: 24px 0; }
.stats div { padding: 15px 10px; background: #f7f5ef; border-radius: 10px; }
.stats small { display: block; margin-bottom: 7px; color: #818984; font: 600 8px var(--font-geist-mono), monospace; letter-spacing: .7px; }
.stats strong { font-size: 14px; }
.primary { width: 100%; min-height: 54px; margin-top: auto; border: 0; border-radius: 11px; background: var(--green); color: white; font-weight: 800; box-shadow: 0 10px 22px rgba(23,62,53,.2); }
.primary:hover { background: #205145; }
.primary span { margin-right: 8px; font-size: 12px; }
.primary.stop { background: var(--red); }
.privacy { margin: 12px 0 0; text-align: center; color: var(--muted); font-size: 10px; }

.history { max-width: 1124px; margin: 0 auto; padding: 0 0 100px; }
.section-title { display: flex; align-items: end; justify-content: space-between; margin-bottom: 22px; }
.section-title h2 { margin: 7px 0 0; font-size: 30px; letter-spacing: -1.2px; }
.trip-count { padding: 7px 10px; border: 1px solid #d3d0c7; border-radius: 999px; color: var(--muted); font-size: 11px; }
.empty-state { display: flex; gap: 16px; align-items: center; padding: 27px; border: 1px dashed #c7c4bb; border-radius: 15px; color: var(--muted); }
.empty-state > span { display: grid; place-items: center; width: 43px; height: 43px; background: white; border-radius: 50%; color: var(--red); font-size: 20px; }
.empty-state strong { color: var(--ink); font-size: 14px; }
.empty-state p { margin: 4px 0 0; font-size: 12px; }
.trip-list { display: grid; gap: 10px; }
.trip-list article { display: grid; grid-template-columns: 42px 1fr auto; gap: 13px; align-items: center; padding: 15px 18px; background: white; border: 1px solid #dedbd2; border-radius: 13px; }
.trip-icon { display: grid; place-items: center; width: 36px; height: 36px; background: #e5efe9; color: var(--green); border-radius: 50%; font-weight: 900; }
.trip-main, .trip-meta { display: flex; flex-direction: column; gap: 4px; }
.trip-main strong, .trip-meta strong { font-size: 13px; }
.trip-main span, .trip-meta span { color: var(--muted); font-size: 10px; }
.trip-meta { text-align: right; }

@media (max-width: 760px) {
  .topbar { height: 70px; padding: 0 18px; }
  .hero { padding: 44px 20px 30px; }
  .hero h1 { font-size: 50px; letter-spacing: -3.5px; }
  .hero p { font-size: 14px; }
  .tracker-card { margin: 0 14px 58px; border-radius: 17px; grid-template-columns: 1fr; }
  .map-shell { min-height: 400px; }
  .controls { padding: 26px 22px 24px; min-height: 390px; }
  .history { padding: 0 18px 70px; }
  .section-title h2 { font-size: 24px; }
}

@media (max-width: 380px) {
  .hero h1 { font-size: 43px; }
  .stats { gap: 4px; }
  .stats div { padding: 13px 8px; }
}

.area-boundary {
  fill: rgba(228, 47, 54, .08);
  stroke: var(--red);
  stroke-width: 3;
  stroke-dasharray: 9 6;
  vector-effect: non-scaling-stroke;
}
.area-pill {
  position: absolute;
  left: 18px;
  bottom: 18px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  max-width: calc(100% - 36px);
  padding: 10px 13px;
  background: rgba(255,255,255,.94);
  border: 1px solid rgba(23,35,31,.08);
  border-radius: 11px;
  box-shadow: 0 2px 12px rgba(0,0,0,.11);
}
.area-pill strong { font-size: 12px; }
.area-pill span { color: var(--muted); font-size: 9px; }
.boundary-info {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-top: 13px;
  padding: 11px 12px;
  background: #f8f7f3;
  border: 1px solid #e4e0d7;
  border-radius: 10px;
}
.boundary-info > div { display: flex; flex-direction: column; gap: 2px; }
.boundary-info strong { font-size: 11px; }
.boundary-info small { color: var(--muted); font-size: 9px; line-height: 1.35; }
.boundary-dot { width: 9px; height: 9px; flex: 0 0 auto; border-radius: 50%; background: #a9afab; }
.boundary-dot.ready { background: var(--green); }
.boundary-dot.error { background: var(--red); }
.trip-list article { grid-template-columns: 42px 1fr auto auto; }
.trip-list article.selected { border-color: var(--red); box-shadow: 0 0 0 2px rgba(228,47,54,.08); }
.view-route {
  border: 1px solid #d6d2c8;
  border-radius: 9px;
  padding: 8px 10px;
  background: #fff;
  color: var(--green);
  font-size: 10px;
  font-weight: 800;
}
.view-route:disabled { cursor: default; color: #a2a7a4; background: #f5f3ed; }
@media (max-width: 620px) {
  .trip-list article { grid-template-columns: 42px 1fr auto; }
  .view-route { grid-column: 2 / -1; justify-self: start; }
}

/* Supabase auth + admin */
input { font: inherit; }
.auth-page { min-height: 100vh; display: grid; place-items: center; padding: 28px; }
.login-card { width: min(460px, 100%); padding: 38px; background: #fff; border: 1px solid #d8d5cc; border-radius: 22px; box-shadow: 0 26px 70px rgba(31,45,39,.12); }
.login-brand { margin-bottom: 42px; }
.login-card h1 { margin: 16px 0 8px; font-size: 42px; letter-spacing: -2px; }
.login-card > p { margin: 0 0 26px; color: var(--muted); }
.login-card label, .admin-card label { display: block; margin: 14px 0 7px; color: var(--muted); font: 700 10px var(--font-geist-mono), monospace; letter-spacing: 1.1px; text-transform: uppercase; }
.login-card input, .admin-card input { width: 100%; min-height: 48px; padding: 0 13px; border: 1px solid #dcd9d0; border-radius: 11px; background: #f8f7f3; color: var(--ink); outline: none; }
.login-card .primary, .admin-card .primary { margin-top: 22px; }
.auth-message, .admin-message { margin-top: 14px; padding: 11px 12px; border-radius: 10px; background: #f7f5ef; color: var(--muted); font-size: 12px; }
.center-state { min-height: 100vh; display: grid; place-items: center; padding: 30px; text-align: center; }
.center-state > div { max-width: 500px; }
.center-state p { color: var(--muted); line-height: 1.6; }
.secondary, .logout-button { border: 1px solid #d3d0c7; border-radius: 10px; padding: 10px 14px; background: #fff; color: var(--green); font-weight: 800; }
.admin-hero { max-width: 1124px; margin: 0 auto; padding: 58px 28px 34px; }
.admin-hero h1 { margin: 16px 0 0; font-size: clamp(44px, 6vw, 72px); line-height: .98; letter-spacing: -4px; }
.admin-hero h1 em { color: var(--red); font-family: Georgia, serif; font-weight: 400; }
.admin-grid { max-width: 1124px; margin: 0 auto; padding: 0 28px 90px; display: grid; grid-template-columns: .9fr 1.1fr; gap: 18px; }
.admin-card { padding: 28px; background: #fff; border: 1px solid #d8d5cc; border-radius: 18px; }
.admin-card h2 { margin: 0 0 8px; font-size: 24px; }
.admin-card > p { color: var(--muted); font-size: 13px; line-height: 1.55; }
.assignment-list { display: grid; gap: 9px; margin-top: 18px; }
.assignment-list article { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px; background: #f8f7f3; border-radius: 11px; }
.assignment-list article div { display: flex; flex-direction: column; gap: 4px; }
.assignment-list article strong { font-size: 13px; }
.assignment-list article span { color: var(--muted); font-size: 11px; }
.viz-status { padding: 6px 8px; border-radius: 999px; background: #e5efe9; color: var(--green) !important; font: 800 9px var(--font-geist-mono), monospace; letter-spacing: .7px; }
.muted { color: var(--muted); }
@media (max-width: 760px) { .admin-grid { grid-template-columns: 1fr; padding: 0 16px 60px; } .admin-hero { padding: 42px 18px 28px; } .logout-button { font-size: 11px; } .login-card { padding: 26px 22px; } }

.notranslate { unicode-bidi: isolate; }

/* Admin live tracking */
.admin-live-section { max-width: 1124px; margin: 0 auto; padding: 0 28px 100px; }
.admin-live-grid { display: grid; grid-template-columns: 1.55fr .75fr; min-height: 580px; overflow: hidden; background: #fff; border: 1px solid #d8d5cc; border-radius: 18px; }
.admin-live-map { position: relative; min-height: 580px; background: #dfe5df; }
.admin-live-map .map { position: absolute; inset: 0; }
.admin-route-panel { padding: 24px; display: flex; flex-direction: column; gap: 12px; }
.admin-route-panel > label { color: var(--muted); font: 700 10px var(--font-geist-mono), monospace; letter-spacing: 1.1px; text-transform: uppercase; }
.live-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin: 8px 0 4px; }
.live-summary div { padding: 13px 10px; border-radius: 10px; background: #f7f5ef; }
.live-summary small { display: block; margin-bottom: 6px; color: var(--muted); font-size: 8px; }
.live-summary strong { font-size: 18px; }
.route-monitor-list { display: grid; gap: 8px; margin-top: 4px; }
.route-monitor-list button { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px; text-align: left; border: 1px solid #dedbd2; border-radius: 11px; background: #fff; color: var(--ink); }
.route-monitor-list button.selected { border-color: var(--red); box-shadow: 0 0 0 2px rgba(228,47,54,.08); }
.route-monitor-list button > span { display: flex; min-width: 0; flex-direction: column; gap: 4px; }
.route-monitor-list strong { font-size: 12px; }
.route-monitor-list small { color: var(--muted); font-size: 9px; }
.route-monitor-list b { flex: 0 0 auto; padding: 6px 7px; border-radius: 999px; font: 800 8px var(--font-geist-mono), monospace; letter-spacing: .6px; }
.workforce-list{display:grid;gap:9px;margin-top:14px}.workforce-list article{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px;border:1px solid #dedbd2;border-radius:11px;background:#fff}.workforce-list article>div{display:flex;align-items:center;gap:9px;min-width:0}.workforce-list i{width:12px;height:12px;border-radius:50%;flex:0 0 auto}.workforce-list span{display:flex;min-width:0;flex-direction:column;gap:3px}.workforce-list strong{font-size:12px}.workforce-list small{font-size:9px;color:var(--muted)}.workforce-list b{font-size:10px;white-space:nowrap}.workforce-grid .multi-driver-route{opacity:.84}
.workforce-empty{padding:14px;border:1px dashed #d8d4ca;border-radius:11px;background:#faf9f5;color:var(--muted);font-size:12px;line-height:1.45}.workforce-empty.error{display:flex;flex-direction:column;gap:5px;border-color:#e6b7b7;background:#fff3f3;color:#813232}.workforce-empty.error strong{font-size:12px}.workforce-empty.error small{overflow-wrap:anywhere;color:#9b5555}
.work-report-map{position:relative;min-height:560px;margin-top:14px;overflow:hidden;border:1px solid #ddd7cc;border-radius:16px;background:#dfe5df}.work-report-map .map{position:absolute;inset:0}.work-report-totals span{display:block;margin-top:4px;color:var(--muted);font-size:10px}.work-report-list{display:grid;gap:9px;margin-top:14px}.work-report-list article{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px;border:1px solid #dedbd2;border-radius:12px;background:#fff}.work-report-list article>div{display:flex;align-items:center;gap:9px}.work-report-list i{width:12px;height:12px;border-radius:50%;flex:0 0 auto}.work-report-list span{display:flex;flex-direction:column;gap:3px}.work-report-list small{color:var(--muted);font-size:9px}.work-report-list b{font-size:11px}@media(max-width:760px){.work-report-map{min-height:430px}.work-report-list article{align-items:flex-start;flex-direction:column}}
.route-live { background: rgba(228,47,54,.11); color: var(--red); }
.route-done { background: #e5efe9; color: var(--green); }
@media (max-width: 820px) {
  .admin-live-section { padding: 0 16px 70px; }
  .admin-live-grid { grid-template-columns: 1fr; }
  .admin-live-map { min-height: 430px; }
}

/* v6 operations: flyer counts, reports, driver editing, history filters */
.flyer-progress { margin: 2px 0 22px; padding: 14px; border: 1px solid #e2ded4; border-radius: 12px; background: #faf9f5; }
.flyer-progress > div { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.flyer-progress span, .flyer-progress label { color: var(--muted); font-size: 11px; }
.flyer-progress input { width:100%; min-height:42px; margin:7px 0; padding:0 11px; border:1px solid #dcd9d0; border-radius:9px; background:#fff; }
.flyer-progress small { color: var(--green); font-weight:700; }
.admin-tools { max-width:1124px; margin:0 auto; padding:0 28px 28px; display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.driver-edit-list { display:grid; gap:9px; margin-top:16px; }
.driver-edit-row { display:grid; grid-template-columns:1fr auto; gap:8px; }
.driver-edit-row input { min-height:44px; padding:0 12px; border:1px solid #dcd9d0; border-radius:10px; background:#f8f7f3; }
.report-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:18px; }
.report-grid div { padding:14px 11px; border-radius:10px; background:#f7f5ef; }
.report-grid small { display:block; color:var(--muted); font-size:9px; margin-bottom:5px; }
.report-grid strong { font-size:18px; }
.history-filters { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.history-filters select { padding:0 12px; }
@media (max-width:760px){ .admin-tools{grid-template-columns:1fr;padding:0 16px 24px}.report-grid{grid-template-columns:repeat(2,1fr)}.history-filters{grid-template-columns:1fr} }

/* v6.2 bilingual language switch */
.language-switch {
  position: fixed;
  top: 14px;
  right: 14px;
  z-index: 10000;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 4px;
  border: 1px solid rgba(31, 41, 55, .18);
  border-radius: 999px;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 6px 22px rgba(15, 23, 42, .12);
  backdrop-filter: blur(8px);
}
.language-switch button {
  min-width: 38px;
  border: 0;
  border-radius: 999px;
  padding: 7px 9px;
  background: transparent;
  color: #5f625d;
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  cursor: pointer;
}
.language-switch button.active {
  background: #1f6f52;
  color: #fff;
}
.language-switch button:focus-visible {
  outline: 2px solid #1f6f52;
  outline-offset: 2px;
}
@media (max-width: 640px) {
  .language-switch { top: 10px; right: 10px; }
  .topbar { padding-right: 96px; }
}

/* v6.3 admin navigation + management */
.admin-app-shell { min-height:100vh; background:#f4f1e9; }
.admin-sidebar { position:fixed; inset:0 auto 0 0; width:230px; padding:22px 14px; background:#173f33; color:#fff; display:flex; flex-direction:column; z-index:100; }
.sidebar-brand { display:flex; align-items:center; gap:10px; padding:4px 8px 24px; font-weight:900; }
.sidebar-brand > span:last-child { display:flex; flex-direction:column; }
.sidebar-brand small { margin-top:2px; opacity:.6; font-size:8px; letter-spacing:1.4px; }
.admin-sidebar nav { display:grid; gap:5px; }
.admin-sidebar nav button { width:100%; display:flex; align-items:center; gap:11px; padding:11px 12px; border:0; border-radius:10px; background:transparent; color:rgba(255,255,255,.72); text-align:left; cursor:pointer; }
.admin-sidebar nav button span { width:20px; text-align:center; font-size:15px; }
.admin-sidebar nav button b { font-size:12px; }
.admin-sidebar nav button.active { background:rgba(255,255,255,.12); color:#fff; }
.sidebar-user { margin-top:auto; padding:14px 10px 2px; border-top:1px solid rgba(255,255,255,.12); display:grid; gap:7px; }
.sidebar-user strong { font-size:11px; }
.sidebar-user button { width:max-content; padding:0; border:0; background:none; color:rgba(255,255,255,.62); font-size:10px; cursor:pointer; }
.admin-main { margin-left:230px; min-height:100vh; }
.admin-content { max-width:1220px; margin:0 auto; padding:48px 34px 90px; }
.admin-page-head { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:26px; }
.admin-page-head span { color:var(--red); font:800 9px var(--font-geist-mono),monospace; letter-spacing:1.2px; }
.admin-page-head h1 { margin:6px 0 0; font-size:clamp(34px,5vw,54px); letter-spacing:-2.5px; }
.compact-date { width:auto; min-height:42px; padding:0 10px; border:1px solid #d8d5cc; border-radius:10px; background:#fff; color:var(--ink); }
.dashboard-metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:18px; }
.metric-box { padding:20px; background:#fff; border:1px solid #d8d5cc; border-radius:15px; }
.metric-box small { display:block; color:var(--muted); font-size:9px; margin-bottom:8px; }
.metric-box strong { font-size:28px; }
.compact-grid { max-width:none; padding:0; margin:0; }
.full-card { margin-bottom:18px; }
.report-grid-wide { grid-template-columns:repeat(3,1fr); }
.form-actions { display:flex; align-items:center; gap:8px; margin-top:4px; }
.form-actions .secondary { margin-top:22px; }
.management-list article { align-items:center; }
.row-actions { flex-direction:row !important; gap:6px !important; }
.mini-button { border:1px solid #d7d3c9; border-radius:8px; padding:7px 9px; background:#fff; color:var(--green); font-size:10px; font-weight:800; cursor:pointer; }
.mini-button.danger { color:#b72c35; border-color:#e5c4c7; }
.driver-management-list { display:grid; gap:10px; margin-top:16px; }
.driver-management-row { padding:12px; border:1px solid #e0ddd4; border-radius:12px; background:#faf9f5; }
.driver-management-row.inactive { opacity:.62; }
.driver-management-row .driver-edit-row { margin-bottom:9px; }
.driver-status-actions { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.status-on,.status-off { padding:5px 7px; border-radius:999px; font:800 8px var(--font-geist-mono),monospace; letter-spacing:.5px; }
.status-on { background:#e5efe9; color:var(--green); }
.status-off { background:#eee9e7; color:#7a6f6c; }
.embedded-live { min-height:620px; }
.history-filters-wide { grid-template-columns:1fr 1fr 1fr; margin-bottom:16px; }
.history-table { display:grid; gap:8px; }
.history-table article { display:grid; grid-template-columns:1.2fr 1fr auto auto; align-items:center; gap:12px; padding:13px 14px; background:#f8f7f3; border-radius:11px; }
.history-table article > div { display:flex; flex-direction:column; gap:3px; }
.history-table article > div:nth-child(2) { flex-direction:row; gap:12px; color:var(--muted); font-size:10px; }
.history-table strong { font-size:12px; }
.history-table span { color:var(--muted); font-size:10px; }
.report-detail { margin-top:18px; }
.settings-card h2:not(:first-child) { margin-top:28px; }
.mobile-admin-nav { display:none; }
@media (max-width:900px) {
  .admin-sidebar { display:none; }
  .admin-main { margin-left:0; }
  .mobile-admin-nav { display:block; position:sticky; top:0; z-index:90; padding:10px 92px 10px 14px; background:rgba(244,241,233,.95); border-bottom:1px solid #d8d5cc; backdrop-filter:blur(8px); }
  .mobile-admin-nav select { width:100%; min-height:42px; padding:0 11px; border:1px solid #d8d5cc; border-radius:10px; background:#fff; }
  .admin-content { padding:26px 16px 70px; }
  .dashboard-metrics { grid-template-columns:repeat(2,1fr); }
  .admin-page-head { align-items:flex-start; flex-direction:column; }
  .history-filters-wide { grid-template-columns:1fr; }
  .history-table article { grid-template-columns:1fr auto; }
  .history-table article > div:nth-child(2) { grid-column:1 / -1; }
}
@media (max-width:560px) {
  .dashboard-metrics { grid-template-columns:1fr 1fr; gap:8px; }
  .metric-box { padding:14px; }
  .metric-box strong { font-size:22px; }
  .report-grid-wide { grid-template-columns:repeat(2,1fr); }
  .row-actions { width:100%; justify-content:flex-end; }
  .management-list article { align-items:flex-start; flex-direction:column; }
}

/* v6.4 reporting */
.finish-overlay{position:fixed;inset:0;background:rgba(20,25,28,.55);z-index:9999;display:grid;place-items:center;padding:20px}
.finish-dialog{width:min(520px,100%);background:#fff;border-radius:22px;padding:24px;box-shadow:0 24px 80px rgba(0,0,0,.25)}
.finish-dialog h2{margin:0 0 16px}.finish-dialog textarea{width:100%;box-sizing:border-box;border:1px solid #d7d2c8;border-radius:12px;padding:12px;font:inherit;resize:vertical}
.finish-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0 18px}
.finish-summary span{background:#f5f2ea;border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:4px}.finish-summary strong{font-size:20px}
.driver-color-control{display:flex!important;align-items:center;gap:6px;margin:0!important}.driver-color-control input{width:34px!important;height:30px!important;padding:2px!important;border-radius:8px!important}
.driver-color-control small{font-size:11px;color:#687077}
.report-builder{margin-bottom:18px}.report-filter-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:14px 0}
.report-filter-grid label{display:flex;flex-direction:column;gap:6px}.report-filter-grid select,.report-filter-grid input{width:100%;box-sizing:border-box}
.report-check{display:flex!important;flex-direction:row!important;align-items:center;gap:9px;margin:14px 0!important}.report-check input{width:auto!important}
.report-export-actions{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}
.report-evidence-map{background:#f7f5ef;border:1px solid #ddd7cc;border-radius:18px;overflow:hidden}
.report-evidence-map svg{display:block;width:100%;height:auto;max-height:520px}.report-map-bg{fill:#f7f5ef}.report-map-boundary{fill:rgba(255,255,255,.55);stroke:#222b30;stroke-width:3;stroke-dasharray:10 7}
.report-map-legend{display:flex;gap:14px;flex-wrap:wrap;padding:12px 16px;border-top:1px solid #ddd7cc;background:#fff}
.report-map-legend span{display:flex;align-items:center;gap:7px;font-size:13px}.report-map-legend i,.driver-color-dot{width:11px;height:11px;border-radius:50%;display:inline-block;margin-right:7px}
.report-map-empty,.report-empty{padding:24px}.history-table article small{display:block;margin-top:4px;color:#687077}
@media(max-width:760px){.report-filter-grid{grid-template-columns:1fr 1fr}.finish-summary{grid-template-columns:1fr}.finish-dialog{padding:18px}}
@media(max-width:460px){.report-filter-grid{grid-template-columns:1fr}}

/* v7.3 end-of-day workflow */
.driver-day-actions{display:grid;gap:10px;margin-top:auto}
.driver-day-actions .primary{margin-top:0}
.end-day-button{min-height:48px;width:100%;border:1px solid #173e35;color:#173e35;background:#fff;border-radius:11px;font-weight:800}
button:disabled{cursor:not-allowed;opacity:.5;box-shadow:none}
.finish-summary{grid-template-columns:repeat(3,minmax(0,1fr))}
.daily-reports-card{margin-top:18px}
.daily-report-list{display:grid;gap:10px;margin-top:14px}
.daily-report-row{display:grid;grid-template-columns:minmax(180px,1.5fr) minmax(150px,.8fr) auto auto;gap:14px;align-items:center;padding:16px 18px;border:1px solid #dedbd2;border-radius:13px;background:#fff}
.daily-report-row.pending{background:#faf9f5}
.daily-report-driver,.daily-report-numbers{display:flex;flex-direction:column;gap:4px}
.daily-report-driver span,.daily-report-driver small,.daily-report-numbers span{color:#6b746f;font-size:11px}
.daily-report-driver small{font-style:italic}
.daily-report-numbers b{color:#17231f;font-size:14px}
.status-pending{padding:6px 8px;border-radius:999px;background:#ece9e1;color:#777d79;font-size:9px;letter-spacing:.6px}
@media(max-width:760px){.daily-report-row{grid-template-columns:1fr auto}.daily-report-numbers{grid-column:1}.daily-report-row>.mini-button{grid-column:2}.finish-summary{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* v6.5 real report map */
.report-map-stage{position:relative;overflow:hidden;background:#e9ece8;aspect-ratio:900/520;cursor:grab;touch-action:none;user-select:none}
.report-map-stage.is-dragging{cursor:grabbing}
.report-map-tiles{position:absolute;inset:0;overflow:hidden}
.report-map-tiles img{position:absolute;width:256px;height:256px;max-width:none;user-select:none;pointer-events:none}
.report-map-stage svg{position:absolute;inset:0;width:100%;height:100%;z-index:2}
.report-map-stage .report-map-outside{fill:rgba(244,241,233,.42);pointer-events:none}
.report-map-stage .report-map-boundary{fill:rgba(255,255,255,.04);stroke:#26322d;stroke-width:2.5;stroke-dasharray:10 8;vector-effect:non-scaling-stroke}
.report-map-credit{position:absolute;right:8px;bottom:6px;z-index:3;background:rgba(255,255,255,.88);padding:3px 6px;font-size:10px;color:#4b5350;border-radius:4px}
.report-map-zoom-controls{z-index:5}

/* v7.4 street names in reports */
.report-street-label rect{fill:rgba(255,255,255,.96);stroke:rgba(20,33,29,.28);stroke-width:1}
.report-street-label text{fill:#14211d;font-size:13px;font-weight:800;paint-order:stroke;stroke:#fff;stroke-width:2px;stroke-linejoin:round}
.history-table article small.report-streets{color:#31453d;font-weight:700}