:root {
  --mib-portal-bg: #080808;
  --mib-portal-surface: #111111;
  --mib-portal-surface-raised: #171717;
  --mib-portal-border: #303036;
  --mib-portal-border-strong: #45454d;
  --mib-portal-gold: #f2b63d;
  --mib-portal-gold-hover: #ffd064;
  --mib-portal-text: #f7f7f7;
  --mib-portal-muted: #a5a5ad;
  --mib-portal-danger: #ef6b6b;
  --mib-portal-success: #54b88a;
}

html,
body.mibBrandTheme,
body.mibBrandTheme.theme-dark,
body.mibBrandTheme.theme-light {
  background: var(--mib-portal-bg) !important;
  color: var(--mib-portal-text) !important;
}

body.mibBrandTheme > main,
body.mibBrandTheme.theme-dark > main,
body.mibBrandTheme.theme-light > main {
  background: var(--mib-portal-bg) !important;
}

html body.mibBrandTheme > main > header {
  min-height: 94px !important;
  padding: 0 28px !important;
  border-bottom: 1px solid var(--mib-portal-border) !important;
  background: #090909 !important;
}

html body.mibBrandTheme .portalHeaderInner {
  width: min(1180px, 100%) !important;
  min-height: 94px !important;
  grid-template-columns: minmax(240px, 1fr) minmax(300px, 1.08fr) minmax(240px, 1fr) !important;
  gap: 24px !important;
}

.portalHeaderActions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.portalPhoneLink,
.portalMobileWebsiteLink {
  color: var(--mib-portal-text) !important;
  font-weight: 800;
  text-decoration: none;
}

.portalPhoneLink {
  padding: 10px 4px;
  font-size: 13px;
}

.portalPhoneLink:is(:hover, :focus-visible) {
  color: var(--mib-portal-gold) !important;
  outline: none;
}

html body.mibBrandTheme .portalWebsiteLink,
.portalMobileWebsiteLink {
  border: 1px solid var(--mib-portal-border-strong) !important;
  border-radius: 4px !important;
  background: var(--mib-portal-surface) !important;
  color: var(--mib-portal-text) !important;
}

html body.mibBrandTheme .portalWebsiteLink:is(:hover, :focus-visible),
.portalMobileWebsiteLink:is(:hover, :focus-visible) {
  border-color: var(--mib-portal-gold) !important;
  background: var(--mib-portal-gold) !important;
  color: #080808 !important;
  outline: none;
}

html body.mibBrandTheme.portalLocked .portalEntryShell {
  display: grid !important;
  grid-template-columns: minmax(0, 1.16fr) minmax(340px, .84fr) !important;
  align-items: start !important;
  gap: 18px !important;
  width: min(1180px, calc(100% - 48px)) !important;
  padding: 34px 0 76px !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide,
html body.mibBrandTheme.portalLocked #manualLookupCard,
html body.mibBrandTheme.portalLocked #portalRegistrationCard {
  border: 1px solid var(--mib-portal-border) !important;
  border-top: 3px solid var(--mib-portal-gold) !important;
  border-radius: 6px !important;
  background: var(--mib-portal-surface) !important;
  color: var(--mib-portal-text) !important;
  box-shadow: none !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide,
html body.mibBrandTheme.portalLocked #manualLookupCard {
  padding: 28px !important;
}

.portalStartLead {
  max-width: 54ch;
  margin: -4px 0 18px !important;
  color: var(--mib-portal-muted) !important;
  font-size: 14px;
  line-height: 1.55;
}

html body.mibBrandTheme.portalLocked #portalStartGuide .portalIntentGrid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide .portalIntentGrid button,
html body.mibBrandTheme.portalLocked #portalStartGuide .portalCommerceLinks button {
  position: relative !important;
  display: grid !important;
  align-content: center !important;
  gap: 5px !important;
  min-width: 0 !important;
  min-height: 76px !important;
  margin: 0 !important;
  padding: 15px 42px 15px 16px !important;
  border: 1px solid var(--mib-portal-border) !important;
  border-radius: 4px !important;
  background: #0d0d0f !important;
  color: var(--mib-portal-text) !important;
  box-shadow: none !important;
  text-align: left !important;
  transform: none !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide .portalIntentGrid button::after,
html body.mibBrandTheme.portalLocked #portalStartGuide .portalCommerceLinks button::after {
  content: "\2192";
  position: absolute;
  top: 50%;
  right: 16px;
  color: var(--mib-portal-gold);
  font-size: 20px;
  line-height: 1;
  transform: translateY(-50%);
}

