/* Approved button relief: preserve existing dimensions, colors and behavior. */
:root[data-relief="on"] button:not(:where(.brand, .main-menu-logo-button, .aurum-mascot-button, #mainUserDropdown button, #brandDropdown button)) {
  --oa-button-edge: rgba(80, 40, 13, .36);
  --oa-button-drop: rgba(17, 10, 5, .22);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.38), inset 0 -2px 0 rgba(0,0,0,.16), 0 3px 0 var(--oa-button-edge), 0 6px 12px var(--oa-button-drop);
  transition: box-shadow 140ms ease, transform 100ms ease, filter 140ms ease, background-color 160ms ease, border-color 160ms ease;
}
:root[data-relief="on"] button:not(:where(.brand, .main-menu-logo-button, .aurum-mascot-button, #mainUserDropdown button, #brandDropdown button)):enabled:active {
  box-shadow: inset 0 1px 2px rgba(0,0,0,.14), inset 0 -1px 0 rgba(255,255,255,.12), 0 1px 0 var(--oa-button-edge), 0 2px 5px var(--oa-button-drop);
  transform: translateY(2px);
}
:root[data-relief="on"] button:not(:where(.brand, .main-menu-logo-button, .aurum-mascot-button, #mainUserDropdown button, #brandDropdown button)):focus-visible {
  outline: 2px solid #ff9b55;
  outline-offset: 3px;
}
:root[data-relief="on"] button:not(:where(.brand, .main-menu-logo-button, .aurum-mascot-button, #mainUserDropdown button, #brandDropdown button)):disabled {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 1px 0 rgba(0,0,0,.12);
  transform: none;
}
@media (hover:hover) and (pointer:fine) {
  :root[data-relief="on"] button:not(:where(.brand, .main-menu-logo-button, .aurum-mascot-button, #mainUserDropdown button, #brandDropdown button)):enabled:hover {
    box-shadow: inset 0 1px 0 rgba(255,255,255,.44), inset 0 -2px 0 rgba(0,0,0,.18), 0 4px 0 var(--oa-button-edge), 0 8px 16px var(--oa-button-drop);
    transform: translateY(-1px);
  }
  :root[data-relief="on"] button:not(:where(.brand, .main-menu-logo-button, .aurum-mascot-button, #mainUserDropdown button, #brandDropdown button)):enabled:active {transform:translateY(2px);box-shadow:inset 0 1px 2px rgba(0,0,0,.14),0 1px 0 var(--oa-button-edge),0 2px 5px var(--oa-button-drop)}
}
@media (prefers-reduced-motion:reduce) {
  :root[data-relief="on"] button:not(:where(.brand, .main-menu-logo-button, .aurum-mascot-button, #mainUserDropdown button, #brandDropdown button)), :root[data-relief="on"] button:not(:where(.brand, .main-menu-logo-button, .aurum-mascot-button, #mainUserDropdown button, #brandDropdown button)):enabled:hover, :root[data-relief="on"] button:not(:where(.brand, .main-menu-logo-button, .aurum-mascot-button, #mainUserDropdown button, #brandDropdown button)):enabled:active {transition:none;transform:none}
}

:root[data-relief="on"] body.main-menu-active button{--oa-button-edge:rgba(0,0,0,.68);--oa-button-drop:rgba(0,0,0,.28)}
