/* v2.9.2 Same look and font as the Regulatory & Compliance Desk: Aptos (Inter where Aptos is not installed),
   ink navy #0E2038, gold #B8924F, no serif. Loaded after the main stylesheet, so these rules win. */
@font-face { font-family: "SPK Sans"; src: local("Aptos"), local("Aptos-Regular"); font-weight: 400; }
@font-face { font-family: "SPK Sans"; src: local("Aptos SemiBold"), local("Aptos-SemiBold"); font-weight: 500 600; }
@font-face { font-family: "SPK Sans"; src: local("Aptos Bold"), local("Aptos-Bold"); font-weight: 700 900; }
@font-face { font-family: "SPK Display"; src: local("Aptos Display"), local("AptosDisplay"), local("Aptos"); font-weight: 300 400; }
@font-face { font-family: "SPK Display"; src: local("Aptos Display Bold"), local("AptosDisplay-Bold"), local("Aptos SemiBold"); font-weight: 500 900; }

:root {
  --ink: #0E2038; --ink-3: #213a63; --gold: #B8924F; --gold-soft: #DCC296; --gold-ink: #8A6A2E;
  --paper: #F5F7FA; --line: #DCE2EA; --slate: #56627A; --text: #1B2536;
  --font-sans: "SPK Sans", "Inter", "Noto Sans Myanmar", "Segoe UI", system-ui, "Myanmar Text", sans-serif;
  --font-serif: "SPK Display", "Inter", "Noto Sans Myanmar", "Segoe UI", system-ui, sans-serif;   /* every former serif heading */
  --display: var(--font-serif);
  /* blues and purples -> ink and gold */
  --color-blue-50: #eef2f8; --color-blue-100: #dfe6f0; --color-blue-200: #c9d3e1; --color-blue-300: #dcc296;
  --color-blue-400: #b8924f; --color-blue-500: #2c4673; --color-blue-600: #213a63; --color-blue-700: #0e2038;
  --color-indigo-50: #f8f3ea; --color-indigo-100: #f0e6d3; --color-indigo-200: #e6d4b2; --color-indigo-300: #dcc296;
  --color-indigo-600: #8a6a2e; --color-indigo-700: #7a5d27; --color-indigo-800: #634b1f;
  --color-purple-50: #f8f3ea; --color-purple-200: #e6d4b2; --color-purple-700: #7a5d27;
  --color-slate-100: #e9edf3;
  --radius-3xl: .875rem;
}
html, body { font-family: var(--font-sans); -webkit-font-smoothing: antialiased; }
body { color: var(--text); }
.font-serif.italic, em.font-normal { font-style: normal; }

