/* Eroded Networks responsive foundation
 * Shared, progressive enhancement for public, authenticated and Admin Hub pages.
 * Breakpoints: 640 / 768 / 1024 / 1440. Existing module styles remain authoritative.
 */
:root {
  --en-space-1: .375rem;
  --en-space-2: .625rem;
  --en-space-3: .875rem;
  --en-space-4: 1.125rem;
  --en-space-5: 1.5rem;
  --en-radius-sm: .75rem;
  --en-radius-md: 1rem;
  --en-radius-lg: 1.375rem;
  --en-tap: 44px;
  --en-nav-height: 56px;
  --en-safe-top: env(safe-area-inset-top, 0px);
  --en-safe-right: env(safe-area-inset-right, 0px);
  --en-safe-bottom: env(safe-area-inset-bottom, 0px);
  --en-safe-left: env(safe-area-inset-left, 0px);
  --en-vh: 1vh;
}

html {
  max-width: 100%;
  overflow-x: clip;
  scroll-padding-top: calc(var(--en-nav-height) + var(--en-safe-top) + 1rem);
  text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  max-width: 100%;
  overflow-x: clip;
  padding-left: var(--en-safe-left);
  padding-right: var(--en-safe-right);
}

img,
svg,
video,
canvas,
iframe {
  max-width: 100%;
}

img,
video {
  height: auto;
}

pre,
code,
.text-break,
.en-wrap-anywhere {
  overflow-wrap: anywhere;
  word-break: break-word;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 3px solid rgba(56, 189, 248, .92) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 5px rgba(56, 189, 248, .16) !important;
}

.en-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;
}

.skip-to-content {
  position: fixed;
  z-index: 2147483647;
  top: max(.5rem, var(--en-safe-top));
  left: max(.5rem, var(--en-safe-left));
  transform: translateY(-160%);
  border-radius: var(--en-radius-sm);
  padding: .75rem 1rem;
  background: #fff;
  color: #07111f;
  font-weight: 900;
  transition: transform .16s ease;
}

.skip-to-content:focus { transform: translateY(0); }

#app,
main,
[role="main"],
.container,
.container-fluid,
.row,
[class*="col-"] { min-width: 0; }

.page-header .title,
.page-header h1,
h1.title {
  font-size: clamp(1.75rem, 5vw, 3.35rem);
  line-height: 1.05;
  overflow-wrap: anywhere;
}

.en-page-actions,
.card-header,
.modal-footer,
.input-group,
.btn-group { min-width: 0; }

/* Navigation: desktop appearance stays intact; mobile becomes an accessible sheet. */
.navbar-fancy {
  min-height: calc(var(--en-nav-height) + var(--en-safe-top));
  padding-top: var(--en-safe-top);
}

.navbar-fancy .navbar-brand {
  min-width: 0;
  max-width: min(48vw, 250px);
}

.navbar-fancy .navbar-brand img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
}

.en-nav-drawer-head,
.en-nav-section-label,
.en-nav-backdrop { display: none; }

/* A closed navigation backdrop must never sit above public page content. */
.en-nav-backdrop[hidden],
body:not(.en-nav-open) .en-nav-backdrop {
  display: none !important;
  pointer-events: none !important;
}

.navbar-toggler-custom {
  min-width: var(--en-tap);
  min-height: var(--en-tap);
  align-items: center;
  justify-content: center;
  color: #fff;
}

.en-nav-close {
  width: var(--en-tap);
  height: var(--en-tap);
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: .875rem;
  background: rgba(255, 255, 255, .06);
  color: #fff;
}

/* Shared forms and touch controls. */
:where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea, .form-control, .form-select) {
  max-width: 100%;
  min-height: var(--en-tap);
}

textarea { resize: vertical; }

