/* =========================================================================
   Nexora UI — core design system for Nexora Club
   Loaded after Bootstrap 5.3 on every page (public site, member, admin).
   1. Tokens   2. Base   3. Bootstrap theming   4. Components
   5. Legacy compatibility (Bootstrap 2/3 markup still used by some pages)
   ========================================================================= */

/* 1. Tokens ---------------------------------------------------------------- */
:root {
  /* Brand: Nexora Club navy + gold (sampled from the logo) */
  --nx-ink: #0a1838;
  --nx-ink-2: #10224a;
  --nx-ink-3: #1a3163;
  --nx-ink-line: rgba(255, 255, 255, .09);
  --nx-navy: #13306b;
  --nx-gold: #dcaa3c;
  --nx-gold-hover: #cc982a;
  --nx-gold-2: #f3d27a;
  --nx-gold-soft: rgba(220, 170, 60, .15);
  --nx-gold-text: #8a6410;
  --nx-gold-gradient: linear-gradient(135deg, #f3d27a 0%, #dcaa3c 45%, #b8862a 100%);

  --nx-bg: #f4f6fa;
  --nx-surface: #ffffff;
  --nx-surface-2: #f8fafc;
  --nx-border: #e4e8f0;
  --nx-text: #0f172a;
  --nx-muted: #64748b;
  --nx-link: #1f47a8;

  --nx-success: #15803d;
  --nx-danger: #dc2626;
  --nx-warning: #b45309;
  --nx-info: #0369a1;

  --nx-radius: 12px;
  --nx-radius-sm: 8px;
  --nx-shadow-sm: 0 1px 2px rgba(15, 23, 42, .06);
  --nx-shadow: 0 1px 3px rgba(15, 23, 42, .06), 0 8px 24px rgba(15, 23, 42, .06);
  --nx-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

[data-bs-theme="dark"] {
  --nx-bg: #0a0f1c;
  --nx-surface: #111827;
  --nx-surface-2: #0f172a;
  --nx-border: #1f2a3d;
  --nx-text: #e5e9f2;
  --nx-muted: #94a3b8;
  --nx-link: #93b4ff;
  --nx-gold-text: #f0c75e;
  --nx-shadow-sm: none;
  --nx-shadow: 0 1px 2px rgba(0, 0, 0, .4);
}

/* 2. Base ------------------------------------------------------------------ */
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--nx-font);
  font-size: .9375rem;
  color: var(--nx-text);
  background: var(--nx-bg);
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6 { color: var(--nx-text); font-weight: 650; letter-spacing: -.01em; }
a { color: var(--nx-link); text-decoration: none; }
a:hover { text-decoration: underline; }
img { max-width: 100%; height: auto; }
::selection { background: var(--nx-gold-soft); }
:focus-visible { outline: 2px solid var(--nx-gold); outline-offset: 2px; }

/* 3. Bootstrap theming ----------------------------------------------------- */
:root, [data-bs-theme="light"] {
  --bs-body-font-family: var(--nx-font);
  --bs-body-bg: var(--nx-bg);
  --bs-body-color: var(--nx-text);
  --bs-border-color: var(--nx-border);
  --bs-secondary-color: var(--nx-muted);
  --bs-link-color: var(--nx-link);
  --bs-link-color-rgb: 31, 71, 168;
  --bs-primary: #c9961f;
  --bs-primary-rgb: 201, 150, 31;
  --bs-border-radius: var(--nx-radius-sm);
  --bs-border-radius-lg: var(--nx-radius);
}
[data-bs-theme="dark"] {
  --bs-body-bg: var(--nx-bg);
  --bs-body-color: var(--nx-text);
  --bs-border-color: var(--nx-border);
  --bs-link-color: var(--nx-link);
  --bs-link-color-rgb: 147, 180, 255;
}

.btn { font-weight: 600; border-radius: var(--nx-radius-sm); padding: .5rem 1rem; }
.btn-sm { padding: .3rem .7rem; }
.btn-lg { padding: .75rem 1.4rem; }
.btn-primary, .btn-warning {
  --bs-btn-color: var(--nx-ink);
  --bs-btn-bg: var(--nx-gold);
  --bs-btn-border-color: var(--nx-gold);
  --bs-btn-hover-color: var(--nx-ink);
  --bs-btn-hover-bg: var(--nx-gold-hover);
  --bs-btn-hover-border-color: var(--nx-gold-hover);
  --bs-btn-active-color: var(--nx-ink);
  --bs-btn-active-bg: #c4951c;
  --bs-btn-active-border-color: #c4951c;
  --bs-btn-disabled-color: var(--nx-ink);
  --bs-btn-disabled-bg: var(--nx-gold);
  --bs-btn-disabled-border-color: var(--nx-gold);
  --bs-btn-focus-shadow-rgb: 227, 181, 61;
}
.btn-dark, .btn-ink {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--nx-ink);
  --bs-btn-border-color: var(--nx-ink);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--nx-ink-3);
  --bs-btn-hover-border-color: var(--nx-ink-3);
}
.btn-info {
  --bs-btn-color: #fff; --bs-btn-bg: var(--nx-info); --bs-btn-border-color: var(--nx-info);
  --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #075985; --bs-btn-hover-border-color: #075985;
}
.btn-success {
  --bs-btn-bg: var(--nx-success); --bs-btn-border-color: var(--nx-success);
  --bs-btn-hover-bg: #166534; --bs-btn-hover-border-color: #166534;
}
.btn-danger {
  --bs-btn-bg: var(--nx-danger); --bs-btn-border-color: var(--nx-danger);
  --bs-btn-hover-bg: #b91c1c; --bs-btn-hover-border-color: #b91c1c;
}
.btn-light, .btn-default {
  --bs-btn-color: var(--nx-text);
  --bs-btn-bg: var(--nx-surface);
  --bs-btn-border-color: var(--nx-border);
  --bs-btn-hover-color: var(--nx-text);
  --bs-btn-hover-bg: var(--nx-surface-2);
  --bs-btn-hover-border-color: #cfd6e3;
}
.btn-outline-primary {
  --bs-btn-color: var(--nx-gold-text); --bs-btn-border-color: var(--nx-gold);
  --bs-btn-hover-color: var(--nx-ink); --bs-btn-hover-bg: var(--nx-gold); --bs-btn-hover-border-color: var(--nx-gold);
}
.text-primary { color: var(--nx-gold-text) !important; }
.bg-primary { background-color: var(--nx-gold) !important; color: var(--nx-ink) !important; }

