:root { --ink:#111; --muted:#666; --brand:#0f766e; --bg:#f7f7f5; --danger:#b91c1c; }
* { box-sizing:border-box }
body { margin:0; font:16px/1.45 system-ui,sans-serif; color:var(--ink); background:var(--bg) }
.topbar { display:flex; justify-content:space-between; align-items:center; padding:.6rem 1rem; background:#fff; border-bottom:1px solid #e5e5e5 }
.topbar nav { display:flex; gap:.8rem; align-items:center }
.brand { font-weight:700; color:var(--brand); text-decoration:none }
main { max-width:960px; margin:0 auto; padding:1rem }
body.driver main { max-width:480px }
h1 { font-size:1.4rem } h2 { font-size:1.1rem }
table { width:100%; border-collapse:collapse; background:#fff } th,td { text-align:left; padding:.4rem .5rem; border-bottom:1px solid #eee; font-size:.92rem }
.btn { display:inline-block; padding:.6rem 1rem; background:var(--brand); color:#fff; border:0; border-radius:6px; font-weight:600; cursor:pointer; text-decoration:none }
.btn.secondary { background:#e5e7eb; color:var(--ink) } .btn.danger { background:var(--danger) }
button.link { background:none; border:0; color:var(--brand); cursor:pointer; padding:0 }
.flash { padding:.6rem 1rem; border-radius:6px } .flash.notice { background:#dcfce7 } .flash.alert { background:#fee2e2 }
.card { background:#fff; border:1px solid #e5e5e5; border-radius:8px; padding:.8rem; margin:.6rem 0 } .card.next { border-color:var(--brand) }
.card .actions { display:flex; gap:.5rem; flex-wrap:wrap; margin-top:.5rem }
.card .actions form button { width:100% } .card .actions form { flex:1 }
.modal { position:fixed; inset:auto 0 0 0; background:#fff; border-top:3px solid var(--brand); padding:1rem; box-shadow:0 -4px 20px rgba(0,0,0,.2); z-index:10 }
.modal.expired { opacity:.4 }
.status { font-size:.75rem; padding:.1rem .5rem; border-radius:999px; background:#e5e7eb }
.status.available,.status.delivered,.status.closed,.status.active { background:#dcfce7 }
.status.on_job,.status.assigned,.status.accepted,.status.en_route_pickup,.status.picked_up,.status.en_route_dropoff { background:#dbeafe }
.status.failed,.status.cancelled,.status.disputed,.status.suspended { background:#fee2e2 }
.chip { display:inline-block; font-size:.8rem; padding:.1rem .5rem; background:#fff; border:1px solid #ddd; border-radius:999px; margin:.1rem 0 }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1rem }
.grid section { background:#fff; padding:.8rem; border-radius:8px; border:1px solid #e5e5e5 }
.timeline { list-style:none; padding:0 } .timeline li { padding:.3rem 0; border-left:2px solid var(--brand); padding-left:.8rem }
.timeline time { color:var(--muted); font-size:.8rem; margin-right:.4rem }
.muted { color:var(--muted) } .cash { color:var(--danger); font-weight:600 }
fieldset { border:1px solid #ddd; border-radius:8px; margin:.6rem 0; background:#fff }
input,select,textarea { font:inherit; padding:.45rem; border:1px solid #ccc; border-radius:6px; margin:.15rem 0; max-width:100% }
.alerts { list-style:none; padding:0 } .alerts .alert { background:#fee2e2; padding:.4rem .6rem; border-radius:6px; margin:.2rem 0 }
.hero { text-align:center; padding:3rem 1rem }