:root {font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; color:#152c37; background:#edf3f4; font-synthesis:none; -webkit-tap-highlight-color:transparent;}
* {box-sizing:border-box;}
html {scroll-behavior:smooth;}
body {margin:0; min-height:100vh;}
button,input {font:inherit;}
button {cursor:pointer; touch-action:manipulation;}
button:disabled {cursor:not-allowed;opacity:.52;}
button:focus-visible,input:focus-visible {outline:3px solid #50c5be;outline-offset:2px;}
.app-shell {max-width:760px;min-height:100vh;margin:0 auto;padding:22px 18px max(32px,env(safe-area-inset-bottom));}
.masthead {display:flex;align-items:center;justify-content:space-between;gap:12px;padding:6px 0 25px;}
.brand {display:flex;align-items:center;gap:11px;min-width:0;}
.brand-icon {display:grid;place-items:center;border-radius:16px;background:#102c39;color:#fff;font-size:26px;width:52px;height:52px;flex:none;}
.eyebrow,.section-kicker {color:#69808a;font-weight:800;font-size:10px;letter-spacing:.12em;margin:0 0 5px;}
h1 {font-size:22px;letter-spacing:-.045em;line-height:1.12;margin:0;color:#15303b;}h1 span {font-weight:500;color:#56717c;}
.test-pill {font-size:10px;font-weight:800;color:#477167;white-space:nowrap;background:#d4e9e2;padding:8px 10px;border-radius:99px;letter-spacing:.04em;}
.gps-panel {background:#102b39;color:white;border-radius:20px;padding:20px;box-shadow:0 10px 25px rgba(10,30,40,.13);}
.gps-heading {display:flex;justify-content:space-between;align-items:flex-start;gap:8px;}
.gps-panel .section-kicker {color:#9bb4bc;}
.status-title {display:flex;align-items:center;gap:9px;font-size:19px;letter-spacing:-.03em;}
.status-dot {width:10px;height:10px;display:block;border-radius:50%;background:#90a5ac;box-shadow:0 0 0 4px rgba(255,255,255,.09);flex:none;}
.status-dot.is-active {background:#57d7a8;box-shadow:0 0 0 4px rgba(87,215,168,.15);}
.status-dot.is-error {background:#ffb078;}
.status-sub {font-size:12px;color:#bfd1d5;margin:9px 0 0;line-height:1.5;}
.gps-icon {font-size:54px;color:#84adb8;line-height:.75;opacity:.75;}
.gps-buttons {display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:20px;}
.button {border:none;border-radius:12px;padding:13px 14px;min-height:46px;font-size:14px;font-weight:800;transition:background .15s ease,transform .15s ease;}
.button:active {transform:scale(.985);}
.button-primary {background:#4fe0b2;color:#0b3031;}
.button-primary:hover {background:#6febc3;}
.button-outline {border:1px solid #57707a;background:transparent;color:#edf8fa;}
.button-outline:hover {background:#1e3c49;}
.button-outline.is-on {border-color:#56dbaa;color:#7bf0c8;}
.button-dark {color:#fff;background:#113441;}
.button-light {color:#163541;background:#e9f0f2;}
.button-danger {color:#a93d32;background:#ffefec;}
.status-metrics {display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;font-size:11px;color:#acc4cb;margin-top:14px;}
.tab-nav {display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:17px 0 20px;padding:5px;background:#dfe8eb;border-radius:15px;}
.tab {border:0;background:transparent;color:#647c87;border-radius:11px;padding:12px 5px;font-size:13px;font-weight:750;white-space:nowrap;}
.tab span {font-size:17px;vertical-align:-1px;margin-right:2px;}
.tab.active {background:white;box-shadow:0 2px 7px rgba(12,38,52,.08);color:#193945;}
.view-header {display:flex;justify-content:space-between;align-items:end;gap:15px;margin:1px 2px 15px;}
.view-header h2 {font-size:22px;letter-spacing:-.045em;margin:0 0 4px;}
.muted {color:#69808a;font-size:13px;line-height:1.5;margin:0;}
.pill {display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border-radius:30px;font-size:11px;font-weight:750;background:#e9f0f2;color:#58717b;white-space:nowrap;}
.pill.green {background:#d8f5e7;color:#247c5c;}
.pill.amber {background:#fff0ce;color:#93691f;}
.pill.blue {background:#dfebff;color:#2e6098;}
.metric-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:15px;}
.metric-card {padding:13px 13px 12px;border:1px solid #dde7e9;border-radius:14px;background:#fff;min-width:0;}
.metric-card strong {display:block;font-size:23px;letter-spacing:-.045em;color:#173642;margin-top:2px;}
.metric-card small {color:#6b818a;font-size:10px;font-weight:750;letter-spacing:.01em;}
.helper {display:flex;gap:9px;align-items:flex-start;background:#e1eef3;border:1px solid #ccdee4;color:#365965;padding:12px 14px;border-radius:13px;margin-bottom:15px;font-size:12px;line-height:1.5;}
.helper span {font-size:17px;}
.card-list {display:flex;flex-direction:column;gap:10px;}
.customer-card {background:white;padding:17px 17px 15px;border:1px solid #dce6e8;border-radius:17px;transition:padding .2s,border-color .2s,background .2s;}
.customer-card.is-near {background:#f6fffa;border:2px solid #6ed5a7;padding:20px 18px;box-shadow:0 3px 13px rgba(19,140,94,.08);}
.customer-card.is-mid {padding:18px;}
.customer-row {display:flex;justify-content:space-between;align-items:flex-start;gap:10px;}
.customer-name {font-weight:850;letter-spacing:-.045em;line-height:1.15;margin:0;overflow-wrap:anywhere;}
.customer-card.is-near .customer-name {font-size:25px;}
.customer-card.is-mid .customer-name {font-size:21px;}
.customer-card.is-far .customer-name {font-size:17px;}
.customer-distance {font-size:12px;color:#5e7b85;font-weight:800;white-space:nowrap;}
.customer-distance strong {display:block;text-align:right;color:#193b46;font-size:22px;letter-spacing:-.04em;}
.customer-card.is-near .customer-distance strong {color:#198662;font-size:26px;}
.customer-sub {margin:7px 0 0;font-size:12px;color:#667f88;}
.card-actions {margin-top:13px;display:flex;align-items:center;justify-content:space-between;gap:10px;}
.card-actions .button {min-height:43px;padding:10px 15px;}
.active-session {background:#fefefe;border:2px solid #69c6b3;border-radius:18px;padding:18px;margin-bottom:16px;}
.active-session h3 {font-size:19px;margin:5px 0 10px;letter-spacing:-.035em;}
.timer {font-size:37px;font-weight:850;font-variant-numeric:tabular-nums;letter-spacing:-.065em;color:#103a43;margin:5px 0;}
.timer-line {display:flex;align-items:center;justify-content:space-between;gap:12px;}
.session-buttons {display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:13px;}
.section-card {background:#fff;border:1px solid #dce6e8;border-radius:17px;padding:18px;margin-bottom:13px;}
.section-card h3 {font-size:16px;margin:0 0 6px;letter-spacing:-.03em;}
.settings-top {display:flex;justify-content:space-between;align-items:center;gap:12px;}
.radius-value {font-weight:850;font-size:21px;color:#146a61;white-space:nowrap;}
.range {width:100%;accent-color:#159f89;margin:14px 0 4px;}
.range-labels {display:flex;justify-content:space-between;color:#78919b;font-size:11px;}
.input-label {font-size:11px;color:#5f7883;font-weight:750;display:block;margin:12px 0 5px;}
.text-input {width:100%;border:1px solid #cad8dd;background:white;color:#1b3c49;border-radius:10px;min-height:44px;padding:10px 12px;font-size:14px;}
.coord-fields {display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.btn-row {display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:12px;}
.point-status {color:#6a828b;font-size:12px;margin-top:7px;overflow-wrap:anywhere;}
.point-status.is-set {color:#247c64;}
.point-label-row {display:flex;justify-content:space-between;align-items:center;gap:12px;}
.point-label-row h3 {margin:0;font-size:16px;}
.small-link {background:none;border:0;color:#ad5149;font-size:12px;font-weight:750;padding:8px 3px;}
.empty {padding:26px 18px;text-align:center;background:#fff;border-radius:17px;border:1px dashed #cadcdd;color:#6b858b;}
.empty .big {font-size:35px;margin-bottom:6px;}
.empty strong {color:#294955;display:block;margin-bottom:6px;}
.empty .button {margin-top:15px;}
.log-row {display:flex;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid #e9eff0;}
.log-row:last-child {border-bottom:0;}
.log-row strong {font-size:14px;}
.log-row .muted {font-size:12px;margin-top:3px;}
.log-duration {font-weight:850;font-variant-numeric:tabular-nums;color:#246b5c;white-space:nowrap;}
.note {font-size:12px;line-height:1.55;color:#6c848c;margin:13px 2px;}
.footer {border-top:1px solid #dce6e9;color:#789097;margin-top:28px;padding:20px 2px;font-size:11px;line-height:1.6;}
.toast {position:fixed;bottom:calc(17px + env(safe-area-inset-bottom));left:50%;transform:translate(-50%,150%);max-width:min(490px,calc(100vw - 32px));width:max-content;background:#153542;color:white;border-radius:12px;box-shadow:0 8px 28px #12364455;padding:13px 17px;font-size:13px;font-weight:650;z-index:100;opacity:0;transition:transform .25s ease,opacity .25s ease;pointer-events:none;}
.toast.show {opacity:1;transform:translate(-50%,0);}
@media(max-width:420px){.app-shell {padding:16px 12px max(24px,env(safe-area-inset-bottom));}.gps-panel {padding:17px;}.gps-buttons {grid-template-columns:1fr;}.test-pill {font-size:9px;padding:6px;}.brand-icon {width:44px;height:44px;}.eyebrow {font-size:9px;}h1 {font-size:19px;}.metric-card {padding:10px;}.metric-card strong {font-size:21px;}.metric-card small{font-size:9px;}.customer-card.is-near .customer-name{font-size:23px;}.btn-row {grid-template-columns:1fr;}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;}}