:root[data-theme=light] .g-curb-hop,:root[data-theme=dark] .g-curb-hop{--g-curb-hop-sky: #613977;--g-curb-hop-sunset: #e77781;--g-curb-hop-horizon: #ffbb78;--g-curb-hop-sun: #ffe4a3;--g-curb-hop-far: #643f77;--g-curb-hop-building: #253e61;--g-curb-hop-building-alt: #235260;--g-curb-hop-window: #ffc985;--g-curb-hop-road: #357581;--g-curb-hop-lane: #a1d8d4;--g-curb-hop-rider: #7bffe1;--g-curb-hop-bike: #ffb6d8;--g-curb-hop-hazard: #ffe4a3;--g-curb-hop-hazard-ink: #101c31;--g-curb-hop-void: #080f24;--g-curb-hop-close: #fff4cd;--g-curb-hop-muted: #ecf7f2;--g-curb-hop-accent: #17645c;width:100%;max-width:var(--mg-board-max);margin:0 auto}:root[data-theme=dark] .g-curb-hop{--g-curb-hop-sky: #382356;--g-curb-hop-sunset: #b54c80;--g-curb-hop-horizon: #ee966f;--g-curb-hop-far: #513463;--g-curb-hop-building: #203552;--g-curb-hop-building-alt: #1d4656;--g-curb-hop-accent: #7bffe1}.g-curb-hop-app{display:grid;grid-template-columns:minmax(0,1fr);padding-bottom:16px;color:var(--mg-text);font-family:var(--mg-font)}.g-curb-hop-status{padding-inline:8px;height:44px;margin-bottom:8px;display:flex;align-items:center;gap:8px;font-variant-numeric:tabular-nums;contain:layout}.g-curb-hop-dist{min-width:4.6em;font-size:1.15rem;font-weight:700;white-space:nowrap}.g-curb-hop-best{min-width:0;display:inline-flex;align-items:center;gap:4px;color:var(--mg-muted);font-size:.9rem;white-space:nowrap;overflow:hidden}.g-curb-hop-best svg{flex:none;color:var(--g-curb-hop-accent)}.g-curb-hop-best span{min-width:0;overflow:hidden;text-overflow:ellipsis}.g-curb-hop-dist{flex:none}.g-curb-hop-best[hidden]{display:none}.g-curb-hop-tools{margin-left:auto;display:flex;flex:none;gap:4px}@media(max-width:340px){.g-curb-hop-status{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:0 8px;height:auto;min-height:44px}.g-curb-hop-dist{grid-column:1;grid-row:1}.g-curb-hop-best{grid-column:1;grid-row:2}.g-curb-hop-tools{grid-column:2;grid-row:1 / span 2}}.g-curb-hop-tool{position:relative;width:44px;height:44px;display:grid;place-items:center;padding:0;border:1px solid var(--mg-line);border-radius:var(--mg-radius);background:var(--mg-surface);color:var(--mg-text);cursor:pointer;touch-action:manipulation}.g-curb-hop-tool:after{content:"";position:absolute;inset:-1px}.g-curb-hop-tool:hover{border-color:var(--mg-muted)}.g-curb-hop-tool[aria-pressed=true]{color:var(--g-curb-hop-accent);border-color:var(--g-curb-hop-accent)}.g-curb-hop-tool:focus-visible,.g-curb-hop-pad.is-kbd:focus{outline:3px solid var(--g-curb-hop-accent);outline-offset:2px}.g-curb-hop-pad:focus:not(.is-kbd){outline:none}.g-curb-hop-play{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}.g-curb-hop-play.is-running{touch-action:none}.g-curb-hop-stage{position:relative;width:100%;aspect-ratio:600 / 510;justify-self:center;overflow:hidden;border-radius:var(--mg-radius);background:var(--g-curb-hop-sky);box-shadow:inset 0 0 0 1px var(--mg-line)}.g-curb-hop-stage:after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--mg-text) 22%,var(--mg-bg));pointer-events:none}@media(max-height:559px){.g-curb-hop-stage{width:min(100%,calc((100svh - 140px) * 600 / 510))}}.g-curb-hop-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.g-curb-hop-card{position:absolute;left:50%;top:7%;transform:translate(-50%);min-width:56%;max-width:86%;display:grid;justify-items:center;gap:2px;padding:10px 16px 12px;border:1px solid var(--mg-line);border-radius:var(--mg-radius);background:color-mix(in srgb,var(--mg-surface) 92%,transparent);color:var(--mg-text);text-align:center;pointer-events:none;font-variant-numeric:tabular-nums}.g-curb-hop-card[hidden]{display:none}.g-curb-hop-card-big{font-size:1.9rem;font-weight:800;line-height:1.15}.g-curb-hop-card-line{font-size:.9rem;color:var(--mg-muted);line-height:1.35}.g-curb-hop-card-line.is-hot{color:var(--g-curb-hop-accent);font-weight:700}.g-curb-hop-card-line[hidden]{display:none}.g-curb-hop-card-hand{margin-top:6px;color:var(--g-curb-hop-accent)}@media(max-width:340px){.g-curb-hop-card{top:4%;padding:6px 12px 8px}.g-curb-hop-card-big{font-size:1.5rem}}.g-curb-hop-pad{position:relative;height:64px;width:100%;display:flex;align-items:center;justify-content:center;gap:14px;padding:0;border:1px solid var(--mg-line);border-radius:var(--mg-radius);background:var(--mg-surface);color:var(--mg-text);font:inherit;cursor:pointer;touch-action:inherit}@media(max-width:340px),(min-width:720px){.g-curb-hop-pad{height:56px}}.g-curb-hop-pad.is-down{background:var(--mg-highlight);border-color:var(--g-curb-hop-accent)}.g-curb-hop-ring{width:44px;height:44px;flex:none;transform:rotate(-90deg)}.g-curb-hop-ring-track{fill:none;stroke:var(--mg-line);stroke-width:4}.g-curb-hop-ring-fill{fill:none;stroke:var(--g-curb-hop-accent);stroke-width:4;stroke-linecap:round}.g-curb-hop-ring-mark{fill:none;stroke:var(--mg-text);stroke-width:6}.g-curb-hop-ring-ghost{fill:none;stroke:var(--g-curb-hop-accent);stroke-width:4;stroke-dasharray:4 4;opacity:.7}.g-curb-hop-ring-ghost.is-filling{stroke-linecap:round;opacity:.5}.g-curb-hop-ring-ghost[hidden]{display:none}.g-curb-hop-hand{color:var(--g-curb-hop-accent);display:block}.g-curb-hop-key{display:none;min-width:96px;padding:4px 12px;border:1px solid var(--mg-line);border-bottom-width:3px;border-radius:6px;font-size:.85rem;font-weight:600;color:var(--mg-muted)}@media(hover:hover)and (pointer:fine){.g-curb-hop-key{display:inline-block}.g-curb-hop-pad .g-curb-hop-hand{display:none}}.g-curb-hop-pulse{animation:g-curb-hop-pulse 1.6s ease-in-out infinite}@keyframes g-curb-hop-pulse{0%,to{transform:scale(1);opacity:.75}50%{transform:scale(1.12);opacity:1}}@media(prefers-reduced-motion:reduce){.g-curb-hop-pulse{animation:none}}.g-curb-hop-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
