:root{
  --bg:#f3f5f8; --card:#fff; --ink:#152231; --muted:#5b6b7b; --line:#e2e7ee;
  --blue:#1d6ff2; --red:#e0262b; --green:#1f8a3b; --amber:#b86a00; --up:#c4531a; --dn:#1b6fa8;
  --chip-live:#e6f6ea; --chip-warn:#fff3dc; --chip-idle:#eaeef3;
  --r:14px; --gut:16px;
}
*{box-sizing:border-box}
html{color-scheme:light}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;-webkit-text-size-adjust:100%}
.wrap{max-width:1100px;margin:0 auto;padding:0 var(--gut)}
.mono{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
.muted{color:var(--muted)} .small{font-size:.8125rem}
h1{font-size:1.15rem;margin:0;line-height:1.2} h2{font-size:1rem;margin:0}
.sub{margin:2px 0 0;color:var(--muted);font-size:.85rem}

.top{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top-in{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:10px;padding-bottom:10px}
.chip{font-size:.78rem;font-weight:600;padding:6px 12px;border-radius:14px;max-width:54vw;line-height:1.25;text-align:center}
.chip-live{background:var(--chip-live);color:#13692b}
.chip-live::before{content:"";display:inline-block;width:8px;height:8px;margin-right:7px;border-radius:50%;background:#1f9d44;animation:pulse 1.6s infinite}
.chip-warn{background:var(--chip-warn);color:#8a5200}
.chip-idle{background:var(--chip-idle);color:#3c4b5b}
@keyframes pulse{50%{opacity:.25}}

main{padding-top:14px;padding-bottom:40px;display:flex;flex-direction:column;gap:14px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;box-shadow:0 1px 2px rgba(20,34,50,.04)}
.card-h{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.lbl{font-size:.74rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:600}

.hero{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px}
.big{font-size:clamp(1.55rem,7.2vw,3rem);white-space:nowrap;font-weight:700;line-height:1.1;margin-top:2px}
.hero .progress{grid-column:1/-1;margin-top:8px}
.hero .prog-txt{grid-column:1/-1;display:flex;justify-content:space-between}
.progress{position:relative;height:10px;border-radius:99px;background:#e6ebf2;overflow:hidden}
.progress #progDone{position:absolute;left:0;top:0;bottom:0;background:var(--red);width:0;transition:width .6s}
.progress #progPred{position:absolute;top:0;bottom:0;background:repeating-linear-gradient(45deg,#f1a3a5 0 4px,#fff0 4px 8px);width:0;transition:all .6s}
.ahead{color:var(--green)} .behind{color:var(--red)}

.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.stat{display:flex;flex-direction:column;gap:3px;min-width:0}
.stat .val{font-size:1.65rem;font-weight:700;line-height:1.15}
.stat .val-s{font-size:1.05rem;font-weight:700;line-height:1.25}
.nxt-km{font-size:1.25rem;font-weight:700}
.two{display:flex;flex-wrap:wrap;gap:2px 12px;font-size:.88rem}
.two span{white-space:nowrap}
.up{color:var(--up)} .dn{color:var(--dn)}
.wide{grid-column:1/-1}
.place{font-size:1.05rem;font-weight:700}
.place-sub{font-size:.9rem}
.bio{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:.95rem}
.bio b{font-weight:700}

.map-card{padding:14px 0 10px}
.map-card .card-h,.map-card .view-opts{padding:0 16px}
.legend{display:flex;align-items:center;gap:6px;flex-wrap:wrap;color:var(--muted)}
.sw{display:inline-block;width:18px;height:4px;border-radius:2px;margin-left:6px}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;background:#ff6a00;border:2px solid #fff;box-shadow:0 0 0 1px #ff6a00;margin-left:6px}
.view{position:relative;height:min(68vh,560px);min-height:340px;background:#fff}
#gl{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;outline:none}
.view-msg{position:absolute;inset:0;display:grid;place-items:center;color:var(--muted);font-size:.9rem;pointer-events:none;text-align:center;padding:20px}
.tools{position:absolute;left:10px;bottom:10px;display:flex;gap:6px;flex-wrap:wrap}
.btn{font:inherit;font-size:.8rem;font-weight:600;padding:7px 11px;border-radius:9px;border:1px solid #c9d3df;background:rgba(255,255,255,.94);color:var(--ink);cursor:pointer}
.btn:hover{background:#fff;border-color:#9fb0c3} .btn:active{transform:translateY(1px)} .btn.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.view-opts{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;padding-top:10px;color:var(--muted)}
.view-opts label{display:inline-flex;align-items:center;gap:6px}
.view-opts input[type=range]{width:110px}

.prof{position:relative;height:210px}
#prof{width:100%;height:100%;display:block;touch-action:pan-y}
.prof-tip{position:absolute;pointer-events:none;background:rgba(21,34,49,.92);color:#fff;padding:5px 8px;border-radius:7px;white-space:nowrap;transform:translate(-50%,-110%)}

.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tbl{width:100%;border-collapse:collapse;font-size:.9rem}
.tbl th{font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);text-align:left;font-weight:600;padding:6px 8px;border-bottom:1px solid var(--line)}
.tbl td{padding:9px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
.tbl .r{text-align:right;font-variant-numeric:tabular-nums}
.tbl tr.passed td:first-child::before{content:"✓ ";color:var(--green);font-weight:700}
.tbl tr.next{background:#eef4ff}
.tbl .est{font-style:italic;color:var(--muted)}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.rk{background:#f6f8fb;border-radius:10px;padding:10px 12px}
.rk b{display:block;font-size:1.5rem}
.foot{padding:4px 2px 12px;line-height:1.5}

@media (min-width:760px){
  :root{--gut:24px}
  .grid{grid-template-columns:repeat(4,1fr)}
  .wide{grid-column:span 2}
  .hero{grid-template-columns:1fr 1fr 2fr;align-items:end}
  .hero .progress{grid-column:3;margin:0 0 20px;align-self:end}
  .hero .prog-txt{grid-column:3}
  .view{height:min(72vh,640px)}
}
.view-msg[hidden]{display:none}

body{padding-bottom:84px}
.rewind{position:fixed;left:0;right:0;bottom:0;z-index:30;background:rgba(255,255,255,.97);backdrop-filter:blur(8px);border-top:1px solid var(--line);box-shadow:0 -4px 16px rgba(20,34,50,.08);padding-bottom:env(safe-area-inset-bottom)}
.rewind[hidden]{display:none}
.rw-in{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;align-items:center;padding-top:9px;padding-bottom:9px}
.rw-in input[type=range]{width:100%;margin:0;accent-color:var(--red);height:28px}
.rw-txt{grid-column:1/-1;color:var(--muted);text-align:center;margin-top:-4px}
#rwLive.on{background:var(--red);border-color:var(--red);color:#fff}
@media (min-width:760px){.rw-in{grid-template-columns:auto 1fr auto}.rw-txt{grid-column:auto;margin:0;min-width:260px;text-align:right}}