.form-control, .form-select {
  border-color: var(--nx-border);
  background-color: var(--nx-surface);
  color: var(--nx-text);
  border-radius: var(--nx-radius-sm);
  padding: .55rem .8rem;
  font-size: .9375rem;
}
.form-select { padding-right: 2.25rem; }
.form-select-sm { padding: .3rem 2rem .3rem .6rem; font-size: .8125rem; }
.form-control-sm { padding: .3rem .6rem; font-size: .8125rem; }
.form-control:focus, .form-select:focus {
  border-color: var(--nx-gold);
  box-shadow: 0 0 0 .2rem var(--nx-gold-soft);
}
.form-control[readonly], .form-control:disabled, .form-control[disabled] { background-color: var(--nx-surface-2); }
.form-label, .control-label, .form-group > label, .form-group > strong {
  display: inline-block;
  margin-bottom: .35rem;
  font-size: .8125rem;
  font-weight: 600;
  color: var(--nx-muted);
}
select.form-control { appearance: auto; }
input[type="checkbox"], input[type="radio"] { accent-color: var(--nx-gold); width: 1rem; height: 1rem; vertical-align: -.15em; }
.form-check-input:checked { background-color: var(--nx-gold); border-color: var(--nx-gold); }

.table {
  --bs-table-bg: transparent;
  --bs-table-striped-bg: rgba(15, 23, 42, .025);
  --bs-table-hover-bg: rgba(227, 181, 61, .07);
  margin-bottom: 0;
  font-size: .875rem;
  vertical-align: middle;
}
.table > :not(caption) > * > * { padding: .7rem .85rem; border-color: var(--nx-border); }
.table th,
.table > thead > tr > *,
.table > tbody > tr:first-child > th {
  font-size: .72rem;
  font-weight: 650;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--nx-muted);
  background: var(--nx-surface-2);
  white-space: nowrap;
}
.table-bordered > :not(caption) > * { border-width: 0; }
.table-bordered > :not(caption) > * > * { border-width: 0 0 1px 0; }
.table a { font-weight: 500; }