/* ---------------- sidebar ---------------- */
.erp-side {
  background: radial-gradient(420px 300px at 0 0, rgba(184, 146, 79, .10), transparent 70%), linear-gradient(180deg, #0E2038 0%, #16294a 60%, #1b3156 100%) !important;
  border-right: 0 !important;
}
.erp-side b.font-serif { font-family: var(--display); font-weight: 700; letter-spacing: .04em; font-size: 13px; }
.erp-ghead { color: var(--gold) !important; font-size: 10.5px !important; font-weight: 700 !important; letter-spacing: .2em; text-transform: uppercase; padding-top: 12px !important; }
.erp-ghead:hover { background: transparent !important; color: var(--gold-soft) !important; }
.erp-ghead svg { width: 15px; height: 15px; }
.erp-nav { color: #c9d3e1 !important; font-size: 13.5px !important; font-weight: 600 !important; border-radius: 0 !important; padding-top: 9px !important; padding-bottom: 9px !important; border-top: 1px solid transparent; border-bottom: 1px solid transparent; }
.erp-nav:hover { color: #fff !important; background: rgba(255, 255, 255, .05) !important; }
.erp-nav.on { color: #fff !important; font-weight: 700 !important;
  background: linear-gradient(90deg, rgba(184, 146, 79, .16), rgba(184, 146, 79, .04)) !important;
  border-top-color: rgba(184, 146, 79, .6); border-bottom-color: rgba(184, 146, 79, .6); box-shadow: inset 3px 0 0 var(--gold); }
.erp-nav.on:before { background: var(--gold) !important; box-shadow: none !important; }

/* ---------------- page header ---------------- */
.erp-eyebrow { color: var(--gold-ink) !important; font-size: 11px !important; font-weight: 700 !important; letter-spacing: .2em !important; }
.erp-eyebrow:before { display: none !important; }
.erp-title { font: 700 28px/1.2 var(--display) !important; letter-spacing: -.015em !important; color: var(--ink) !important; }
.erp-pagehead { position: relative; border-color: var(--line) !important; }
.erp-pagehead::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 72px; height: 2px; background: var(--gold); }

/* ---------------- cards ---------------- */
main .rounded-3xl.bg-white { border-color: var(--line) !important; box-shadow: 0 1px 2px rgba(14, 32, 56, .05), 0 12px 28px -18px rgba(14, 32, 56, .18) !important; }
main .bg-white.p-6.rounded-3xl.min-w-0 { border-top: 3px solid var(--gold) !important; }          /* number tiles */
main :is(h2, h3):not(.uppercase):not([class*="text-xs"]):not([class*="text-sm"]) { font-family: var(--display); font-weight: 700 !important; letter-spacing: -.01em; color: var(--ink); }
main .erp-hero :is(h2, h3) { color: #fff; }
main .font-black { font-weight: 600 !important; font-family: var(--display); letter-spacing: -.02em; }
main .font-extrabold { font-weight: 700 !important; }

/* ---------------- welcome banner and dark panels = Registration Desk hero ---------------- */
.erp-hero { position: relative; overflow: hidden; color: #fff;
  background: radial-gradient(800px 560px at 80% 30%, rgba(184, 146, 79, .18), transparent 60%), radial-gradient(640px 480px at 0% 100%, rgba(33, 58, 99, .95), transparent 70%), #0E2038;
  border: 0; border-top: 3px solid var(--gold); box-shadow: 0 18px 40px -26px rgba(14, 32, 56, .7); }
.erp-hero-rule { display: none; }
.erp-hero-seal { position: absolute; right: -110px; bottom: -170px; width: 440px; height: 440px; pointer-events: none; opacity: .07; filter: brightness(0) invert(1); }
.erp-hero-badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 999px; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: var(--gold-soft); background: rgba(184, 146, 79, .12); border: 1px solid rgba(184, 146, 79, .4); }
.erp-hero-title { font: 300 30px/1.12 var(--display); letter-spacing: -.025em; margin-bottom: 8px; }
@media (min-width: 768px) { .erp-hero-title { font-size: 40px; } }
.erp-hero select, .erp-hero button { border-color: rgba(184, 146, 79, .3) !important; }

/* ---------------- login = Registration Desk sign-in ---------------- */
.erp-motto { font: 300 clamp(30px, 3.3vw, 46px)/1.12 var(--display); letter-spacing: -.025em; }
.erp-motto em { color: var(--gold-soft) !important; font-style: normal; font-weight: 300; }
.erp-login-pane { overflow: hidden; background: var(--paper) !important; }
.erp-login-seal { position: absolute; right: -170px; top: -150px; width: 520px; height: 520px; pointer-events: none;
  opacity: .06; filter: grayscale(1) sepia(1) saturate(1.5) hue-rotate(-8deg); }
.erp-login-seal.low { right: auto; top: auto; left: -200px; bottom: -220px; width: 460px; height: 460px; opacity: .04; }
@media (max-width: 767px) { .erp-login-seal { width: 360px; height: 360px; right: -140px; top: -120px; } .erp-login-seal.low { display: none; } }
.erp-login-pane .erp-eyebrow { color: var(--gold-ink) !important; }
.erp-login-pane h1 { font: 700 26px/1.2 var(--display) !important; letter-spacing: -.015em !important; color: var(--ink) !important; }
.erp-login-pane h1 + p { font-size: 14px !important; color: var(--slate) !important; }
.erp-login-pane form { background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--gold); border-radius: 16px; padding: 28px 26px 26px;
  box-shadow: 0 1px 2px rgba(14, 32, 56, .05), 0 18px 40px rgba(14, 32, 56, .07); }
.erp-login-pane form label { font-size: 10.5px !important; font-weight: 700 !important; letter-spacing: .14em; text-transform: uppercase; color: var(--slate) !important; }
.erp-login-pane form input { border-color: #c8d1dd !important; }
.erp-login-pane form input:focus { border-color: var(--ink) !important; box-shadow: 0 0 0 2px rgba(184, 146, 79, .45) !important; }
.erp-login-pane form button[type=submit] { border-radius: 999px !important; min-height: 48px; background: var(--ink) !important; }
.erp-login-pane form button[type=submit]:hover { background: var(--ink-3) !important; }