html body.mibBrandTheme.portalLocked #portalStartGuide .portalIntentGrid button:nth-child(-n+2) {
  border-left: 3px solid var(--mib-portal-gold) !important;
  background: #15130e !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide .portalIntentGrid button:nth-child(5) {
  grid-column: 1 / -1 !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button :is(strong, span) {
  color: var(--mib-portal-text) !important;
  -webkit-text-fill-color: currentColor !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button span {
  color: var(--mib-portal-muted) !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button:is(:hover, :focus-visible),
html body.mibBrandTheme.portalLocked #portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button[aria-pressed="true"],
html body.mibBrandTheme.portalLocked #portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button.is-active {
  border-color: var(--mib-portal-gold) !important;
  background: #1d190f !important;
  color: var(--mib-portal-text) !important;
  outline: 2px solid rgba(242, 182, 61, .16) !important;
  outline-offset: 1px !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button:is(:hover, :focus-visible) :is(strong, span),
html body.mibBrandTheme.portalLocked #portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button[aria-pressed="true"] :is(strong, span),
html body.mibBrandTheme.portalLocked #portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button.is-active :is(strong, span) {
  color: var(--mib-portal-text) !important;
  -webkit-text-fill-color: currentColor !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide .portalCommerceLinks {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin-top: 10px !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide .portalCommerceLinks button {
  min-height: 70px !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide .portalRegisterLink {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  min-height: 50px !important;
  margin-top: 14px !important;
  padding: 12px 15px !important;
  border: 1px solid var(--mib-portal-gold) !important;
  border-radius: 4px !important;
  background: transparent !important;
  color: var(--mib-portal-text) !important;
  text-decoration: none !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide .portalRegisterLink :is(span, strong) {
  color: var(--mib-portal-text) !important;
  -webkit-text-fill-color: currentColor !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide .portalRegisterLink strong {
  color: var(--mib-portal-gold) !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide .portalRegisterLink:is(:hover, :focus-visible) {
  background: var(--mib-portal-gold) !important;
  outline: none !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide .portalRegisterLink:is(:hover, :focus-visible) :is(span, strong) {
  color: #080808 !important;
  -webkit-text-fill-color: #080808 !important;
}

html body.mibBrandTheme.portalLocked #manualLookupCard .lookupBox {
  gap: 11px !important;
}

html body.mibBrandTheme.portalLocked #manualLookupCard #manualLookupBtn,
html body.mibBrandTheme.portalLocked #portalRegistrationCard #portalRegistrationSubmit {
  min-height: 46px !important;
  border-color: var(--mib-portal-gold) !important;
  background: var(--mib-portal-gold) !important;
  color: #080808 !important;
}

html body.mibBrandTheme.portalLocked #manualLookupCard #manualLookupBtn:is(:hover, :focus-visible),
html body.mibBrandTheme.portalLocked #portalRegistrationCard #portalRegistrationSubmit:is(:hover, :focus-visible) {
  background: var(--mib-portal-gold-hover) !important;
  outline: 2px solid rgba(242, 182, 61, .18) !important;
}

html body.mibBrandTheme :is(input, textarea, select) {
  border: 1px solid var(--mib-portal-border-strong) !important;
  border-radius: 4px !important;
  background: #080808 !important;
  color: var(--mib-portal-text) !important;
  box-shadow: none !important;
}

html body.mibBrandTheme :is(input, textarea, select):focus {
  border-color: var(--mib-portal-gold) !important;
  outline: 2px solid rgba(242, 182, 61, .16) !important;
  outline-offset: 1px !important;
}

html body .cookieBar {
  right: auto !important;
  bottom: 12px !important;
  left: 50% !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 16px !important;
  width: min(920px, calc(100% - 32px)) !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  border: 1px solid var(--mib-portal-border-strong) !important;
  border-left: 3px solid var(--mib-portal-gold) !important;
  border-radius: 6px !important;
  background: #111114 !important;
  color: var(--mib-portal-text) !important;
  box-shadow: 0 12px 36px rgba(0, 0, 0, .42) !important;
  transform: translateX(-50%) !important;
}

html body .cookieBar strong {
  color: var(--mib-portal-text) !important;
  font-size: 13px !important;
}

html body .cookieBar p {
  margin: 2px 0 0 !important;
  color: var(--mib-portal-muted) !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
}

html body .cookieBar button {
  width: auto !important;
  min-width: 104px !important;
  min-height: 38px !important;
  margin: 0 !important;
  padding: 8px 14px !important;
  border: 1px solid var(--mib-portal-gold) !important;
  border-radius: 4px !important;
  background: var(--mib-portal-gold) !important;
  color: #080808 !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 1.1 !important;
}

body:has(.cookieBar) #mibFloatingTools {
  bottom: 88px !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu {
  border-right: 1px solid var(--mib-portal-border) !important;
  background: #090909 !important;
  color: var(--mib-portal-text) !important;
  box-shadow: none !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu :is(button, .portalExternalLink, select) {
  border: 1px solid transparent !important;
  border-radius: 4px !important;
  background: transparent !important;
  color: var(--mib-portal-muted) !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu :is(button, .portalExternalLink):is(:hover, :focus-visible),
html body.mibBrandTheme.portalPageMode > aside#sideMenu :is(button, .portalExternalLink).active,
html body.mibBrandTheme.portalPageMode > aside#sideMenu :is(button, .portalExternalLink)[aria-current="page"] {
  border-color: #40381f !important;
  background: #17140d !important;
  color: var(--mib-portal-gold) !important;
  outline: none !important;
}

html body.mibBrandTheme.portalPageMode > main > :is(
  #portalCommandBar,
  #portalSmartPulse,
  #content,
  #accountPanel,
  #instrumentsPanel,
  #purchasesPanel,
  #receiptClaimPanel,
  #walletPanel,
  #messagePanel,
  #wikiPanel,
  #ordersPanel,
  #marketplacePanel,
  #rentalPanel,
  #legalPanel,
  #newRepairPanel
) {
  border-color: var(--mib-portal-border) !important;
  border-radius: 6px !important;
  background: var(--mib-portal-surface) !important;
  color: var(--mib-portal-text) !important;
  box-shadow: none !important;
}

html body.mibBrandTheme.portalPageMode > main :is(
  .stat,
  .repairItem,
  .messageItem,
  .customerOrderCard,
  .purchaseDetail,
  .purchaseList,
  .marketplaceItem,
  .portalPriority,
  .portalContextDock,
  .portalPulseBody,
  .wikiLibraryHead,
  .wikiCard,
  .wikiCardBody,
  .wikiCategories,
  .wikiTip,
  .rentalFormGrid,
  form
) {
  border-color: var(--mib-portal-border) !important;
  border-radius: 5px !important;
  background: #0d0d0f !important;
  color: var(--mib-portal-text) !important;
  box-shadow: none !important;
}

html body.mibBrandTheme.portalPageMode > main :is(h1, h2, h3, h4, strong, b, label) {
  color: var(--mib-portal-text) !important;
}

html body.mibBrandTheme.portalPageMode > main :is(p, span, small, .muted) {
  color: var(--mib-portal-muted) !important;
}

html body.mibBrandTheme.portalPageMode > main :is(.portalEyebrow, .portalPulseTitle, .wikiCardMeta, .wikiCardLink) {
  color: var(--mib-portal-gold) !important;
}

html body.mibBrandTheme.portalPageMode > main button:not(.secondary):not(.menuToggle):not(.portalTextAction):not(.wikiCard):not(.wikiCategory) {
  border-color: #4b3d17 !important;
  border-radius: 4px !important;
  background: #1b170d !important;
  color: var(--mib-portal-text) !important;
  box-shadow: none !important;
}

html body.mibBrandTheme.portalPageMode > main button:not(.secondary):not(.menuToggle):not(.portalTextAction):not(.wikiCard):not(.wikiCategory):is(:hover, :focus-visible) {
  border-color: var(--mib-portal-gold) !important;
  color: var(--mib-portal-gold) !important;
  outline: 2px solid rgba(242, 182, 61, .14) !important;
}

html body.mibBrandTheme.portalPageMode > main :is(#createRepair, #sendMessage, #sendOrderRequest, #sendRentalRequest, #saveInstrumentEntry, #submitReceiptClaim) {
  border-color: var(--mib-portal-gold) !important;
  background: var(--mib-portal-gold) !important;
  color: #080808 !important;
}

html body.mibBrandTheme.portalPageMode #wikiPanel .wikiCategory.active {
  border-color: var(--mib-portal-gold) !important;
  background: var(--mib-portal-gold) !important;
  color: #080808 !important;
}

html body.mibBrandTheme.portalPageMode #wikiPanel .wikiTip {
  border-left: 4px solid var(--mib-portal-gold) !important;
}

html body.mibBrandTheme.portalPageMode #legalPanel > :is(h2, .stat) {
  border-color: var(--mib-portal-border) !important;
  border-top-color: var(--mib-portal-gold) !important;
  background: var(--mib-portal-surface) !important;
  color: var(--mib-portal-text) !important;
  box-shadow: none !important;
}

.portalMobileWebsiteLink {
  display: none;
  min-height: 40px;
  padding: 9px 10px;
  font-size: 12px;
}

@media (max-width: 900px) {
  html body.mibBrandTheme .portalHeaderInner {
    grid-template-columns: minmax(0, 1fr) auto !important;
  }

  html body.mibBrandTheme .portalHeaderActions {
    grid-column: 2;
  }

  html body.mibBrandTheme .portalPhoneLink {
    display: none;
  }

  html body.mibBrandTheme.portalLocked .portalEntryShell {
    grid-template-columns: minmax(0, 1fr) !important;
    width: min(720px, calc(100% - 32px)) !important;
  }
}

@media (max-width: 640px) {
  html body.mibBrandTheme .mobileTopbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 90 !important;
    min-height: 64px !important;
    padding: 0 12px !important;
    border-bottom: 1px solid var(--mib-portal-border) !important;
    background: #090909 !important;
  }

  html body.mibBrandTheme .mobileBrand {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }

  html body.mibBrandTheme .mobileBrand > div {
    overflow: hidden !important;
  }

  html body.mibBrandTheme .mobileBrand :is(strong, span) {
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html body.mibBrandTheme .mobileActions {
    flex: 0 0 auto !important;
    gap: 6px !important;
  }

  .portalMobileWebsiteLink {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  html body.mibBrandTheme.portalLocked #menuToggle {
    display: none !important;
  }

  html body.mibBrandTheme.portalLocked .portalEntryShell {
    width: calc(100% - 24px) !important;
    padding: 16px 0 94px !important;
  }

  html body.mibBrandTheme.portalLocked #portalStartGuide,
  html body.mibBrandTheme.portalLocked #manualLookupCard,
  html body.mibBrandTheme.portalLocked #portalRegistrationCard {
    padding: 20px !important;
  }

  html body.mibBrandTheme.portalLocked #portalStartGuide .portalIntentGrid,
  html body.mibBrandTheme.portalLocked #portalStartGuide .portalCommerceLinks {
    grid-template-columns: 1fr !important;
  }

  html body.mibBrandTheme.portalLocked #portalStartGuide .portalIntentGrid button:nth-child(5) {
    grid-column: auto !important;
  }

  html body.mibBrandTheme.portalLocked #portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button {
    min-height: 66px !important;
    padding: 13px 40px 13px 14px !important;
  }

  html body .cookieBar {
    bottom: 8px !important;
    gap: 8px !important;
    width: calc(100% - 16px) !important;
    padding: 8px 9px !important;
  }

  html body .cookieBar strong {
    font-size: 12px !important;
  }

  html body .cookieBar p {
    display: -webkit-box !important;
    overflow: hidden !important;
    font-size: 10px !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important;
  }

  html body .cookieBar button {
    min-width: 86px !important;
    min-height: 36px !important;
    padding: 7px 9px !important;
    font-size: 12px !important;
  }

  body:has(.cookieBar) #mibFloatingTools {
    bottom: 82px !important;
  }

  html body.mibBrandTheme.menuOpen > aside#sideMenu {
    top: 64px !important;
    min-height: calc(100dvh - 64px) !important;
  }

  html body.mibBrandTheme.menuOpen > aside#sideMenu .navScroll {
    padding-bottom: max(24px, env(safe-area-inset-bottom)) !important;
  }
}

