/* Surgical mobile feedback fixes — 2026-08-08.
   Loaded after styles.v2.css so the approved layout remains unchanged. */

.brand-logo {
  display: block;
  width: 230px;
  height: auto;
  max-height: 58px;
  object-fit: contain;
  object-position: left center;
  filter: brightness(.28) saturate(.55);
}

body[data-theme="dark"] .brand-logo {
  filter: none;
}

body[data-theme="dark"] {
  --preview-cta-bg: #336050;
  --preview-cta-border: #4b7365;
  --preview-cta-ink: #f3efe6;
}

.theme-toggle {
  width: 44px;
  min-width: 44px;
  padding: 0;
  display: grid;
  place-items: center;
}

.theme-label {
  display: none;
}

.theme-icon,
.theme-icon svg {
  display: block;
  width: 20px;
  height: 20px;
}

.theme-icon svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  transform: translate(1px, -1px);
}

.menu-toggle {
  width: 44px;
  min-width: 44px;
  padding: 0;
  align-content: center;
  justify-items: center;
}

.menu-toggle span {
  width: 18px;
  margin: 3px 0;
}

body[data-theme="dark"] .btn-primary {
  background: var(--preview-cta-bg);
  border-color: var(--preview-cta-border);
  color: var(--preview-cta-ink);
  box-shadow: none;
  font-weight: 600;
}

body[data-theme="dark"] .btn-primary small {
  color: var(--preview-cta-ink);
  opacity: .82;
}

@media (max-width: 850px) {
  .header-inner {
    gap: 10px;
  }

  .menu-toggle {
    display: grid;
  }
}

@media (max-width: 520px) {
  .header-inner {
    gap: 8px;
  }

  .brand {
    min-width: 0;
  }

  .brand-logo {
    width: clamp(185px, 59vw, 230px);
    max-height: 56px;
  }

  .header-actions {
    flex: 0 0 auto;
    gap: 8px;
  }
}