.alert { border-radius: var(--nx-radius-sm); border-width: 1px; font-size: .9rem; }
.badge { font-weight: 600; letter-spacing: .02em; }
.modal-content { border: 0; border-radius: var(--nx-radius); box-shadow: 0 24px 64px rgba(2, 6, 23, .25); }
.modal-header { border-bottom-color: var(--nx-border); }
.modal-footer { border-top-color: var(--nx-border); }
.dropdown-menu { border-color: var(--nx-border); border-radius: var(--nx-radius-sm); box-shadow: var(--nx-shadow); padding: .35rem; }
.dropdown-item { border-radius: 6px; padding: .45rem .75rem; font-size: .875rem; display: flex; align-items: center; gap: .55rem; }
.nav-tabs { border-bottom-color: var(--nx-border); gap: .25rem; }
.nav-tabs .nav-link { border: 0; border-bottom: 2px solid transparent; color: var(--nx-muted); font-weight: 600; }
.nav-tabs .nav-link.active, .nav-tabs > li.active > a { color: var(--nx-text); border-bottom-color: var(--nx-gold); background: transparent; }
.progress { height: .6rem; border-radius: 99px; background: var(--nx-surface-2); }
.progress-bar { background-color: var(--nx-gold); }

/* 4. Components ------------------------------------------------------------ */
.card {
  --bs-card-bg: var(--nx-surface);
  --bs-card-border-color: var(--nx-border);
  --bs-card-border-radius: var(--nx-radius);
  --bs-card-inner-border-radius: calc(var(--nx-radius) - 1px);
  --bs-card-cap-bg: transparent;
  --bs-card-cap-padding-y: .9rem;
  --bs-card-cap-padding-x: 1.25rem;
  --bs-card-spacer-x: 1.25rem;
  --bs-card-spacer-y: 1.25rem;
  box-shadow: var(--nx-shadow-sm);
  margin-bottom: 1.5rem;
}
.card-header { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; border-bottom-color: var(--nx-border); }
.card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5, .card-title {
  font-size: 1rem; font-weight: 650; margin: 0; display: flex; align-items: center; gap: .5rem;
}
.card-header > .bi:first-child, .card-title > .bi:first-child { color: var(--nx-gold-text); }

/* Stat tile */
.nx-stat {
  position: relative;
  display: flex; align-items: flex-start; gap: 1rem;
  height: 100%;
  padding: 1.15rem 1.25rem;
  background: var(--nx-surface);
  border: 1px solid var(--nx-border);
  border-radius: var(--nx-radius);
  box-shadow: var(--nx-shadow-sm);
}
.nx-stat-icon {
  flex: 0 0 auto;
  display: grid; place-items: center;
  width: 2.75rem; height: 2.75rem;
  border-radius: 10px;
  font-size: 1.25rem;
  background: var(--nx-gold-soft); color: var(--nx-gold-text);
}
.nx-stat-icon.is-green { background: rgba(21, 128, 61, .1); color: var(--nx-success); }
.nx-stat-icon.is-blue { background: rgba(29, 78, 216, .1); color: var(--nx-link); }
.nx-stat-icon.is-red { background: rgba(220, 38, 38, .1); color: var(--nx-danger); }
.nx-stat-icon.is-ink { background: rgba(15, 23, 42, .07); color: var(--nx-text); }
.nx-stat-label { font-size: .78rem; font-weight: 600; color: var(--nx-muted); text-transform: uppercase; letter-spacing: .04em; margin-bottom: .25rem; }
.nx-stat-value { font-size: 1.5rem; font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; color: var(--nx-text); word-break: break-word; }
.nx-stat-sub { font-size: .8rem; color: var(--nx-muted); margin-top: .2rem; }