/* Active task follows the public website's single gold primary action. */
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button.active,
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button[aria-pressed="true"] {
  border-color: var(--mib-portal-gold) !important;
  background: var(--mib-portal-gold) !important;
  color: #080808 !important;
  outline: none !important;
}

html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button.active::after,
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button[aria-pressed="true"]::after {
  color: #080808 !important;
}

html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button.active :is(strong, span),
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button[aria-pressed="true"] :is(strong, span),
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button.active *,
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button[aria-pressed="true"] * {
  color: #080808 !important;
  -webkit-text-fill-color: #080808 !important;
}

/* Final light-canvas override after all legacy portal rules. */
html body.mibBrandTheme.theme-light.portalLocked,
html body.mibBrandTheme.theme-light.portalPageMode,
html body.mibBrandTheme.theme-light.portalLocked > main,
html body.mibBrandTheme.theme-light.portalPageMode > main {
  background: #d9dfe1 !important;
  color: #162024 !important;
}

/* Keep the optional light mode readable after the legacy portal theme rules. */
html body.mibBrandTheme.theme-light.portalLocked,
html body.mibBrandTheme.theme-light.portalPageMode {
  background: #d9dfe1 !important;
  color: #162024 !important;
}

html body.mibBrandTheme.theme-light.portalLocked > main,
html body.mibBrandTheme.theme-light.portalPageMode > main {
  background: #d9dfe1 !important;
  color: #162024 !important;
}