button,
.btn,
[role="button"],
summary {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.btn:not(.btn-sm),
button:not(.btn-sm):not(.navbar-toggler):not(.dropdown-toggle) {
  min-height: var(--en-tap);
}

.form-label,
label { overflow-wrap: anywhere; }

.invalid-feedback,
.form-text,
[role="alert"] { overflow-wrap: anywhere; }

form.en-is-submitting { cursor: progress; }
form.en-is-submitting [type="submit"] { opacity: .72; }

.en-back-to-top {
  position: fixed;
  z-index: 1040;
  right: max(1rem, calc(var(--en-safe-right) + .75rem));
  bottom: max(1rem, calc(var(--en-safe-bottom) + .75rem));
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  min-width: 3rem;
  min-height: 3rem;
  padding: .7rem .9rem;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  color: #fff;
  background: rgba(9,14,24,.94);
  box-shadow: 0 12px 30px rgba(0,0,0,.34);
  opacity: 0;
  visibility: hidden;
  transform: translateY(.75rem);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease;
}
.en-back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  pointer-events: auto;
}
.en-back-to-top:focus-visible { outline: 3px solid #7dd3fc; outline-offset: 3px; }

/* Tables: contain overflow by default; selected data tables become cards on phones. */
.en-table-scroll {
  position: relative;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
  border-radius: var(--en-radius-md);
  scrollbar-width: thin;
}

.en-table-scroll::after {
  content: "Swipe for more";
  display: none;
  position: sticky;
  right: .5rem;
  bottom: .4rem;
  float: right;
  padding: .28rem .55rem;
  border-radius: 999px;
  background: rgba(2, 6, 23, .88);
  color: #cbd5e1;
  font-size: .72rem;
  font-weight: 800;
  pointer-events: none;
}

.en-table-scroll.en-can-scroll::after { display: inline-flex; }
.en-table-scroll table { margin-bottom: 0; }

.pagination {
  flex-wrap: wrap;
  gap: .25rem;
}

.pagination .page-link {
  min-width: 2.5rem;
  min-height: 2.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Tabs remain complete and discoverable without widening the page. */
.nav-tabs,
.nav-pills,
.enhub-tabs,
[role="tablist"] {
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  flex-wrap: nowrap;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

.nav-tabs > *,
.nav-pills > *,
.enhub-tabs > *,
[role="tablist"] > * { flex: 0 0 auto; }

/* Modals use dynamic viewport height and safe-area padding. */
.modal {
  padding-left: var(--en-safe-left) !important;
  padding-right: var(--en-safe-right) !important;
}

.modal-dialog { max-width: min(94vw, var(--bs-modal-width, 700px)); }
.modal-content { max-height: calc(var(--en-vh) * 100 - 1.5rem - var(--en-safe-top) - var(--en-safe-bottom)); }
.modal-body { overflow: auto; overscroll-behavior: contain; }

.dropdown-menu {
  max-width: min(94vw, 28rem);
  max-height: min(70vh, calc(var(--en-vh) * 70));
  overflow-y: auto;
  overscroll-behavior: contain;
}

.toast-container {
  max-width: calc(100vw - var(--en-safe-left) - var(--en-safe-right));
  padding: .75rem;
}

/* Module-level layout safety. */
.enhub-root,
.en-landing,
.enstore-shell,
.rz-page,
.enstatus-page,
.staff-app-wrap,
.profile-wrap,
.profile-surface,
.en-pc-shell { max-width: 100%; }

.enhub-table-wrap,
.table-responsive { max-width: 100%; }

.enhub-actions > *,
.enhub-command-bar > *,
.enhub-section-head > * { min-width: 0; }

.enhub-sidebar-toggle { display: none; }

/* Profile identity and customisation shared enhancements. */
.en-pc-root,
.en-pc-root * { box-sizing: border-box; }

.en-pc-root,
.en-pc-shell,
.en-pc-card,
.en-pc-card-body,
.en-pc-identity,
.en-pc-identity > *,
.en-pc-game-card { min-width: 0; }

.en-pc-root .en-pc-games-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  align-items: stretch;
}

.en-pc-root .en-pc-identity h2 {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.en-pc-root :where(a, p, span) { overflow-wrap: anywhere; }

.en-profile-section-nav {
  position: sticky;
  top: calc(var(--en-nav-height) + var(--en-safe-top) + .5rem);
  z-index: 30;
  display: flex;
  gap: .45rem;
  width: 100%;
  max-width: 100%;
  margin: 0 0 1rem;
  padding: .5rem;
  overflow-x: auto;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 1rem;
  background: rgba(5, 9, 20, .88);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  scrollbar-width: thin;
}

.en-profile-section-nav a {
  flex: 0 0 auto;
  min-height: var(--en-tap);
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .65rem .85rem;
  border: 1px solid transparent;
  border-radius: .8rem;
  color: rgba(255, 255, 255, .76);
  font-weight: 850;
  text-decoration: none;
}

.en-profile-section-nav a:hover,
.en-profile-section-nav a[aria-current="true"] {
  color: #fff;
  border-color: rgba(56, 189, 248, .34);
  background: rgba(56, 189, 248, .11);
}

.en-profile-completion {
  display: grid;
  grid-template-columns: auto minmax(9rem, 1fr) auto;
  align-items: center;
  gap: .75rem;
  margin: 0 0 1rem;
  padding: .85rem 1rem;
  border: 1px solid rgba(56, 189, 248, .22);
  border-radius: 1rem;
  background: linear-gradient(135deg, rgba(59, 130, 246, .12), rgba(168, 85, 247, .08));
}

.en-profile-completion__bar {
  height: .55rem;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(255, 255, 255, .10);
}

.en-profile-completion__bar span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #3b82f6, #a855f7, #22c55e);
}

[data-en-profile-section] { scroll-margin-top: calc(var(--en-nav-height) + 5.25rem); }

.en-cosmetic-toolbar {
  display: grid;
  grid-template-columns: minmax(12rem, 1fr) repeat(2, minmax(9rem, auto));
  gap: .65rem;
  margin-bottom: 1rem;
}

.en-cosmetic-toolbar input,
.en-cosmetic-toolbar select { width: 100%; }

.en-cosmetic-hidden { display: none !important; }

.en-store-funding-progress {
  height: .8rem;
  overflow: hidden;
  margin-top: 1rem;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
}
.en-store-funding-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #7c3aed, #2563eb, #06b6d4);
}
.en-store-funding-total { color: #fff; font-size: clamp(1rem, 2vw, 1.3rem); }
.en-store-contributor-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin-top: 1.2rem; }
.en-store-contributor-card { min-width: 0; padding: 1rem; border: 1px solid rgba(255,255,255,.10); border-radius: 1rem; background: rgba(3,8,18,.44); }
.en-store-contributor-card h3 { margin-bottom: .8rem; font-size: 1rem; color: #fff; }
.en-store-contributor-row { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; gap: .7rem; align-items: center; padding: .55rem 0; border-top: 1px solid rgba(255,255,255,.08); }
.en-store-contributor-row img { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; }
.en-store-contributor-row strong, .en-store-contributor-row small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.en-store-contributor-row small { color: rgba(255,255,255,.58); }
.en-store-contributor-row b { color: #a7f3d0; white-space: nowrap; }

.en-profile-preview-fullscreen {
  position: fixed !important;
  z-index: 2147483644 !important;
  inset: 0 !important;
  width: 100vw !important;
  height: calc(var(--en-vh) * 100) !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  border-radius: 0 !important;
  padding: max(1rem, var(--en-safe-top)) max(1rem, var(--en-safe-right)) max(1rem, var(--en-safe-bottom)) max(1rem, var(--en-safe-left)) !important;
  overflow: auto !important;
  background-color: #040812 !important;
}

.en-cosmetic-hidden { display: none !important; }

@media (max-width: 1023.98px) {
  #en-profile-customization > div:first-child { grid-template-columns: minmax(0, 1fr) !important; }
  .en-store-contributor-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 980px) {
  .en-pc-root .en-pc-games-grid { grid-template-columns: minmax(0, 1fr) !important; }
}

@media (max-width: 820px) {
  .en-pc-root .en-pc-shell { padding: 1rem !important; }
  .en-pc-root .en-pc-identity {
    grid-template-columns: 92px minmax(0, 1fr) !important;
    gap: .875rem !important;
  }
  .en-pc-root .en-pc-avatarbox,
  .en-pc-root .en-pc-avatarbox img.en-pc-avatar-main {
    width: 92px !important;
    height: 92px !important;
    min-width: 92px !important;
    min-height: 92px !important;
    max-width: 92px !important;
    max-height: 92px !important;
  }
  .en-pc-root .en-pc-split { grid-template-columns: minmax(0, 1fr) !important; }
  .en-pc-root .en-pc-comment-form { grid-template-columns: 42px minmax(0, 1fr) !important; }
}

/* Large desktop: constrain reading widths while allowing dashboards to breathe. */
@media (min-width: 1440px) {
  .container { max-width: 1380px; }
  .enhub-root { max-width: 1920px; }
  .profile-content { max-width: 1600px; margin-inline: auto; }
}

/* Tablet and down. */
@media (max-width: 1023.98px) {
  .container { max-width: 100%; }
  .page-header { padding-block: clamp(1.25rem, 4vw, 2.25rem); }

  .enhub-shell { grid-template-columns: 1fr !important; }
  .enhub-root .enhub-shell > .enhub-sidebar {
    position: fixed !important;
    z-index: 2147483639 !important;
    inset: calc(var(--en-nav-height) + var(--en-safe-top)) auto 0 0 !important;
    width: min(88vw, 22rem) !important;
    max-height: none !important;
    overflow-y: auto !important;
    border-radius: 0 1.25rem 1.25rem 0 !important;
    transform: translateX(-105%);
    transition: transform .2s ease !important;
    animation: none !important;
    padding-bottom: calc(1rem + var(--en-safe-bottom)) !important;
  }

  .enhub-root.enhub-drawer-open .enhub-sidebar { transform: translateX(0); }

  .enhub-sidebar-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    min-height: var(--en-tap);
    margin-bottom: 1rem;
    border: 1px solid rgba(56, 189, 248, .30);
    border-radius: .875rem;
    padding: .65rem .9rem;
    background: rgba(56, 189, 248, .10);
    color: #eef8ff;
    font-weight: 900;
  }

  .enhub-root.enhub-drawer-open::after {
    content: "";
    position: fixed;
    z-index: 2147483638;
    inset: calc(var(--en-nav-height) + var(--en-safe-top)) 0 0;
    background: rgba(1, 5, 15, .72);
    backdrop-filter: blur(3px);
  }

  .enhub-kanban { grid-template-columns: 1fr !important; }
  .enhub-grid.wide { grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr)); }
  .enhub-main .enhub-btn { min-height: var(--en-tap) !important; }
  .enhub-command-bar {
    max-width: 100%;
    margin-bottom: 1rem !important;
    padding-bottom: .3rem;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: .5rem !important;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline proximity;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
  }
  .enhub-command-bar > * {
    flex: 0 0 auto;
    width: auto !important;
    min-height: var(--en-tap) !important;
    white-space: nowrap;
    scroll-snap-align: start;
  }
}

