/* Phone-only overrides. Load AFTER styles.css. Desktop rules stay untouched. */
@media (max-width: 600px) {
  body > header { gap: 10px; padding-inline: 12px; }
  body > header .brand { flex-shrink: 0; }
  body > header #account { margin-left: auto; min-width: 0; }
  body > header .login { padding: 12px 10px; font-size: 12px; }
  .bvMobileMenu { flex: 0 0 auto; min-width: 64px; min-height: 44px; padding: 10px; border: 1px solid #ec2dff; background: #180b20; color: white; font: bold 13px Arial, sans-serif; cursor: pointer; }
  .bvMobileMenu:focus-visible, header nav a:focus-visible { outline: 2px solid white; outline-offset: 3px; }
  body > header > nav[data-mobile-open="true"] { display: flex; position: absolute; inset: 100% 0 auto; margin: 0; padding: 12px; max-height: calc(100dvh - 72px); overflow-y: auto; flex-direction: column; gap: 4px; background: #0d0911; border-bottom: 1px solid #ec2dff; box-shadow: 0 12px 24px #0009; }
  body > header > nav[data-mobile-open="true"] a { padding: 14px 12px; min-height: 44px; border-bottom: 1px solid #39203f; }
  body > header > nav a[hidden] { display: none !important; }
  .homeHighlights { padding-inline: 12px; gap: 12px; }
  .homeHighlights .homeHighlightCard { padding: 16px; min-width: 0; }
  .homeHighlights .homeHighlightTitle { padding: 12px; gap: 10px; min-width: 0; }
  .homeHighlights .homeHighlightTitle > div { padding: 0; border: 0; background: transparent; min-width: 0; flex: 1; }
  .homeHighlights .homeHighlightTitle b { margin-left: 0; font-size: 18px; line-height: 1.25; }
  .homeHighlights .homeHighlightTitle small { margin: 7px 0 0; line-height: 1.5; letter-spacing: .3px; }
  .homeHighlights .homeHighlightIcon { flex: 0 0 26px; font-size: 24px; }
  .homeHighlights .homeHighlightCard p { line-height: 1.6; }
  .homeLearnMore { min-height: 44px; display: inline-flex; align-items: center; }
  .homeLegalNotice { margin-inline: 12px; gap: 12px; grid-template-columns: 32px minmax(0, 1fr); }
  .homeLegalBadge { width: 28px; height: 28px; font-size: 18px; }
  .homeLegalTitle { line-height: 1.4; }
  .serverDashboard, .serverSystems { min-width: 0; }
  .serverDashboard h3 { overflow-wrap: anywhere; }
  body[data-page="server"] .heroCtas .btn { min-height: 48px; padding-inline: 6px; gap: 6px; letter-spacing: .2px; }
}
