:root{font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","Helvetica Neue",sans-serif;color-scheme:dark;background:#020b14}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;min-height:100%;background:#020b14;color:#f8fbff}
body{min-height:100svh;overflow:hidden}
button,select{font:inherit}
.app{min-height:100svh;display:flex;flex-direction:column;align-items:center;padding:max(12px,env(safe-area-inset-top)) 18px max(18px,env(safe-area-inset-bottom));background:radial-gradient(circle at 50% 34%,#092238 0,#041524 43%,#020b14 76%)}
.statusbar{height:44px;width:min(100%,520px);display:flex;align-items:center;justify-content:flex-end;color:#59d8f5;font-size:12px;font-weight:650;letter-spacing:.2px}
.status-controls{height:44px;display:flex;align-items:center;justify-content:flex-end;gap:7px}
.status-controls #gpsText{display:flex;align-items:center;height:44px;line-height:1}
.gps-dot{width:7px;height:7px;border-radius:50%;background:#59717e;flex:0 0 auto}.gps-dot.good{background:#39d477;box-shadow:0 0 8px #39d477}.gps-dot.mid{background:#f4d32b}.gps-dot.bad{background:#ff5a5f}
.settings-btn{margin:0 0 0 5px;width:44px;height:44px;border:0;background:transparent;color:#7894a3;font-size:20px;padding:0;display:grid;place-items:center;line-height:1;touch-action:manipulation;cursor:pointer;position:relative;z-index:5}
.gauge-section{width:min(94vw,520px);display:flex;flex-direction:column;align-items:center;margin-top:1vh}
#gauge{width:100%;height:auto;filter:drop-shadow(0 12px 28px #00101b)}
.tick{stroke:#8aa0ad;stroke-linecap:round;transition:stroke .25s ease,filter .25s ease}.tick.major{stroke:#dce7ed}.tick.reached{filter:drop-shadow(0 0 3px #54ddea99)}
.tick-label{fill:#9cafb9;font-size:13px;font-weight:500}.speed{fill:#fff;font-size:56px;font-weight:760;letter-spacing:-2px}.unit{fill:#8297a4;font-size:15px;font-weight:650}
#colorArc{stroke-width:14;stroke-linecap:round;opacity:1;transition:stroke-dasharray .3s ease}
.direction{margin-top:-24px;height:30px;display:flex;align-items:center;justify-content:center;gap:6px;color:#8fa6b3;font-size:12px;font-weight:750;letter-spacing:.8px}.direction.hidden{display:none}.direction-arrow{color:#48d6f2;font-size:10px;line-height:1}
.stats{width:min(92vw,480px);display:grid;grid-template-columns:repeat(3,1fr);gap:22px 18px;margin-top:25px}.stats article{text-align:center;min-width:0}.label{font-size:11px;color:#8499a6;font-weight:750;letter-spacing:1px;margin-bottom:5px}.ico{color:#38cbea}.gps-accuracy-icon{display:inline-block;transform:scaleX(1.08);transform-origin:center}.stats strong{font-size:28px;font-weight:670;letter-spacing:.2px;font-variant-numeric:tabular-nums}.stats small{font-size:13px;color:#8295a1;font-weight:600}
.permission{position:fixed;left:18px;right:18px;bottom:max(18px,env(safe-area-inset-bottom));max-width:430px;margin:auto;padding:16px;border:1px solid #23445b;border-radius:18px;background:#071927ef;backdrop-filter:blur(18px);display:grid;gap:8px;box-shadow:0 18px 45px #000;z-index:30}.permission b{font-size:16px}.permission span{font-size:13px;line-height:1.4;color:#9bb0bd}.permission button{border:0;border-radius:12px;padding:12px;background:#47d7f4;color:#00111a;font-weight:750;font-size:15px}.hidden{display:none}
.settings-sheet{position:fixed;inset:0;background:#0008;backdrop-filter:blur(6px);display:grid;place-items:end center;padding:18px;z-index:20}.settings-sheet.hidden{display:none}.settings-card{width:min(100%,430px);background:#081b29;border:1px solid #23445b;border-radius:20px;padding:18px;box-shadow:0 20px 60px #000}.settings-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;font-size:18px}.settings-head button{border:0;background:transparent;color:#9eb2bd;font-size:28px}.settings-card label{display:block;color:#91a6b2;font-size:12px;font-weight:750;letter-spacing:.7px;margin-bottom:7px}.settings-card select{width:100%;background:#0c2737;color:#fff;border:1px solid #28506a;border-radius:12px;padding:13px;font-size:16px}.settings-card p{color:#718894;font-size:12px;line-height:1.4;margin:10px 2px 0}.reset-session{width:100%;margin-top:18px;padding:12px;border:1px solid #28506a;border-radius:12px;background:#0a2231;color:#dbeaf1;font-weight:700}
.hud-overlay{position:fixed;inset:0;z-index:100;background:#000;display:flex;align-items:center;justify-content:center;padding:max(20px,env(safe-area-inset-top)) 20px max(20px,env(safe-area-inset-bottom))}.hud-overlay.hidden{display:none}.hud-mirror{transform:scaleX(-1);text-align:center;color:#fff;text-shadow:0 0 12px #fff5}.hud-speed{font-size:clamp(150px,43vw,300px);font-weight:760;line-height:.85;letter-spacing:-10px;font-variant-numeric:tabular-nums}.hud-unit{margin-top:22px;font-size:clamp(20px,6vw,36px);font-weight:650;letter-spacing:2px;color:#e8f4f8}
@media(max-height:700px){.gauge-section{width:min(69vh,430px);margin-top:-10px}.stats{margin-top:10px;gap:12px}.stats strong{font-size:22px}.direction{display:none}}
@media (orientation:portrait) and (min-height:800px){.app{padding-top:max(22px,calc(env(safe-area-inset-top) + 8px))}.statusbar{margin-bottom:10px}.gauge-section{margin-top:clamp(18px,3.4vh,38px)}.stats{margin-top:clamp(28px,3.2vh,38px)}}
@media (orientation:portrait) and (min-height:880px){.gauge-section{margin-top:clamp(30px,4.5vh,48px)}}
@media (orientation:landscape){.hud-overlay:not(.hidden){display:flex}.hud-speed{font-size:clamp(150px,38vh,310px);letter-spacing:-8px}.hud-unit{margin-top:18px;font-size:clamp(20px,5vh,34px)}}


/* v15: hidden GPS diagnostics inside settings */
.settings-divider{
  height:1px;
  background:#1d3a4d;
  margin:18px 0 10px;
}
.diagnostics-toggle{
  width:100%;
  min-height:44px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 2px;
  border:0;
  background:transparent;
  color:#dbeaf1;
  font-size:14px;
  font-weight:700;
  text-align:left;
}
#diagnosticsChevron{
  color:#718894;
  font-size:24px;
  line-height:1;
  transition:transform .2s ease;
}
.diagnostics-toggle[aria-expanded="true"] #diagnosticsChevron{
  transform:rotate(90deg);
}
.diagnostics-panel{
  margin-top:8px;
  padding:12px;
  border:1px solid #1e4054;
  border-radius:14px;
  background:#071b29;
}
.diagnostics-panel.hidden{display:none}
.diagnostics-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px 14px;
}
.diagnostics-grid div{
  min-width:0;
}
.diagnostics-grid span{
  display:block;
  margin-bottom:3px;
  color:#718894;
  font-size:10px;
  font-weight:750;
  letter-spacing:.55px;
  text-transform:uppercase;
}
.diagnostics-grid strong{
  display:block;
  color:#eaf7fb;
  font-size:14px;
  font-weight:700;
  font-variant-numeric:tabular-nums;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.diagnostics-note{
  margin:12px 0 0!important;
  color:#5e7784!important;
  font-size:10px!important;
}
