:root{--bg: #0b0f14;--bg-panel: #141c26;--fg: #f2f5f9;--fg-dim: #8fa1b5;--accent: #ffb020;--good: #2ecc71;--medium: #f1c40f;--bad: #e74c3c;--danger: #c0392b;--radius: 14px}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%}body{background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;-webkit-user-select:none;user-select:none;overscroll-behavior:none}#app{min-height:100dvh;display:flex;flex-direction:column;max-width:640px;margin:0 auto;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}button{font-family:inherit;border:none;border-radius:var(--radius);cursor:pointer;color:var(--fg);background:var(--bg-panel);touch-action:manipulation}button:active{transform:scale(.97)}input{font-family:inherit;width:100%;padding:1rem;font-size:1.15rem;border-radius:var(--radius);border:2px solid #2a3646;background:var(--bg-panel);color:var(--fg)}input:focus{outline:none;border-color:var(--accent)}.screen{flex:1;display:flex;flex-direction:column;padding:1rem;gap:1rem}.topbar{display:flex;justify-content:space-between;align-items:center;gap:.5rem}.topbar h1{font-size:1.15rem;letter-spacing:.05em;text-transform:uppercase;color:var(--fg-dim)}.navbtn{padding:.6rem 1rem;font-size:1rem;font-weight:700}.btn-huge{font-size:2rem;font-weight:900;padding:1.6rem;letter-spacing:.06em;width:100%}.btn-start{background:var(--good);color:#06280f}.btn-stop{background:var(--danger)}.btn-armed{background:var(--accent);color:#201400}.btn-secondary{padding:1rem;font-size:1.1rem;font-weight:700}.panel{background:var(--bg-panel);border-radius:var(--radius);padding:1rem}.odometer{text-align:center}.odometer .value{font-size:clamp(4rem,22vw,7rem);font-weight:900;font-variant-numeric:tabular-nums;line-height:1;color:var(--accent)}.odometer .unit{font-size:1.4rem;color:var(--fg-dim);font-weight:700}.bigrow{display:flex;gap:.75rem}.bigrow>*{flex:1}.stat{text-align:center;padding:.75rem .25rem}.stat .label{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--fg-dim)}.stat .value{font-size:1.9rem;font-weight:800;font-variant-numeric:tabular-nums}.gps-dot{display:inline-block;width:1.2rem;height:1.2rem;border-radius:50%;vertical-align:middle}.gps-good{background:var(--good)}.gps-medium{background:var(--medium)}.gps-bad{background:var(--bad)}.adjust-row{display:flex;gap:.6rem}.adjust-row button{flex:1;font-size:1.5rem;font-weight:800;padding:1.1rem 0}.field label{display:block;margin-bottom:.4rem;color:var(--fg-dim);font-weight:600}.msg{padding:1rem;border-radius:var(--radius);font-weight:600}.msg-ok{background:#123b22;color:#7ff0a8}.msg-err{background:#3b1512;color:#ff9d92}.msg-warn{background:#3b3012;color:#ffd97f}.track-item{display:flex;flex-direction:column;gap:.6rem}.track-item .meta{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.4rem;color:var(--fg-dim);font-size:.95rem}.track-item .actions{display:flex;gap:.5rem;flex-wrap:wrap}.track-item .actions button{padding:.7rem 1rem;font-weight:700;font-size:.95rem}.badge{padding:.2rem .6rem;border-radius:999px;font-size:.8rem;font-weight:800;text-transform:uppercase}.badge-recording{background:var(--accent);color:#201400}.badge-pending{background:var(--medium);color:#2b2405}.badge-uploaded{background:var(--good);color:#06280f}a{color:var(--accent);font-weight:700}