/* v20260923-08: final customer portal frame and touch navigation. */
html body.mibBrandTheme {
  --mib-portal-bg: #101416;
  --mib-portal-surface: #171d20;
  --mib-portal-raised: #1d2529;
  --mib-portal-line: #344249;
  --mib-portal-text: #edf2f3;
  --mib-portal-muted: #a6b2b7;
  --mib-portal-gold: #f0bf59;
  --mib-portal-cyan: #5dd9ed;
  background: var(--mib-portal-bg) !important;
  color: var(--mib-portal-text) !important;
}

html body.mibBrandTheme :is(button, a, input, textarea, select) {
  -webkit-tap-highlight-color: transparent;
}

html body.mibBrandTheme.portalLocked > main,
html body.mibBrandTheme.portalPageMode > main {
  background: var(--mib-portal-bg) !important;
  color: var(--mib-portal-text) !important;
}

html body.mibBrandTheme :is(.portalHeaderInner, .mobileTopbar) {
  border-color: var(--mib-portal-line) !important;
}

html body.mibBrandTheme :is(.portalHeaderActions .menuToggle, .mobileActions .menuToggle, #portalDesktopMenuToggle) {
  border: 1px solid var(--mib-portal-line) !important;
  border-radius: 6px !important;
  background: var(--mib-portal-raised) !important;
  color: var(--mib-portal-text) !important;
}

html body.mibBrandTheme :is(.portalHeaderActions .portalWebsiteLink, .mobileActions #menuToggle) {
  border: 1px solid #b68c3e !important;
  border-radius: 6px !important;
  background: var(--mib-portal-gold) !important;
  color: #101416 !important;
  font-weight: 800 !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu {
  background: #141a1d !important;
  border-right: 1px solid var(--mib-portal-line) !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu :is(.portalNavBrand strong, .portalNavBrand span) {
  color: var(--mib-portal-text) !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu .navScroll :is(summary, button, a) {
  border-color: transparent !important;
  color: var(--mib-portal-muted) !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu .navScroll :is(summary:hover, button:hover, a:hover),
html body.mibBrandTheme.portalPageMode > aside#sideMenu .navScroll :is(summary[aria-current="page"], button.navActive, button[aria-current="page"]) {
  background: #1f3035 !important;
  color: var(--mib-portal-cyan) !important;
}

html body.mibBrandTheme.portalPageMode > main > header {
  background: #12181b !important;
  border-bottom: 1px solid var(--mib-portal-line) !important;
}

html body.mibBrandTheme.portalPageMode > main > header :is(h1, h2, h3, p, span, small) {
  color: var(--mib-portal-text) !important;
}

html body.mibBrandTheme.portalPageMode > main > header :is(p, small) {
  color: var(--mib-portal-muted) !important;
}

html body.mibBrandTheme.portalPageMode :is(.card, section, .panel, .customerHubCard, .dashboardCard) {
  border-color: var(--mib-portal-line) !important;
  background: var(--mib-portal-surface) !important;
  color: var(--mib-portal-text) !important;
  box-shadow: none !important;
}

html body.mibBrandTheme.portalPageMode :is(h1, h2, h3, h4, strong, b, label) {
  color: var(--mib-portal-text) !important;
}

html body.mibBrandTheme.portalPageMode :is(p, small, .muted, .small, dt) {
  color: var(--mib-portal-muted) !important;
}

html body.mibBrandTheme.portalPageMode :is(input, textarea, select) {
  border: 1px solid var(--mib-portal-line) !important;
  border-radius: 5px !important;
  background: #0d1315 !important;
  color: var(--mib-portal-text) !important;
}

html body.mibBrandTheme.portalPageMode :is(button, a[role="button"]) {
  border-radius: 5px !important;
}

/* Logged-in mobile navigation: compact, colourful and horizontally swipeable. */
@media (max-width: 760px) {
  html body.mibBrandTheme.portalPageMode {
    padding-bottom: calc(78px + env(safe-area-inset-bottom)) !important;
  }

  html body.mibBrandTheme.portalPageMode #customerQuickNav {
    display: flex !important;
    align-items: stretch !important;
    gap: 4px !important;
    min-height: 70px !important;
    padding: 6px 8px max(6px, env(safe-area-inset-bottom)) !important;
    background: #0d1316 !important;
    border-top: 1px solid var(--mib-portal-line) !important;
    box-shadow: 0 -8px 22px rgba(0, 0, 0, .22) !important;
    overflow-x: auto !important;
    touch-action: pan-x !important;
  }

  html body.mibBrandTheme.portalPageMode #customerQuickNav button {
    flex: 0 0 72px !important;
    min-width: 72px !important;
    min-height: 58px !important;
    padding: 4px 3px !important;
    border: 1px solid transparent !important;
    border-radius: 7px !important;
    background: transparent !important;
    color: #aab6bb !important;
    font-size: 10px !important;
    line-height: 1.15 !important;
  }

  html body.mibBrandTheme.portalPageMode #customerQuickNav .customerNavIcon {
    display: grid !important;
    width: 34px !important;
    height: 30px !important;
    place-items: center !important;
    border: 1px solid currentColor !important;
    border-radius: 7px !important;
    background: color-mix(in srgb, currentColor 16%, #111719) !important;
    color: inherit !important;
    font-size: 17px !important;
    font-weight: 800 !important;
  }

  html body.mibBrandTheme.portalPageMode #customerQuickNav button:nth-child(1) { color: #5dd9ed !important; }
  html body.mibBrandTheme.portalPageMode #customerQuickNav button:nth-child(2) { color: #f0bf59 !important; }
  html body.mibBrandTheme.portalPageMode #customerQuickNav button:nth-child(3) { color: #7db5ff !important; }
  html body.mibBrandTheme.portalPageMode #customerQuickNav button:nth-child(4) { color: #7ed69b !important; }
  html body.mibBrandTheme.portalPageMode #customerQuickNav button:nth-child(5) { color: #c0a4ff !important; }
  html body.mibBrandTheme.portalPageMode #customerQuickNav button:nth-child(6) { color: #d2dde1 !important; }

  html body.mibBrandTheme.portalPageMode #customerQuickNav button[aria-current="page"] {
    background: #1f3035 !important;
    border-color: currentColor !important;
    color: var(--mib-portal-text) !important;
  }

  html body.mibBrandTheme.portalPageMode #customerQuickNav button[aria-current="page"] .customerNavIcon {
    background: currentColor !important;
    color: #101416 !important;
  }

  html body.mibBrandTheme.portalPageMode .mobileTopbar {
    min-height: 58px !important;
    padding: 8px 12px !important;
    background: #12181b !important;
  }

  html body.mibBrandTheme #cookieConsent {
    inset: auto 12px calc(78px + env(safe-area-inset-bottom)) 12px !important;
    transform: none !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    border: 1px solid var(--mib-portal-line) !important;
    border-radius: 6px !important;
    background: #171d20 !important;
    color: var(--mib-portal-text) !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .35) !important;
  }

  html body.mibBrandTheme #cookieConsent :is(p, span, strong, button, a) {
    color: var(--mib-portal-text) !important;
  }
}

