.routes-workspace h1 { font-family: var(--display-font-cyrillic-safe); font-size: clamp(48px, 8vw, 88px); font-weight: 700; line-height: .95; margin: 0; }
.routes-workspace__actions { display: flex; flex-wrap: wrap; gap: 14px; margin: 24px 0 32px; }
.routes-workspace__saved { border-top: 4px solid #000; margin-top: 36px; padding-top: 24px; }
.route-file-panel { margin: 24px 0 40px; scroll-margin-top: 110px; }
.route-file-panel[hidden] { display: none; }
.route-file-panel h2, .routes-workspace__saved h2 { font-size: clamp(22px, 4vw, 32px); line-height: 1.1; }
.route-file-panel .gpx-editor__map { min-height: 420px; }
.route-file-panel .gpx-editor__panel { align-content: start; }
.route-file-panel .gpx-editor__panel > #gpx-stats { padding: 0 4px; }
.route-file-panel summary { cursor: pointer; font-weight: 900; }
.route-file-panel :is(button, summary, a):focus-visible { outline: 3px solid #FF4A00; outline-offset: 4px; }
.route-file-panel button { min-height: 44px; }
@media (max-width: 760px) {
  .routes-workspace__actions > * { flex: 1 1 220px; text-align: center; }
  .route-file-panel .gpx-editor__map { min-height: 320px; }
  .route-file-panel .gpx-editor__actions > * { flex: 1 1 180px; }
}

@media (max-width: 780px) {
  #segment-editor[data-entity="route"] { --editor-bar-height: 104px; }
  #segment-editor[data-entity="route"] .segment-editor__bar { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; grid-template-rows: 44px 42px; gap: 4px 8px; padding: 6px 12px; flex-shrink: 0; }
  #segment-editor[data-entity="route"] .segment-editor__back { grid-column: 1; grid-row: 1; }
  #segment-editor[data-entity="route"] .segment-editor__history { grid-column: 2; grid-row: 1; }
  #segment-editor[data-entity="route"] .segment-editor__bar-actions { grid-column: 3; grid-row: 1; }
  #segment-editor[data-entity="route"] .segment-editor__title { grid-column: 1 / -1; grid-row: 2; width: 100%; height: 40px; font-size: 18px; }
}