/* Shared mobile-first safety layer for public and staff interfaces. */
html { text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }
body { min-width: 320px; max-width: 100%; overflow-x: clip; }
main, section, article, aside, header, footer, nav, form, fieldset, div { min-width: 0; }
img, picture, video, canvas, svg { max-width: 100%; }
button, [role="button"], input, select, textarea, summary, a { touch-action: manipulation; }
button, [role="button"], input[type="button"], input[type="submit"], input[type="reset"], summary { min-height: 44px; }
input:not([type="checkbox"]):not([type="radio"]), select, textarea { max-width: 100%; }
label { overflow-wrap: anywhere; }
pre, code { white-space: pre-wrap; overflow-wrap: anywhere; }
table { max-width: 100%; border-collapse: collapse; }
.table-wrap, .table-shell, .data-table-wrap, .responsive-table, [class*="table-container"], [class*="table-wrapper"] { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch; }
[hidden] { display: none !important; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
:focus-visible { outline: 3px solid var(--mio-gold-300, #e7cc8a); outline-offset: 3px; }

/* Compact public chrome keeps the experience elegant without consuming the viewport. */
:where(.mio-site-header, .site-header, .premium-site-header) {
  min-height: clamp(64px, 5.3vw, 78px) !important;
  height: auto !important;
}
:where(.mio-site-header .mio-nav-shell, .site-header .nav-shell, .premium-site-header .nav-shell) {
  min-height: inherit;
}
@media (max-width: 47.99rem) {
  input:not([type="checkbox"]):not([type="radio"]), select, textarea { font-size: 16px !important; }
  .modal, .dialog, [role="dialog"] { max-width: calc(100vw - 1.5rem); max-height: calc(100dvh - 1.5rem); }
  .sticky-actions, .bottom-actions, [class*="bottom-bar"] { padding-bottom: max(.75rem, env(safe-area-inset-bottom)); }
  :where(.mio-site-header, .site-header, .premium-site-header) {
    min-height: 62px !important;
    padding-top: env(safe-area-inset-top) !important;
  }
  :where(.mio-site-header .mio-nav-shell, .site-header .nav-shell, .premium-site-header .nav-shell) {
    min-height: 62px !important;
    padding-block: 7px !important;
  }
  .mio-public-site :where(.hero, .page-hero, .mio-hero, .premium-hero) {
    min-height: 0 !important;
    padding-top: clamp(38px, 10vw, 62px) !important;
    padding-bottom: clamp(42px, 11vw, 72px) !important;
  }
  .mio-public-site :where(.hero h1, .page-hero h1, .mio-hero h1, .premium-hero h1) {
    max-width: 100%;
    font-size: clamp(2.65rem, 13vw, 4.6rem) !important;
    line-height: .98 !important;
    overflow-wrap: anywhere;
    text-wrap: balance;
  }
}
@media (orientation: landscape) and (max-height: 37rem) {
  .modal, .dialog, [role="dialog"] { max-height: calc(100dvh - 1rem); overflow-y: auto; }
}
@media (min-width: 120rem) {
  body { font-size: clamp(1rem, .25vw + .7rem, 1.25rem); }
  .mio-public-site :where(main > section, .page-section) { padding-inline: clamp(4rem, 6vw, 9rem); }
}
@media (forced-colors: active) {
  :focus-visible { outline: 3px solid CanvasText; }
  button, a, input, select, textarea { border-color: CanvasText !important; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}
@media print {
  .site-header, .mobile-dock, .nav-toggle, .no-print, [data-display-mode-toggle] { display: none !important; }
  body { color: #000 !important; background: #fff !important; }
  a { text-decoration: none; }
}