/* The light switch stays usable without reverting to a white, low-contrast portal. */
html body.mibBrandTheme.theme-light {
  --mib-portal-bg: #d9dfe1;
  --mib-portal-surface: #eef1f2;
  --mib-portal-raised: #e3e8e9;
  --mib-portal-line: #9aa9ae;
  --mib-portal-text: #162024;
  --mib-portal-muted: #425257;
  --mib-portal-gold: #a87411;
  --mib-portal-cyan: #0d788c;
}

html body.mibBrandTheme.theme-light.portalLocked,
html body.mibBrandTheme.theme-light.portalPageMode,
html body.mibBrandTheme.theme-light.portalLocked > main,
html body.mibBrandTheme.theme-light.portalPageMode > main {
  background: var(--mib-portal-bg) !important;
  color: var(--mib-portal-text) !important;
}

html body.mibBrandTheme.theme-light.portalPageMode > aside#sideMenu,
html body.mibBrandTheme.theme-light.portalPageMode > main > header,
html body.mibBrandTheme.theme-light.portalPageMode #customerQuickNav {
  background: #e7ecee !important;
}

html body.mibBrandTheme.theme-light.portalPageMode > main > header :is(h1, h2, h3, p, span, small),
html body.mibBrandTheme.theme-light.portalPageMode > aside#sideMenu :is(strong, span, summary, button, a),
html body.mibBrandTheme.theme-light.portalPageMode #customerQuickNav button {
  color: var(--mib-portal-text) !important;
}

html body.mibBrandTheme.theme-light.portalPageMode :is(input, textarea, select) {
  background: #f3f5f5 !important;
  color: #162024 !important;
}

