/* Shared brand copy remains readable at narrow widths and without JavaScript. */
.hx-brand, .hx-brand > div, .brand > div { min-width: 0; }
.hx-brand h1, .hx-ask-page .hx-brand h1 { font-size: clamp(21px, 3vw, 28px); line-height: 1.15; overflow-wrap: break-word; }
.smaxi-footer { max-width: 940px; margin: 0 auto; padding: 20px 24px max(24px, env(safe-area-inset-bottom)); color: #b4afbd; font: 12px/1.6 system-ui, sans-serif; }
.smaxi-footer a { color: inherit; text-underline-offset: 3px; }
.smaxi-about { max-width: 760px; margin: 0 auto; padding: 32px 24px; color: #eee8f2; font: 16px/1.7 system-ui, sans-serif; }
.smaxi-about h1 { font-size: clamp(28px, 5vw, 42px); line-height: 1.2; }
.smaxi-about a { color: #d1bdff; }
.smaxi-about nav { display: flex; flex-wrap: wrap; gap: 24px; }
@media (max-width: 620px) {
  .hx-top { flex-wrap: wrap; }
  .hx-ask-page .hx-brand p, .hx-brand p { display: block; max-width: 46ch; line-height: 1.5; }
  .hx-ask-page .hx-tools { width: 100%; justify-content: flex-start; }
  .hx-ask-page #runtimeState { flex-basis: auto; margin-right: auto; }
}