/* Empty state used by GridView EmptyDataTemplate */
.nx-empty { padding: 2rem 1rem; text-align: center; color: var(--nx-muted); }

/* Brand mark (gold logo with white wordmark – always placed on ink) */
.nx-logo { display: inline-flex; align-items: center; }
.nx-logo img { height: 40px; width: auto; }

/* Alert dialog used by sweetAlert()/$.confirm() shims */
.nx-dialog .modal-body { text-align: center; padding: 2rem 1.75rem 1.25rem; }
.nx-dialog-icon { display: inline-grid; place-items: center; width: 3.5rem; height: 3.5rem; border-radius: 50%; font-size: 1.75rem; margin-bottom: 1rem; }
.nx-dialog-icon.success { background: rgba(21, 128, 61, .12); color: var(--nx-success); }
.nx-dialog-icon.error, .nx-dialog-icon.danger { background: rgba(220, 38, 38, .12); color: var(--nx-danger); }
.nx-dialog-icon.info { background: rgba(3, 105, 161, .12); color: var(--nx-info); }
.nx-dialog-icon.warning { background: rgba(180, 83, 9, .12); color: var(--nx-warning); }
.nx-dialog h5 { font-size: 1.15rem; margin-bottom: .4rem; }
.nx-dialog p { color: var(--nx-muted); margin: 0; }
.nx-dialog .modal-footer { justify-content: center; border: 0; padding-top: 0; padding-bottom: 1.5rem; }

/* DataTables (bootstrap 5 integration) */
div.dataTables_wrapper { padding: .25rem 0; }
div.dataTables_wrapper div.dataTables_length select { width: auto; display: inline-block; }
div.dataTables_wrapper div.dataTables_filter input { margin-left: .5rem; width: 14rem; max-width: 60vw; }
div.dataTables_wrapper div.dataTables_info { font-size: .8125rem; color: var(--nx-muted); }
.dataTables_wrapper .pagination { --bs-pagination-padding-x: .65rem; --bs-pagination-padding-y: .3rem; --bs-pagination-font-size: .8125rem; --bs-pagination-active-bg: var(--nx-gold); --bs-pagination-active-border-color: var(--nx-gold); --bs-pagination-active-color: var(--nx-ink); --bs-pagination-color: var(--nx-text); }

/* GridView pager row (server-side paging) */
.dataTable-pager td, tr.pagination-row td, .gv-pager td { padding: .5rem 0 !important; background: transparent !important; }
.dataTable-pager table, .gv-pager table { margin: 0 auto; }
.dataTable-pager table td, .gv-pager table td { padding: 0 .15rem !important; border: 0 !important; }
.dataTable-pager a, .dataTable-pager span, .gv-pager a, .gv-pager span {
  display: inline-grid; place-items: center; min-width: 2rem; height: 2rem; padding: 0 .5rem;
  border: 1px solid var(--nx-border); border-radius: 6px; font-size: .8125rem; background: var(--nx-surface);
}
.dataTable-pager span, .gv-pager span { background: var(--nx-gold); border-color: var(--nx-gold); color: var(--nx-ink); font-weight: 700; }

/* flatpickr accents */
.flatpickr-day.selected, .flatpickr-day.selected:hover { background: var(--nx-gold); border-color: var(--nx-gold); color: var(--nx-ink); }