/* Signed-in portal: replace the legacy blue POS shell with the public MIB language. */
html body.mibBrandTheme.theme-dark.portalPageMode,
html body.mibBrandTheme.portalPageMode {
  --portal-pos-bg: #080808 !important;
  --portal-pos-surface: #111111 !important;
  --portal-pos-surface-2: #0d0d0f !important;
  --portal-pos-border: #303036 !important;
  --portal-pos-text: #f7f7f7 !important;
  --portal-pos-muted: #a5a5ad !important;
  --portal-led: #f2b63d !important;
  --portal-led-text: #080808 !important;
  display: grid !important;
  grid-template-columns: 228px minmax(0, 1fr) !important;
  min-height: 100vh !important;
  background: #080808 !important;
  color: var(--portal-pos-text) !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu {
  position: sticky !important;
  inset: auto !important;
  top: 0 !important;
  z-index: 70 !important;
  display: flex !important;
  flex: none !important;
  width: 228px !important;
  min-width: 228px !important;
  height: 100vh !important;
  padding: 14px 10px 16px !important;
  overflow: hidden !important;
  border: 0 !important;
  border-right: 1px solid var(--portal-pos-border) !important;
  background: #090909 !important;
  color: var(--portal-pos-text) !important;
  box-shadow: none !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu > :is(img, h1, .sub) {
  display: none !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu #navStatus {
  margin-top: 0 !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu .navScroll {
  min-height: 0 !important;
  padding-right: 2px !important;
  overflow-y: auto !important;
  scrollbar-width: thin !important;
  scrollbar-color: #4b3d17 transparent !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu :is(button, .portalExternalLink, select) {
  width: 100% !important;
  min-height: 40px !important;
  margin: 0 0 4px !important;
  padding: 9px 11px !important;
  border: 1px solid transparent !important;
  border-radius: 4px !important;
  background: transparent !important;
  color: var(--portal-pos-muted) !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 750 !important;
  line-height: 1.25 !important;
  text-align: left !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu :is(button, .portalExternalLink):is(:hover, :focus-visible) {
  border-color: #40381f !important;
  background: #15130e !important;
  color: var(--portal-led) !important;
  outline: none !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu button.navActive,
html body.mibBrandTheme.portalPageMode > aside#sideMenu button[aria-current="page"] {
  border-color: #4b3d17 !important;
  border-left: 3px solid var(--portal-led) !important;
  background: #17140d !important;
  color: var(--portal-led) !important;
}

html body.mibBrandTheme.portalPageMode > aside#sideMenu #mibPortalLogout {
  border-color: #4b3d17 !important;
  color: var(--portal-led) !important;
}

html body.mibBrandTheme.portalPageMode > main {
  grid-column: 2 !important;
  width: auto !important;
  min-width: 0 !important;
  min-height: 100vh !important;
  padding: 0 0 34px !important;
  background: #080808 !important;
  color: var(--portal-pos-text) !important;
}

html body.mibBrandTheme.portalPageMode > main > header {
  display: block !important;
  min-height: 88px !important;
  padding: 0 22px !important;
  border-bottom: 1px solid var(--portal-pos-border) !important;
  background: #090909 !important;
  color: var(--portal-pos-text) !important;
}

html body.mibBrandTheme.portalPageMode > main > header .portalHeaderInner {
  width: min(1320px, 100%) !important;
  min-height: 88px !important;
  grid-template-columns: minmax(220px, .85fr) minmax(260px, 1fr) minmax(330px, 1fr) !important;
  gap: 22px !important;
}

html body.mibBrandTheme.portalPageMode > main > header .portalBrandMark {
  display: inline-flex !important;
}

html body.mibBrandTheme.portalPageMode > main > header .portalBrandMark img {
  width: 42px !important;
  height: 42px !important;
}

html body.mibBrandTheme.portalPageMode > main > header #pageTitle {
  font-size: clamp(25px, 2.2vw, 32px) !important;
  line-height: 1.08 !important;
}

html body.mibBrandTheme.portalPageMode > main > header #pageSub {
  margin-top: 5px !important;
  color: var(--portal-pos-muted) !important;
  font-size: 13px !important;
  text-shadow: none !important;
}

html body.mibBrandTheme.portalPageMode > main > header .portalHeaderActions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  min-width: 0 !important;
}

html body.mibBrandTheme.portalPageMode > main > header :is(.portalPhoneLink, .portalWebsiteLink, #mibPortalLogout) {
  width: auto !important;
  min-height: 40px !important;
  margin: 0 !important;
  padding: 10px 13px !important;
  border-radius: 4px !important;
  font-size: 13px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

html body.mibBrandTheme.portalPageMode > main > #portalCommandBar.portalCommandBar {
  width: min(1280px, calc(100% - 32px)) !important;
  margin: 18px auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--portal-pos-text) !important;
  box-shadow: none !important;
}

html body.mibBrandTheme.portalPageMode #portalCommandBar .portalWelcomeRow {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 10px !important;
}

html body.mibBrandTheme.portalPageMode #portalCommandBar :is(.portalWelcomeCopy, .portalPriority) {
  min-width: 0 !important;
  min-height: 136px !important;
  margin: 0 !important;
  padding: 18px 20px !important;
  border: 1px solid var(--portal-pos-border) !important;
  border-left: 3px solid #4b3d17 !important;
  border-radius: 6px !important;
  background: var(--portal-pos-surface) !important;
  color: var(--portal-pos-text) !important;
  box-shadow: none !important;
}

html body.mibBrandTheme.portalPageMode #portalCommandBar .portalWelcomeCopy {
  border-left-color: var(--portal-led) !important;
}

html body.mibBrandTheme.portalPageMode #portalCommandBar .portalWelcomeCopy h2 {
  margin: 5px 0 7px !important;
  color: var(--portal-pos-text) !important;
  font-size: clamp(24px, 2vw, 30px) !important;
  line-height: 1.12 !important;
}

html body.mibBrandTheme.portalPageMode #portalCommandBar :is(.portalWelcomeCopy, .portalPriority) p {
  margin: 0 !important;
  color: var(--portal-pos-muted) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

html body.mibBrandTheme.portalPageMode #portalCommandBar .portalPriority > span {
  color: var(--portal-led) !important;
  font-size: 11px !important;
  font-weight: 850 !important;
  text-transform: uppercase !important;
}

html body.mibBrandTheme.portalPageMode #portalCommandBar .portalPriority > strong {
  margin-top: 7px !important;
  color: var(--portal-pos-text) !important;
  font-size: 19px !important;
  line-height: 1.25 !important;
}

html body.mibBrandTheme.portalPageMode #portalCommandBar .portalPriority > button {
  min-height: 40px !important;
  margin: 10px 0 0 !important;
  padding: 9px 13px !important;
  border: 1px solid #4b3d17 !important;
  border-radius: 4px !important;
  background: #17140d !important;
  color: var(--portal-led) !important;
  box-shadow: none !important;
}