/* The drawer remains active through Bootstrap's constrained 960px container.
   Full desktop navigation starts at xxl, where all links and account controls fit. */
@media (max-width: 1399.98px) {
  body.en-nav-open { overflow: hidden; }

  /* Keep the drawer's parent stacking context above the page backdrop. */
  body.en-nav-open .navbar-fancy {
    z-index: 2147483642 !important;
  }

  /* The drawer has its own close button; hide the header toggle while open so
     mobile browsers do not render two competing close controls. */
  body.en-nav-open [data-en-nav-toggle] {
    visibility: hidden;
    pointer-events: none;
  }

  .navbar-fancy > .container,
  .navbar-fancy > .container-fluid {
    flex-wrap: nowrap;
    gap: .45rem;
  }

  .navbar-fancy .navbar-collapse {
    position: fixed;
    z-index: 2147483642;
    inset: 0 auto 0 0;
    width: min(88vw, 22rem) !important;
    height: calc(var(--en-vh) * 100);
    max-height: none;
    padding: max(1rem, var(--en-safe-top)) .85rem calc(1rem + var(--en-safe-bottom));
    overflow-y: auto;
    overscroll-behavior: contain;
    background: linear-gradient(180deg, rgba(12, 18, 33, .99), rgba(4, 9, 20, .985));
    border-right: 1px solid rgba(56, 189, 248, .24);
    box-shadow: 1.5rem 0 5rem rgba(0, 0, 0, .58);
    transform: translateX(-104%);
    transition: transform .2s ease;
  }

  .navbar-fancy .navbar-collapse.collapsing {
    display: block;
    height: calc(var(--en-vh) * 100) !important;
  }

  .navbar-fancy .navbar-collapse.show {
    display: block;
    transform: translateX(0);
  }

  .navbar-fancy .navbar-collapse:not(.show):not(.collapsing) { display: block; visibility: hidden; }
  .navbar-fancy .navbar-collapse.show { visibility: visible; }

  .en-nav-drawer-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    margin: 0 0 .75rem;
    padding: 0 .15rem .75rem;
    border-bottom: 1px solid rgba(255, 255, 255, .10);
  }

  .en-nav-drawer-title {
    color: #fff;
    font-size: 1rem;
    font-weight: 950;
    letter-spacing: .02em;
  }

  .en-nav-section-label {
    display: block;
    margin: .9rem .65rem .3rem;
    color: rgba(255, 255, 255, .48);
    font-size: .7rem;
    font-weight: 950;
    letter-spacing: .16em;
    text-transform: uppercase;
  }

  .navbar-fancy .navbar-nav { width: 100%; }
  .navbar-fancy .navbar-nav .nav-item { width: 100%; }
  .navbar-fancy .navbar-nav .nav-link {
    min-height: 48px;
    display: flex;
    align-items: center;
    width: 100%;
    margin: .15rem 0;
    padding: .72rem .8rem;
    border: 1px solid transparent;
    border-radius: .85rem;
    white-space: normal;
  }

  .navbar-fancy .navbar-nav .nav-link.active {
    border-color: rgba(56, 189, 248, .25);
    background: linear-gradient(135deg, rgba(56, 189, 248, .13), rgba(168, 85, 247, .10));
  }

  .navbar-fancy .navbar-nav .dropdown-menu {
    position: static !important;
    width: 100%;
    max-width: none;
    margin: .2rem 0 .55rem;
    transform: none !important;
    box-shadow: none;
  }

  .navbar-fancy .dropdown-item {
    min-height: 44px;
    display: flex;
    align-items: center;
    white-space: normal;
  }

  .en-nav-backdrop {
    position: fixed;
    z-index: 2147483641;
    inset: 0;
    background: rgba(1, 5, 15, .72);
    /* iOS applies backdrop-filter across the nav stacking context and blurs
       the open drawer too. The dimmer keeps contrast without that bug. */
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  body.en-nav-open .en-nav-backdrop { display: block; pointer-events: auto; }
}