/* 5. Legacy compatibility -------------------------------------------------- */
/* Bootstrap 3 panels -> cards */
.panel {
  background: var(--nx-surface);
  border: 1px solid var(--nx-border);
  border-radius: var(--nx-radius);
  box-shadow: var(--nx-shadow-sm);
  margin-bottom: 1.5rem;
  overflow: hidden;
}
.panel .panel { box-shadow: none; }
.panel-heading {
  display: flex; align-items: center; gap: .6rem; flex-wrap: wrap;
  padding: .9rem 1.25rem;
  border-bottom: 1px solid var(--nx-border);
  background: transparent !important;
  color: var(--nx-text) !important;
}
.panel-heading h1, .panel-heading h2, .panel-heading h3, .panel-heading h4, .panel-title {
  font-size: 1rem; font-weight: 650; margin: 0; color: var(--nx-text) !important;
  display: flex; align-items: center; gap: .5rem;
}
.panel-body { padding: 1.25rem; display: flow-root; }
.panel-footer { padding: .9rem 1.25rem; border-top: 1px solid var(--nx-border); background: var(--nx-surface-2); }
.panel-ctrls, .panel-controls { display: none; }
.panel-primary > .panel-heading, .panel-info > .panel-heading { box-shadow: inset 3px 0 0 var(--nx-gold); }
.panel-danger > .panel-heading { box-shadow: inset 3px 0 0 var(--nx-danger); }
.panel-success > .panel-heading { box-shadow: inset 3px 0 0 var(--nx-success); }

