:root {
  color-scheme: light;
  --admin-critical-ink: #122033;
  --admin-critical-muted: #5b6878;
  --admin-critical-line: #dce3eb;
  --admin-critical-page: #f4f7fb;
  --admin-critical-surface: #fff;
  --admin-critical-primary: #0b5d52;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html, body { min-width: 0; margin: 0; padding: 0; }
body { min-height: 100vh; overflow-x: clip; background: var(--admin-critical-page); color: var(--admin-critical-ink); font-family: var(--font-body); }
button, input { font: inherit; }
/* EWX-PERF-002: exact Browser evidence binds this shell and every visible card child to the visual viewport. */
.login-screen { position: fixed; inset: 0; display: flex; min-height: 100vh; width: auto; inline-size: auto; min-width: 0; align-items: center; justify-content: center; padding: 20px; overflow-x: hidden; overflow-y: auto; }
.login-card { width: min(430px, 100%); inline-size: min(430px, 100%); max-width: 100%; max-inline-size: 100%; min-width: 0; margin-inline: auto; padding: 28px; border: 1px solid var(--admin-critical-line); border-radius: 18px; background: var(--admin-critical-surface); box-shadow: 0 18px 44px rgb(18 32 51 / 10%); }
.login-brand-lockup { display: block; width: min(100%, 344px); height: auto; max-height: 104px; margin: 0 auto 18px; object-fit: contain; }
.login-card h1 { margin: 0 0 8px; text-align: center; font-size: clamp(1.45rem, 5vw, 2rem); }
.login-card .field { display: grid; gap: 6px; margin: 0 0 14px; }
.login-card label { color: var(--admin-critical-muted); font-size: .875rem; font-weight: 650; }
.login-card input { width: 100%; min-width: 0; min-height: 44px; padding: 10px 12px; border: 1px solid var(--admin-critical-line); border-radius: 12px; background: #fff; color: inherit; }
.login-card button { min-height: 44px; border: 0; border-radius: 12px; padding: 10px 14px; background: var(--admin-critical-primary); color: #fff; font-weight: 700; }
.login-card a { color: var(--admin-critical-primary); }
.cell-sub { color: var(--admin-critical-muted); }
.app-shell { min-height: 100vh; min-width: 0; max-width: 100vw; overflow-x: clip; }
.sidebar, .main, .content { min-width: 0; max-width: 100%; }
.topbar[data-horizontal-containment-track="admin-header"],
.topbar[data-horizontal-containment-track="admin-header"] .topbar-title-block,
.topbar[data-horizontal-containment-track="admin-header"] .topbar-title-block > div,
.topbar[data-horizontal-containment-track="admin-header"] .topbar-right {
  box-sizing: border-box;
  max-inline-size: 100%;
  min-inline-size: 0;
}
.topbar[data-horizontal-containment-track="admin-header"] :where(h1, .sub, .admin-breadcrumbs, .topbar-search-placeholder, .topbar-alert-placeholder, .store-pill, .admin-identity) {
  max-inline-size: 100%;
  min-inline-size: 0;
}
.topbar[data-horizontal-containment-track="admin-header"] :where(h1, .sub, .admin-breadcrumbs, .topbar-search-placeholder strong, .topbar-alert-placeholder span, .topbar-alert-placeholder small, .store-pill, .admin-identity) {
  overflow-wrap: anywhere;
}
#section-platform_admin,
#section-platform_admin * { min-inline-size: 0; }
#section-platform_admin :where(h1, h2, h3, h4, p, a, button, span, small, strong, code, .value, .cell-sub) {
  max-inline-size: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}
#admin-main .platform-local-subnav {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  overflow-x: hidden !important;
  scroll-snap-type: none !important;
}
#admin-main .platform-local-subnav > button {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  white-space: normal !important;
}
@media (max-width: 900px) {
  #admin-main .platform-local-subnav { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 1040px) {
  .app-shell:not(.sidebar-open) .sidebar { visibility: hidden !important; }
  .app-shell.sidebar-open .sidebar { visibility: visible !important; }
}
@media (max-width: 1360px) {
  .topbar[data-horizontal-containment-track="admin-header"] {
    align-items: stretch !important;
    flex-direction: column !important;
    gap: 12px !important;
    inline-size: 100% !important;
  }
  .topbar[data-horizontal-containment-track="admin-header"] .topbar-title-block,
  .topbar[data-horizontal-containment-track="admin-header"] .topbar-right {
    inline-size: 100% !important;
  }
  .topbar[data-horizontal-containment-track="admin-header"] .topbar-right {
    flex-wrap: wrap !important;
  }
}
@media (min-width: 1361px) {
  .topbar[data-horizontal-containment-track="admin-header"] {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 12px !important;
  }
  .topbar[data-horizontal-containment-track="admin-header"] .topbar-title-block,
  .topbar[data-horizontal-containment-track="admin-header"] .topbar-right {
    inline-size: min(100%, 34rem) !important;
    max-inline-size: 34rem !important;
    min-inline-size: 0 !important;
  }
  .topbar[data-horizontal-containment-track="admin-header"] .topbar-right {
    align-items: center !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
  }
  .topbar[data-horizontal-containment-track="admin-header"] .topbar-right > * {
    max-inline-size: 100% !important;
    min-inline-size: 0 !important;
  }
  .topbar[data-horizontal-containment-track="admin-header"] .topbar-search-placeholder strong {
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
  }
}
@media (max-width: 760px) {
  .topbar[data-horizontal-containment-track="admin-header"] .topbar-title-block > div {
    inline-size: 100% !important;
  }
  .topbar[data-horizontal-containment-track="admin-header"] .sub {
    display: block !important;
    -webkit-line-clamp: unset !important;
    overflow: visible !important;
    white-space: normal !important;
    word-break: break-word;
  }
  .topbar[data-horizontal-containment-track="admin-header"] .topbar-right {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    justify-content: stretch !important;
  }
  .topbar[data-horizontal-containment-track="admin-header"] .topbar-alert-placeholder,
  .topbar[data-horizontal-containment-track="admin-header"] .topbar-search-placeholder {
    grid-column: 1 / -1 !important;
    inline-size: 100% !important;
  }
  .topbar[data-horizontal-containment-track="admin-header"] .topbar-search-placeholder strong {
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
  }
}
@media (max-width: 480px) {
  .login-screen { padding: 12px; }
  .login-card { width: 100%; inline-size: 100%; max-width: 100%; max-inline-size: 100%; padding: 20px 16px; border-radius: 14px; }
  #admin-main .dashboard-metrics {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
    overflow-x: hidden !important;
    scroll-snap-type: none !important;
  }
  #admin-main .dashboard-metrics > .dashboard-metric-card {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    scroll-snap-align: none !important;
  }
  #admin-main #section-platform_admin { overflow-x: visible !important; }
  #admin-main .platform-local-subnav {
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    box-sizing: border-box !important;
  }
}