html body.mibBrandTheme.portalPageMode #portalCommandBar .portalCommandMetrics {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 0 !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 10px !important;
  overflow: hidden !important;
  border: 1px solid var(--portal-pos-border) !important;
  border-radius: 6px !important;
  background: #0d0d0f !important;
}

html body.mibBrandTheme.portalPageMode #portalCommandBar .portalCommandMetrics > span {
  display: flex !important;
  align-items: baseline !important;
  gap: 7px !important;
  min-width: 0 !important;
  min-height: 58px !important;
  padding: 13px 15px !important;
  border: 0 !important;
  border-right: 1px solid var(--portal-pos-border) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--portal-pos-muted) !important;
}

html body.mibBrandTheme.portalPageMode #portalCommandBar .portalCommandMetrics > span:last-child {
  border-right: 0 !important;
}

html body.mibBrandTheme.portalPageMode #portalCommandBar .portalCommandMetrics b {
  color: var(--portal-pos-text) !important;
  font-size: 20px !important;
  line-height: 1 !important;
  overflow-wrap: anywhere !important;
}

html body.mibBrandTheme.portalPageMode #portalCommandBar :is(.portalContextDock, .portalContextStrip) {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 13px 15px !important;
  border: 1px solid var(--portal-pos-border) !important;
  border-radius: 6px !important;
  background: #0d0d0f !important;
  color: var(--portal-pos-text) !important;
  box-shadow: none !important;
}

html body.mibBrandTheme.portalPageMode > main > :is(
  #content,
  #accountPanel,
  #instrumentsPanel,
  #purchasesPanel,
  #receiptClaimPanel,
  #walletPanel,
  #messagePanel,
  #wikiPanel,
  #ordersPanel,
  #marketplacePanel,
  #rentalPanel,
  #legalPanel,
  #newRepairPanel
) {
  width: min(1280px, calc(100% - 32px)) !important;
  min-height: 0 !important;
  margin: 14px auto 0 !important;
  padding: 20px !important;
  border: 1px solid var(--portal-pos-border) !important;
  border-top: 3px solid var(--portal-led) !important;
  border-radius: 6px !important;
  background: var(--portal-pos-surface) !important;
  color: var(--portal-pos-text) !important;
  box-shadow: none !important;
}

html body.mibBrandTheme.portalPageMode > main > :is(
  #content,
  #accountPanel,
  #instrumentsPanel,
  #purchasesPanel,
  #receiptClaimPanel,
  #walletPanel,
  #messagePanel,
  #wikiPanel,
  #ordersPanel,
  #marketplacePanel,
  #rentalPanel,
  #legalPanel,
  #newRepairPanel
) :is(.stat, .repairItem, .purchaseRow, .customerOrderCard, .rentalRequestCard, .wallet, form, .purchaseList, .purchaseDetail) {
  border-color: var(--portal-pos-border) !important;
  border-radius: 5px !important;
  background: #0d0d0f !important;
  color: var(--portal-pos-text) !important;
  box-shadow: none !important;
}

html body.mibBrandTheme.portalPageMode #accountSummary .stat {
  min-height: 94px !important;
  padding: 14px !important;
}

html body.mibBrandTheme.portalPageMode #accountSummary .stat > strong {
  font-size: 24px !important;
}

@media (max-width: 1040px) {
  html body.mibBrandTheme.portalPageMode {
    grid-template-columns: 204px minmax(0, 1fr) !important;
  }

  html body.mibBrandTheme.portalPageMode > aside#sideMenu {
    width: 204px !important;
    min-width: 204px !important;
  }

  html body.mibBrandTheme.portalPageMode > main > header .portalHeaderInner {
    grid-template-columns: minmax(0, 1fr) auto !important;
  }

  html body.mibBrandTheme.portalPageMode > main > header .portalBrandMark {
    display: none !important;
  }

  html body.mibBrandTheme.portalPageMode #portalCommandBar .portalCommandMetrics {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }

  html body.mibBrandTheme.portalPageMode #portalCommandBar .portalCommandMetrics > span:nth-child(3) {
    border-right: 0 !important;
  }
}

@media (max-width: 760px) {
  html body.mibBrandTheme.theme-dark.portalPageMode,
  html body.mibBrandTheme.portalPageMode {
    display: block !important;
    grid-template-columns: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    overflow-x: hidden !important;
  }

  html body.mibBrandTheme.portalPageMode > aside#sideMenu {
    position: fixed !important;
    inset: 0 auto 0 0 !important;
    z-index: 95 !important;
    display: block !important;
    width: min(310px, 88vw) !important;
    min-width: 0 !important;
    height: 100dvh !important;
    padding: 76px 12px 20px !important;
    overflow-y: auto !important;
    transform: translateX(-105%) !important;
    transition: transform 180ms ease !important;
  }

  html body.mibBrandTheme.portalPageMode.menuOpen > aside#sideMenu {
    transform: translateX(0) !important;
  }

  html body.mibBrandTheme.portalPageMode > main {
    position: relative !important;
    inset: auto !important;
    grid-column: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    transform: none !important;
    overflow-x: hidden !important;
  }

  html body.mibBrandTheme.portalPageMode .mobileTopbar {
    position: sticky !important;
    top: 0 !important;
    z-index: 100 !important;
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    min-height: 64px !important;
    padding: 0 12px !important;
    border-bottom: 1px solid var(--portal-pos-border) !important;
    background: #090909 !important;
  }

  html body.mibBrandTheme.portalPageMode > main > header {
    display: none !important;
  }

  html body.mibBrandTheme.portalPageMode #portalCommandBar .portalWelcomeRow {
    grid-template-columns: 1fr !important;
  }

  html body.mibBrandTheme.portalPageMode #portalCommandBar :is(.portalWelcomeCopy, .portalPriority) {
    min-height: 0 !important;
  }

  html body.mibBrandTheme.portalPageMode #portalCommandBar .portalCommandMetrics {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  html body.mibBrandTheme.portalPageMode #portalCommandBar .portalCommandMetrics > span,
  html body.mibBrandTheme.portalPageMode #portalCommandBar .portalCommandMetrics > span:nth-child(3) {
    border-right: 1px solid var(--portal-pos-border) !important;
    border-bottom: 1px solid var(--portal-pos-border) !important;
  }

  html body.mibBrandTheme.portalPageMode #portalCommandBar .portalCommandMetrics > span:nth-child(even) {
    border-right: 0 !important;
  }

  html body.mibBrandTheme.portalPageMode #portalCommandBar .portalCommandMetrics > span:last-child {
    grid-column: 1 / -1 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
  }

  html body.mibBrandTheme.portalPageMode > main > :is(
    #content,
    #accountPanel,
    #instrumentsPanel,
    #purchasesPanel,
    #receiptClaimPanel,
    #walletPanel,
    #messagePanel,
    #wikiPanel,
    #ordersPanel,
    #marketplacePanel,
    #rentalPanel,
    #legalPanel,
    #newRepairPanel
  ),
  html body.mibBrandTheme.portalPageMode > main > #portalCommandBar.portalCommandBar {
    width: calc(100% - 20px) !important;
    margin-top: 10px !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
  }
}