/* Tablets and small tablets. */
@media (max-width: 767.98px) {
  :root { --en-nav-height: 56px; }

  body { margin-top: calc(var(--en-nav-height) + var(--en-safe-top)) !important; }

  .container,
  .container-fluid { padding-left: .9rem; padding-right: .9rem; }

  .page-header .title { padding-inline: .9rem; }

  .row { --bs-gutter-x: 1rem; }

  .card,
  base-card,
  .fancy-surface,
  .users-surface,
  .profile-surface,
  .enhub-panel,
  .enhub-card { border-radius: var(--en-radius-md) !important; }

  .modal-dialog {
    width: calc(100vw - 1rem - var(--en-safe-left) - var(--en-safe-right));
    max-width: none;
    margin: max(.5rem, var(--en-safe-top)) auto max(.5rem, var(--en-safe-bottom));
  }

  .modal-content { max-height: calc(var(--en-vh) * 100 - 1rem - var(--en-safe-top) - var(--en-safe-bottom)); }

  .enhub-root { padding: .85rem .65rem calc(1.5rem + var(--en-safe-bottom)) !important; }
  .enhub-shell { gap: .75rem !important; }
  .enhub-hero {
    padding: 1.05rem .95rem !important;
    margin-bottom: .8rem !important;
    border-radius: 1.05rem !important;
  }
  .enhub-hero-inner { gap: .65rem !important; align-items: flex-start !important; }
  .enhub-hero h1 {
    font-size: clamp(1.8rem, 8vw, 2.7rem) !important;
    line-height: 1.03 !important;
    margin: .35rem 0 .45rem !important;
    letter-spacing: -.045em !important;
  }
  .enhub-hero p { font-size: .92rem !important; line-height: 1.45 !important; }
  .enhub-live { margin-top: .15rem !important; }
  .enhub-panel {
    padding: .9rem !important;
    margin-bottom: .75rem !important;
  }
  .enhub-card { padding: .9rem !important; }
  .enhub-section-head {
    align-items: flex-start !important;
    gap: .65rem !important;
    margin-bottom: .85rem !important;
  }
  .enhub-section-head > :first-child { flex: 1 1 14rem; }
  .enhub-section-head > :where(.enhub-btn, .enhub-pill, form) {
    flex: 0 0 auto;
    align-self: flex-start;
  }
  .enhub-section-title { font-size: clamp(1.25rem, 6vw, 1.65rem) !important; }
  .enhub-muted { line-height: 1.4; }
  .enhub-grid,
  .enhub-grid.tight,
  .enhub-grid.wide { gap: .7rem !important; }
  .enhub-stat-card { min-height: 108px !important; padding: .9rem !important; }
  .enhub-stat { font-size: 2.15rem !important; margin-top: .55rem !important; }
  .enhub-stat-sub { margin-top: .45rem !important; }
  .enhub-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: .5rem !important;
  }
  .enhub-actions > .enhub-btn {
    flex: 1 1 10.5rem;
    width: auto !important;
  }
  .enhub-actions > :where(.enhub-input, .enhub-select) { flex: 1 1 12rem; }
  .enhub-form-grid,
  .enhub-mini-form { grid-template-columns: 1fr !important; }
  .enhub-command-bar {
    margin: 0 0 .75rem !important;
    padding-top: 0;
  }
  .enhub-command-bar > * {
    padding-inline: .8rem !important;
  }
  .enhub-user-card {
    grid-template-columns: 42px minmax(0, 1fr) !important;
    gap: .7rem !important;
    padding: .75rem !important;
    border-radius: 1rem !important;
  }
  .enhub-tool-card { padding: .75rem !important; gap: .65rem !important; }

  .profile-hero__row,
  .profile-hero .row { align-items: center; }
  .profile-content { padding-inline: .75rem; }
  .en-profile-section-nav { top: calc(var(--en-nav-height) + var(--en-safe-top) + .35rem); }

  .en-cosmetic-toolbar { grid-template-columns: 1fr; }

  .auth-provider-row {
    display: grid !important;
    grid-template-columns: 1fr;
    gap: .7rem;
  }

  .auth-provider-row > a {
    width: 100%;
    margin: 0 !important;
  }

  .auth-provider-row .btn,
  .auth-provider-row base-button { width: 100%; }

  .store-packages,
  .en-store-grid,
  .server-grid,
  .status-grid,
  .features-grid { grid-template-columns: minmax(0, 1fr) !important; }
}

