:root { color-scheme: light; font-family: Inter, system-ui, sans-serif; background:#f3f1e8; color:#15231f; }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; }
main { width:min(100%, 560px); margin:auto; padding:24px 16px 48px; }
header { padding:24px 8px; }
header span { color:#c46332; font-weight:800; letter-spacing:.2em; }
h1 { margin:.35rem 0; font-size:2.2rem; }
header p { margin:0; color:#52615d; }
.card { background:#fff; border:1px solid #dedbd0; border-radius:20px; padding:20px; box-shadow:0 12px 35px #173a3020; }
h2,h3 { margin-top:0; }
article { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 0; border-bottom:1px solid #ece9df; }
article div { display:grid; gap:4px; }
article span { color:#68746f; }
article .edit { width:auto; min-height:38px; padding:0 14px; background:#e7ece8; color:#163832; }
form { margin-top:24px; }
label { display:grid; gap:7px; margin:14px 0; font-weight:650; }
input,select,button { width:100%; min-height:48px; border-radius:12px; font:inherit; }
input,select { border:1px solid #c9cec8; padding:0 13px; background:#fff; }
button { border:0; background:#163832; color:#fff; font-weight:750; padding:0 18px; }
button:disabled { opacity:.6; }
.secondary { margin-top:12px; background:#e7ece8; color:#163832; }
.eyebrow { color:#c46332; font-size:.78rem; font-weight:800; letter-spacing:.14em; }
#continue { margin-top:18px; }
.global-back { position:sticky; top:8px; z-index:10; width:auto; min-height:42px; margin-bottom:8px; padding:0 14px; border:1px solid #c9d2cd; background:#fff; color:#163832; box-shadow:0 5px 18px #173a3020; }
#dashboard button + button { margin-top:10px; }
.install-entry { margin-top:24px; }
.expense-row { border:1px solid #d9e2df; border-radius:12px; padding:12px; margin:10px 0; }
.expense-row .remove-expense { margin-top:8px; }
.trip-result { display:grid; gap:8px; margin:18px 0; }
.trip-result p { display:flex; justify-content:space-between; gap:14px; margin:0; padding:12px 14px; border-radius:12px; background:#f3f1e8; }
.trip-result .net { padding:16px 14px; background:#163832; color:#fff; font-size:1.08rem; }
.trip-result .net.loss { background:#a63228; }
.trip-card-money { text-align:right; }
.trip-card-money span { display:block; }
.global-close { position:fixed; top:max(12px, env(safe-area-inset-top)); right:14px; z-index:20; width:44px; height:44px; padding:0; border-radius:50%; font-size:30px; line-height:1; }
.metrics { display:grid; gap:10px; }
.metrics p { display:flex; justify-content:space-between; gap:16px; margin:0; padding:14px; border-radius:12px; background:#f3f1e8; }
.metrics span { color:#586660; }
.metrics .net { background:#163832; color:#fff; }
.metrics .net span { color:#dbe6e1; }
.connection { margin:0 0 12px; padding:10px 14px; border-radius:12px; background:#fff1c9; color:#694f00; font-size:.9rem; }
#navigation-map { width:100%; height:360px; margin:16px 0; border-radius:14px; overflow:hidden; background:#e7ece8; }
.address-suggestions { display:grid; gap:6px; margin:6px 0 12px; padding:6px; border:1px solid #c9d2cd; border-radius:12px; background:#fff; box-shadow:0 8px 24px #173a3024; }
.address-suggestion { min-height:44px; padding:10px 12px; background:#f3f1e8; color:#163832; text-align:left; font-size:.92rem; line-height:1.25; }
#voice-destination { margin-top:8px; }
.truck-marker { display:grid; place-items:center; width:42px; height:42px; border:3px solid #fff; border-radius:50%; background:#c46332; box-shadow:0 4px 14px #0004; font-size:23px; }
.truck-arrow { display:block; color:#fff; font-size:24px; transform-origin:center; }
#navigation-guidance { display:grid; gap:5px; margin:10px 0; padding:14px; border-radius:14px; background:#163832; color:#fff; }
.maneuver-sign { grid-row:1 / span 2; display:grid; place-items:center; width:58px; height:58px; margin-right:8px; border-radius:14px; background:#fff; color:#163832; font-size:38px; font-weight:900; }
#next-instruction, #navigation-progress { grid-column:2; }
#navigation-progress { color:#dbe6e1; }
body.navigation-active { overflow:hidden; }
body.navigation-active #navigation-screen { position:fixed; inset:0; z-index:100; width:100%; max-width:none; height:100dvh; border:0; border-radius:0; padding:max(16px, env(safe-area-inset-top)) 14px max(14px, env(safe-area-inset-bottom)); display:grid; grid-template-rows:auto 1fr auto; }
body.navigation-active #navigation-screen h2, body.navigation-active #navigation-vehicle, body.navigation-active #navigation-form, body.navigation-active #navigation-status, body.navigation-active #navigation-screen small { display:none; }
body.navigation-active #navigation-guidance { display:grid; margin:0 54px 10px 0; }
body.navigation-active #navigation-map { height:100%; min-height:0; margin:0; }
body.navigation-active .navigation-stop { display:block; margin-top:10px; background:#a63228; }