/* Bootstrap 3 utilities */
.pull-left { float: left !important; }
.pull-right { float: right !important; }
.center-block { display: block; margin-inline: auto; }
.hidden, .hide { display: none !important; }
.img-responsive { max-width: 100%; height: auto; display: block; }
.img-circle { border-radius: 50%; }
.help-block { display: block; margin-top: .3rem; font-size: .8125rem; color: var(--nx-muted); }
.text-muted { color: var(--nx-muted) !important; }
.label { display: inline-block; padding: .25em .55em; font-size: .75em; font-weight: 600; border-radius: 6px; color: #fff; background: var(--nx-muted); }
.label-success { background: var(--nx-success); } .label-danger { background: var(--nx-danger); }
.label-warning { background: var(--nx-warning); } .label-info, .label-primary { background: var(--nx-info); }
.btn-xs { padding: .2rem .5rem; font-size: .75rem; border-radius: 6px; }
.btn-block { display: block; width: 100%; }
.close { background: none; border: 0; font-size: 1.4rem; line-height: 1; opacity: .5; float: right; }
.close:hover { opacity: .8; }
.input-sm { padding: .3rem .6rem; font-size: .8125rem; }
.input-group-addon {
  display: flex; align-items: center; padding: .5rem .75rem;
  font-size: .9375rem; color: var(--nx-muted);
  background: var(--nx-surface-2);
  border: 1px solid var(--nx-border);
  border-radius: var(--nx-radius-sm) 0 0 var(--nx-radius-sm);
  border-right: 0;
}
.input-group > .input-group-addon + .form-control { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.form-group { margin-bottom: 1rem; }
/* Horizontal forms: <div class="form-group"><label class="col-md-2 form-label"> + <div class="col-md-6"> */
.form-horizontal .form-group,
.form-group:has(> .control-label + [class*="col-"]),
.form-group:has(> .form-label[class*="col-"] + [class*="col-"]) { display: flex; flex-wrap: wrap; align-items: center; }
.form-group > .form-label[class*="col-"] { margin-bottom: 0; padding-block: .4rem; }
.well { padding: 1.25rem; background: var(--nx-surface-2); border: 1px solid var(--nx-border); border-radius: var(--nx-radius); margin-bottom: 1rem; }
.breadcrumb > li + li::before { content: "/"; padding: 0 .5rem; color: var(--nx-muted); }
.breadcrumb > li { display: inline; }
.caret { display: none; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }

/* Bootstrap 3 grid: columns that are not inside a .row float like they used to.
   :where() keeps specificity at zero so Bootstrap 5 breakpoints still win. */
:where(:not(.row, .row-fluid) > [class*="col-xs-"], :not(.row, .row-fluid) > [class*="col-sm-"], :not(.row, .row-fluid) > [class*="col-md-"], :not(.row, .row-fluid) > [class*="col-lg-"]) {
  float: left; width: 100%; min-height: 1px; padding-inline: .75rem;
}
:where(:is(div, section, fieldset, article, form):has(> [class*="col-md-"], > [class*="col-sm-"], > [class*="col-lg-"])) { display: flow-root; }
/* Blocks that establish their own formatting context would otherwise squeeze in beside those floats. */
:where(.table-responsive, .dataTables_wrapper, .row, .row-fluid, .card, .alert, table.table) { clear: both; }
.col-xs-1 { width: 8.3333%; } .col-xs-2 { width: 16.6667%; } .col-xs-3 { width: 25%; } .col-xs-4 { width: 33.3333%; }
.col-xs-5 { width: 41.6667%; } .col-xs-6 { width: 50%; } .col-xs-7 { width: 58.3333%; } .col-xs-8 { width: 66.6667%; }
.col-xs-9 { width: 75%; } .col-xs-10 { width: 83.3333%; } .col-xs-11 { width: 91.6667%; } .col-xs-12 { width: 100%; }
.row > [class*="col-xs-"] { flex: 0 0 auto; }

/* Bootstrap 2 fluid grid (row-fluid / span*) */
.row-fluid { display: flex; flex-wrap: wrap; margin-inline: -.75rem; }
.row-fluid > * { width: 100%; padding-inline: .75rem; }
@media (min-width: 768px) {
  .row-fluid > .span1 { width: 8.3333%; } .row-fluid > .span2 { width: 16.6667%; } .row-fluid > .span3 { width: 25%; }
  .row-fluid > .span4 { width: 33.3333%; } .row-fluid > .span5 { width: 41.6667%; } .row-fluid > .span6 { width: 50%; }
  .row-fluid > .span7 { width: 58.3333%; } .row-fluid > .span8 { width: 66.6667%; } .row-fluid > .span9 { width: 75%; }
  .row-fluid > .span10 { width: 83.3333%; } .row-fluid > .span11 { width: 91.6667%; } .row-fluid > .span12 { width: 100%; }
}
.control-group { margin-bottom: 1rem; }
.controls { margin-top: .25rem; }
.box, .box-content { display: flow-root; }
.form-row { display: flex; flex-wrap: wrap; gap: 0 1rem; }
.form-row > * { flex: 1 1 14rem; }

/* Spacing helpers from the previous member theme */
.p-n { padding: 0 !important; } .m-n { margin: 0 !important; } .mt-n { margin-top: 0 !important; } .mb-n { margin-bottom: 0 !important; }
.p-md { padding: 1rem !important; } .pt-md { padding-top: 1rem !important; } .mb-sm { margin-bottom: .5rem !important; } .pt-xs { padding-top: .25rem !important; }

/* 6. Motion -----------------------------------------------------------------
   html.nx-motion is set by nx.js only when IntersectionObserver is available and
   the visitor has not asked for reduced motion, so content never stays hidden. */
@keyframes nx-rise { from { opacity: 0; transform: translateY(18px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes nx-shimmer { 0% { background-position: 0% 50%; } 100% { background-position: 200% 50%; } }
@keyframes nx-spin { to { transform: rotate(360deg); } }
@keyframes nx-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes nx-pulse-ring { 0% { box-shadow: 0 0 0 0 rgba(220, 170, 60, .45); } 100% { box-shadow: 0 0 0 14px rgba(220, 170, 60, 0); } }
@keyframes nx-sweep { from { transform: translateX(-120%) skewX(-20deg); } to { transform: translateX(220%) skewX(-20deg); } }
@keyframes nx-grow-x { from { transform: scaleX(0); } to { transform: scaleX(1); } }

html.nx-motion [data-nx-reveal]:not(.is-visible) { opacity: 0; }
html.nx-motion [data-nx-reveal].is-visible { animation: nx-rise .7s cubic-bezier(.2, .7, .2, 1) both; animation-delay: var(--nx-delay, 0ms); }

/* Gold gradient text with a slow shimmer */
.nx-gold-text {
  background: linear-gradient(90deg, #b8862a, #f3d27a, #dcaa3c, #f3d27a, #b8862a);
  background-size: 200% auto;
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
  animation: nx-shimmer 6s linear infinite;
}

/* Stat tiles: lift, rotating gold edge, icon pulse, light sweep */
.nx-stat { overflow: hidden; isolation: isolate; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.nx-stat::before {
  content: ""; position: absolute; inset: -1px; z-index: -2; border-radius: inherit; opacity: 0;
  background: conic-gradient(from var(--nx-angle, 0deg), transparent 0 60%, var(--nx-gold) 75%, transparent 90%);
  transition: opacity .3s;
}
.nx-stat::after { content: ""; position: absolute; inset: 1px; z-index: -1; border-radius: calc(var(--nx-radius) - 1px); background: var(--nx-surface); }
.nx-stat:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(10, 24, 56, .12); border-color: transparent; }
.nx-stat:hover::before { opacity: 1; animation: nx-spin-angle 2.4s linear infinite; }
.nx-stat-icon { position: relative; transition: transform .3s ease; }
.nx-stat:hover .nx-stat-icon { transform: scale(1.08) rotate(-6deg); animation: nx-pulse-ring 1.2s ease-out infinite; }
.nx-stat .nx-sweep { position: absolute; top: 0; bottom: 0; width: 40%; pointer-events: none; z-index: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .55), transparent); transform: translateX(-120%) skewX(-20deg); }
[data-bs-theme="dark"] .nx-stat .nx-sweep { background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .08), transparent); }
.nx-stat:hover .nx-sweep { animation: nx-sweep .9s ease; }
@property --nx-angle { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
@keyframes nx-spin-angle { to { --nx-angle: 360deg; } }

/* Primary buttons: light sweep */
.btn-primary { position: relative; overflow: hidden; }
.btn-primary::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 45%; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .45), transparent);
  transform: translateX(-120%) skewX(-20deg);
}
.btn-primary:hover::after { animation: nx-sweep .8s ease; }