html body.mibBrandTheme.portalLocked #manualLookupCard #portalIntentSelection {
  min-height: 38px !important;
  margin: 12px 0 0 !important;
  padding: 10px 12px !important;
  border: 1px solid #40381f !important;
  border-left: 3px solid var(--mib-portal-gold) !important;
  border-radius: 4px !important;
  background: #17140d !important;
  color: var(--mib-portal-muted) !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

html body.mibBrandTheme.portalLocked #portalStartGuide .portalHelpLine a {
  color: var(--mib-portal-gold) !important;
}

html body.mibBrandTheme #mibAiToggle,
html body.mibBrandTheme .mibAiFab {
  border: 1px solid #55471e !important;
  background: #111114 !important;
  color: var(--mib-portal-gold) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .38) !important;
}

html body.mibBrandTheme #mibAiToggle:is(:hover, :focus-visible),
html body.mibBrandTheme .mibAiFab:is(:hover, :focus-visible) {
  border-color: var(--mib-portal-gold) !important;
  background: var(--mib-portal-gold) !important;
  color: #080808 !important;
  outline: 2px solid rgba(242, 182, 61, .16) !important;
}

@media (max-width: 380px) {
  .portalMobileWebsiteLink {
    width: 40px;
    overflow: hidden;
    color: transparent !important;
  }

  .portalMobileWebsiteLink::before {
    content: "MIB";
    color: var(--mib-portal-gold);
    font-size: 11px;
  }
}

@media (prefers-reduced-motion: no-preference) {
  html body.mibBrandTheme :is(button, a, input, textarea, select) {
    transition: border-color 160ms ease, background-color 160ms ease, color 160ms ease, transform 160ms ease;
  }

  html body.mibBrandTheme.portalLocked #portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button:is(:hover, :focus-visible) {
    transform: translateY(-1px) !important;
  }
}

/* Final override for the legacy five-color module cards. */
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button,
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button:nth-child(1),
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button:nth-child(2),
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button:nth-child(3),
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button:nth-child(4),
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button:nth-child(5) {
  min-height: 76px !important;
  padding: 15px 42px 15px 16px !important;
  border: 1px solid var(--mib-portal-border) !important;
  border-radius: 4px !important;
  background: #0d0d0f !important;
  color: var(--mib-portal-text) !important;
  box-shadow: none !important;
  filter: none !important;
}

html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button:nth-child(-n+2) {
  border-left: 3px solid var(--mib-portal-gold) !important;
  background: #15130e !important;
}

html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button :is(strong, span),
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button * {
  color: var(--mib-portal-text) !important;
  -webkit-text-fill-color: var(--mib-portal-text) !important;
}

html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button span {
  color: var(--mib-portal-muted) !important;
  -webkit-text-fill-color: var(--mib-portal-muted) !important;
}

html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button:is(:hover, :focus-visible),
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button[aria-pressed="true"],
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button.is-active {
  border-color: var(--mib-portal-gold) !important;
  background: #1d190f !important;
  outline: 2px solid rgba(242, 182, 61, .16) !important;
}

@media (max-width: 640px) {
  html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid {
    grid-template-columns: 1fr !important;
  }

  html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button,
  html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide .portalIntentGrid button:nth-child(5) {
    min-height: 66px !important;
    padding: 13px 40px 13px 14px !important;
  }
}

html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button.active,
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button[aria-pressed="true"] {
  border-color: var(--mib-portal-gold) !important;
  background: var(--mib-portal-gold) !important;
  color: #080808 !important;
  outline: none !important;
}

html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button.active::after,
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button[aria-pressed="true"]::after,
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button.active :is(strong, span),
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button[aria-pressed="true"] :is(strong, span),
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button.active *,
html body.mibBrandTheme.portalLocked #portalEntryShell.portalEntryShell #portalStartGuide.portalStartGuide :is(.portalIntentGrid, .portalCommerceLinks) button[aria-pressed="true"] * {
  color: #080808 !important;
  -webkit-text-fill-color: #080808 !important;
}

/* Final light-canvas override after all legacy portal rules. */
html body.mibBrandTheme.theme-light.portalLocked,
html body.mibBrandTheme.theme-light.portalPageMode,
html body.mibBrandTheme.theme-light.portalLocked > main,
html body.mibBrandTheme.theme-light.portalPageMode > main {
  background: #d9dfe1 !important;
  color: #162024 !important;
}