/* Reflow to the available viewport; retain pinch zoom and document scrolling. */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { min-inline-size: 0; overflow-wrap: anywhere; }
*, *::before, *::after { box-sizing: border-box; }
main, header, nav, section, article, details, form, .panel, .console,
.hero > *, .pricing > *, .grid > *, .cards > *, .providers > *, .actions > * {
  min-inline-size: 0;
}
main { inline-size: 100%; }
img, svg, video, iframe { max-inline-size: 100%; }
button, .button, .btn, input, select, textarea {
  max-inline-size: 100%; min-inline-size: 0;
}
button, .button, .btn, summary {
  white-space: normal; overflow-wrap: anywhere; text-align: center;
}
summary { text-align: start; }
button, .button, .btn { line-height: 1.45; padding-block: 12px; }
input, select, textarea { font-size: max(1rem, 16px); }
header { flex-wrap: wrap; }
header > *, nav > * { min-inline-size: 0; max-inline-size: 100%; }
#accountLabel, #accountEmail, .message, pre, code { overflow-wrap: anywhere; }
pre { white-space: pre-wrap; }
.scroll { min-inline-size: 0; max-inline-size: 100%; overflow-x: auto; }
textarea, input { scroll-margin-block: 24px; }
body:not([data-page="index"]) > main {
  padding-inline-start: max(18px, env(safe-area-inset-left));
  padding-inline-end: max(18px, env(safe-area-inset-right));
  padding-bottom: max(24px, env(safe-area-inset-bottom));
}
@media (max-width: 600px) {
  .hero, .pricing, .cards, .legal { grid-template-columns: minmax(0, 1fr); }
  .actions { align-items: stretch; }
  .actions > button, .actions > .button, .actions > .btn { inline-size: 100%; }
  .btn, .button, button { min-block-size: 48px; }
  #connection > button, #connection > .button { inline-size: 100%; margin-block-start: 8px; }
  #providerPanel, #keyPanel, #billingAdmin { padding: 14px !important; }
  #messages { min-block-size: 120px; max-block-size: 45vh; max-block-size: 45dvh; }
  .languagebar { flex-wrap: wrap; }
}
@media (max-width: 380px) {
  .providers, .grid { grid-template-columns: minmax(0, 1fr); }
  .panel, .customadd { padding: 14px; }
  .price { font-size: 2.5rem; }
}

.providerlink { display: flex; inline-size: 100%; margin-block-start: 12px; font-size: 1rem; text-align: center; }

/* Restore the directory's original green badge palette for its working links. */
.providerlink { background: #132b3b; color: #7be9bd; border-color: #263b5f; }
.providerlink:hover, .providerlink:focus-visible { background: #173a48; color: #a1ffe0; }
