/* SO-RadioViewer · Mobile 0–767px
 * Priorität: Hören > eigener Sender-Mix > Suche > Globus > Zusatzinfos.
 */

.site-header {
  padding: 7px 10px;
  min-height: 58px;
}
.signal-chip, .button-text { display: none; }
.header-actions { margin-left: auto; gap: 2px; }
.icon-button { width: 42px; min-width: 42px; padding: 0; }
#theme-toggle { display: none; }

.site-menu { position: static; }
.site-menu-panel {
  position: fixed;
  top: 64px;
  right: 10px;
  width: min(350px, calc(100vw - 20px));
  max-height: calc(100dvh - 78px - var(--safe-bottom));
  border-radius: 15px;
}
.site-menu-panel a { min-height: 50px; }
.site-menu-panel strong { font-size: 12px; }
.site-menu-panel small { font-size: 10px; }
.static-site-menu { margin-left: auto; }
.brand-wrap { gap: 7px; min-width: 0; }
.brand-copy { min-width: 0; }
.brand-copy small { display: none; }
.brand-copy strong {
  display: block;
  max-width: 145px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
}

.radio-app {
  padding: 10px 10px calc(102px + var(--safe-bottom));
}

/* Wenn Favoriten vorhanden sind, ist der Sender-Mix der echte Mobile-Einstieg. */
.mobile-mix-anchor[hidden] { display: none !important; }
.mobile-mix-anchor:not([hidden]) {
  display: block;
  margin: 2px 0 10px;
}
body.has-mobile-sender-mix .intro-bar { display: none; }
body.has-mobile-sender-mix .view-tabs { margin-top: 8px; }

.intro-bar {
  display: grid;
  gap: 4px;
  padding: 7px 3px 0;
}
.intro-status { display: none; }
.intro-bar .eyebrow { margin-bottom: 3px; }
.intro-bar h1 {
  margin: 0;
  font-size: clamp(21px, 7vw, 27px);
  line-height: 1.08;
}
.intro-copy {
  margin-top: 6px;
  font-size: 12px;
  line-height: 1.45;
}

.view-tabs {
  position: sticky;
  top: 60px;
  z-index: 70;
  width: calc(100% + 20px);
  max-width: none;
  margin: 13px -10px 10px;
  padding: 0 10px 2px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
  background: linear-gradient(180deg, color-mix(in srgb, var(--bg) 94%, transparent), color-mix(in srgb, var(--bg) 82%, transparent));
  backdrop-filter: blur(10px);
}
.view-tabs::-webkit-scrollbar { display: none; }
.view-tab {
  flex: 0 0 auto;
  min-height: 42px;
  padding: 0 11px;
  font-size: 11px;
  white-space: nowrap;
}

/* Hören zuerst, Globus danach. */
.hero-dashboard {
  display: grid;
  gap: 10px;
}
.now-panel { order: 1; }
.globe-panel { order: 2; }

.panel { border-radius: 17px; }
.globe-panel,
.now-panel,
.control-panel,
.schedule-panel,
.local-card,
.world-news-card,
.community-card,
.favorite-playlist-card { padding: 12px; }

.panel-heading { align-items: flex-start; gap: 8px; }
.panel-heading h2 { line-height: 1.12; }
.panel-actions { gap: 5px; }
.panel-actions .small-button {
  min-height: 40px;
  padding-inline: 8px;
  font-size: 10px;
}

/* Aktueller Sender kompakt, aber sofort bedienbar. */
.now-panel { display: grid; gap: 10px; }
.now-station { align-items: center; gap: 10px; }
.station-logo--large {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  flex: 0 0 52px;
}
.now-copy h3 { font-size: 17px; line-height: 1.15; }
.now-copy p, .station-region { font-size: 11px; }
.program-block { padding: 10px; }
.player-controls { align-items: center; gap: 10px; }
.volume-control { display: none; }
.play-button {
  width: 50px;
  height: 50px;
  flex: 0 0 50px;
}
.player-meta strong { font-size: 13px; }
.player-meta span { font-size: 11px; }
.now-actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 7px;
}
.now-actions .secondary-button {
  width: 100%;
  min-height: 42px;
  justify-content: center;
  padding-inline: 8px;
  text-align: center;
  font-size: 11px;
}
.now-actions #share-station { grid-column: 1 / -1; }
.source-note { display: none; }

