/*
 * SC_REG_0.10D41 — World-class visual and motion layer
 * Progressive enhancement only. All application hooks remain owned by the existing pages.
 */

:root {
  --nx-motion-brand: var(--brand, var(--event-primary, #2f7475));
  --nx-motion-ink: var(--ink, #162126);
  --nx-motion-surface: var(--surface-strong, var(--surface, #fff));
  --nx-motion-line: var(--line, rgba(22, 33, 38, .13));
  --nx-motion-ease: cubic-bezier(.22, .8, .24, 1);
  --nx-motion-spring: cubic-bezier(.2, .92, .24, 1.16);
  --nx-motion-fast: 180ms;
  --nx-motion-medium: 420ms;
  --nx-motion-slow: 8s;
}

.admin-page {
  --nx-motion-brand: var(--brand, #2f7475);
  --nx-motion-ink: var(--ink, #162126);
  --nx-motion-surface: var(--surface-strong, #fff);
  --nx-motion-line: var(--line, rgba(22, 33, 38, .13));
}

.coordinator-page {
  --nx-motion-brand: var(--brand, #2f7475);
  --nx-motion-ink: var(--ink, #f2f4f7);
  --nx-motion-surface: var(--panel, #171a22);
  --nx-motion-line: var(--line, rgba(255, 255, 255, .1));
}

@property --nx-orbit-angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}

@keyframes nx-ambient-drift {
  0%, 100% { background-position: 0% 0%, 100% 100%, 0 0; }
  50% { background-position: 7% 4%, 94% 96%, 22px 16px; }
}

@keyframes nx-view-enter {
  from { opacity: 0; transform: translateY(12px) scale(.994); }
  to { opacity: 1; transform: none; }
}

@keyframes nx-ring-in {
  from { transform: rotate(-72deg) scale(.84); opacity: 0; }
  to { transform: rotate(0deg) scale(1); opacity: 1; }
}

@keyframes nx-value-pop {
  0% { transform: translateY(2px) scale(.94); opacity: .55; }
  55% { transform: translateY(-1px) scale(1.06); }
  100% { transform: none; opacity: 1; }
}

@keyframes nx-pulse-ring {
  0% { box-shadow: 0 0 0 0 color-mix(in srgb, currentColor 34%, transparent); }
  68%, 100% { box-shadow: 0 0 0 9px transparent; }
}

@keyframes nx-sheen {
  0%, 18% { transform: translateX(-140%) skewX(-18deg); opacity: 0; }
  42% { opacity: .52; }
  70%, 100% { transform: translateX(160%) skewX(-18deg); opacity: 0; }
}

@keyframes nx-float {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: translate3d(0, -5px, 0) rotate(1.5deg); }
}

@keyframes nx-beam {
  0% { transform: translateY(-7px); opacity: 0; }
  12% { opacity: .9; }
  88% { opacity: .9; }
  100% { transform: translateY(calc(100% + 7px)); opacity: 0; }
}

@keyframes nx-route-flow {
  to { background-position: 34px 0; }
}

@keyframes nx-spin {
  to { transform: rotate(1turn); }
}

/* Progressive page and component reveals */

.nx-motion-enabled .nx-reveal {
  opacity: 0;
  transform: translateY(16px) scale(.992);
  transition:
    opacity var(--nx-motion-medium) var(--nx-motion-ease) var(--nx-stagger, 0ms),
    transform var(--nx-motion-medium) var(--nx-motion-ease) var(--nx-stagger, 0ms);
}

.nx-motion-enabled .nx-reveal.nx-visible {
  opacity: 1;
  transform: none;
}

.nx-motion-enabled .nx-view-enter {
  animation: nx-view-enter 340ms var(--nx-motion-ease) both;
}

/* Responsive pointer light — applied only on fine-pointer devices by JS */

.nx-pointer-card {
  position: relative;
  isolation: isolate;
}

.nx-pointer-card::before {
  position: absolute;
  z-index: 0;
  inset: -1px;
  border-radius: inherit;
  background: radial-gradient(
    300px circle at var(--nx-pointer-x, 50%) var(--nx-pointer-y, 50%),
    color-mix(in srgb, var(--nx-motion-brand) 14%, transparent),
    transparent 62%
  );
  content: "";
  opacity: 0;
  pointer-events: none;
  transition: opacity 220ms ease;
}

.nx-pointer-card.nx-pointer-active::before {
  opacity: 1;
}

/* Premium buttons and action feedback */

:where(
  .primary-button,
  .partner-primary,
  .coordinator-page .primary-action,
  .coordinator-page button[type="submit"],
  .logistics-page #confirm-schedule,
  .admin-onboarding-page button[type="submit"]
) {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition:
    transform var(--nx-motion-fast) var(--nx-motion-ease),
    box-shadow var(--nx-motion-fast) ease,
    filter var(--nx-motion-fast) ease;
}

:where(
  .primary-button,
  .partner-primary,
  .coordinator-page .primary-action,
  .coordinator-page button[type="submit"],
  .logistics-page #confirm-schedule,
  .admin-onboarding-page button[type="submit"]
)::after {
  position: absolute;
  z-index: 0;
  top: -40%;
  bottom: -40%;
  left: -38%;
  width: 32%;
  transform: translateX(-140%) skewX(-18deg);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .44), transparent);
  content: "";
  opacity: 0;
  pointer-events: none;
}

:where(
  .primary-button,
  .partner-primary,
  .coordinator-page .primary-action,
  .coordinator-page button[type="submit"],
  .logistics-page #confirm-schedule,
  .admin-onboarding-page button[type="submit"]
):hover:not(:disabled)::after {
  animation: nx-sheen 1.15s ease;
}

:where(button, .primary-button, .secondary-button, .secondary-link, .partner-primary, .partner-secondary):active:not(:disabled) {
  transform: translateY(1px) scale(.985) !important;
}

/* Platform ambient stage */

.nx-motion-enabled .admin-page:not(.admin-locked) {
  background:
    radial-gradient(circle at 8% 6%, rgba(47, 116, 117, .105), transparent 28rem),
    radial-gradient(circle at 94% 88%, rgba(62, 112, 143, .08), transparent 32rem),
    linear-gradient(rgba(47, 116, 117, .022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(47, 116, 117, .022) 1px, transparent 1px),
    var(--nx-page);
  background-size: auto, auto, 24px 24px, 24px 24px, auto;
  animation: nx-ambient-drift 18s ease-in-out infinite;
}

html[data-theme="dark"].nx-motion-enabled .admin-page:not(.admin-locked) {
  background:
    radial-gradient(circle at 8% 6%, rgba(83, 173, 175, .11), transparent 30rem),
    radial-gradient(circle at 94% 88%, rgba(71, 119, 153, .08), transparent 32rem),
    linear-gradient(rgba(110, 190, 192, .018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(110, 190, 192, .018) 1px, transparent 1px),
    #0b1013;
  background-size: auto, auto, 24px 24px, 24px 24px, auto;
}

.nx-motion-enabled .admin-topbar {
  overflow: visible;
}

.nx-motion-enabled .admin-topbar::after {
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 1px;
  transform-origin: left;
  background: linear-gradient(90deg, transparent, var(--brand), transparent);
  content: "";
  opacity: .52;
  animation: nx-route-flow 7s linear infinite;
}

.nx-motion-enabled .platform-brand-mark {
  position: relative;
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--brand) 20%, transparent), 0 8px 20px rgba(29, 71, 73, .13);
  transition: transform 300ms var(--nx-motion-spring), box-shadow 300ms ease;
}

.nx-motion-enabled .brand-lockup:hover .platform-brand-mark {
  transform: rotate(-4deg) scale(1.06);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--brand) 10%, transparent), 0 12px 28px rgba(29, 71, 73, .18);
}

/* Graphical metrics based on real ratios where a denominator exists */

:where(.metric, .metric-card, .summary-card)[data-nx-metric="true"] {
  --nx-metric-tone: var(--nx-motion-brand);
  position: relative;
  min-height: 104px;
  overflow: hidden;
  isolation: isolate;
  padding-right: 76px !important;
  border-color: color-mix(in srgb, var(--nx-metric-tone) 16%, var(--nx-motion-line));
  background:
    linear-gradient(145deg, color-mix(in srgb, var(--nx-metric-tone) 4%, transparent), transparent 58%),
    var(--nx-motion-surface);
  transition: transform 220ms var(--nx-motion-ease), border-color 220ms ease, box-shadow 220ms ease;
}

:where(.metric, .metric-card, .summary-card)[data-nx-tone="positive"] { --nx-metric-tone: #1b8a5a; }
:where(.metric, .metric-card, .summary-card)[data-nx-tone="warning"] { --nx-metric-tone: #c47b12; }
:where(.metric, .metric-card, .summary-card)[data-nx-tone="danger"] { --nx-metric-tone: #c13f35; }

:where(.metric, .metric-card, .summary-card)[data-nx-metric="true"]::after {
  position: absolute;
  z-index: 0;
  inset: auto -24px -30px auto;
  width: 104px;
  height: 104px;
  border: 1px solid color-mix(in srgb, var(--nx-metric-tone) 13%, transparent);
  border-radius: 50%;
  content: "";
  opacity: .9;
}

:where(.metric, .metric-card, .summary-card)[data-nx-metric="true"]:hover {
  border-color: color-mix(in srgb, var(--nx-metric-tone) 34%, var(--nx-motion-line));
  box-shadow: 0 16px 36px color-mix(in srgb, var(--nx-metric-tone) 10%, transparent);
  transform: translateY(-2px);
}

:where(.metric, .metric-card, .summary-card)[data-nx-metric="true"] > span:first-child {
  position: relative;
  z-index: 2;
}

:where(.metric, .metric-card, .summary-card)[data-nx-metric="true"] > strong {
  position: relative;
  z-index: 2;
  color: var(--nx-motion-ink);
}

.nx-value-updated > strong {
  animation: nx-value-pop 480ms var(--nx-motion-spring);
}

.nx-metric-visual {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: 15px;
  display: grid !important;
  width: 48px;
  height: 48px;
  margin: 0 !important;
  transform: translateY(-50%);
  place-items: center;
  border-radius: 50%;
  color: var(--nx-metric-tone);
  pointer-events: none;
}

.nx-metric-ratio {
  background: conic-gradient(
    from -90deg,
    var(--nx-metric-tone) calc(var(--nx-ratio, 0) * 1turn),
    color-mix(in srgb, var(--nx-metric-tone) 12%, transparent) 0
  );
  animation: nx-ring-in 700ms var(--nx-motion-ease) both;
}

.nx-metric-ratio::after {
  width: 35px;
  height: 35px;
  border: 1px solid color-mix(in srgb, var(--nx-metric-tone) 12%, transparent);
  border-radius: 50%;
  background: var(--nx-motion-surface);
  content: "";
}

.nx-metric-ratio i {
  position: absolute;
  z-index: 2;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 0 5px color-mix(in srgb, currentColor 9%, transparent);
}

.nx-metric-ratio b,
.nx-metric-ratio em {
  display: none;
}

.nx-metric-neutral {
  grid-template-columns: repeat(3, 6px);
  grid-template-rows: repeat(3, 6px);
  gap: 4px;
  border: 1px solid color-mix(in srgb, var(--nx-metric-tone) 12%, transparent);
  background: color-mix(in srgb, var(--nx-metric-tone) 4%, transparent);
}

.nx-metric-neutral::before,
.nx-metric-neutral::after,
.nx-metric-neutral i,
.nx-metric-neutral b,
.nx-metric-neutral em {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--nx-metric-tone) 26%, transparent);
  content: "";
}

.nx-metric-neutral i { grid-column: 1; grid-row: 3; background: var(--nx-metric-tone); }
.nx-metric-neutral b { grid-column: 2; grid-row: 2; background: color-mix(in srgb, var(--nx-metric-tone) 72%, transparent); }
.nx-metric-neutral em { grid-column: 3; grid-row: 1; background: color-mix(in srgb, var(--nx-metric-tone) 48%, transparent); }
.nx-metric-neutral::before { grid-column: 1; grid-row: 1; }
.nx-metric-neutral::after { grid-column: 3; grid-row: 3; }

/* Owner control centre cards */

.nx-motion-enabled .admin-page .module-card {
  border-color: color-mix(in srgb, var(--brand) 10%, var(--line));
  background:
    linear-gradient(140deg, color-mix(in srgb, var(--brand) 4%, transparent), transparent 54%),
    var(--surface);
  transition: transform 260ms var(--nx-motion-spring), box-shadow 260ms ease, border-color 260ms ease;
}

.nx-motion-enabled .admin-page .module-card::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  border-radius: inherit;
  background:
    linear-gradient(90deg, color-mix(in srgb, var(--brand) 5%, transparent) 1px, transparent 1px),
    linear-gradient(color-mix(in srgb, var(--brand) 5%, transparent) 1px, transparent 1px);
  background-size: 24px 24px;
  content: "";
  opacity: .46;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(135deg, #000, transparent 64%);
  mask-image: linear-gradient(135deg, #000, transparent 64%);
}

.nx-motion-enabled .admin-page .module-card > * {
  position: relative;
  z-index: 2;
}

.nx-motion-enabled .admin-page .module-card::after {
  transition: transform 540ms var(--nx-motion-spring), background 260ms ease;
}

.nx-motion-enabled .admin-page .module-clickable:hover {
  border-color: color-mix(in srgb, var(--brand) 32%, var(--line));
  box-shadow: 0 22px 46px color-mix(in srgb, var(--brand) 11%, transparent);
  transform: translateY(-5px);
}

.nx-motion-enabled .admin-page .module-clickable:hover::after {
  transform: translate(-10px, -8px) scale(1.12);
  background: color-mix(in srgb, var(--brand) 13%, transparent);
}

.nx-motion-enabled .admin-page .module-icon {
  overflow: visible;
  box-shadow: 0 8px 22px color-mix(in srgb, var(--brand) 12%, transparent);
  transition: transform 400ms var(--nx-motion-spring), box-shadow 300ms ease;
}

.nx-motion-enabled .admin-page .module-icon::before {
  position: absolute;
  inset: -6px;
  border: 1px dashed color-mix(in srgb, var(--brand) 30%, transparent);
  border-radius: 50%;
  content: "";
  opacity: 0;
  transition: opacity 200ms ease;
}

.nx-motion-enabled .admin-page .module-clickable:hover .module-icon {
  transform: translateY(-3px) rotate(-4deg) scale(1.08);
  box-shadow: 0 13px 30px color-mix(in srgb, var(--brand) 18%, transparent);
}

.nx-motion-enabled .admin-page .module-clickable:hover .module-icon::before {
  opacity: 1;
  animation: nx-spin 9s linear infinite;
}

.nx-motion-enabled .module-count {
  position: relative;
  overflow: visible;
  box-shadow: 0 10px 24px color-mix(in srgb, var(--brand) 24%, transparent);
}

.nx-motion-enabled .status-live,
.nx-motion-enabled .live-pill,
.nx-motion-enabled .activity-badge {
  position: relative;
}

.nx-motion-enabled .status-live::before,
.nx-motion-enabled .live-pill i,
.nx-motion-enabled .activity-badge::before {
  animation: nx-pulse-ring 2s ease-out infinite;
}

.nx-motion-enabled .status-live::before {
  display: inline-block;
  flex: 0 0 6px;
  width: 6px;
  height: 6px;
  margin-right: 6px;
  border-radius: 50%;
  background: currentColor;
  content: "";
}

.nx-motion-enabled .activity-badge::before {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 7px;
  border-radius: 50%;
  background: currentColor;
  content: "";
}

/* Event workspace */

.nx-motion-enabled .workspace-heading {
  overflow: hidden;
  border-color: color-mix(in srgb, var(--brand) 16%, var(--line));
}

.nx-motion-enabled .workspace-heading::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  transform: translateX(-55%);
  background: linear-gradient(90deg, transparent, var(--brand), transparent);
  content: "";
  opacity: .5;
  animation: nx-sheen 5.5s ease-in-out infinite;
}

.nx-motion-enabled .workspace-nav-item {
  overflow: hidden;
  transition: color 180ms ease, background 180ms ease, border-color 180ms ease, transform 180ms var(--nx-motion-ease);
}

.nx-motion-enabled .workspace-nav-item:hover {
  transform: translateX(2px);
}

.nx-motion-enabled .workspace-nav-item.active .workspace-nav-icon {
  box-shadow: 0 7px 18px color-mix(in srgb, var(--brand) 15%, transparent);
  animation: nx-value-pop 360ms var(--nx-motion-spring);
}

.nx-motion-enabled .workspace-nav-item.active::after {
  position: absolute;
  right: 9px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--brand);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--brand) 10%, transparent);
  content: "";
}

.nx-motion-enabled .save-state-pill::before {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  content: "";
  opacity: .68;
}

.nx-motion-enabled .save-state-pill.nx-state-ok::before {
  color: #1b8a5a;
  animation: nx-pulse-ring 2.6s ease-out infinite;
}

.nx-motion-enabled .save-state-pill.nx-state-active::before {
  animation: nx-pulse-ring 1s ease-out infinite;
}

/* Client- and event-facing registration experience */

.nx-motion-enabled .public-registration-card {
  position: relative;
  isolation: isolate;
  transition: box-shadow 420ms ease, transform 420ms var(--nx-motion-ease);
}

.nx-motion-enabled .public-event-header {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.nx-motion-enabled .public-event-header::after {
  position: absolute;
  z-index: 0;
  inset: -35%;
  background:
    radial-gradient(circle at 72% 28%, color-mix(in srgb, var(--event-accent, #fff) 24%, transparent), transparent 24%),
    linear-gradient(115deg, transparent 28%, color-mix(in srgb, var(--event-on-primary, #fff) 8%, transparent) 48%, transparent 64%),
    repeating-radial-gradient(circle at 86% 8%, color-mix(in srgb, var(--event-on-primary, #fff) 12%, transparent) 0 1px, transparent 1px 18px);
  content: "";
  opacity: .72;
  transform: rotate(-4deg);
  animation: nx-float 9s ease-in-out infinite;
  pointer-events: none;
}

.nx-motion-enabled .public-header-art,
.nx-motion-enabled .public-hero-copy {
  position: relative;
  z-index: 2;
}

.nx-motion-enabled .public-hero-copy h1 {
  text-wrap: balance;
}

.nx-motion-enabled .public-event-details > div {
  position: relative;
  overflow: hidden;
  transition: transform 220ms var(--nx-motion-spring), background 220ms ease, border-color 220ms ease;
}

.nx-motion-enabled .public-event-details > div:hover {
  transform: translateY(-2px);
}

.nx-motion-enabled .public-event-details > div::after {
  position: absolute;
  right: -12px;
  bottom: -16px;
  width: 42px;
  height: 42px;
  border: 1px solid currentColor;
  border-radius: 50%;
  content: "";
  opacity: .1;
}

.nx-motion-enabled .public-form-panel {
  position: relative;
}

.nx-motion-enabled .public-registration-card :where(label, .choice-field) {
  transition: color 180ms ease, transform 180ms var(--nx-motion-ease);
}

.nx-motion-enabled .public-registration-card :where(label, .choice-field):has(:focus-visible) {
  color: var(--event-primary, var(--nx-brand));
  transform: translateX(2px);
}

.nx-motion-enabled .public-registration-card :where(input, select, textarea) {
  transition: border-color 180ms ease, box-shadow 180ms ease, background 180ms ease, transform 180ms var(--nx-motion-ease);
}

.nx-motion-enabled .public-registration-card :where(input, select, textarea):focus {
  transform: translateY(-1px);
}

.nx-motion-enabled body[data-nx-form-stage="review"] #registration-form,
.nx-motion-enabled body[data-nx-form-stage="final"] #registration-form {
  animation: nx-view-enter 360ms var(--nx-motion-ease) both;
}

/* Partner journey */

.nx-motion-enabled .partner-progress {
  overflow: hidden;
  isolation: isolate;
}

.nx-motion-enabled .partner-progress::before,
.nx-motion-enabled .partner-progress::after {
  position: absolute;
  z-index: 0;
  right: 12px;
  bottom: 2px;
  left: 12px;
  height: 2px;
  border-radius: 999px;
  content: "";
}

.nx-motion-enabled .partner-progress::before {
  background: color-mix(in srgb, var(--event-primary) 12%, transparent);
}

.nx-motion-enabled .partner-progress::after {
  right: auto;
  width: var(--nx-step-progress, 0%);
  background: linear-gradient(90deg, var(--event-primary), var(--event-accent));
  box-shadow: 0 0 12px color-mix(in srgb, var(--event-primary) 26%, transparent);
  transition: width 440ms var(--nx-motion-ease);
}

.nx-motion-enabled .partner-progress a {
  position: relative;
  z-index: 2;
  transition: color 180ms ease, background 180ms ease, transform 180ms var(--nx-motion-spring);
}

.nx-motion-enabled .partner-progress a:hover {
  transform: translateY(-1px);
}

.nx-motion-enabled .partner-progress a span {
  transition: color 220ms ease, background 220ms ease, border-color 220ms ease, transform 220ms var(--nx-motion-spring);
}

.nx-motion-enabled .partner-progress a.nx-complete span {
  border-color: color-mix(in srgb, var(--event-primary) 48%, var(--partner-line));
  color: var(--event-primary);
  background: color-mix(in srgb, var(--event-primary) 8%, #fff);
  font-size: 0;
}

.nx-motion-enabled .partner-progress a.nx-complete span::after {
  content: "✓";
  font-size: 11px;
  font-weight: 900;
}

.nx-motion-enabled .partner-progress a[aria-current="step"] span {
  transform: scale(1.08);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--event-primary) 10%, transparent);
}

.nx-motion-enabled .partner-card {
  position: relative;
  overflow: hidden;
  border-color: color-mix(in srgb, var(--event-primary) 10%, var(--partner-line));
  transition: transform 260ms var(--nx-motion-ease), box-shadow 260ms ease, border-color 260ms ease;
}

.nx-motion-enabled .partner-card::before {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 3px;
  transform: scaleY(0);
  transform-origin: top;
  background: linear-gradient(var(--event-primary), var(--event-accent));
  content: "";
  transition: transform 500ms var(--nx-motion-ease);
}

.nx-motion-enabled .partner-card.nx-visible::before {
  transform: scaleY(1);
}

.nx-motion-enabled .partner-card:hover {
  border-color: color-mix(in srgb, var(--event-primary) 24%, var(--partner-line));
  box-shadow: 0 18px 42px color-mix(in srgb, var(--event-primary) 8%, transparent);
}

.nx-motion-enabled .partner-card-heading > span {
  position: relative;
  overflow: hidden;
  box-shadow: 0 9px 20px color-mix(in srgb, var(--event-primary) 15%, transparent);
}

.nx-motion-enabled .partner-card-heading > span::after {
  position: absolute;
  inset: -50%;
  transform: translateX(-80%) rotate(22deg);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .38), transparent);
  content: "";
  transition: transform 700ms var(--nx-motion-ease);
}

.nx-motion-enabled .partner-card.nx-visible .partner-card-heading > span::after {
  transform: translateX(80%) rotate(22deg);
}

.nx-motion-enabled .partner-check {
  transition: border-color 180ms ease, background 180ms ease, transform 180ms var(--nx-motion-ease), box-shadow 180ms ease;
}

.nx-motion-enabled .partner-check:hover {
  border-color: color-mix(in srgb, var(--event-primary) 22%, var(--partner-line));
  background: color-mix(in srgb, var(--event-primary) 4%, #fff);
  transform: translateX(2px);
}

.nx-motion-enabled .partner-check:has(input:checked) {
  border-color: color-mix(in srgb, var(--event-primary) 34%, var(--partner-line));
  background: color-mix(in srgb, var(--event-primary) 7%, #fff);
  box-shadow: inset 3px 0 0 var(--event-primary);
}

.nx-motion-enabled .partner-success-card {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.nx-motion-enabled .partner-success-card::before {
  position: absolute;
  z-index: 0;
  inset: -30%;
  background:
    radial-gradient(circle, color-mix(in srgb, var(--event-primary) 28%, transparent) 0 2px, transparent 3px) 0 0 / 28px 28px,
    radial-gradient(circle, color-mix(in srgb, var(--event-accent) 35%, transparent) 0 2px, transparent 3px) 12px 14px / 34px 34px;
  content: "";
  opacity: .42;
  animation: nx-float 8s ease-in-out infinite;
}

.nx-motion-enabled .partner-success-card > * {
  position: relative;
  z-index: 1;
}

.nx-motion-enabled .partner-success-card > span:first-child {
  animation: nx-value-pop 650ms var(--nx-motion-spring) both;
}

/* Secure access */

.nx-motion-enabled .admin-onboarding-page,
.nx-motion-enabled .coordinator-page:has(.coordinator-login:not([hidden])) {
  background:
    radial-gradient(circle at 12% 5%, rgba(82, 175, 177, .18), transparent 26rem),
    radial-gradient(circle at 88% 92%, rgba(88, 113, 148, .18), transparent 30rem),
    linear-gradient(rgba(113, 194, 196, .025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(113, 194, 196, .025) 1px, transparent 1px),
    #0d1317;
  background-size: auto, auto, 28px 28px, 28px 28px, auto;
  animation: nx-ambient-drift 17s ease-in-out infinite;
}

.nx-motion-enabled .admin-page.admin-locked {
  background:
    radial-gradient(circle at 11% 5%, rgba(47, 116, 117, .12), transparent 27rem),
    radial-gradient(circle at 89% 92%, rgba(88, 113, 148, .1), transparent 30rem),
    linear-gradient(rgba(47, 116, 117, .018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(47, 116, 117, .018) 1px, transparent 1px),
    #f5f7f7;
  background-size: auto, auto, 28px 28px, 28px 28px, auto;
  animation: nx-ambient-drift 17s ease-in-out infinite;
}

.nx-motion-enabled .registration-login-card,
.nx-motion-enabled .admin-onboarding-page .access-setup-card,
.nx-motion-enabled .coordinator-page .login-card {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.nx-motion-enabled .registration-login-card::before,
.nx-motion-enabled .admin-onboarding-page .access-setup-card::before,
.nx-motion-enabled .coordinator-page .login-card::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  border-radius: inherit;
  background:
    radial-gradient(circle at 90% 0, rgba(104, 193, 195, .13), transparent 35%),
    linear-gradient(135deg, rgba(255, 255, 255, .035), transparent 45%);
  content: "";
  pointer-events: none;
}

.nx-motion-enabled .registration-login-card > *,
.nx-motion-enabled .admin-onboarding-page .access-setup-card > *,
.nx-motion-enabled .coordinator-page .login-card > * {
  position: relative;
  z-index: 1;
}

.nx-motion-enabled .login-owner-visual,
.nx-motion-enabled .onboarding-brand .mark,
.nx-motion-enabled .coordinator-page .login-brand .brand-mark {
  position: relative;
  filter: drop-shadow(0 12px 26px rgba(46, 119, 121, .22));
  animation: nx-float 6s ease-in-out infinite;
}

.nx-motion-enabled .login-owner-visual::after {
  position: absolute;
  inset: -8px;
  border: 1px dashed rgba(47, 116, 117, .24);
  border-radius: 50%;
  content: "";
  animation: nx-spin 24s linear infinite;
}

/* Scanner */

.nx-motion-enabled .scanner-event-banner {
  position: relative;
  overflow: hidden;
}

.nx-motion-enabled .scanner-event-banner::after {
  position: absolute;
  right: -80px;
  bottom: -90px;
  width: 240px;
  height: 240px;
  border: 1px solid color-mix(in srgb, var(--brand) 18%, transparent);
  border-radius: 50%;
  box-shadow:
    0 0 0 26px color-mix(in srgb, var(--brand) 5%, transparent),
    0 0 0 56px color-mix(in srgb, var(--brand) 3%, transparent);
  content: "";
  pointer-events: none;
}

.nx-motion-enabled .scanner-stage {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border-color: color-mix(in srgb, var(--brand) 24%, var(--line));
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .04), 0 18px 42px rgba(12, 26, 31, .12);
}

.nx-motion-enabled .scanner-stage::after {
  position: absolute;
  z-index: 3;
  inset: 14px;
  border: 2px solid transparent;
  border-radius: 12px;
  background:
    linear-gradient(var(--brand), var(--brand)) top left / 34px 2px no-repeat,
    linear-gradient(var(--brand), var(--brand)) top left / 2px 34px no-repeat,
    linear-gradient(var(--brand), var(--brand)) top right / 34px 2px no-repeat,
    linear-gradient(var(--brand), var(--brand)) top right / 2px 34px no-repeat,
    linear-gradient(var(--brand), var(--brand)) bottom left / 34px 2px no-repeat,
    linear-gradient(var(--brand), var(--brand)) bottom left / 2px 34px no-repeat,
    linear-gradient(var(--brand), var(--brand)) bottom right / 34px 2px no-repeat,
    linear-gradient(var(--brand), var(--brand)) bottom right / 2px 34px no-repeat;
  content: "";
  opacity: .72;
  pointer-events: none;
}

.nx-motion-enabled .scanner-stage::before {
  position: absolute;
  z-index: 4;
  top: 14px;
  right: 18px;
  left: 18px;
  height: 2px;
  transform: translateY(-7px);
  border-radius: 999px;
  background: linear-gradient(90deg, transparent, #7ff0d0, transparent);
  box-shadow: 0 0 14px #63ddbd;
  content: "";
  opacity: 0;
  pointer-events: none;
}

.nx-motion-enabled body.nx-scanner-active .scanner-stage::before {
  animation: nx-beam 2.4s ease-in-out infinite;
}

/* Coordinator command view */

.nx-motion-enabled .coordinator-page .event-hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.nx-motion-enabled .coordinator-page .event-hero::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  background:
    radial-gradient(circle at 84% 24%, rgba(112, 211, 187, .13), transparent 23rem),
    repeating-linear-gradient(115deg, transparent 0 32px, rgba(255, 255, 255, .018) 33px 34px);
  content: "";
  animation: nx-route-flow 8s linear infinite;
}

.nx-motion-enabled .coordinator-page .event-hero-content {
  position: relative;
  z-index: 1;
}

.nx-motion-enabled .coordinator-page .live-pill i {
  animation: nx-pulse-ring 1.8s ease-out infinite;
}

.nx-motion-enabled .coordinator-page .timeline-card {
  position: relative;
  overflow: hidden;
  border-color: color-mix(in srgb, var(--brand) 12%, var(--line));
  transition: transform 220ms var(--nx-motion-ease), border-color 220ms ease, box-shadow 220ms ease;
}

.nx-motion-enabled .coordinator-page .timeline-card::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 3px;
  background: linear-gradient(var(--brand), var(--accent));
  content: "";
  opacity: .7;
}

.nx-motion-enabled .coordinator-page .timeline-card:hover {
  border-color: color-mix(in srgb, var(--brand) 28%, var(--line));
  box-shadow: 0 16px 38px color-mix(in srgb, var(--brand) 9%, transparent);
  transform: translateY(-2px);
}

.nx-motion-enabled .coordinator-page .timeline-time strong {
  background: linear-gradient(135deg, var(--ink), var(--accent));
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
}

/* Supplier logistics timeline */

.nx-motion-enabled .logistics-page .next-call {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.nx-motion-enabled .logistics-page .next-call::after {
  position: absolute;
  z-index: 0;
  top: -70%;
  bottom: -70%;
  left: -28%;
  width: 22%;
  transform: skewX(-20deg);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .2), transparent);
  content: "";
  animation: nx-sheen 5.4s ease-in-out infinite;
}

.nx-motion-enabled .logistics-page .next-call > * {
  position: relative;
  z-index: 1;
}

.nx-motion-enabled .logistics-page .schedule-entry {
  position: relative;
  overflow: hidden;
  border-color: color-mix(in srgb, var(--primary) 10%, var(--line));
  transition: transform 220ms var(--nx-motion-ease), border-color 220ms ease, box-shadow 220ms ease;
}

.nx-motion-enabled .logistics-page .schedule-entry::before {
  position: absolute;
  top: 22px;
  bottom: 22px;
  left: 0;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: linear-gradient(var(--primary), var(--accent));
  content: "";
  opacity: .72;
}

.nx-motion-enabled .logistics-page .schedule-entry:hover {
  border-color: color-mix(in srgb, var(--primary) 26%, var(--line));
  box-shadow: 0 18px 38px color-mix(in srgb, var(--primary) 9%, transparent);
  transform: translateY(-2px);
}

.nx-motion-enabled .confirmation-card[data-confirmed="true"] {
  position: relative;
  overflow: hidden;
}

.nx-motion-enabled .confirmation-card[data-confirmed="true"]::after {
  position: absolute;
  top: 14px;
  right: 14px;
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: #15803d;
  content: "✓";
  font-size: 13px;
  font-weight: 900;
  animation: nx-value-pop 520ms var(--nx-motion-spring);
}

/* Response confirmation */

.nx-motion-enabled .public-response-card {
  overflow: hidden;
}

.nx-motion-enabled .response-summary {
  position: relative;
  overflow: hidden;
  padding-left: 76px;
  transition: border-color 220ms ease, box-shadow 220ms ease;
}

.nx-motion-enabled .response-summary::before {
  position: absolute;
  top: 50%;
  left: 18px;
  display: grid;
  width: 42px;
  height: 42px;
  transform: translateY(-50%);
  place-items: center;
  border: 1px solid color-mix(in srgb, var(--event-primary, var(--nx-brand)) 24%, transparent);
  border-radius: 50%;
  color: var(--event-primary, var(--nx-brand));
  background: color-mix(in srgb, var(--event-primary, var(--nx-brand)) 7%, #fff);
  content: "•";
  font-size: 24px;
  line-height: 1;
}

.nx-motion-enabled .response-summary.nx-status-success::before {
  border-color: rgba(21, 128, 61, .25);
  color: #fff;
  background: #15803d;
  content: "✓";
  font-size: 15px;
  animation: nx-value-pop 520ms var(--nx-motion-spring);
}

.nx-motion-enabled .response-summary.nx-status-pending::before {
  border-top-color: var(--event-primary, var(--nx-brand));
  content: "";
  animation: nx-spin 1.1s linear infinite;
}

.nx-motion-enabled .response-summary.nx-status-warning::before {
  border-color: rgba(180, 35, 24, .25);
  color: #fff;
  background: #b42318;
  content: "!";
  font-size: 15px;
  font-weight: 900;
}

/* Mobile refinement */

@media (max-width: 980px) {
  .nx-motion-enabled .workspace-nav-item:hover { transform: translateY(-1px); }
  .nx-motion-enabled .workspace-nav-item.active::after { right: 5px; bottom: 5px; }
}

@media (max-width: 720px) {
  .nx-motion-enabled .admin-page:not(.admin-locked),
  .nx-motion-enabled .admin-page.admin-locked,
  .nx-motion-enabled .admin-onboarding-page {
    animation-duration: 24s;
  }

  :where(.metric, .metric-card, .summary-card)[data-nx-metric="true"] {
    min-height: 94px;
  }

  .nx-motion-enabled .public-event-header::after {
    inset: -18%;
    opacity: .54;
  }

  .nx-motion-enabled .partner-progress::before,
  .nx-motion-enabled .partner-progress::after {
    right: 8px;
    left: 8px;
  }

  .nx-motion-enabled .partner-progress::after {
    right: auto;
    width: var(--nx-step-progress, 0%);
  }

  .nx-motion-enabled .partner-card:hover,
  .nx-motion-enabled .logistics-page .schedule-entry:hover,
  .nx-motion-enabled .coordinator-page .timeline-card:hover {
    transform: none;
  }
}

/* Accessibility and low-power preference */

@media (prefers-reduced-motion: reduce) {
  .nx-motion-enabled *,
  .nx-motion-enabled *::before,
  .nx-motion-enabled *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-delay: 0ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    transition-delay: 0ms !important;
  }

  .nx-motion-enabled .nx-reveal,
  .nx-motion-enabled .nx-reveal.nx-visible {
    opacity: 1 !important;
    transform: none !important;
  }

  .nx-motion-enabled body.nx-scanner-active .scanner-stage::before {
    top: 50%;
    opacity: .55;
  }
}

@media (prefers-contrast: more) {
  .nx-motion-enabled .nx-pointer-card::before,
  .nx-motion-enabled .public-event-header::after,
  .nx-motion-enabled .admin-page .module-card::before {
    display: none;
  }

  :where(.metric, .metric-card, .summary-card)[data-nx-metric="true"] {
    border-width: 2px;
  }
}