/* Bars that grow when revealed */
html.nx-motion .is-visible .nx-bar-fill, html.nx-motion .nx-bar-fill.is-visible { animation: nx-grow-x 1s cubic-bezier(.2, .7, .2, 1) both; animation-delay: var(--nx-delay, 0ms); }
.nx-bar-fill { transform-origin: left center; }

/* "To be confirmed" marker used for unresolved plan rules */
.nx-tbc { display: inline-flex; align-items: center; gap: .35rem; padding: .15rem .55rem; border-radius: 99px; font-size: .75rem; font-weight: 600; color: #92400e; background: #fef3c7; border: 1px solid #fde68a; white-space: nowrap; }
[data-bs-theme="dark"] .nx-tbc { color: #fcd34d; background: rgba(252, 211, 77, .1); border-color: rgba(252, 211, 77, .25); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .nx-gold-text { color: var(--nx-gold); background: none; }
}

/* Math captcha (login + registration) --------------------------------------- */
.nx-captcha { display: flex; align-items: stretch; gap: .5rem; }
.nx-captcha-q {
  display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto;
  min-width: 7.5rem; padding: 0 .9rem; border-radius: var(--nx-radius-sm);
  background: linear-gradient(135deg, #0a1838, #1a3163); color: #fff;
  font-weight: 800; font-size: 1.05rem; letter-spacing: .06em; font-variant-numeric: tabular-nums;
  user-select: none;
}
.nx-captcha .form-control { flex: 1 1 auto; min-width: 0; max-width: 9rem; text-align: center; font-weight: 700; }
.nx-captcha-refresh {
  display: inline-grid; place-items: center; flex: 0 0 auto; width: 2.6rem;
  border: 1px solid var(--nx-border); border-radius: var(--nx-radius-sm); color: var(--nx-muted); background: var(--nx-surface);
}
.nx-captcha-refresh:hover { color: var(--nx-gold-text); border-color: var(--nx-gold); text-decoration: none; }