/* GPS wireframe: all behavior and recording controls remain the existing app's. */
body.ride-gpt-ui {
 --ride-live-left:24px;
 --ride-live-bottom:24px;
 --ride-live-width:402px;
 --ride-live-border:var(--soft-line, #dfe2de);
}
body.ride-gpt-ui .ride-live-card {
 position:fixed; z-index:12; left:var(--ride-live-left); bottom:var(--ride-live-bottom);
 width:min(var(--ride-live-width), calc(100vw - 48px)); padding:20px;
 background:var(--white, #fff); color:var(--ink, #252929);
 border:1px solid var(--ride-live-border); border-radius:5px;
 box-shadow:none; touch-action:auto;
}
body.ride-gpt-ui .ride-live-card[hidden],
body.ride-gpt-ui .ride-pitch-label[hidden],
body.ride-gpt-ui:not([data-ui-view="ride"]) :is(.ride-live-card,.ride-pitch-label) {display:none!important}
body.ride-gpt-ui .ride-live-metrics {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 26px}
body.ride-gpt-ui .ride-live-metrics > div {min-width:0}
body.ride-gpt-ui .ride-live-metrics span {display:block;font-size:26px;font-weight:500;letter-spacing:-1px;line-height:1.25;font-variant-numeric:tabular-nums}
body.ride-gpt-ui .ride-live-metrics small {display:block;margin-top:7px;font-size:11px;line-height:1.3;font-weight:400;color:var(--muted,#7d8584)}
body.ride-gpt-ui .ride-live-card .audio-option {display:block;margin:0 0 22px;padding:0;border:0;background:none;min-height:32px}
body.ride-gpt-ui .ride-live-card .audio-option label {display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:32px;padding:0;width:100%;font-size:12px;font-weight:400;color:var(--muted,#7d8584)}
body.ride-gpt-ui .ride-live-card .audio-option label > span {display:flex;align-items:center;gap:11px}
body.ride-gpt-ui .ride-live-card .audio-option svg {width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body.ride-gpt-ui .ride-live-card #voiceExpand {display:none!important}
body.ride-gpt-ui .ride-live-card #navVoice {appearance:none;-webkit-appearance:none;position:relative;flex:none;width:36px;height:22px;min-height:22px;padding:0;margin:0;border:1px solid var(--muted)!important;border-radius:20px!important;background:var(--soft-line)!important;cursor:pointer}
body.ride-gpt-ui .ride-live-card #navVoice::after {content:"";display:block;position:absolute;width:16px;height:16px;top:2px;left:2px;border-radius:50%;background:var(--white);transition:transform .15s}
body.ride-gpt-ui .ride-live-card #navVoice:checked {background:var(--ink)!important;border-color:var(--ink)!important}
body.ride-gpt-ui .ride-live-card #navVoice:checked::after {transform:translateX(14px)}
body.ride-gpt-ui .ride-live-card #navVoice:disabled {opacity:.5;cursor:not-allowed}
body.ride-gpt-ui .ride-live-card .ride-control-row {display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0}
body.ride-gpt-ui .ride-live-card .ride-control-row[hidden] {display:none}
body.ride-gpt-ui .ride-live-card .ride-control-row button {height:42px;min-height:42px;padding:10px 8px;border:1px solid transparent!important;border-radius:4px!important;font-size:13px;font-weight:600;line-height:1.3;box-shadow:none}
body.ride-gpt-ui .ride-live-card #pauseBtn {background:var(--bg,#f0f1ed)!important;color:var(--ink)!important}
body.ride-gpt-ui .ride-live-card #finishBtn {background:var(--ink)!important;color:var(--white)!important}
body.ride-gpt-ui .ride-live-card #finishBtn .hold-action-progress {background:var(--white);opacity:.3}
body.ride-gpt-ui .ride-live-card .ride-message {margin:0 0 12px;padding:0;border:0;font-size:12px;line-height:1.45;color:var(--muted)}
body.ride-gpt-ui .ride-live-card .ride-message:empty {display:none}
body.ride-gpt-ui .ride-live-hold-help {position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
body.ride-gpt-ui #finishBtn:focus-visible,body.ride-gpt-ui #navVoice:focus-visible {outline:2px solid var(--ink);outline-offset:4px}
body.ride-gpt-ui[data-ride-live="true"][data-ui-view="ride"] :is(.ride-stat-main,.ride-small-stats,#rideHeading,#navigationPanel) {display:none!important}
body.ride-gpt-ui #navigationPanel {display:none!important}
body.ride-gpt-ui #navMapCard {
 position:fixed;z-index:11;top:24px;left:max(450px, calc(50vw - 240px));right:auto;
 width:500px;max-width:calc(100vw - 530px);min-height:112px;margin:0;padding:16px 20px;
 display:flex;flex-direction:row;align-items:center;gap:18px;
 background:var(--white)!important;color:var(--ink)!important;
 border:1px solid var(--ride-live-border)!important;border-radius:5px;box-shadow:none;pointer-events:none;
}
body.ride-gpt-ui #navMapCard.hidden,body.ride-gpt-ui:not([data-ui-view="ride"]) #navMapCard {display:none!important}
body.ride-gpt-ui #navMapCard > div {display:flex;flex-direction:column;min-width:0;gap:10px}
body.ride-gpt-ui #navMapCard #navMapTurn {font-size:14px;line-height:1.4;font-weight:400;margin:0;color:var(--ink)!important;overflow-wrap:anywhere}
body.ride-gpt-ui #navMapCard #navMapDistance {display:block;font-size:30px;line-height:1.15;font-weight:600;letter-spacing:-.5px;color:var(--ink)!important;margin:0}
body.ride-gpt-ui #navMapCard #navMapDistance:empty {display:none}
body.ride-gpt-ui #navMapCard:not(.ride-guidance-with-distance) #navMapTurn {font-size:22px;font-weight:500}
body.ride-gpt-ui #navMapCard .outdoor-turn-icon {display:block;width:40px;height:46px;flex:none;background:none!important;color:var(--ink)!important;border:0;border-radius:0}
body.ride-gpt-ui #navMapCard .outdoor-turn-icon svg {display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:square;stroke-linejoin:miter}
body.ride-gpt-ui .ride-pitch-label {position:fixed;right:24px;bottom:62px;z-index:10;display:grid;place-items:center;width:38px;height:28px;padding:0;background:var(--white);color:var(--muted);border:1px solid var(--ride-live-border);border-radius:5px;font-size:10px;line-height:1;font-variant-numeric:tabular-nums;pointer-events:none}
@media (min-width:701px) and (max-width:1100px) {
 body.ride-gpt-ui #navMapCard {left:450px;width:calc(100vw - 530px);min-width:0;padding:14px;gap:12px}
 body.ride-gpt-ui #navMapCard #navMapDistance {font-size:26px}
}
@media (max-width:700px) {
 body.ride-gpt-ui .ride-live-card {left:12px;right:12px;bottom:calc(var(--ride-ui-nav-bottom, 12px) + var(--ride-ui-nav-height, 52px) + 12px);width:auto;padding:16px;max-height:calc(100dvh - 220px);overflow-y:auto}
 body.ride-gpt-ui .ride-live-metrics {gap:12px;margin-bottom:24px}
 body.ride-gpt-ui .ride-live-metrics span {font-size:21px;letter-spacing:-.7px}
 body.ride-gpt-ui .ride-live-metrics small {font-size:10px;margin-top:6px}
 body.ride-gpt-ui .ride-live-card .audio-option {margin-bottom:18px}
 body.ride-gpt-ui .ride-live-card .ride-control-row {gap:12px}
 body.ride-gpt-ui .ride-live-card .ride-control-row button {height:44px;min-height:44px;font-size:12px}
 body.ride-gpt-ui #navMapCard {top:calc(12px + env(safe-area-inset-top));left:12px;right:12px;width:auto;max-width:none;min-width:0;min-height:90px;padding:14px 18px;gap:16px}
 body.ride-gpt-ui #navMapCard > div {gap:8px}
 body.ride-gpt-ui #navMapCard #navMapDistance {font-size:25px}
 body.ride-gpt-ui #navMapCard #navMapTurn {font-size:12px}
 body.ride-gpt-ui #navMapCard .outdoor-turn-icon {width:40px;height:40px}
 body.ride-gpt-ui .ride-pitch-label {right:12px;top:calc(284px + env(safe-area-inset-top));bottom:auto;width:34px}
}
@media (prefers-reduced-motion:reduce) {body.ride-gpt-ui .ride-live-card #navVoice::after {transition:none}}

body.ride-gpt-ui #navMapCard:is([data-guidance="off-route"],[data-guidance="arrived"]) #navMapDistance {order:2;font-size:14px;font-weight:400;letter-spacing:0}
body.ride-gpt-ui #navMapCard:is([data-guidance="off-route"],[data-guidance="arrived"]) #navMapTurn {order:1;font-size:22px;font-weight:500}

/* Only the live Ride view reserves the guidance lane. Planning/Settings keep
   the shared layout's normal search, Fit, and map-control positions. */
body.ride-gpt-ui[data-ride-live="true"][data-ui-view="ride"] .place-search {display:none!important}
body.ride-gpt-ui[data-ride-live="true"][data-ui-view="ride"] .map-controls {bottom:98px}
@media (max-width:700px) {
 body.ride-gpt-ui[data-ride-live="true"][data-ui-view="ride"] .map-controls {top:var(--ride-live-controls-top,calc(12px + env(safe-area-inset-top)));right:12px;bottom:auto}
 body.ride-gpt-ui[data-ride-live="true"][data-ui-view="ride"] .map-overlay-top {top:var(--ride-live-controls-top,calc(12px + env(safe-area-inset-top)));left:12px;right:auto}
 body.ride-gpt-ui[data-ride-live="true"][data-ui-view="ride"][data-ride-live-controls="row"] .map-controls {flex-direction:row}
 body.ride-gpt-ui[data-ride-live="true"][data-ui-view="ride"][data-ride-live-controls="row"] .map-controls button+button {border-top:0!important;border-left:1px solid var(--soft-line)!important}
 body.ride-gpt-ui[data-ride-live="true"][data-ui-view="ride"][data-ride-live-controls="row"] .ride-live-card {max-height:max(80px,min(calc(100dvh - 220px),calc(100dvh - var(--ride-live-controls-top,12px) - var(--ride-ui-nav-bottom,12px) - var(--ride-ui-nav-height,52px) - 72px)))}
}