/* Small phones. */
@media (max-width: 639.98px) {
  :root { --en-tap: 46px; }

  body { font-size: 1rem; }

  .navbar-fancy { padding-inline: .55rem; }
  .navbar-fancy .navbar-brand { max-width: 42vw; }
  .navbar-fancy .navbar-brand img { max-height: 34px !important; }
  .navbar-fancy .btn-outline-custom { padding: .5rem .65rem; white-space: nowrap; }
  .navbar-fancy .en-navbar-notif { width: 42px; height: 42px; }
  .navbar-fancy .avism { width: 40px; height: 40px; }

  .page-header { min-height: 0 !important; }
  .page-header .title,
  .page-header h1 { margin-block: .5rem; }

  .p-4 { padding: 1rem !important; }
  .p-5 { padding: 1.1rem !important; }
  .py-5 { padding-top: 1.5rem !important; padding-bottom: 1.5rem !important; }
  .my-5 { margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; }

  .btn-group:not(.en-keep-inline) {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
  }

  .btn-group:not(.en-keep-inline) > .btn { border-radius: .75rem !important; }

  .input-group.en-mobile-stack { display: grid; grid-template-columns: 1fr; }
  .input-group.en-mobile-stack > * { width: 100%; border-radius: .75rem !important; }

  .en-profile-completion {
    grid-template-columns: 1fr auto;
  }

  .en-profile-completion__bar { grid-column: 1 / -1; grid-row: 2; }

  /* Card table pattern keeps every cell available with a generated label. */
  .en-table-cards { border-collapse: separate !important; border-spacing: 0 .75rem !important; }
  .en-table-cards thead {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
  }
  .en-table-cards tbody,
  .en-table-cards tr,
  .en-table-cards td { display: block !important; width: 100% !important; }
  .en-table-cards tr {
    overflow: hidden;
    margin-bottom: .8rem;
    border: 1px solid rgba(148, 163, 184, .16) !important;
    border-radius: 1rem !important;
    background: rgba(8, 15, 31, .72);
  }
  .en-table-cards td {
    min-height: 2.5rem;
    display: grid !important;
    grid-template-columns: minmax(6.5rem, 38%) minmax(0, 1fr) !important;
    gap: .65rem;
    align-items: start;
    padding: .72rem .8rem !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(148, 163, 184, .10) !important;
    border-radius: 0 !important;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
  }
  .en-table-cards td:last-child { border-bottom: 0 !important; }
  .en-table-cards td::before {
    content: attr(data-en-label);
    color: #91a4bf;
    font-size: .72rem;
    font-weight: 950;
    letter-spacing: .08em;
    text-transform: uppercase;
  }
  .en-table-cards td[colspan] { display: block !important; }
  .en-table-cards td[colspan]::before { display: none; }
  .en-table-cards .btn,
  .en-table-cards button,
  .en-table-cards select { max-width: 100%; }
  .en-table-cards .en-row-actions { display: grid; grid-template-columns: 1fr; gap: .45rem; }

  .en-table-scroll:has(.en-table-cards) { overflow: visible; }
  .en-table-scroll:has(.en-table-cards)::after { display: none; }

  .enhub-table.en-table-cards td:first-child,
  .enhub-table.en-table-cards td:last-child { border-radius: 0 !important; }

  .enhub-grid,
  .enhub-grid.tight,
  .enhub-grid.wide,
  .enhub-log-grid,
  .user-intel-grid,
  .profile-info-grid,
  .activity-timeline,
  .identity-grid-clean,
  .bm-grid-clean { grid-template-columns: minmax(0, 1fr) !important; }

  .task-modal-clean { padding: max(.35rem, var(--en-safe-top)) .35rem max(.35rem, var(--en-safe-bottom)) !important; }
  .task-panel-clean {
    width: calc(100vw - .7rem - var(--en-safe-left) - var(--en-safe-right)) !important;
    height: calc(var(--en-vh) * 100 - .7rem - var(--en-safe-top) - var(--en-safe-bottom)) !important;
    max-height: none !important;
    border-radius: 1rem !important;
  }

  .profile-hero__row { margin-top: -3.25rem !important; }
  .en-pc-avatar-main { width: 92px !important; height: 92px !important; min-width: 92px !important; min-height: 92px !important; }

  .rz-page,
  .enstatus-page,
  .staff-app-wrap { padding-inline: .65rem !important; }

  .changelog-actions,
  .staff-actions,
  .status-actions { display: grid !important; grid-template-columns: 1fr !important; }
}

