/* Fueltek v6.9.292 — make the wordmark a true part of the compact mobile bar.
   The previous 150px background was clipped by an increasingly narrow grid
   track. Scale both the track and artwork together instead. */

@media (max-width: 560px) {
  html[data-theme] body .header {
    --mobile-logo-slot: clamp(82px, 25vw, 108px);
    grid-template-columns: var(--mobile-logo-slot) minmax(0, 1fr) !important;
    column-gap: 6px !important;
  }

  html[data-theme] body .header .logo {
    grid-column: 1 !important;
    grid-row: 1 !important;
    box-sizing: border-box !important;
    width: var(--mobile-logo-slot) !important;
    min-width: var(--mobile-logo-slot) !important;
    max-width: var(--mobile-logo-slot) !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    margin: 0 !important;
    padding: 0 4px !important;
    align-self: center !important;
    justify-self: start !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 10px !important;
    background-color: transparent !important;
    background-position: center !important;
    background-size: calc(var(--mobile-logo-slot) - 10px) auto !important;
    box-shadow: none !important;
    filter: none !important;
  }

  html[data-theme] body .header .header-actions-v56 {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    justify-self: end !important;
  }
}