/* Sender-Mix: bei vorhandenen Favoriten direkt ganz oben. */
body:not(.has-mobile-sender-mix) .favorite-playlist-card { display: none; }
.favorite-playlist-card.is-mobile-priority {
  display: block;
  position: relative;
  padding: 12px;
  border-color: color-mix(in srgb, var(--accent-warm) 46%, var(--line));
  background:
    radial-gradient(circle at 100% 0, rgba(255,204,107,.11), transparent 12rem),
    linear-gradient(145deg, color-mix(in srgb, var(--surface) 94%, #08131d), var(--surface));
  box-shadow: 0 14px 34px rgba(0, 0, 0, .22);
}
.favorite-playlist-card.is-mobile-priority::before {
  content: "DEIN START";
  display: inline-flex;
  margin-bottom: 7px;
  padding: 3px 7px;
  border: 1px solid color-mix(in srgb, var(--accent-warm) 35%, transparent);
  border-radius: 999px;
  color: var(--accent-warm);
  font: 800 9px var(--font-mono);
  letter-spacing: .08em;
}
.favorite-playlist-card.is-mobile-priority .panel-heading { align-items: center; }
.favorite-playlist-card.is-mobile-priority #playlist-heading { font-size: 19px; }
.favorite-playlist-card.is-mobile-priority .playlist-help { display: none; }
.favorite-playlist-card.is-mobile-priority .playlist-controls {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) 44px;
  gap: 7px;
  margin-top: 10px;
}
.favorite-playlist-card.is-mobile-priority .playlist-controls > * { min-width: 0; }
.favorite-playlist-card.is-mobile-priority #playlist-play { width: 100%; }
.favorite-playlist-card.is-mobile-priority #playlist-shuffle {
  grid-column: 1 / -1;
  width: 100%;
  min-height: 40px;
}
.favorite-playlist-card.is-mobile-priority .playlist-options {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 9px;
}
.favorite-playlist-card.is-mobile-priority .select-field { min-width: 0; }
.favorite-playlist-card.is-mobile-priority .select-field select {
  width: 100%;
  min-width: 0;
  padding-right: 25px;
  font-size: 11px;
}
.favorite-playlist-card.is-mobile-priority .playlist-timer-status {
  margin-top: 6px;
  min-height: 14px;
  font-size: 9px;
}
.favorite-playlist-card.is-mobile-priority .favorite-playlist-list {
  max-height: 172px;
  margin-top: 8px;
  gap: 4px;
}
.favorite-playlist-card.is-mobile-priority .favorite-playlist-item {
  min-height: 44px;
  padding: 4px 6px;
  border-radius: 10px;
}
.favorite-playlist-card.is-mobile-priority .playlist-station-button {
  min-height: 40px;
  padding-block: 2px;
}
.favorite-playlist-card.is-mobile-priority .playlist-footer-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 8px;
}
.favorite-playlist-card.is-mobile-priority .playlist-footer-actions .secondary-button {
  width: 100%;
  min-height: 40px;
  padding-inline: 7px;
  justify-content: center;
  font-size: 10px;
}

/* Globus bleibt groß genug für Touch, steht aber nicht mehr vor dem Player. */
.globe-stage {
  min-height: min(76vw, 385px);
  margin-top: 10px;
  border-radius: 15px;
}
.globe-control-strip {
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
  padding: 2px 0 3px;
}
.globe-control-strip::-webkit-scrollbar { display: none; }
.globe-control-strip .small-button {
  flex: 0 0 auto;
  min-height: 40px;
  white-space: nowrap;
  font-size: 10px;
}
.globe-legend {
  margin-top: 8px;
  gap: 7px 10px;
  font-size: 10px;
}
.globe-help {
  margin-top: 6px;
  font-size: 10px;
  line-height: 1.35;
}
.globe-source { font-size: 9px; }

