:root{font-family:system-ui,-apple-system,"Segoe UI","Yu Gothic UI",sans-serif;color:#182b37;background:#f3f6f9;font-size:16px;--blue:#075ed4;--line:#dce3ea}*{box-sizing:border-box}body{margin:0}header{height:88px;padding:16px 28px;background:white;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;gap:13px;align-items:center}.mark{background:var(--blue);color:white;font-size:36px;line-height:48px;width:48px;text-align:center;border-radius:14px}h1{font-size:21px;margin:0;letter-spacing:.03em}.sub,.small{font-size:14px;line-height:1.7;color:#566976}.badge{border:1px solid var(--line);border-radius:30px;padding:8px 12px;font-size:14px}.badge.ready{background:#e8f7ef;color:#226245;border-color:#c5e6d3}main{display:grid;grid-template-columns:370px 1fr;height:calc(100dvh - 88px)}aside{overflow:auto;background:white;padding:26px 26px 36px;border-right:1px solid var(--line)}section+section{border-top:1px solid var(--line);padding-top:22px;margin-top:24px}.eyebrow{font-size:12px;font-weight:750;color:var(--blue);letter-spacing:.13em}h2{font-size:19px;margin:7px 0 18px}label{display:block;font-size:14px;font-weight:600;margin-bottom:7px}input{width:100%;min-width:0;border:1px solid #bccbd6;border-radius:9px;padding:12px;font:inherit;background:#fff;color:inherit}input:focus,button:focus-visible,summary:focus-visible{outline:3px solid #84baff;outline-offset:2px}.row{display:flex;gap:8px}.row input{flex:1}.coordinate label{width:50%}button{font:inherit;cursor:pointer;border-radius:9px;padding:11px 14px;font-weight:650;transition:background .15s}button:disabled{cursor:default;opacity:.5}.secondary{background:white;color:#203e54;border:1px solid #bdcbd6}.secondary:hover:enabled{background:#edf4fa}.primary{background:var(--blue);color:white;border:0;width:100%;display:flex;justify-content:space-between;padding:16px;margin-top:19px}.primary:hover:enabled{background:#064dad}.wide{width:100%;margin-top:10px}.presets{display:flex;gap:7px;margin-top:11px}.presets button{flex:1;background:#f4f7fa;border:1px solid var(--line);padding:8px 4px;font-size:14px}.presets button.selected{background:#e7f0ff;color:var(--blue);border-color:#94bcf7}.distancebox{display:flex;align-items:baseline;gap:10px}.distancebox input{font-size:38px;font-weight:750;padding:8px 14px;width:150px}.distancebox span{font-size:20px;color:#6b7c88}.startbox{display:flex;gap:10px;padding:12px;background:#f1f6fc;border-radius:10px}.startbox strong{display:block;font-size:14px;overflow-wrap:anywhere}.startbox .small{display:block;font-size:12px}.dot{flex:none;background:var(--blue);width:10px;height:10px;border-radius:50%;margin-top:6px}details{font-size:14px;margin-top:15px;line-height:1.7}summary{cursor:pointer;color:#526878}details .row{margin:10px 0}.status{font-size:14px;line-height:1.7;margin-top:14px;color:#526878}.status.error{color:#a2302c}.stats{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:12px}.stats strong{display:block;font-size:33px;font-variant-numeric:tabular-nums}.stats span{font-size:13px;color:#607382}.about{margin-top:25px;border-top:1px solid var(--line);padding-top:15px;font-size:13px}.about a{color:#245a94}.mapwrap{position:relative;min-height:450px}#map{height:100%;background:#e8eef3}.mapnote{position:absolute;z-index:500;left:20px;top:20px;background:white;padding:12px 17px;border-radius:10px;box-shadow:0 3px 15px #18314220;font-size:14px;max-width:calc(100% - 85px);pointer-events:none}.mapbutton{position:absolute;z-index:500;bottom:30px;left:20px;background:white;border:1px solid var(--line);box-shadow:0 3px 12px #18314220}.leaflet-control-zoom{margin-top:85px!important}.place{display:block;text-align:left;width:100%;background:#f3f7fc;border:1px solid var(--line);margin-top:6px;font-size:14px;font-weight:400}.filehelp{position:fixed;inset:0;background:#183040bb;z-index:9999;display:grid;place-items:center;padding:25px}.filehelp>div{max-width:500px;background:white;border-radius:14px;padding:26px;line-height:1.8}[hidden]{display:none!important}.startpin{width:24px;height:24px;border:5px solid white;border-radius:50%;background:#0864dc;box-shadow:0 1px 9px #1238}.waypin{width:24px;height:24px;border-radius:50%;background:#fff;border:2px solid #075ed4;color:#075ed4;text-align:center;font-size:12px;font-weight:700;line-height:20px}.leaflet-tooltip{font-family:inherit}@media(max-width:780px){header{height:auto;min-height:76px;padding:12px 16px}h1{font-size:17px}.sub{font-size:12px}.mark{width:38px;line-height:38px;font-size:29px}.badge{font-size:12px;padding:6px}main{height:auto;display:flex;flex-direction:column}.mapwrap{order:-1;height:46dvh;min-height:300px}aside{overflow:visible;padding:23px;border:0}.mapnote{top:12px;left:12px;font-size:12px}.stats{max-width:400px}}

.mapwrap{display:flex;flex-direction:column}.mapstage{position:relative;flex:1;min-height:260px}.tracking-panel{flex:none;background:#fff;border-top:1px solid var(--line);padding:12px 16px}.tracking-actions{display:flex;gap:8px;flex-wrap:wrap}.tracking-actions button{min-height:44px;font-size:14px}.tracking-actions button[aria-pressed="true"]{background:#e6f7f1;border-color:#087d65;color:#05634f}.tracking-panel p{font-size:13px;margin:6px 0 0;line-height:1.5}.tracking-hint{color:#607382;font-size:12px!important}.livepin{width:26px;height:26px;background:#087d65;border:4px solid white;border-radius:50%;box-shadow:0 0 0 2px #087d65,0 2px 8px #1238}.livepin:after{content:'';display:block;width:6px;height:6px;margin:6px;background:white;border-radius:50%}@media(max-width:780px){.mapwrap{height:66dvh;min-height:460px}.tracking-panel{padding:10px 12px}.tracking-actions{gap:6px}.tracking-actions button{flex:1;padding:10px 8px;font-size:13px}.tracking-hint{font-size:11px!important}}/* Riding mode fills the visible browser area, without fullscreen permissions. */
body.riding{overflow:hidden}
body.riding>header,body.riding main>aside{display:none}
body.riding main{display:block;height:100dvh}
body.riding .mapwrap{position:fixed;inset:0;z-index:2000;width:100%;height:100dvh;min-height:0;overscroll-behavior:none}
body.riding .mapstage{min-height:0}
body.riding .mapnote,body.riding .tracking-hint{display:none}
body.riding .mapbutton{top:calc(12px + env(safe-area-inset-top));bottom:auto;left:calc(12px + env(safe-area-inset-left));min-height:48px}
body.riding .leaflet-control-zoom{margin-top:calc(12px + env(safe-area-inset-top))!important;margin-right:calc(12px + env(safe-area-inset-right))!important}
body.riding .leaflet-control-zoom a{width:44px;height:44px;line-height:44px}
body.riding .tracking-panel{padding:10px max(12px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left))}
body.riding .tracking-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
body.riding .tracking-actions button{min-height:48px;font-size:14px;padding:10px 6px}
body.riding #trackFollow{grid-column:1;grid-row:1}
body.riding #trackToggle{grid-column:2;grid-row:1;border-color:#627582}
body.riding #trackStatus{font-size:12px}
body.riding #trackDetail{font-size:11px;color:#607382}