/* Hand-maintained fixes on top of the generated marketing stylesheet (style.*.css is
 * overwritten by scripts/sync-marketing.mjs). Injected by app/[[...slug]]/route.ts. */

/* Announcement bar on phones: language.css stacks the copy above full-size language tabs
 * (~100px tall). Keep it to one compact row: copy left, tabs right.
 * `html body … .announce.announce` outranks language.css's `body:not(.inner)>.announce:has(…)`. */
@media (max-width: 760px) {
  html body .announce.announce:has(.language-switch) {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    padding: 4px 12px;
  }
  html body .announce.announce > .announcement-copy { grid-column: 1; font-size: 12px; line-height: 1.4; text-align: left; }
  html body .announce.announce > .language-switch { grid-column: 2; }
  html body .announce.announce .language-switch svg { display: none; }
  html body .announce.announce .language-switch a { min-height: 32px; min-width: 0; padding: 2px 8px; font-size: 13px; }
}