/* scenes/glidepaths.js: three jumps off one cliff, a profile and its clocks */
.gscene-glidepaths .gscene-stage { height: auto; min-height: 240px; background: #0e1a33; }
.gscene-glidepaths .gscene-stage:not(.glide-ready) { height: clamp(260px, 40vh, 380px); }
.glide-wrap { display: flex; flex-direction: column; }
.glide-svg { display: block; width: 100%; height: auto; }
.glide-grid { stroke: rgba(255, 255, 255, 0.12); stroke-width: 1; stroke-dasharray: 2 6; }
.glide-tick { font: 700 15px var(--display); fill: rgba(255, 255, 255, 0.8); }
.glide-label { font: 900 17px var(--display); fill: #fff; letter-spacing: 0.06em; }
.glide-ghost { fill: none; stroke-width: 2; opacity: 0.18; stroke-dasharray: 4 6; }
.glide-trail { fill: none; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.35)); }
.glide-open { transition: opacity 0.3s; }
.glide-legend { list-style: none; margin: 0; padding: 14px 18px 4px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 18px; }
.glide-legend li { display: flex; flex-direction: column; gap: 2px; padding-left: 14px; border-left: 4px solid var(--c); }
.glide-legend b { font: 800 0.98rem/1.2 var(--display); color: #fff; }
.glide-read { font: 700 0.86rem/1.35 var(--display); color: var(--muted); font-variant-numeric: tabular-nums; }
.glide-legend li.is-done .glide-read { color: var(--c); }
.glide-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 8px 18px 16px; }
.glide-clock { font: 800 0.9rem var(--display); color: rgba(255, 255, 255, 0.75); font-variant-numeric: tabular-nums; }
@media (max-width: 720px) {
  .glide-legend { grid-template-columns: 1fr; }
  .glide-tick { font-size: 22px; }
  .glide-label { font-size: 24px; }
}