/* Suche und Weltfunktionen: wenig Scrollen, klare Primäraktion. */
.control-panel {
  margin-top: 10px;
  box-shadow: none;
}
.stations-heading-wrap { gap: 8px; }
.stations-heading-wrap .accent-button {
  max-width: 124px;
  min-height: 40px;
  padding-inline: 8px;
  line-height: 1.1;
  font-size: 10px;
}
.search-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 7px;
  margin-top: 11px;
}
.search-field {
  min-width: 0;
  min-height: 46px;
  padding-inline: 11px;
}
.search-field kbd { display: none; }
.filter-toggle { min-width: 48px; padding-inline: 9px; }
.world-search-button {
  grid-column: 1 / -1;
  width: 100%;
  min-height: 42px;
  justify-content: center;
}
.search-assist {
  display: grid;
  gap: 3px;
  margin-top: 6px;
  font-size: 10px;
  line-height: 1.35;
}
.search-assist > span:first-child { display: none; }
.filters {
  display: none;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
.filters.is-open { display: grid; }
.filter-group, .select-field { width: 100%; }
.select-field select { width: 100%; }

.global-controls {
  display: grid;
  gap: 8px;
  margin-top: 10px;
  padding: 10px;
}
.global-copy { gap: 2px; }
.global-copy strong { font-size: 12px; }
.global-copy > span:last-child { display: none; }
.global-controls .country-field,
.global-controls .country-field select,
.global-load-button,
.world-load-button,
.news-load-button { width: 100%; }
.global-status { padding-top: 1px; font-size: 9px; }

.content-grid {
  display: grid;
  gap: 14px;
  margin-top: 16px;
}
.section-strip { margin-bottom: 8px; }
.section-strip h2 { font-size: 18px; }
.station-grid { grid-template-columns: 1fr; gap: 7px; }
.station-card { border-radius: 14px; }
.station-main-button { min-height: 58px; padding: 9px 10px; }
.station-logo { width: 43px; height: 43px; flex: 0 0 43px; font-size: 13px; }
.station-copy strong { font-size: 13px; }
.station-copy span { font-size: 10px; }
.station-footer { min-height: 42px; padding: 4px 7px; }
.station-state, .stream-codec { font-size: 9px; }
.side-column { gap: 10px; }

/* Auf Mobile sind echte Radiofunktionen wichtiger als vorbereitete Community-Hinweise. */
.community-card { display: none; }
.local-card, .world-news-card { padding: 12px; }
.local-card p, .world-news-card p { font-size: 11px; }
.schedule-panel .schedule-list { max-height: 230px; overflow: auto; }

.regional-note {
  margin-top: 17px;
  padding: 14px 2px;
  align-items: flex-start;
}
.site-footer {
  display: grid;
  margin-top: 16px;
  padding: 14px 2px 0;
}
.site-footer nav { gap: 11px; }

.mobile-player {
  position: fixed;
  left: 7px;
  right: 7px;
  bottom: calc(7px + var(--safe-bottom));
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 62px;
  padding: 7px 9px;
  border-radius: 16px;
}
.mobile-player-copy { min-width: 0; }
.mobile-player-copy strong { font-size: 12px; }
.mobile-player-copy span { font-size: 10px; }
.mobile-play, .mobile-favorite { flex: 0 0 44px; width: 44px; min-width: 44px; }
.toast-region {
  left: 10px;
  right: 10px;
  bottom: calc(78px + var(--safe-bottom));
}

.globe-panel:fullscreen { padding: 10px; background: var(--bg); }
.globe-panel:fullscreen .globe-stage { height: calc(100vh - 112px); min-height: 0; }
.globe-panel:fullscreen .globe-legend,
.globe-panel:fullscreen .globe-help,
.globe-panel:fullscreen .globe-source { display: none; }

/* Standby/Lockscreen: auf Mobile sichtbar, aber bewusst kompakt. */
.standby-note {
  margin-top: 8px;
  padding: 8px 9px;
  font-size: 10px;
  line-height: 1.35;
}

/* Informations- und Rechtsseiten · Mobile */
.static-site-header { flex-wrap: wrap; gap: 6px; }
.static-site-header .brand-copy small { display: block; max-width: 155px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 9px; }
.static-top-nav { width: 100%; gap: 4px; overflow-x: auto; scrollbar-width: none; }
.static-top-nav::-webkit-scrollbar { display: none; }
.static-top-nav a { flex: 0 0 auto; min-height: 38px; padding: 0 10px; font-size: 10px; }
.static-page { width: calc(100% - 20px); padding: 12px 0 94px; }
.breadcrumb { margin-bottom: 10px; font-size: 10px; }
.static-hero, .static-section, .legal-hero, .legal-content section, .static-cta { padding: 14px; border-radius: 16px; }
.static-hero { gap: 14px; }
.static-hero h1, .legal-hero h1 { font-size: clamp(27px, 9vw, 36px); }
.static-hero-copy > p:not(.eyebrow), .legal-hero > p { font-size: 12px; line-height: 1.55; }
.project-cover { border-radius: 13px; }
.static-actions { display: grid; grid-template-columns: 1fr; }
.primary-link-button, .secondary-link-button { width: 100%; }
.static-feature-grid, .source-grid, .two-column-info { grid-template-columns: 1fr; }
.info-card, .info-panel, .source-grid article { padding: 13px; }
.static-cta { display: grid; }
.static-cta .primary-link-button { width: 100%; }
.legal-content p, .legal-content li, .legal-content address { font-size: 12px; line-height: 1.62; }
.header-info-link { display: none; }

/* ========================================================================== 
   Mobile Compact Pass · 2026-08-14
   Ziel: 320–430 CSS-Pixel bekommen deutlich mehr Radio pro Bildschirmhöhe.
   Desktop/Tablet bleiben unberührt, da diese Datei nur bis 767px geladen wird.
   ========================================================================== */

/* Grundrhythmus: weniger Außenraum, ohne Touch-Ziele unbrauchbar klein zu machen. */
.site-header {
  min-height: 52px;
  padding: 5px 7px;
  gap: 6px;
}
.brand { min-height: 42px; gap: 7px; }
.brand-mark {
  width: 40px;
  height: 40px;
  border-radius: 12px;
  font-size: 13px;
}
.brand-copy strong { max-width: 118px; font-size: 12px; }
.header-actions { gap: 0; }
.icon-button {
  width: 40px;
  min-width: 40px;
  min-height: 40px;
  height: 40px;
  border-radius: 10px;
}
.site-menu-icon { font-size: 17px; }
.site-menu-panel {
  top: 56px;
  right: 7px;
  width: min(330px, calc(100vw - 14px));
  max-height: calc(100dvh - 66px - var(--safe-bottom));
  padding: 6px;
  border-radius: 13px;
}
.site-menu-panel a {
  min-height: 46px;
  padding: 6px 8px;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 8px;
}
.site-menu-panel a > span:first-child { width: 27px; height: 27px; }
.site-menu-panel strong { font-size: 11px; }
.site-menu-panel small { font-size: 9px; }

.radio-app { padding: 7px 7px calc(88px + var(--safe-bottom)); }

/* Tabs: auf 384px bleibt mehr Inhalt sichtbar; horizontal scrollen bleibt möglich. */
.view-tabs {
  top: 52px;
  width: calc(100% + 14px);
  margin: 7px -7px 7px;
  padding: 0 7px 1px;
  gap: 2px;
}
.view-tab {
  min-height: 38px;
  height: 38px;
  padding: 0 9px;
  border-radius: 9px;
  font-size: 10px;
}

/* Intro nur dann großzügig, wenn es tatsächlich der Einstieg ist. */
.intro-bar { padding-top: 4px; }
.intro-bar h1 { font-size: clamp(20px, 6.2vw, 25px); }
.intro-copy { margin-top: 4px; font-size: 11px; line-height: 1.38; }
body.has-mobile-sender-mix .view-tabs { margin-top: 5px; }

.hero-dashboard { gap: 7px; }
.panel { border-radius: 14px; }
.globe-panel,
.now-panel,
.control-panel,
.schedule-panel,
.local-card,
.world-news-card,
.community-card,
.favorite-playlist-card { padding: 9px; }
.panel-heading { gap: 6px; }
.panel-heading .eyebrow { font-size: 8px; letter-spacing: .105em; }
.panel-heading h2 { margin-top: 2px; font-size: 17px; line-height: 1.06; }
.panel-actions { gap: 4px; }
.panel-actions .small-button {
  min-height: 38px;
  height: 38px;
  padding-inline: 7px;
  border-radius: 9px;
  font-size: 9px;
}

/* Jetzt läuft: wichtigste Informationen auf ca. 250–285px statt ~380px. */
.now-panel { gap: 7px; }
.now-panel > .panel-heading .eyebrow { display: none; }
.live-badge {
  min-height: 26px;
  padding: 3px 7px;
  font-size: 8px;
}
.live-badge > span { width: 5px; height: 5px; }
.now-station { gap: 7px; }
.station-logo--large {
  width: 44px;
  height: 44px;
  flex-basis: 44px;
  border-radius: 12px;
  font-size: 11px;
}
.station-logo--large::after { inset-inline: 6px; bottom: 4px; }
.now-copy .station-region { font-size: 8px; letter-spacing: .09em; }
.now-copy h3 { font-size: 15px; line-height: 1.1; }
.now-copy p { margin-top: 2px; font-size: 9px; line-height: 1.25; }
.favorite-button--large {
  width: 38px;
  height: 38px;
  min-height: 38px;
  flex: 0 0 38px;
  font-size: 19px;
}

.program-block {
  gap: 2px;
  padding: 7px 8px;
  border-radius: 10px;
}
.program-label { font-size: 8px; letter-spacing: .1em; }
.program-block strong { font-size: 13px; line-height: 1.2; }
.program-block > span:not(.program-label) {
  font-size: 9px;
  line-height: 1.25;
  max-height: 2.5em;
  overflow: hidden;
}
.progress-track { height: 3px; margin-top: 3px; }

.player-controls { gap: 8px; }
.play-button {
  width: 44px;
  height: 44px;
  min-height: 44px;
  flex-basis: 44px;
  font-size: 16px;
}
.player-meta strong { font-size: 12px; line-height: 1.2; }
.player-meta span { margin-top: 2px; font-size: 9px; }

.now-actions {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
}
.now-actions .secondary-button {
  min-width: 0;
  min-height: 38px;
  height: 38px;
  padding: 0 5px;
  border-radius: 9px;
  font-size: 9px;
  line-height: 1.1;
  white-space: normal;
}
.now-actions #share-station { grid-column: auto; }

/* Auf Mobile genügt ein kurzer Hinweis; die ausführliche Erklärung bleibt Desktop/Tablet. */
.standby-note {
  align-items: center;
  margin-top: 1px;
  padding: 6px 7px;
  border-radius: 9px;
  font-size: 9px;
  line-height: 1.25;
}
.standby-copy { min-width: 0; }
.standby-full { display: none; }
.standby-mobile { display: inline; }

/* RadioGlobus: weiterhin gut bedienbar, aber kein halber Bildschirm mehr. */
.globe-stage {
  height: clamp(210px, 60vw, 270px);
  min-height: 210px;
  margin-top: 7px;
  border-radius: 12px;
}
.globe-control-strip { margin-top: 6px; gap: 4px; }
.globe-control-strip .small-button {
  min-height: 38px;
  height: 38px;
  padding-inline: 8px;
  border-radius: 9px;
  font-size: 9px;
}
/* Legende/Hilfetext sind auf dem kleinen Display sekundär; Vollbild/Buttons bleiben verfügbar. */
.globe-legend,
.globe-help,
.globe-source { display: none; }

/* Suche und Weltfunktionen ebenfalls enger setzen. */
.control-panel { margin-top: 7px; }
.stations-heading-wrap .accent-button {
  min-height: 38px;
  height: 38px;
  max-width: 112px;
  font-size: 9px;
}
.search-row { gap: 5px; margin-top: 8px; }
.search-field {
  min-height: 42px;
  padding-inline: 9px;
  border-radius: 10px;
}
.search-field input { min-height: 40px; font-size: 12px; }
.filter-toggle { min-width: 44px; min-height: 40px; font-size: 10px; }
.world-search-button { min-height: 40px; font-size: 10px; }
.search-assist { margin-top: 4px; font-size: 9px; }
.global-controls { gap: 6px; margin-top: 7px; padding: 8px; }
.global-copy strong { font-size: 11px; }
.global-status { font-size: 8px; }
.global-controls .secondary-button,
.global-controls .small-button,
.global-controls select { min-height: 40px; font-size: 10px; }

.content-grid { gap: 10px; margin-top: 11px; }
.section-strip { margin-bottom: 6px; }
.section-strip h2 { font-size: 16px; }
.station-grid { gap: 5px; }
.station-card { border-radius: 11px; }
.station-main-button { min-height: 52px; padding: 6px 8px; }
.station-logo { width: 38px; height: 38px; flex-basis: 38px; font-size: 11px; }
.station-copy strong { font-size: 12px; }
.station-copy span { font-size: 9px; }
.station-footer { min-height: 38px; padding: 3px 6px; }
.station-state, .stream-codec { font-size: 8px; }

/* Playlist-Start ebenfalls kompakter, wenn Favoriten vorhanden sind. */
.mobile-mix-anchor:not([hidden]) { margin: 0 0 6px; }
.favorite-playlist-card.is-mobile-priority { padding: 9px; }
.favorite-playlist-card.is-mobile-priority::before { margin-bottom: 4px; font-size: 8px; }
.favorite-playlist-card.is-mobile-priority #playlist-heading { font-size: 17px; }
.favorite-playlist-card.is-mobile-priority .playlist-controls { margin-top: 7px; gap: 5px; }
.favorite-playlist-card.is-mobile-priority .playlist-options { gap: 5px; margin-top: 6px; }
.favorite-playlist-card.is-mobile-priority .favorite-playlist-list { max-height: 138px; margin-top: 6px; }
.favorite-playlist-card.is-mobile-priority .favorite-playlist-item { min-height: 40px; }
.favorite-playlist-card.is-mobile-priority .playlist-footer-actions { gap: 5px; margin-top: 6px; }

/* Footer-Player darf Inhalt nicht unnötig verdecken. */
.mobile-player {
  left: 5px;
  right: 5px;
  bottom: calc(5px + var(--safe-bottom));
  min-height: 56px;
  padding: 5px 7px;
  border-radius: 14px;
}
.mobile-play,
.mobile-favorite { width: 40px; height: 40px; min-height: 40px; flex-basis: 40px; }
.mobile-player-copy strong { font-size: 11px; }
.mobile-player-copy span { font-size: 9px; }
.toast-region { bottom: calc(68px + var(--safe-bottom)); }

/* Sehr schmale Geräte: unnötige Kopie entfernen, statt Inhalte zusammenzuquetschen. */
@media (max-width: 360px) {
  .site-header { padding-inline: 5px; }
  .brand-mark { width: 37px; height: 37px; }
  .brand-copy strong { max-width: 96px; font-size: 11px; }
  .icon-button { width: 37px; min-width: 37px; height: 38px; min-height: 38px; }
  #voice-toggle { display: none; }
  .radio-app { padding-inline: 5px; }
  .view-tabs { width: calc(100% + 10px); margin-inline: -5px; padding-inline: 5px; }
  .view-tab { padding-inline: 8px; font-size: 9px; }
  .now-actions .secondary-button { font-size: 8px; }
  .globe-stage { height: clamp(198px, 59vw, 225px); min-height: 198px; }
}

/* Querformat auf Handys: Höhe ist knapper als Breite. */
@media (max-width: 767px) and (orientation: landscape) {
  .site-header { position: sticky; min-height: 48px; }
  .view-tabs { top: 48px; }
  .hero-dashboard { grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr); align-items: start; }
  .now-panel { order: 1; }
  .globe-panel { order: 2; }
  .globe-stage { height: min(52dvh, 255px); min-height: 180px; }
  .standby-note { display: none; }
  .program-block > span:not(.program-label) { display: none; }
  .globe-control-strip { display: none; }
}