@media (max-width: 479.98px) {
  .enhub-root { padding-inline: .45rem !important; }
  .enhub-hero { padding: .9rem .8rem !important; }
  .enhub-panel,
  .enhub-card { padding: .75rem !important; }
  .enhub-actions > .enhub-btn { flex-basis: 100%; }
  .enhub-command-bar { margin-inline: -.1rem !important; }

  .profile-content > .container {
    padding-left: .375rem !important;
    padding-right: .375rem !important;
  }

  .profile-surface {
    padding: .5rem !important;
    border-radius: 1rem !important;
  }

  #profile.container-fluid {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .en-pc-root {
    margin: .625rem auto 1.25rem !important;
    padding: 0 .25rem !important;
  }

  .en-pc-root .en-pc-shell {
    padding: .5rem !important;
    border-radius: 1rem !important;
  }

  .en-pc-root .en-pc-card { border-radius: 1rem !important; }
  .en-pc-root .en-pc-banner { height: 180px !important; }
  .en-pc-root .en-pc-card-body { padding: 112px .875rem 1.125rem !important; }
  .en-pc-root .en-pc-identity {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: .75rem !important;
    align-items: center !important;
    text-align: center;
  }
  .en-pc-root .en-pc-avatarbox { margin-inline: auto; }
  .en-pc-root .en-pc-identity > div:last-child {
    width: 100%;
    padding-bottom: 0 !important;
  }
  .en-pc-root .en-pc-identity > div:last-child > div { justify-content: center; }
}

/* Very narrow devices. */
@media (max-width: 359.98px) {
  .navbar-fancy .navbar-brand { max-width: 38vw; }
  .navbar-fancy .btn-outline-custom i { display: none; }
  .container,
  .container-fluid { padding-left: .65rem; padding-right: .65rem; }
  .en-profile-completion { grid-template-columns: 1fr; }
  .en-profile-completion__bar { grid-column: auto; grid-row: auto; }
  .en-table-cards td { grid-template-columns: 1fr !important; gap: .25rem; }
}

@media (orientation: landscape) and (max-height: 560px) {
  .navbar-fancy .navbar-collapse { width: min(72vw, 24rem) !important; }
  .modal-content { max-height: calc(var(--en-vh) * 100 - .5rem); }
  .en-profile-section-nav { position: relative; top: 0; }
}

@media (hover: none) {
  #en-hovercard { display: none !important; }
  .hoverscale:hover,
  .enhub-card:hover,
  .fancy-surface:hover { transform: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }

}

@media (forced-colors: active) {
  :where(a, button, input, select, textarea, summary, [tabindex]):focus-visible { outline: 3px solid Highlight !important; }
  .enhub-pill,
  .badge { border: 1px solid currentColor; }
}
