/* Shared viewport contract. Loaded after feature presentation styles. */
:root {
  --ui-content-max: 80rem;
  --ui-form-max: 42rem;
  --ui-gutter: clamp(1rem, 2.5vw, 2rem);
  --ui-gap: clamp(.75rem, 1.5vw, 1.25rem);
  --ui-sidebar-width: 15rem;
  --ui-touch: 2.75rem;
  --ui-nav-height: 4.75rem;
  --ui-table-min: 44rem;
}
html { scrollbar-gutter: stable; }
body { min-width: 0; min-height: 100vh; min-height: 100dvh; }
img, video, iframe { max-inline-size: 100%; }
input, select, textarea { min-inline-size: 0; max-inline-size: 100%; }
:focus-visible { outline: 3px solid var(--teal-green, #148f87); outline-offset: 3px; }
.ui-public { display: block; padding-bottom: 0; }
.ui-public .app-container {
  width: 100%; max-width: none; min-height: 100dvh;
  overflow-x: clip; box-shadow: none;
  padding-bottom: calc(var(--ui-nav-height) + env(safe-area-inset-bottom));
}
.ui-public .bottom-nav {
  max-width: none; height: calc(var(--ui-nav-height) + env(safe-area-inset-bottom));
  padding-bottom: env(safe-area-inset-bottom);
  padding-inline: env(safe-area-inset-left) env(safe-area-inset-right);
}
.ui-public .bottom-nav a { min-height: var(--ui-touch); justify-content: center; }
.ui-public .navbar { padding-inline: var(--ui-gutter); }
.ui-public .page-content { width: 100%; max-width: var(--ui-content-max); margin-inline: auto; }
.ui-messages { position: fixed; inset: 0 0 auto; margin-inline: auto; width: min(100%, var(--ui-form-max)); z-index: 1000; padding: var(--ui-gutter); }
.ui-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ui-gap); }
.ui-filter-bar { display: flex; flex-wrap: wrap; align-items: end; gap: var(--ui-gap); }
.ui-filter-bar > div { flex: 1 1 12rem; min-width: 0; }
.ui-filter-bar .form-control { width: 100%; }
.ui-input-action { display: flex; align-items: stretch; gap: .5rem; min-width: 0; }
.ui-input-action input { flex: 1; width: 100%; }
.ui-input-action button { flex: none; }
.ui-form { width: 100%; max-width: var(--ui-form-max); }
.ui-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 17rem), 1fr)); gap: var(--ui-gap); }
.ui-detail-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--ui-gap); }
.ui-detail-grid > *, .ui-grid > * { min-width: 0; }
.ui-panel { --sidebar-w: var(--ui-sidebar-width); }
.ui-panel .main-content { min-width: 0; width: calc(100% - var(--ui-sidebar-width)); min-height: 100dvh; }
.ui-panel .sidebar { height: 100dvh; padding-bottom: env(safe-area-inset-bottom); }
.ui-panel .content { width: 100%; min-width: 0; max-width: var(--ui-content-max); margin-inline: auto; padding: var(--ui-gutter); }
.ui-panel .topbar { gap: var(--ui-gap); flex-wrap: wrap; padding: .75rem var(--ui-gutter); }
.ui-topbar-heading { flex: 1 1 10rem; min-width: 0; overflow-wrap: anywhere; }
.ui-panel .topbar-actions { flex-wrap: wrap; min-width: 0; }
.ui-panel .card { min-width: 0; padding: var(--ui-gutter); }
.ui-panel .table-wrapper { max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
.ui-panel .table-wrapper table { min-inline-size: var(--ui-table-min); }
.ui-panel .badge { white-space: nowrap; }
.ui-panel .form-control { min-height: var(--ui-touch); }
.ui-panel :is(.btn, .page-link, .profile-trigger, .nav-link) { min-height: var(--ui-touch); }
.ui-panel .btn { justify-content: center; }
.ui-panel .profile-trigger { max-width: 100%; }
.ui-panel .profile-dropdown { max-width: calc(100vw - 2 * var(--ui-gutter)); }
.ui-panel .stat-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr)); }
.ui-panel .stat-card { min-width: 0; }
.ui-panel .stat-value { overflow-wrap: anywhere; }
.ui-menu-toggle, .ui-menu-close, .ui-menu-backdrop { display: none; }
.ui-menu-toggle, .ui-menu-close {
  align-items: center; justify-content: center; gap: .5rem; cursor: pointer;
  min-height: var(--ui-touch); min-width: var(--ui-touch);
  padding: .5rem .75rem; border: 1px solid var(--border-grey, #e2e8f0);
  border-radius: .5rem; background: white; color: var(--deep-navy, #003354); font: inherit;
}
@media (max-width: 63.999rem) {
  .landing-navbar .navbar-inner { flex-wrap: wrap; gap: .75rem; }
  .landing-navbar .navbar-brand { min-width: 0; overflow-wrap: anywhere; }
  .landing-navbar .navbar-toggle { display: inline-flex; min-height: var(--ui-touch); align-items: center; }
  .landing-navbar .navbar-links {
    display: none; position: static; order: 3; width: 100%;
    flex-direction: column; padding: .75rem 0; gap: .5rem;
  }
  .landing-navbar .navbar-links.active { display: flex; }
  .landing-navbar .navbar-links a { width: 100%; min-height: var(--ui-touch); padding: .5rem; }
  .ui-panel .main-content { margin-left: 0; width: 100%; }
  .ui-panel:not(.ui-navigation-ready) { flex-direction: column; }
  .ui-panel:not(.ui-navigation-ready) .sidebar { position: relative; width: 100%; height: auto; visibility: visible; transform: none; }
  .ui-panel:not(.ui-navigation-ready) :is(.ui-menu-toggle, .ui-menu-close) { display: none; }
  .ui-menu-toggle { display: inline-flex; }
  .ui-panel .sidebar {
    width: min(20rem, calc(100vw - 3rem)); visibility: hidden;
    transform: translateX(-100%); z-index: 1100;
  }
  .ui-panel.ui-navigation-open .sidebar { visibility: visible; transform: none; }
  .ui-navigation-open { overflow: hidden; }
  .ui-menu-close { display: inline-flex; position: absolute; right: .5rem; top: .5rem; }
  .ui-menu-backdrop:not([hidden]) {
    display: block; position: fixed; inset: 0; width: 100%; height: 100dvh;
    background: rgb(0 20 35 / .55); border: 0; z-index: 1050;
  }
  .ui-panel .profile-trigger-info { max-width: 9rem; overflow-wrap: anywhere; }
  .ui-panel .form-control, .ui-public :is(input, select, textarea), .login-card input { font-size: 1rem; }
}
@media (min-width: 64rem) {
  .landing-navbar .navbar-links { display: flex; }
  .landing-navbar .navbar-toggle { display: none; }
  .ui-public .app-container { padding-bottom: 0; }
  .ui-public .navbar { top: 72px; }
  .ui-public .desktop-site-header { padding-inline: var(--ui-gutter); gap: var(--ui-gap); }
  .ui-public .desktop-primary-nav { gap: var(--ui-gap); }
  .ui-public :is(.desktop-primary-nav a, .desktop-profile-link, .desktop-icon-link) { min-height: var(--ui-touch); display: inline-flex; align-items: center; }
  .ui-detail-grid { grid-template-columns: minmax(0, 2fr) minmax(16rem, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}