html, body, #root {
  margin: 0;
  padding: 0;
  background: #0a0f0c;
  font-family: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  min-height: 100vh;
  overflow: hidden;
}
* { box-sizing: border-box; }
a { color: inherit; }

@keyframes msuRowIn {
  0% { background: rgba(212, 166, 74, 0.18); transform: translateY(-4px); opacity: 0; }
  100% { background: transparent; transform: translateY(0); opacity: 1; }
}
@keyframes msuSlide {
  from { transform: translateX(100%); }
  to   { transform: translateX(0); }
}
@keyframes msuFade {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes msuToast {
  from { transform: translate(-50%, 20px); opacity: 0; }
  to   { transform: translate(-50%, 0);    opacity: 1; }
}

div[style*="overflowY:auto"], div[style*="overflowY: auto"] {
  scrollbar-width: thin;
  scrollbar-color: rgba(212, 166, 74, 0.25) transparent;
}
div[style*="overflowY:auto"]::-webkit-scrollbar,
div[style*="overflowY: auto"]::-webkit-scrollbar { width: 6px; height: 6px; }
div[style*="overflowY:auto"]::-webkit-scrollbar-thumb,
div[style*="overflowY: auto"]::-webkit-scrollbar-thumb {
  background: rgba(212, 166, 74, 0.25);
  border-radius: 3px;
}

input:focus, select:focus, textarea:focus {
  border-color: #d4a64a !important;
}
button {
  font-family: inherit;
}

/* Kill the native browser number-input spinners (the up/down arrows on
   the right edge). They render with the browser's default light/white
   chrome and look badly out of place against our dark palette. */
.msu-no-spinner::-webkit-outer-spin-button,
.msu-no-spinner::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.msu-no-spinner {
  -moz-appearance: textfield;
  appearance: textfield;
}

/* Re-style the native <select> dropdown so the scrollable list matches
   the rest of the dashboard. Browsers honor very little of the popup's
   internals, but font + scrollbar + option background work in most. */
.msu-styled-select {
  scrollbar-width: thin;
  scrollbar-color: rgba(212, 166, 74, 0.35) #11160f;
  /* Replace the OS-default chevron with a small gold caret matching V1. */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8' fill='none'><path d='M1 1.5 L6 6.5 L11 1.5' stroke='%23d4a64a' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 11px;
  padding-right: 28px !important;
}
.msu-styled-select::-webkit-scrollbar { width: 8px; }
.msu-styled-select::-webkit-scrollbar-track { background: #11160f; }
.msu-styled-select::-webkit-scrollbar-thumb {
  background: rgba(212, 166, 74, 0.35);
  border-radius: 4px;
  border: 1px solid #11160f;
}
.msu-styled-select::-webkit-scrollbar-thumb:hover {
  background: rgba(212, 166, 74, 0.55);
}
/* On Chromium-based browsers the open dropdown popup picks up these. */
.msu-styled-select option {
  background: #11160f;
  color: #d8d4cb;
  padding: 6px 10px;
}
.msu-styled-select optgroup {
  background: #0a0f0c;
  color: #d4a64a;
  font-style: normal;
  font-weight: 600;
  font-size: 0.85em;
  letter-spacing: 0.05em;
}