/* Niedrige Displays bekommen zusätzlich etwas Luft zurück. */
@media (max-width: 430px) and (max-height: 740px) {
  .view-tab { min-height: 36px; height: 36px; }
  .now-panel { gap: 5px; }
  .program-block { padding-block: 5px; }
  .standby-note { display: none; }
  .globe-stage { height: clamp(190px, 55vw, 225px); min-height: 190px; }
}

/* Geteilter Sender: auf dem Handy sofort verständlich, aber kompakt. */
.shared-station-banner {
  grid-template-columns: 34px minmax(0, 1fr) auto;
  gap: 8px;
  margin-bottom: 7px;
  padding: 8px;
  border-radius: 12px;
}
.shared-station-signal { width: 34px; height: 34px; border-radius: 10px; font-size: 15px; }
.shared-station-kicker { font-size: 7px; }
.shared-station-copy strong { font-size: 12px; }
.shared-station-copy > span:last-child { font-size: 8px; }
.shared-station-actions { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr auto; gap: 5px; }
.shared-station-actions .secondary-button { min-height: 38px; padding-inline: 8px; font-size: 9px; }
.shared-station-dismiss { width: 38px; height: 38px; }

/* Bedienfreundliche, sichtbare Scrollleisten statt versteckter Touch-Scroller. */
.view-tabs,
.globe-control-strip,
.static-top-nav,
.favorite-playlist-list,
.site-menu-panel {
  scrollbar-width: auto !important;
  scrollbar-color: var(--accent) color-mix(in srgb, var(--surface-strong) 88%, #000) !important;
}
.view-tabs::-webkit-scrollbar,
.globe-control-strip::-webkit-scrollbar,
.static-top-nav::-webkit-scrollbar,
.favorite-playlist-list::-webkit-scrollbar,
.site-menu-panel::-webkit-scrollbar {
  display: block !important;
  width: 12px;
  height: 12px;
}

.track-block { padding: 10px 11px; gap: 3px; }
.track-block > strong { font-size: 14px; line-height: 1.25; }
.track-block > span:not(.program-label) { font-size: 10px; }
.track-heading-row { gap: 6px; }
.track-live-state { font-size: 9px !important; }
.song-progress-row { gap: 6px; font-size: 9px; }
.song-progress { height: 7px; }
.song-search-panel { margin-top: 8px; }
.song-search-panel > summary { min-height: 44px; padding: 9px 10px; font-size: 12px; }
.song-search-body { grid-template-columns: 1fr; gap: 7px; padding: 9px 9px 0; }
.song-search-body .secondary-button { width: 100%; justify-content: center; }
.song-search-hint,
.song-search-status { margin-inline: 9px; font-size: 10px; }
.song-search-results { margin: 8px 9px 9px; }
.song-search-result { grid-template-columns: minmax(0,1fr) auto; gap: 6px; padding: 7px 8px; }
.song-search-result button { min-width: 44px; padding-inline: 10px; }