:root {
  --bg: #030814;
  --bg-2: #071222;
  --panel: rgba(8, 19, 37, 0.74);
  --panel-strong: rgba(9, 22, 42, 0.9);
  --panel-soft: rgba(15, 34, 58, 0.58);
  --line: rgba(150, 184, 220, 0.11);
  --line-strong: rgba(106, 184, 235, 0.2);
  --text: #f3f0e8;
  --muted: #8798b2;
  --muted-strong: #c3cde0;
  --cyan: #79dff6;
  --blue: #6ca8f7;
  --gold: #c8a96a;
  --green: #59d390;
  --yellow: #e7c76a;
  --red: #ff6474;
  --shadow: 0 34px 90px rgba(0, 0, 0, 0.46);
  --module-shadow: 0 24px 70px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  --surface-radius: 20px;
  --control-radius: 12px;
  --glass-border: 1px solid rgba(128, 185, 235, 0.14);
  --glass-highlight: inset 0 1px 0 rgba(255, 255, 255, 0.07);
  --font-ui: "Manrope", "Inter", "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* AUREX reconstructed foundation: shared tokens, surfaces, motion, and layout primitives. */
.admin-intelligence-body,
.portal-body {
  min-height: 100vh;
  color: var(--text);
  font-family: var(--font-ui);
  font-size: 15px;
  line-height: 1.55;
  background:
    radial-gradient(circle at 20% -10%, rgba(72, 142, 225, 0.18), transparent 34%),
    radial-gradient(circle at 84% 12%, rgba(61, 182, 220, 0.09), transparent 30%),
    linear-gradient(180deg, #030814 0%, #06101d 46%, #030711 100%);
  overflow-x: hidden;
}

.admin-intelligence-body::before,
.portal-body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  opacity: 0.36;
  background-image:
    linear-gradient(rgba(130, 180, 235, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(130, 180, 235, 0.035) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: linear-gradient(to bottom, black, transparent 82%);
}

.admin-intelligence-body a,
.portal-body a {
  color: inherit;
  text-decoration: none;
}

.admin-intelligence-body.admin-booting {
  min-height: 100vh;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 10%, rgba(92, 181, 255, 0.12), transparent 27rem),
    linear-gradient(145deg, #020814, #061222 52%, #020814);
}

.admin-intelligence-body.admin-booting #adminApp {
  min-height: 100vh;
  visibility: hidden;
  opacity: 0;
}

#adminApp {
  min-height: 100vh;
  opacity: 1;
  transition: opacity 180ms ease;
}

@media (prefers-reduced-motion: reduce) {
  #adminApp {
    transition: none;
  }
}

.admin-intelligence-shell,
.portal-shell {
  align-items: stretch;
  gap: 0;
  background: transparent;
}

.admin-main,
.portal-main {
  width: 100%;
  min-width: 0;
  padding: clamp(18px, 2.2vw, 30px);
}

.admin-intelligence-shell .admin-sidebar,
.portal-shell .portal-sidebar {
  width: 278px;
  padding: 18px 14px;
  border-right: var(--glass-border);
  background:
    linear-gradient(180deg, rgba(8, 19, 37, 0.86), rgba(4, 10, 22, 0.94)),
    radial-gradient(circle at 18% 0%, rgba(72, 157, 247, 0.14), transparent 42%);
  box-shadow: 22px 0 70px rgba(0, 0, 0, 0.22), var(--glass-highlight);
  backdrop-filter: blur(26px);
}

.admin-intelligence-shell .brand-lockup,
.portal-shell .brand-lockup {
  align-items: center;
  gap: 12px;
  padding: 12px;
  margin-bottom: 14px;
  border: var(--glass-border);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.025);
}

.admin-intelligence-shell .brand-mark,
.portal-shell .brand-mark {
  width: 42px;
  height: 42px;
  border-radius: 13px;
  color: #f9f2df;
  background: linear-gradient(145deg, rgba(71, 155, 244, 0.28), rgba(13, 35, 65, 0.75));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 14px 30px rgba(52, 138, 225, 0.14);
}

.admin-intelligence-shell .brand-kicker,
.portal-shell .brand-kicker,
.eyebrow,
.note-label {
  color: var(--gold);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.admin-intelligence-shell .brand-lockup h1,
.portal-shell .brand-lockup h1 {
  margin: 2px 0 0;
  color: var(--text);
  font-size: 0.96rem;
  font-weight: 690;
  line-height: 1.15;
}

.admin-intelligence-shell .admin-brand-signal {
  color: rgba(205, 218, 236, 0.64);
  font-size: 0.76rem;
}

.admin-intelligence-shell .nav-list,
.portal-shell .nav-list {
  display: grid;
  gap: 13px;
}

.admin-intelligence-shell .nav-group {
  display: grid;
  gap: 4px;
}

.admin-intelligence-shell .nav-group > span {
  padding: 8px 10px 3px;
  color: rgba(155, 176, 205, 0.58);
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.admin-intelligence-shell .nav-item,
.portal-shell .nav-item {
  position: relative;
  min-height: 38px;
  padding: 9px 10px;
  gap: 10px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: rgba(209, 220, 237, 0.76);
  font-size: 0.84rem;
  font-weight: 590;
  line-height: 1;
  background: transparent;
  transition: background 180ms ease, border-color 180ms ease, color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

.admin-intelligence-shell .nav-item svg {
  width: 17px;
  height: 17px;
  fill: currentColor;
  opacity: 0.74;
}

.admin-intelligence-shell .nav-item:hover,
.portal-shell .nav-item:hover {
  color: var(--text);
  border-color: rgba(123, 190, 245, 0.12);
  background: rgba(255, 255, 255, 0.035);
  transform: translateX(2px);
}

.admin-intelligence-shell .nav-item.is-active,
.portal-shell .nav-item.is-active {
  color: #f6fbff;
  border-color: rgba(111, 191, 245, 0.22);
  background: linear-gradient(90deg, rgba(70, 152, 240, 0.18), rgba(255, 255, 255, 0.025));
  box-shadow: inset 2px 0 0 rgba(121, 223, 246, 0.72), 0 12px 34px rgba(38, 115, 210, 0.12);
}

.admin-intelligence-shell .sidebar-note,
.portal-shell .sidebar-note {
  margin-top: auto;
  padding: 13px;
  border: var(--glass-border);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.025);
  color: rgba(205, 218, 236, 0.66);
}

/* Unified client shell: restrained UV glass depth shared by service surfaces. */
.portal-classic-shell .portal-sidebar {
  background:
    linear-gradient(155deg, rgba(11, 26, 47, .94), rgba(5, 13, 27, .96)),
    radial-gradient(circle at 10% 12%, rgba(116, 97, 255, .12), transparent 34%);
  border-right-color: rgba(122, 154, 220, .18);
  box-shadow: 18px 0 50px rgba(12, 25, 70, .18), inset -1px 0 rgba(153, 222, 255, .05);
}

.portal-classic-shell .portal-sidebar .nav-item {
  border-color: rgba(122, 154, 220, .10);
  background: rgba(9, 22, 41, .34);
  transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease, color .16s ease;
}

.portal-classic-shell .portal-sidebar .nav-item:hover,
.portal-classic-shell .portal-sidebar .nav-item.is-active {
  border-color: rgba(117, 214, 255, .48);
  background: linear-gradient(100deg, rgba(51, 157, 211, .18), rgba(122, 92, 255, .12));
  box-shadow: inset 3px 0 rgba(111, 221, 255, .82), 0 0 24px rgba(95, 126, 255, .10);
}

.portal-classic-shell .portal-main .glass-panel,
.portal-classic-shell .portal-main .strategy-zone,
.portal-classic-shell .portal-main .portal-service-gate,
.portal-classic-shell .portal-main .portal-intelligence-stage,
.portal-classic-shell .portal-main .portal-service-side article {
  background:
    linear-gradient(145deg, rgba(16, 36, 61, .80), rgba(7, 18, 35, .84)),
    radial-gradient(circle at 100% 0, rgba(110, 96, 255, .10), transparent 42%);
  border-color: rgba(116, 190, 238, .18);
  box-shadow: inset 0 1px rgba(203, 243, 255, .06), 0 18px 48px rgba(3, 10, 24, .22);
}

.portal-classic-shell .portal-main .glass-panel:hover,
.portal-classic-shell .portal-main .strategy-zone:hover,
.portal-classic-shell .portal-main .portal-service-side article:hover {
  border-color: rgba(116, 214, 255, .30);
  box-shadow: inset 0 1px rgba(203, 243, 255, .08), 0 20px 58px rgba(46, 67, 150, .18);
}

.portal-classic-shell .portal-main .panel-header h3,
.portal-classic-shell .portal-main .zone-heading h3 {
  letter-spacing: .005em;
}

.aurex-registration-page { min-height: 100vh; background: radial-gradient(circle at 18% 12%, rgba(91, 113, 255, .16), transparent 34%), #06111f; }
.registration-shell { width: min(1120px, calc(100% - 40px)); min-height: 100vh; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(420px, 510px); gap: clamp(40px, 8vw, 112px); align-items: center; padding: 56px 0; }
.registration-brand { display: inline-flex; align-items: baseline; gap: 9px; color: #eef7ff; text-decoration: none; letter-spacing: .08em; }
.registration-brand span { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid rgba(132, 215, 255, .5); color: #9ee8ff; font-size: 11px; letter-spacing: 0; }
.registration-brand strong { font-size: 15px; } .registration-brand small { color: #7890ac; font-size: 9px; letter-spacing: .12em; }
.registration-brand span .aurex-mark-svg { width: 22px; height: 22px; }
.registration-intro h1 { max-width: 580px; margin: 12px 0 18px; font-size: clamp(40px, 5vw, 70px); line-height: .98; letter-spacing: -.035em; color: #f4f9ff; }
.registration-lede { max-width: 520px; color: #a7bad0; font-size: 17px; line-height: 1.65; }
.registration-steps { display: grid; gap: 12px; margin-top: 42px; max-width: 520px; }
.registration-steps article { display: grid; grid-template-columns: 38px 1fr; column-gap: 14px; padding: 15px 0; border-top: 1px solid rgba(151, 191, 237, .14); }
.registration-steps b { color: #83dfff; font-size: 12px; grid-row: span 2; } .registration-steps span { color: #f0f6ff; font-weight: 700; } .registration-steps small { color: #7e96b0; margin-top: 4px; }
.registration-card { padding: 30px; background: linear-gradient(145deg, rgba(21, 43, 73, .86), rgba(7, 18, 35, .92)); border: 1px solid rgba(148, 215, 255, .28); box-shadow: inset 0 1px rgba(239, 251, 255, .08), 0 28px 80px rgba(0, 0, 0, .36), 0 0 42px rgba(95, 89, 255, .10); backdrop-filter: blur(24px); }
.registration-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 24px; } .registration-card h2 { margin: 6px 0 0; color: #f4f9ff; font-size: 26px; } .registration-badge { padding: 7px 10px; border: 1px solid rgba(104, 222, 255, .35); color: #a7eaff; font-size: 11px; white-space: nowrap; }
.registration-field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; } .registration-card label { display: grid; gap: 7px; margin-bottom: 15px; color: #bdcee2; font-size: 12px; font-weight: 700; } .registration-card label em { color: #7188a2; font-style: normal; font-weight: 400; }
.registration-card input { width: 100%; box-sizing: border-box; padding: 12px 13px; border: 1px solid rgba(142, 183, 225, .21); background: rgba(2, 10, 21, .64); color: #f1f7ff; outline: none; } .registration-card input:focus { border-color: #7cdeff; box-shadow: 0 0 0 3px rgba(94, 205, 255, .12); } .registration-card input[aria-invalid="true"] { border-color: #ed8f9d; } .registration-card label small { min-height: 14px; color: #f2a2ad; font-size: 11px; font-weight: 500; }
.registration-check { display: flex !important; grid-template-columns: auto 1fr; align-items: flex-start; gap: 10px !important; font-weight: 500 !important; line-height: 1.45; } .registration-check input { width: 16px; margin-top: 1px; } .registration-check a, .registration-footer a { color: #98e5ff; }
.registration-submit { width: 100%; min-height: 48px; display: inline-flex; justify-content: center; align-items: center; gap: 10px; border: 0; background: linear-gradient(100deg, #62d4fa, #98a5ff); color: #071323; font-weight: 800; cursor: pointer; } .registration-submit:disabled { opacity: .65; cursor: wait; } .registration-spinner { display: none; width: 14px; height: 14px; border: 2px solid rgba(7, 19, 35, .32); border-top-color: #071323; border-radius: 50%; } .is-submitting .registration-spinner { display: inline-block; animation: registration-spin .8s linear infinite; }
.registration-alert { margin: 0 0 16px; padding: 11px 13px; border-left: 2px solid #ed8f9d; background: rgba(237, 143, 157, .10); color: #ffd6dc; font-size: 12px; line-height: 1.5; } .registration-alert[hidden] { display: none; }
.registration-footer, .registration-safe-note { color: #8096ae; text-align: center; font-size: 12px; line-height: 1.5; } .registration-footer { margin: 20px 0 8px; } .registration-safe-note { margin: 0; font-size: 11px; }
.registration-success { text-align: center; padding: 28px 6px 8px; } .registration-success-mark { display: grid; place-items: center; width: 48px; height: 48px; margin: 0 auto 18px; border: 1px solid #71dfb0; color: #8ff1c5; font-size: 24px; } .registration-success h3 { color: #f4f9ff; font-size: 24px; line-height: 1.15; } .registration-success p:not(.eyebrow) { color: #a7bad0; line-height: 1.6; } .registration-success-link { text-decoration: none; margin-top: 16px; }
@keyframes registration-spin { to { transform: rotate(360deg); } }
@media (max-width: 820px) { .registration-shell { grid-template-columns: 1fr; width: min(620px, calc(100% - 28px)); gap: 30px; padding: 30px 0; } .registration-intro h1 { font-size: 43px; } .registration-steps { margin-top: 24px; } }
@media (max-width: 520px) { .registration-field-grid { grid-template-columns: 1fr; gap: 0; } .registration-card { padding: 22px 18px; } .registration-card-head { display: block; } .registration-badge { display: inline-block; margin-top: 14px; } }
@media (prefers-reduced-motion: reduce) { .registration-spinner { animation: none; } }

@media (prefers-reduced-motion: reduce) {
  .portal-classic-shell .portal-sidebar .nav-item { transition: none; }
}

/* Trading Accounts uses the existing portal shell primitives; these rules only
   provide the dedicated workspace layout and keep broker records readable. */
.portal-main .trading-accounts-page { display: grid; gap: 18px; }
.portal-main .portal-page-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; padding: 4px 0 6px; }
.portal-main .portal-page-hero h1 { margin: 5px 0 7px; color: var(--text); font-size: clamp(1.55rem, 2.5vw, 2.35rem); line-height: 1.05; }
.portal-main .portal-page-hero p { max-width: 620px; margin: 0; color: rgba(198, 213, 233, .68); line-height: 1.55; }
.portal-main .portal-page-actions, .portal-main .portal-form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; }
.portal-main .portal-section { display: grid; gap: 10px; }
.portal-main .portal-section .panel-header { margin-bottom: 0; }
.portal-main .portal-data-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
.portal-main .trading-account-card { padding: 17px; }
.portal-main .trading-account-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.portal-main .trading-account-card h3 { margin: 5px 0 0; color: var(--text); font-size: 1rem; }
.portal-main .trading-account-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 17px; padding-top: 13px; border-top: 1px solid rgba(143, 191, 230, .12); }
.portal-main .trading-account-meta span { min-width: 0; color: rgba(224, 235, 248, .82); font-size: .82rem; overflow-wrap: anywhere; }
.portal-main .trading-account-meta small { display: block; margin-bottom: 4px; color: rgba(160, 184, 211, .58); font-size: .64rem; letter-spacing: .08em; text-transform: uppercase; }
.portal-main .trading-accounts-form-wrap[hidden] { display: none; }
.portal-main .portal-form-panel { padding: clamp(16px, 2vw, 24px); }
.portal-main .portal-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.portal-main .portal-form-grid label { display: grid; gap: 7px; color: rgba(202, 218, 237, .78); font-size: .76rem; font-weight: 700; }
.portal-main .portal-form-grid label span { color: rgba(160, 184, 211, .55); font-weight: 500; }
.portal-main .portal-form-grid input { width: 100%; box-sizing: border-box; min-height: 42px; padding: 10px 12px; border: 1px solid rgba(143, 191, 230, .18); border-radius: 10px; background: rgba(2, 10, 21, .58); color: var(--text); outline: none; }
.portal-main .portal-form-grid input:focus { border-color: rgba(126, 205, 255, .65); box-shadow: 0 0 0 3px rgba(94, 205, 255, .12); }
.portal-main .portal-form-wide { grid-column: 1 / -1; }
.portal-main .portal-error-state, .portal-main .portal-success-state, .portal-main .portal-loading-state { padding: 14px 16px; border: 1px solid rgba(143, 191, 230, .16); border-radius: 12px; background: rgba(9, 24, 43, .52); color: rgba(224, 235, 248, .84); }
.portal-main .portal-error-state { border-left: 2px solid #ed8f9d; }
.portal-main .portal-success-state { border-left: 2px solid #71dfb0; }
.portal-main .portal-error-state p, .portal-main .portal-success-state p { margin: 5px 0 10px; color: rgba(198, 213, 233, .66); }
.portal-main .portal-privacy-note { margin: 0; color: rgba(160, 184, 211, .58); font-size: .76rem; line-height: 1.5; }
@media (max-width: 680px) {
  .portal-main .portal-page-hero { display: grid; align-items: start; }
  .portal-main .portal-page-actions { width: 100%; }
  .portal-main .portal-page-actions button { flex: 1 1 180px; }
  .portal-main .portal-form-grid { grid-template-columns: 1fr; }
  .portal-main .portal-form-wide { grid-column: auto; }
  .portal-main .trading-account-meta { grid-template-columns: 1fr; gap: 8px; }
}

.admin-intelligence-shell .topbar h2,
.portal-topbar h2,
.portal-welcome-panel h3,
.chart-reader-head h2,
.strategy-lab-head h2 {
  color: var(--text);
  font-size: clamp(1.35rem, 2.2vw, 2.15rem);
  font-weight: 690;
  line-height: 1.08;
  letter-spacing: 0;
}

.admin-intelligence-shell .topbar p,
.portal-topbar p,
.portal-welcome-panel p,
.chart-reader-head p,
.strategy-lab-head p {
  color: rgba(198, 212, 232, 0.68);
}

.admin-main .primary-button,
.admin-main .secondary-button,
.portal-main .primary-button,
.portal-main .secondary-button {
  min-height: 40px;
  border-radius: 12px;
  font-weight: 690;
  letter-spacing: 0;
  text-decoration: none;
  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease, background 180ms ease;
}

.admin-main .primary-button,
.portal-main .primary-button {
  border: 1px solid rgba(126, 205, 255, 0.35);
  color: #fbfdff;
  background: linear-gradient(135deg, rgba(62, 144, 236, 0.92), rgba(19, 67, 128, 0.88));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 16px 34px rgba(38, 120, 220, 0.2);
}

.admin-main .secondary-button,
.portal-main .secondary-button {
  border: 1px solid rgba(141, 190, 230, 0.18);
  color: rgba(230, 238, 249, 0.88);
  background: rgba(255, 255, 255, 0.035);
}

.admin-main .primary-button:hover,
.admin-main .secondary-button:hover,
.portal-main .primary-button:hover,
.portal-main .secondary-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.22);
}

.admin-main .status-badge,
.portal-main .portal-status-pill {
  border-radius: 999px;
  border: 1px solid rgba(143, 191, 230, 0.15);
  background: rgba(255, 255, 255, 0.04);
  font-size: 0.72rem;
  font-weight: 700;
}

.admin-main .admin-table-panel {
  overflow: hidden;
}

.admin-main .admin-table-wrap {
  overflow: auto;
  max-width: 100%;
}

.admin-main .admin-table {
  min-width: 760px;
  border-collapse: separate;
  border-spacing: 0;
}

.admin-main .admin-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  padding: 12px 16px;
  background: rgba(8, 20, 38, 0.96);
  color: rgba(194, 210, 232, 0.72);
  font-size: 0.68rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.admin-main .admin-table th span {
  display: inline-block;
  padding-right: 8px;
}

.admin-main .admin-table td {
  padding: 13px 16px;
  border-top: 1px solid rgba(132, 174, 220, 0.08);
  color: rgba(233, 239, 248, 0.84);
  vertical-align: middle;
}

.admin-main .admin-table tbody tr {
  animation: tableRowIn 420ms ease both;
  animation-delay: calc(var(--row-index, 0) * 22ms);
}

.admin-main .admin-table tbody tr:hover td {
  background: rgba(70, 146, 235, 0.045);
}

.admin-main .table-action-row {
  gap: 6px;
}

.admin-main .compact-action,
.admin-main .table-icon-button {
  min-height: 32px;
  padding: 7px 10px;
  border-radius: 10px;
  font-size: 0.72rem;
}

.page-rise,
.page-load-panel {
  animation: panelEntrance 520ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
}

@keyframes panelEntrance {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes tableRowIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

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

.portal-main .chart-reader-head,
.portal-main .strategy-lab-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 18px;
}

.portal-main .chart-mode-switch {
  display: inline-flex;
  padding: 4px;
  border: 1px solid rgba(135, 190, 235, 0.14);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.035);
}

.portal-main .chart-mode-switch button {
  min-height: 34px;
  padding: 8px 12px;
  border: 0;
  border-radius: 10px;
  color: rgba(209, 222, 239, 0.72);
  background: transparent;
}

.portal-main .chart-mode-switch button.is-active {
  color: #f9fbff;
  background: rgba(92, 166, 245, 0.18);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.portal-main .chart-reader-terminal {
  display: grid;
  grid-template-columns: minmax(230px, 0.28fr) minmax(0, 1fr);
  gap: 16px;
}

.portal-main .chart-control-rail {
  display: grid;
  gap: 13px;
  align-content: start;
  padding: 14px;
}

.portal-main .tradingview-widget-container {
  min-height: 600px;
}

.portal-main .market-chip-row,
.portal-main .timeframe-preset-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.portal-main .market-chip,
.portal-main .timeframe-preset-row button {
  min-height: 30px;
  padding: 7px 9px;
  border: 1px solid rgba(130, 188, 235, 0.14);
  border-radius: 999px;
  color: rgba(217, 228, 243, 0.76);
  background: rgba(255, 255, 255, 0.035);
}

.portal-main .market-chip.is-active,
.portal-main .timeframe-preset-row button.is-active {
  color: #f9fbff;
  border-color: rgba(122, 213, 246, 0.28);
  background: rgba(78, 154, 240, 0.18);
}

.portal-main .analysis-connection-banner,
.portal-main .scenario-plan-head,
.portal-main .zone-heading {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
}

.portal-main .analysis-connection-banner {
  margin-bottom: 14px;
  padding: 14px 16px;
  border: 1px solid rgba(200, 169, 106, 0.18);
  border-radius: 16px;
  background: rgba(200, 169, 106, 0.055);
}

.portal-main .analysis-connection-banner span,
.portal-main .scenario-summary-card span,
.portal-main .scenario-position-card > span,
.portal-main .scenario-reasoning-card span,
.portal-main .scenario-risk-card span {
  color: var(--gold);
  font-size: 0.7rem;
  font-weight: 760;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.portal-main .analysis-workflow-steps,
.portal-main .strategy-stepper {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  padding-bottom: 4px;
}

.portal-main .analysis-workflow-steps article,
.portal-main .strategy-stepper article {
  flex: 0 0 auto;
  min-width: 118px;
  padding: 9px 10px;
  border: 1px solid rgba(134, 190, 235, 0.12);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.025);
}

.portal-main .analysis-workflow-steps span,
.portal-main .strategy-stepper span,
.portal-main .zone-heading > span {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  color: #dff6ff;
  background: rgba(92, 166, 245, 0.18);
}

.portal-main .analysis-workflow-steps strong,
.portal-main .strategy-stepper strong {
  display: block;
  margin-top: 6px;
  color: rgba(237, 243, 250, 0.88);
  font-size: 0.78rem;
}

.portal-main .analysis-input-grid,
.portal-main .strategy-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.portal-main .analysis-input-grid label,
.portal-main .strategy-form-grid label,
.portal-main .chart-control-rail label {
  min-width: 0;
  color: rgba(198, 213, 233, 0.74);
  font-size: 0.76rem;
  font-weight: 700;
}

.portal-main .analysis-notes,
.portal-main .chart-capture-grid,
.portal-main .scenario-plan-workspace {
  grid-column: 1 / -1;
}

.portal-main .chart-capture-grid,
.portal-main .scenario-plan-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: 14px;
  margin-top: 16px;
}

.portal-main .capture-action-panel,
.portal-main .screenshot-preview-panel,
.portal-main .scenario-summary-card,
.portal-main .scenario-position-card,
.portal-main .scenario-reasoning-card,
.portal-main .scenario-risk-card,
.portal-main .strategy-guided-empty {
  padding: 16px;
  border: 1px solid rgba(135, 190, 235, 0.12);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.025);
}

.portal-main .scenario-plan-workspace {
  margin-top: 18px;
  padding: 16px;
  border: 1px solid rgba(135, 190, 235, 0.13);
  border-radius: 18px;
  background: rgba(4, 13, 27, 0.42);
}

.portal-main .scenario-plan-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.portal-main .intelligence-summary-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: 12px;
  margin-top: 14px;
}

.portal-main .confidence-meter {
  position: relative;
  display: grid;
  gap: 7px;
  margin-top: 10px;
}

.portal-main .confidence-meter i {
  display: block;
  height: 7px;
  min-width: 8px;
  max-width: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(103, 232, 249, 0.54), rgba(199, 240, 255, 0.82));
  box-shadow: 0 0 18px rgba(103, 232, 249, 0.2);
}

.portal-main .confidence-meter[data-direction="bullish"] i {
  background: linear-gradient(90deg, rgba(34, 211, 238, 0.45), rgba(125, 249, 214, 0.78));
}

.portal-main .confidence-meter[data-direction="bearish"] i {
  background: linear-gradient(90deg, rgba(200, 169, 106, 0.48), rgba(248, 113, 113, 0.68));
}

.portal-main .confidence-meter span {
  color: rgba(205, 222, 239, 0.68);
  font-size: 0.74rem;
}

.portal-main .key-level-panel {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.portal-main .key-level-panel article {
  border: 1px solid rgba(135, 190, 235, 0.1);
  border-radius: 14px;
  padding: 12px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.012)),
    rgba(1, 7, 16, 0.38);
}

.portal-main .key-level-panel span {
  color: var(--gold);
  font-size: 0.66rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.portal-main .key-level-panel p,
.portal-main .scenario-reasoning-card li {
  margin: 8px 0 0;
  color: rgba(210, 225, 242, 0.72);
  font-size: 0.82rem;
  line-height: 1.48;
}

.portal-main .scenario-reasoning-card ul {
  display: grid;
  gap: 6px;
  margin: 10px 0 0;
  padding-left: 18px;
}

.portal-main .advanced-analysis-details {
  margin-top: 14px;
  border-top: 1px solid rgba(135, 190, 235, 0.1);
  padding-top: 12px;
}

.portal-main .advanced-analysis-details summary,
.portal-main .secondary-action-menu summary {
  cursor: pointer;
  color: rgba(225, 235, 248, 0.86);
  font-weight: 700;
}

.portal-main .advanced-analysis-details > div {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.portal-main .advanced-analysis-details article {
  padding: 12px;
  border: 1px solid rgba(135, 190, 235, 0.1);
  border-radius: 13px;
  background: rgba(255, 255, 255, 0.02);
}

.portal-main .strategy-zones-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: 16px;
}

.portal-main .strategy-zone {
  padding: 16px;
}

.portal-main .zone-heading {
  justify-content: flex-start;
  margin-bottom: 14px;
}

.portal-main .zone-heading h3 {
  margin: 0;
  color: var(--text);
  font-size: 1.02rem;
  font-weight: 690;
}

.portal-main .zone-heading p {
  margin: 4px 0 0;
  color: rgba(198, 213, 233, 0.64);
  font-size: 0.84rem;
}

.portal-main .strategy-builder-panel {
  margin-top: 14px;
}

.portal-main .strategy-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 14px;
}

.portal-main .secondary-action-menu {
  position: relative;
}

.portal-main .secondary-action-menu > div {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.portal-main .strategy-plan-zone {
  margin-top: 16px;
}

.portal-main .strategy-guided-empty {
  display: grid;
  gap: 8px;
  min-height: 190px;
  place-content: center;
  text-align: center;
}

.portal-main .strategy-guided-empty h3 {
  margin: 0 auto;
  max-width: 620px;
  color: var(--text);
  font-size: clamp(1.25rem, 2.4vw, 1.8rem);
  font-weight: 690;
}

.portal-main .strategy-guided-empty p {
  max-width: 680px;
  margin: 0 auto;
  color: rgba(198, 213, 233, 0.66);
}

.portal-main .guided-empty-points {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.portal-main .guided-empty-points span {
  padding: 7px 10px;
  border: 1px solid rgba(135, 190, 235, 0.14);
  border-radius: 999px;
  color: rgba(221, 232, 246, 0.76);
  background: rgba(255, 255, 255, 0.03);
}

.portal-main .portal-locked-state,
.portal-main .membership-access-panel {
  border: var(--glass-border);
  border-radius: 18px;
  background:
    linear-gradient(145deg, rgba(10, 24, 45, 0.72), rgba(4, 11, 24, 0.88)),
    radial-gradient(circle at 12% 0%, rgba(121, 223, 246, 0.085), transparent 36%);
  box-shadow:
    0 22px 64px rgba(0, 0, 0, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(24px);
}

.portal-main .membership-hero-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 18px;
  border: 1px solid rgba(121, 223, 246, 0.15);
  border-radius: 16px;
  background:
    radial-gradient(circle at 100% 0%, rgba(121, 223, 246, 0.09), transparent 28rem),
    linear-gradient(145deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.016));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.portal-main .membership-hero-card h3 {
  margin: 0;
  color: var(--text);
  font-size: clamp(1.25rem, 2vw, 1.72rem);
  font-weight: 670;
  line-height: 1.1;
}

.portal-main .membership-hero-card p:not(.eyebrow) {
  max-width: 780px;
  margin: 8px 0 0;
  color: rgba(198, 213, 233, 0.68);
  font-size: 0.92rem;
  line-height: 1.56;
}

.portal-main .membership-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}


.portal-main .portal-locked-state {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: clamp(18px, 2.4vw, 26px);
}

.portal-main .portal-locked-state h2,
.portal-main .membership-access-head h3 {
  margin: 0;
  color: var(--text);
  font-size: clamp(1.15rem, 1.9vw, 1.62rem);
  font-weight: 660;
  line-height: 1.12;
}

.portal-main .portal-locked-state p:not(.eyebrow),
.portal-main .membership-access-head p,
.portal-main .telegram-access-grid p,
.portal-main .reactivate-membership-card p {
  max-width: 720px;
  margin: 7px 0 0;
  color: rgba(198, 213, 233, 0.66);
  font-size: 0.9rem;
  line-height: 1.55;
}

.portal-main .locked-state-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
}

.portal-main .membership-access-panel {
  margin-top: 18px;
  padding: clamp(16px, 2.1vw, 22px);
}

.portal-main .membership-access-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}

.portal-main .membership-section-label {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 15px 0 9px;
  color: rgba(204, 220, 241, 0.72);
  font-size: 0.68rem;
  font-weight: 760;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.portal-main .membership-section-label::after {
  content: "";
  flex: 1;
  height: 1px;
  background: linear-gradient(90deg, rgba(121, 223, 246, 0.18), transparent);
}

.portal-main .membership-state-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.portal-main .entitlement-grid,
.portal-main .telegram-access-grid,
.portal-main .membership-service-grid,
.portal-main .membership-support-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 0;
}

.portal-main .entitlement-card,
.portal-main .telegram-access-grid article,
.portal-main .membership-service-card,
.portal-main .membership-support-grid article,
.portal-main .reactivate-membership-card {
  border: 1px solid rgba(139, 194, 238, 0.12);
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.032), rgba(255, 255, 255, 0.015));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.portal-main .membership-service-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 10px 12px;
  min-height: 138px;
  padding: 14px;
  transition: transform 180ms ease, border-color 180ms ease, background 180ms ease, box-shadow 180ms ease;
}

.portal-main .membership-service-card:hover {
  transform: translateY(-2px);
  border-color: rgba(121, 223, 246, 0.22);
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.portal-main .membership-service-card .portal-status-pill {
  grid-column: 1 / -1;
  align-self: end;
}

.portal-main .membership-service-icon {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid rgba(121, 223, 246, 0.2);
  border-radius: 12px;
  color: var(--cyan);
  background: rgba(121, 223, 246, 0.065);
}

.portal-main .membership-service-icon svg {
  width: 20px;
  height: 20px;
  fill: currentColor;
}

.portal-main .membership-service-card strong,
.portal-main .membership-support-grid strong {
  display: block;
  color: rgba(244, 248, 253, 0.94);
  font-size: 0.94rem;
  font-weight: 670;
  line-height: 1.22;
}

.portal-main .membership-service-card p,
.portal-main .membership-support-grid p {
  margin: 5px 0 0;
  color: rgba(198, 213, 233, 0.62);
  font-size: 0.82rem;
  line-height: 1.45;
}

.portal-main .membership-service-card.is-unavailable {
  border-color: rgba(200, 169, 106, 0.15);
  background:
    linear-gradient(145deg, rgba(200, 169, 106, 0.035), rgba(255, 255, 255, 0.014));
}

.portal-main .membership-support-grid article {
  display: grid;
  gap: 8px;
  align-content: start;
  padding: 14px;
}

.portal-main .membership-support-grid span {
  color: var(--gold);
  font-size: 0.64rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.portal-main .membership-support-grid .primary-button,
.portal-main .membership-support-grid .secondary-button {
  width: fit-content;
  margin-top: 3px;
}

.portal-main .entitlement-card {
  display: grid;
  gap: 5px;
  min-height: 76px;
  padding: 12px;
}

.portal-main .entitlement-card span,
.portal-main .telegram-access-grid span {
  color: var(--gold);
  font-size: 0.64rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.portal-main .entitlement-card strong,
.portal-main .telegram-access-grid strong {
  color: rgba(241, 246, 252, 0.92);
  font-size: 0.88rem;
  font-weight: 660;
  line-height: 1.25;
}

.portal-main .entitlement-card.is-enabled {
  border-color: rgba(121, 223, 246, 0.18);
  background:
    linear-gradient(145deg, rgba(121, 223, 246, 0.055), rgba(255, 255, 255, 0.018));
}

.portal-main .entitlement-card.is-locked {
  border-color: rgba(200, 169, 106, 0.16);
  background:
    linear-gradient(145deg, rgba(200, 169, 106, 0.045), rgba(255, 255, 255, 0.018));
}

.portal-main .telegram-access-grid article {
  padding: 13px;
}

.portal-main .reactivate-membership-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 14px;
  padding: 14px;
  background:
    linear-gradient(145deg, rgba(200, 169, 106, 0.052), rgba(255, 255, 255, 0.02)),
    radial-gradient(circle at 0% 0%, rgba(121, 223, 246, 0.06), transparent 44%);
}

.portal-main .reactivate-membership-card h4 {
  margin: 0;
  color: var(--text);
  font-size: 0.98rem;
  font-weight: 660;
}

.portal-main .portal-status-pill.warning,
.portal-main .portal-status-pill.danger {
  border-color: rgba(200, 169, 106, 0.2);
  color: #ead8ad;
  background: rgba(200, 169, 106, 0.07);
}

.portal-main .portal-status-pill.positive {
  border-color: rgba(121, 223, 246, 0.22);
  color: #c9f8ff;
  background: rgba(121, 223, 246, 0.07);
}

.portal-main .carlos-workspace {
  display: grid;
  gap: 14px;
  border: var(--glass-border);
  border-radius: var(--surface-radius);
  padding: clamp(16px, 2.2vw, 24px);
  background:
    radial-gradient(circle at 12% 0%, rgba(121, 223, 246, 0.12), transparent 30rem),
    linear-gradient(145deg, rgba(10, 24, 45, 0.74), rgba(4, 11, 24, 0.9));
  box-shadow: var(--module-shadow);
  backdrop-filter: blur(24px);
}

.portal-main .carlos-head,
.portal-main .carlos-shell,
.portal-main .carlos-composer-actions,
.portal-main .carlos-head-actions {
  display: flex;
  gap: 12px;
}

.portal-main .carlos-head {
  align-items: flex-start;
  justify-content: space-between;
}

.portal-main .carlos-head h2 {
  margin: 0;
  color: var(--text);
  font-size: clamp(1.32rem, 2.3vw, 2rem);
  font-weight: 670;
  line-height: 1.08;
}

.portal-main .carlos-head p:not(.eyebrow),
.portal-main .carlos-safety-line,
.portal-main .carlos-empty-state p {
  max-width: 780px;
  margin: 8px 0 0;
  color: rgba(198, 213, 233, 0.66);
  font-size: 0.9rem;
  line-height: 1.55;
}

.portal-main .carlos-head-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.portal-main .carlos-billing-notice {
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(200, 169, 106, 0.18);
  border-radius: 14px;
  padding: 10px 12px;
  color: rgba(232, 218, 184, 0.88);
  background: rgba(200, 169, 106, 0.055);
}

.portal-main .carlos-context-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
}

.portal-main .carlos-context-strip article,
.portal-main .carlos-history-panel,
.portal-main .carlos-chat-panel {
  border: 1px solid rgba(139, 194, 238, 0.12);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.026);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.portal-main .carlos-context-strip article {
  padding: 10px 12px;
}

.portal-main .carlos-context-strip span,
.portal-main .carlos-panel-head span,
.portal-main .carlos-message > div span {
  color: var(--gold);
  font-size: 0.64rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.portal-main .carlos-context-strip strong {
  display: block;
  margin-top: 5px;
  color: rgba(244, 248, 253, 0.92);
  font-size: 0.9rem;
  font-weight: 670;
}

.portal-main .carlos-greeting-panel {
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.1fr) minmax(0, 1.2fr);
}

.portal-main .carlos-context-strip p {
  margin: 6px 0 0;
  color: rgba(198, 213, 233, 0.68);
  font-size: 0.8rem;
  line-height: 1.45;
}

.portal-main .carlos-quick-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  align-items: center;
}

.portal-main .carlos-quick-actions .primary-button,
.portal-main .carlos-quick-actions .secondary-button {
  min-height: 38px;
  font-size: 0.82rem;
}

.portal-main .carlos-shell {
  align-items: stretch;
}

.portal-main .carlos-history-panel {
  width: min(280px, 28%);
  min-width: 230px;
  padding: 12px;
}

.portal-main .carlos-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}

.portal-main .carlos-history-list {
  display: grid;
  gap: 8px;
}

.portal-main .carlos-history-list button {
  width: 100%;
  border: 1px solid rgba(139, 194, 238, 0.1);
  border-radius: 12px;
  padding: 10px;
  color: rgba(231, 240, 250, 0.88);
  text-align: left;
  background: rgba(255, 255, 255, 0.024);
}

.portal-main .carlos-history-list button.is-active {
  border-color: rgba(121, 223, 246, 0.24);
  background: rgba(121, 223, 246, 0.075);
}

.portal-main .carlos-history-list strong,
.portal-main .carlos-history-list span {
  display: block;
}

.portal-main .carlos-history-list span {
  margin-top: 4px;
  color: rgba(198, 213, 233, 0.58);
  font-size: 0.76rem;
}

.portal-main .carlos-chat-panel {
  display: grid;
  flex: 1;
  min-width: 0;
  padding: 12px;
}

.portal-main .carlos-message-list {
  display: grid;
  align-content: start;
  gap: 10px;
  min-height: 340px;
  max-height: 52vh;
  overflow: auto;
  padding: 4px;
}

.portal-main .carlos-message {
  width: min(84%, 760px);
  border: 1px solid rgba(139, 194, 238, 0.12);
  border-radius: 16px;
  padding: 12px 14px;
  background: rgba(255, 255, 255, 0.03);
  animation: panelEntrance 320ms ease both;
}

.portal-main .carlos-message.user {
  justify-self: end;
  border-color: rgba(121, 223, 246, 0.2);
  background: rgba(121, 223, 246, 0.075);
}

.portal-main .carlos-message.assistant {
  justify-self: start;
  background:
    radial-gradient(circle at 0% 0%, rgba(121, 223, 246, 0.075), transparent 18rem),
    rgba(255, 255, 255, 0.026);
}

.portal-main .carlos-message.is-error {
  border-color: rgba(200, 169, 106, 0.2);
  background: rgba(200, 169, 106, 0.055);
}

.portal-main .carlos-message.is-streaming {
  box-shadow: 0 0 28px rgba(121, 223, 246, 0.08);
}

.portal-main .carlos-message.is-streaming p::after {
  content: "";
  display: inline-block;
  width: 26px;
  height: 8px;
  margin-left: 8px;
  border-radius: 999px;
  background:
    radial-gradient(circle, rgba(210, 248, 255, 0.95) 20%, transparent 24%) 0 50% / 9px 9px repeat-x;
  animation: carlosThinking 1.1s linear infinite;
}

.portal-main .carlos-message > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.portal-main .carlos-message time {
  color: rgba(198, 213, 233, 0.52);
  font-size: 0.72rem;
}

.portal-main .carlos-message p {
  margin: 8px 0 0;
  white-space: pre-wrap;
  color: rgba(239, 245, 252, 0.9);
  font-size: 0.92rem;
  line-height: 1.58;
}

.portal-main .carlos-structured-card {
  display: grid;
  gap: 12px;
  margin-top: 12px;
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 14px;
  padding: 13px;
  background:
    radial-gradient(circle at 8% 0%, rgba(103, 232, 249, 0.1), transparent 14rem),
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.014)),
    rgba(1, 7, 16, 0.42);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055), 0 18px 42px rgba(0, 0, 0, 0.16);
}

.portal-main .intelligence-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.portal-main .intelligence-card-head span,
.portal-main .carlos-evidence-list article::before,
.portal-main .scenario-compare-grid span,
.portal-main .invalidation-card span {
  color: var(--gold);
  font-size: 0.66rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.portal-main .intelligence-card-head strong {
  color: rgba(218, 235, 250, 0.84);
  font-size: 0.78rem;
  font-weight: 640;
}

.portal-main .carlos-evidence-list {
  display: grid;
  gap: 7px;
}

.portal-main .carlos-system-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.portal-main .carlos-system-card-grid article {
  min-width: 0;
  border: 1px solid rgba(135, 190, 235, 0.1);
  border-radius: 12px;
  padding: 10px;
  background: rgba(1, 7, 16, 0.34);
}

.portal-main .carlos-system-card-grid span {
  display: block;
  color: var(--gold);
  font-size: 0.66rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.portal-main .carlos-system-card-grid p {
  margin: 6px 0 0;
  color: rgba(221, 234, 247, 0.78);
  font-size: 0.82rem;
  line-height: 1.48;
}

.portal-main .carlos-evidence-list article {
  position: relative;
  border: 1px solid rgba(135, 190, 235, 0.09);
  border-radius: 11px;
  padding: 9px 10px 9px 28px;
  color: rgba(224, 236, 248, 0.78);
  background: rgba(255, 255, 255, 0.025);
  font-size: 0.82rem;
  line-height: 1.45;
}

.portal-main .carlos-evidence-list article::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 15px;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: rgba(103, 232, 249, 0.72);
  box-shadow: 0 0 12px rgba(103, 232, 249, 0.28);
}

.portal-main .scenario-compare-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.portal-main .scenario-compare-grid article,
.portal-main .invalidation-card {
  border: 1px solid rgba(135, 190, 235, 0.1);
  border-radius: 12px;
  padding: 10px;
  background: rgba(1, 7, 16, 0.34);
}

.portal-main .scenario-compare-grid p,
.portal-main .invalidation-card p,
.portal-main .risk-note {
  margin: 6px 0 0;
  color: rgba(221, 234, 247, 0.78);
  font-size: 0.82rem;
  line-height: 1.48;
}

.portal-main .risk-note {
  border-left: 2px solid rgba(200, 169, 106, 0.58);
  padding-left: 10px;
  color: rgba(235, 222, 194, 0.82);
}

.portal-main .carlos-empty-state {
  display: grid;
  place-content: center;
  min-height: 300px;
  text-align: center;
}

.portal-main .carlos-empty-state h3 {
  margin: 0;
  color: var(--text);
  font-size: clamp(1.15rem, 2vw, 1.6rem);
  font-weight: 670;
}

.portal-main .carlos-empty-state div,
.portal-main .carlos-suggested-prompts {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-top: 14px;
}

.portal-main .carlos-empty-state div span,
.portal-main .carlos-suggested-prompts button {
  border: 1px solid rgba(139, 194, 238, 0.13);
  border-radius: 999px;
  padding: 7px 10px;
  color: rgba(221, 232, 246, 0.78);
  background: rgba(255, 255, 255, 0.03);
}

.portal-main .carlos-suggested-prompts {
  justify-content: flex-start;
  padding: 10px 4px;
}

.portal-main .carlos-suggested-prompts button {
  cursor: pointer;
  font: inherit;
  transition: transform 140ms ease, border-color 140ms ease, background 140ms ease;
}

.portal-main .carlos-suggested-prompts button:hover,
.portal-main .carlos-quick-actions .primary-button:hover,
.portal-main .carlos-quick-actions .secondary-button:hover {
  transform: translateY(-1px);
  border-color: rgba(121, 223, 246, 0.28);
}

.portal-main .carlos-composer {
  display: grid;
  gap: 10px;
  border-top: 1px solid rgba(139, 194, 238, 0.1);
  padding-top: 12px;
}

.portal-main .carlos-composer textarea {
  width: 100%;
  min-height: 74px;
  border: 1px solid rgba(139, 194, 238, 0.14);
  border-radius: 14px;
  padding: 13px 14px;
  color: rgba(244, 248, 253, 0.92);
  background: rgba(1, 7, 16, 0.58);
  resize: vertical;
}

.portal-main .carlos-composer-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

@keyframes carlosThinking {
  from {
    background-position-x: 0;
  }
  to {
    background-position-x: 18px;
  }
}

.portal-main .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
}

@media (max-width: 1120px) {
  .portal-main .chart-reader-terminal,
  .portal-main .strategy-zones-grid,
  .portal-main .chart-capture-grid,
  .portal-main .scenario-plan-grid,
  .portal-main .intelligence-summary-grid,
  .portal-main .key-level-panel {
    grid-template-columns: 1fr;
  }

  .portal-main .tradingview-widget-container {
    min-height: 470px;
  }
}

@media (max-width: 760px) {
  .admin-intelligence-shell,
  .portal-shell {
    display: block;
  }

  .admin-intelligence-shell .admin-sidebar,
  .portal-shell .portal-sidebar {
    position: sticky;
    top: 0;
    z-index: 20;
    width: 100%;
    max-height: 72vh;
    overflow: auto;
  }

  .portal-main .chart-reader-head,
  .portal-main .strategy-lab-head,
  .admin-intelligence-shell .topbar,
  .portal-main .portal-topbar {
    flex-direction: column;
  }

  .portal-main .analysis-input-grid,
  .portal-main .strategy-form-grid,
  .portal-main .advanced-analysis-details > div,
  .portal-main .membership-state-grid,
  .portal-main .entitlement-grid,
  .portal-main .telegram-access-grid,
  .portal-main .membership-service-grid,
  .portal-main .membership-support-grid {
    grid-template-columns: 1fr;
  }

  .portal-main .portal-locked-state,
  .portal-main .membership-access-head,
  .portal-main .membership-hero-card,
  .portal-main .carlos-head,
  .portal-main .carlos-shell,
  .portal-main .reactivate-membership-card {
    flex-direction: column;
    align-items: stretch;
  }

  .portal-main .membership-hero-actions,
  .portal-main .carlos-head-actions,
  .portal-main .carlos-composer-actions {
    justify-content: flex-start;
  }

  .portal-main .carlos-context-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .portal-main .carlos-history-panel {
    width: 100%;
    min-width: 0;
  }

  .portal-main .scenario-compare-grid {
    grid-template-columns: 1fr;
  }

  .portal-main .carlos-greeting-panel,
  .portal-main .carlos-system-card-grid {
    grid-template-columns: 1fr;
  }

  .portal-main .carlos-message {
    width: 100%;
  }

  .portal-main .carlos-quick-actions .primary-button,
  .portal-main .carlos-quick-actions .secondary-button,
  .portal-main .carlos-composer-actions .primary-button,
  .portal-main .carlos-composer-actions .secondary-button {
    flex: 1 1 150px;
    justify-content: center;
  }

  .portal-main .locked-state-actions {
    justify-content: flex-start;
  }
}

@media (prefers-reduced-motion: reduce) {
  .portal-main .carlos-message.is-streaming p::after {
    animation: none;
  }

  .portal-main .carlos-suggested-prompts button:hover,
  .portal-main .carlos-quick-actions .primary-button:hover,
  .portal-main .carlos-quick-actions .secondary-button:hover {
    transform: none;
  }
}

/* Unified AUREX Intelligence system */
.admin-intelligence-body,
.portal-body {
  font-family: "Manrope", "Inter", "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: 0;
}

.unified-page-header,
.context-strip,
.operations-center,
.admin-analytics-grid,
.education-editor-panel,
.quiz-builder-panel,
.chart-panel {
  border: 1px solid rgba(88, 179, 255, 0.18);
  background:
    linear-gradient(145deg, rgba(12, 26, 48, 0.84), rgba(5, 12, 28, 0.92)),
    radial-gradient(circle at 18% 0%, rgba(43, 149, 255, 0.16), transparent 34%);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(24px);
}

.unified-page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 22px;
  border-radius: 18px;
}

.unified-page-header h3,
.operations-center h3,
.education-editor-panel h3,
.quiz-builder-panel h3,
.chart-panel h3 {
  margin: 0;
  font-size: clamp(1.25rem, 2vw, 1.8rem);
  font-weight: 720;
  line-height: 1.08;
  color: #f5fbff;
}

.unified-page-header p:not(.eyebrow) {
  max-width: 720px;
  margin: 8px 0 0;
  color: rgba(216, 232, 255, 0.72);
  line-height: 1.55;
}

.context-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  border-radius: 18px;
}

.context-strip article {
  min-width: 0;
  padding: 18px;
  background: rgba(255, 255, 255, 0.025);
}

.context-strip span,
.activity-feed span {
  display: block;
  color: rgba(177, 210, 245, 0.68);
  font-size: 0.72rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.context-strip strong {
  display: block;
  margin-top: 7px;
  color: #f8fcff;
  font-size: clamp(1.15rem, 2vw, 1.8rem);
  font-weight: 760;
  line-height: 1;
}

.context-strip small {
  display: block;
  margin-top: 8px;
  color: rgba(211, 228, 250, 0.58);
  line-height: 1.4;
}

.admin-analytics-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  padding: 16px;
  border-radius: 22px;
}

.operations-center {
  padding: 18px;
  border-radius: 22px;
}

.activity-feed {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.activity-feed article {
  min-width: 0;
  padding: 15px;
  border: 1px solid rgba(120, 190, 255, 0.14);
  border-radius: 14px;
  background: rgba(2, 9, 23, 0.34);
}

.activity-feed strong {
  display: block;
  margin-top: 9px;
  color: #f5fbff;
  font-size: 0.98rem;
  line-height: 1.25;
}

.activity-feed p {
  margin: 7px 0 0;
  color: rgba(214, 231, 255, 0.62);
  font-size: 0.86rem;
  line-height: 1.45;
}

.education-admin-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(340px, 0.95fr);
  gap: 16px;
  align-items: start;
}

.education-editor-panel,
.quiz-builder-panel,
.chart-panel {
  padding: 18px;
  border-radius: 22px;
}

.education-editor-grid,
.quiz-question-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}

.education-editor-grid label,
.quiz-question-form label,
.revenue-settings-panel label,
.export-controls label {
  min-width: 0;
}

.education-editor-grid input,
.education-editor-grid textarea,
.education-editor-grid select,
.quiz-question-form input,
.quiz-question-form textarea,
.quiz-question-form select {
  width: 100%;
}

.education-description-field {
  grid-column: 1 / -1;
}

.education-description-field textarea {
  min-height: 104px;
  resize: vertical;
}

.education-action-row,
.table-action-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.education-action-row {
  margin-top: 16px;
}

.education-library-controls {
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(170px, 0.35fr) minmax(170px, 0.35fr);
  gap: 12px;
  padding: 16px;
  border: 1px solid rgba(88, 179, 255, 0.16);
  border-radius: 18px;
  background: rgba(4, 14, 31, 0.64);
  backdrop-filter: blur(20px);
}

.education-library-controls label {
  min-width: 0;
}

.education-library-controls input,
.education-library-controls select {
  width: 100%;
}

tr.is-hidden {
  display: none;
}

.compact-action {
  min-height: 34px;
  padding: 8px 11px;
  font-size: 0.78rem;
}

.event-control-row {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

.portal-notification-center,
.admin-notification-center {
  min-width: min(100%, 340px);
  border: 1px solid rgba(103, 232, 249, 0.14);
  border-radius: 18px;
  padding: 12px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.09), transparent 14rem),
    rgba(2, 10, 22, 0.56);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 18px 44px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(18px);
}

.portal-notification-center .panel-header,
.admin-notification-center .panel-header {
  align-items: start;
  gap: 10px;
  margin-bottom: 10px;
}

.portal-notification-center select,
.admin-notification-center select {
  min-height: 34px;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 10px;
  color: rgba(239, 247, 255, 0.92);
  background: rgba(1, 8, 20, 0.72);
}

.notification-list {
  display: grid;
  gap: 8px;
}

.notification-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: start;
  border: 1px solid rgba(103, 232, 249, 0.09);
  border-left: 3px solid rgba(103, 232, 249, 0.4);
  border-radius: 12px;
  padding: 10px;
  background: rgba(1, 7, 16, 0.34);
}

.notification-item.is-unread {
  background: rgba(245, 184, 75, 0.05);
  box-shadow: inset 3px 0 0 rgba(245, 184, 75, 0.6), inset 0 0 0 1px rgba(245, 184, 75, 0.14);
}
.notification-item.is-unread > div:first-child strong::before {
  content: "";
  display: inline-block;
  width: 7px; height: 7px; margin-right: 7px; vertical-align: middle;
  border-radius: 50%; background: #f5b84b;
  box-shadow: 0 0 0 3px rgba(245, 184, 75, 0.18);
}
@media (hover: hover) {
  .notification-item { transition: border-color 150ms ease, background 150ms ease; }
  .notification-item:hover { border-color: rgba(103, 232, 249, 0.22); background: rgba(4, 12, 24, 0.5); }
}
@media (prefers-reduced-motion: reduce) { .notification-item { transition: none; } }

.notification-item.warning {
  border-left-color: rgba(245, 184, 75, 0.82);
}

.notification-item.critical {
  border-left-color: rgba(255, 99, 132, 0.85);
}

.notification-item.success {
  border-left-color: rgba(79, 209, 197, 0.8);
}

.notification-item strong {
  display: block;
  color: #f5fbff;
  font-size: 0.88rem;
  line-height: 1.25;
}

.notification-item p {
  margin: 5px 0;
  color: rgba(204, 219, 236, 0.72);
  font-size: 0.78rem;
  line-height: 1.42;
}

.notification-item small {
  color: rgba(198, 211, 229, 0.54);
  font-size: 0.68rem;
}

.notification-actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 6px;
}

.admin-notification-center .notification-item {
  grid-template-columns: minmax(0, 1fr) minmax(160px, auto);
}

.client-recommendation-panel,
.admin-action-queue {
  position: relative;
  overflow: hidden;
}

.client-recommendation-panel::before,
.admin-action-queue::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(103, 232, 249, 0.42), transparent);
  pointer-events: none;
}

.recommendation-primary-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: center;
  margin-top: 14px;
  padding: 16px;
  border: 1px solid rgba(103, 232, 249, 0.14);
  border-radius: 16px;
  background:
    radial-gradient(circle at top right, rgba(28, 117, 255, 0.14), transparent 34%),
    linear-gradient(145deg, rgba(9, 25, 54, 0.72), rgba(3, 10, 24, 0.58));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06), 0 18px 42px rgba(0, 0, 0, 0.24);
}

.recommendation-primary-card p,
.recommendation-copy {
  margin: 0;
  color: rgba(221, 234, 247, 0.84);
  line-height: 1.55;
}

.recommendation-primary-card small {
  display: block;
  margin-top: 8px;
  color: rgba(167, 188, 213, 0.72);
  font-size: 0.78rem;
  line-height: 1.45;
}

.recommendation-actions {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  min-width: 180px;
}

.recommendation-secondary-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

.recommendation-secondary-list article {
  min-width: 0;
  padding: 12px;
  border: 1px solid rgba(103, 232, 249, 0.1);
  border-radius: 14px;
  background: rgba(1, 8, 20, 0.36);
}

.recommendation-secondary-list span {
  display: block;
  margin-bottom: 5px;
  color: rgba(103, 232, 249, 0.82);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.recommendation-secondary-list strong {
  display: block;
  color: #f5fbff;
  font-size: 0.86rem;
  line-height: 1.25;
}

.recommendation-secondary-list p {
  margin: 6px 0 8px;
  color: rgba(204, 219, 236, 0.68);
  font-size: 0.76rem;
  line-height: 1.42;
}

.recommendation-secondary-list a {
  color: rgba(174, 225, 255, 0.92);
  font-size: 0.76rem;
  font-weight: 800;
  text-decoration: none;
}

.recommendation-status-message {
  margin-top: 10px;
  padding: 9px 11px;
  border: 1px solid rgba(79, 209, 197, 0.24);
  border-radius: 12px;
  color: rgba(221, 255, 250, 0.92);
  background: rgba(20, 184, 166, 0.1);
  font-size: 0.8rem;
}

.chart-connected-state {
  margin: 12px 0;
}

.chart-connected-state.is-hidden {
  display: none;
}

.chart-connected-state-inner {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(79, 209, 197, 0.18);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(9, 25, 54, 0.7), rgba(2, 11, 26, 0.62));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 16px 38px rgba(0, 0, 0, 0.22);
}

.chart-connected-state-inner article {
  min-width: 0;
  padding: 10px;
  border: 1px solid rgba(103, 232, 249, 0.1);
  border-radius: 12px;
  background: rgba(20, 184, 166, 0.06);
}

.chart-connected-state-inner strong {
  display: block;
  color: #f5fbff;
  font-size: 0.78rem;
  line-height: 1.25;
}

.chart-connected-state-inner span {
  display: block;
  margin-top: 4px;
  color: rgba(190, 210, 232, 0.72);
  font-size: 0.7rem;
  line-height: 1.35;
}

.recommendation-filter-panel {
  margin-bottom: 12px;
}

.mono-chip {
  display: inline-flex;
  max-width: 100%;
  padding: 5px 8px;
  border: 1px solid rgba(103, 232, 249, 0.14);
  border-radius: 999px;
  color: rgba(225, 241, 255, 0.9);
  background: rgba(3, 13, 30, 0.58);
  font-size: 0.72rem;
  line-height: 1;
}

@media (max-width: 760px) {
  .recommendation-primary-card {
    grid-template-columns: 1fr;
  }

  .recommendation-actions {
    justify-content: flex-start;
    min-width: 0;
  }

  .recommendation-secondary-list {
    grid-template-columns: 1fr;
  }

  .chart-connected-state-inner {
    grid-template-columns: 1fr;
  }
}

.step-flow {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
}

.step-flow article {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px 10px;
  padding: 12px;
  border: 1px solid rgba(111, 190, 255, 0.14);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.025);
}

.step-flow article span {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 999px;
  color: #dff3ff;
  background: rgba(38, 145, 255, 0.16);
}

.step-flow article.is-active {
  border-color: rgba(74, 172, 255, 0.38);
  box-shadow: 0 0 0 1px rgba(74, 172, 255, 0.08), 0 18px 44px rgba(0, 92, 190, 0.16);
}

.chart-panel {
  min-width: 0;
}

.confirmation-modal {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(1, 5, 14, 0.72);
  backdrop-filter: blur(18px);
}

.confirmation-card {
  width: min(460px, 100%);
  padding: 22px;
  border: 1px solid rgba(91, 183, 255, 0.24);
  border-radius: 20px;
  background:
    linear-gradient(145deg, rgba(12, 28, 53, 0.94), rgba(3, 9, 22, 0.98)),
    radial-gradient(circle at 0 0, rgba(80, 171, 255, 0.18), transparent 38%);
  box-shadow: 0 34px 90px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

.confirmation-card h3 {
  margin: 0;
  color: #f6fbff;
}

.confirmation-card p:not(.eyebrow) {
  color: rgba(216, 232, 255, 0.68);
  line-height: 1.55;
}

.cloud-control-panel,
.portal-auth-card {
  border: 1px solid rgba(92, 181, 255, 0.18);
  background:
    linear-gradient(145deg, rgba(9, 24, 47, 0.86), rgba(3, 9, 22, 0.94)),
    radial-gradient(circle at 12% 0%, rgba(72, 165, 255, 0.15), transparent 34%);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(24px);
}

.cloud-control-panel {
  padding: 18px;
  border-radius: 20px;
}

.cloud-status-row {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
}

.cloud-status-row h3 {
  margin: 0;
  color: #f7fbff;
  font-size: 1.18rem;
  font-weight: 720;
}

.cloud-status-row p {
  margin: 7px 0 0;
  color: rgba(213, 230, 255, 0.66);
  line-height: 1.45;
}

.cloud-error {
  display: block;
  margin-top: 8px;
  color: #ff9aa7;
}

.cloud-status-pills,
.cloud-action-stack {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.cloud-config-drawer {
  margin-top: 14px;
}

.cloud-config-drawer summary {
  cursor: pointer;
  color: #dcefff;
  font-size: 0.84rem;
  font-weight: 760;
}

.cloud-control-grid {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(260px, 1fr) auto;
  gap: 14px;
  margin-top: 14px;
}

.cloud-config-drawer.is-login-open {
  margin-top: 18px;
}

.cloud-config-drawer.is-login-open summary {
  color: rgba(220, 239, 255, 0.82);
}

.cloud-config-drawer.is-login-open .cloud-control-grid {
  grid-template-columns: minmax(0, 560px);
  justify-content: center;
  padding: clamp(10px, 2vw, 18px) 0 4px;
}

.cloud-control-grid form,
.cloud-action-stack {
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(120, 190, 255, 0.12);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.025);
}

.cloud-config-drawer.is-login-open #cloudConfigForm,
.cloud-config-drawer.is-login-open .cloud-action-stack {
  display: none;
}

.cloud-config-drawer.is-login-open #cloudLoginForm {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  gap: 14px;
  padding: clamp(20px, 3vw, 30px);
  border-color: rgba(122, 202, 255, 0.26);
  border-radius: 24px;
  background:
    radial-gradient(circle at 12% 0%, rgba(103, 232, 249, 0.15), transparent 34%),
    radial-gradient(circle at 92% 18%, rgba(59, 130, 246, 0.14), transparent 34%),
    linear-gradient(145deg, rgba(8, 22, 43, 0.9), rgba(2, 8, 20, 0.96));
  box-shadow:
    0 34px 100px rgba(0, 0, 0, 0.42),
    0 0 0 1px rgba(255, 255, 255, 0.035) inset,
    inset 0 1px 0 rgba(255, 255, 255, 0.09);
  backdrop-filter: blur(28px) saturate(145%);
  -webkit-backdrop-filter: blur(28px) saturate(145%);
}

.cloud-config-drawer.is-login-open #cloudLoginForm::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(120deg, transparent 18%, rgba(255, 255, 255, 0.06), transparent 42%),
    linear-gradient(rgba(126, 199, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(126, 199, 255, 0.028) 1px, transparent 1px);
  background-size: 100% 100%, 38px 38px, 38px 38px;
  opacity: 0.58;
}

.cloud-login-copy h3 {
  margin: 0;
  color: #f7fbff;
  font-size: clamp(1.18rem, 1.9vw, 1.58rem);
  font-weight: 660;
  line-height: 1.15;
}

.cloud-login-copy p:not(.eyebrow) {
  max-width: 520px;
  margin: 8px 0 0;
  color: rgba(213, 230, 255, 0.68);
  font-size: 0.91rem;
  line-height: 1.55;
}

.cloud-config-drawer.is-login-open #cloudLoginForm input {
  min-height: 46px;
  border-color: rgba(121, 223, 246, 0.2);
  background: rgba(3, 12, 28, 0.76);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.cloud-config-drawer.is-login-open #cloudLoginForm input:focus {
  border-color: rgba(121, 223, 246, 0.46);
  box-shadow: 0 0 0 3px rgba(61, 169, 255, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.cloud-control-grid label,
.portal-auth-form label {
  display: grid;
  gap: 7px;
  color: rgba(213, 230, 255, 0.72);
  font-size: 0.78rem;
  font-weight: 720;
}

.cloud-control-grid input,
.portal-auth-form input {
  width: 100%;
}

.admin-secure-gate {
  position: relative;
  display: grid;
  min-height: 100vh;
  place-items: center;
  overflow: hidden;
  padding: clamp(22px, 5vw, 64px);
  background:
    radial-gradient(circle at 18% 10%, rgba(92, 181, 255, 0.16), transparent 27rem),
    radial-gradient(circle at 82% 16%, rgba(103, 232, 249, 0.09), transparent 28rem),
    linear-gradient(145deg, #020814, #061222 52%, #020814);
}

.admin-secure-gate::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(rgba(126, 199, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(126, 199, 255, 0.03) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: radial-gradient(circle at 50% 32%, #000, transparent 72%);
  opacity: 0.62;
}

.admin-secure-gate .admin-mfa-panel {
  width: min(760px, 100%);
}

.admin-secure-gate .primary-button,
.admin-secure-gate .secondary-button {
  min-height: 42px;
  border-radius: 12px;
  font-weight: 690;
  letter-spacing: 0;
  text-decoration: none;
}

.admin-secure-gate .primary-button {
  border: 1px solid rgba(126, 205, 255, 0.35);
  color: #fbfdff;
  background: linear-gradient(135deg, rgba(62, 144, 236, 0.92), rgba(19, 67, 128, 0.88));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 16px 34px rgba(38, 120, 220, 0.2);
}

.admin-secure-gate .secondary-button {
  border: 1px solid rgba(141, 190, 230, 0.18);
  color: rgba(230, 238, 249, 0.88);
  background: rgba(255, 255, 255, 0.035);
}

.admin-secure-gate .primary-button:hover,
.admin-secure-gate .secondary-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 42px rgba(0, 0, 0, 0.22);
}

.admin-secure-gate .cloud-auth-status {
  padding-top: 2px;
}

.admin-route-content,
.portal-route-content {
  min-height: 320px;
  opacity: 1;
}

.admin-route-content,
.portal-route-content {
  contain: layout paint;
  will-change: opacity;
}

.admin-route-content.route-content-enter,
.portal-route-content.route-content-enter {
  animation: routeContentFade 160ms ease both;
}

.admin-route-content .page-rise,
.admin-route-content .page-load-panel,
.admin-route-content .admin-table tbody tr,
.portal-route-content .page-rise,
.portal-route-content .page-load-panel,
.portal-route-content .carlos-message {
  animation: none !important;
}

@keyframes routeContentFade {
  from { opacity: 0.92; }
  to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .admin-route-content.route-content-enter,
  .portal-route-content.route-content-enter {
    animation: none;
  }

  .admin-route-content,
  .portal-route-content {
    will-change: auto;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .portal-main {
    animation: none !important;
  }
}

.admin-login-form {
  align-items: end;
}

.admin-mfa-panel {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  max-width: 760px;
  margin: 0 auto;
  padding: clamp(22px, 3.2vw, 34px);
  border: 1px solid rgba(122, 202, 255, 0.24);
  border-radius: 26px;
  background:
    radial-gradient(circle at 12% -8%, rgba(106, 202, 255, 0.2), transparent 34%),
    radial-gradient(circle at 86% 8%, rgba(45, 118, 255, 0.14), transparent 38%),
    linear-gradient(145deg, rgba(10, 25, 48, 0.82), rgba(3, 9, 22, 0.94));
  box-shadow:
    0 34px 110px rgba(0, 0, 0, 0.42),
    0 0 0 1px rgba(255, 255, 255, 0.035) inset,
    inset 0 1px 0 rgba(255, 255, 255, 0.09);
  backdrop-filter: blur(30px) saturate(145%);
  -webkit-backdrop-filter: blur(30px) saturate(145%);
}

.admin-mfa-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(120deg, transparent 18%, rgba(255, 255, 255, 0.075), transparent 42%),
    linear-gradient(rgba(126, 199, 255, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(126, 199, 255, 0.035) 1px, transparent 1px);
  background-size: 100% 100%, 38px 38px, 38px 38px;
  opacity: 0.55;
}

.security-gate-panel {
  display: grid;
  gap: 20px;
}

.security-orbit {
  position: absolute;
  top: -78px;
  right: -64px;
  width: 190px;
  aspect-ratio: 1;
  border: 1px solid rgba(121, 223, 246, 0.16);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(96, 189, 255, 0.16), transparent 66%);
  box-shadow: 0 0 70px rgba(49, 151, 255, 0.18);
}

.security-orbit span {
  position: absolute;
  inset: 34px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: inherit;
}

.admin-mfa-copy h3 {
  margin: 0;
  color: #f7fbff;
  font-size: clamp(1.16rem, 1.75vw, 1.48rem);
  font-weight: 660;
  letter-spacing: 0;
  line-height: 1.16;
}

.admin-mfa-copy p:not(.eyebrow),
.mfa-manual-key p {
  max-width: 620px;
  margin: 8px 0 0;
  color: rgba(213, 230, 255, 0.68);
  font-size: 0.91rem;
  line-height: 1.55;
}

.security-stepper {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 18px;
}

.security-stepper span {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 9px 10px;
  border: 1px solid rgba(117, 180, 235, 0.12);
  border-radius: 999px;
  color: rgba(199, 221, 247, 0.58);
  background: rgba(255, 255, 255, 0.025);
  font-size: 0.72rem;
  font-weight: 680;
}

.security-stepper i {
  display: grid;
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  place-items: center;
  border-radius: 50%;
  color: rgba(220, 238, 255, 0.72);
  background: rgba(82, 166, 255, 0.12);
  font-style: normal;
  font-size: 0.68rem;
}

.security-stepper .is-active {
  color: #f7fbff;
  border-color: rgba(121, 223, 246, 0.34);
  background: linear-gradient(180deg, rgba(65, 149, 255, 0.15), rgba(255, 255, 255, 0.035));
  box-shadow: 0 12px 34px rgba(40, 130, 255, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.security-stepper .is-complete {
  color: rgba(213, 230, 255, 0.8);
}

.security-stepper .is-complete i,
.security-stepper .is-active i {
  color: #03101f;
  background: linear-gradient(135deg, #8de7ff, #4fa8ff);
}

.mfa-enrollment-grid {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 14px;
  margin-top: 18px;
}

.mfa-qr-frame,
.mfa-manual-key,
.admin-mfa-form {
  border: 1px solid rgba(120, 190, 255, 0.18);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.022)),
    rgba(2, 11, 25, 0.4);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 20px 44px rgba(0, 0, 0, 0.18);
}

.mfa-qr-frame {
  display: grid;
  place-items: center;
  min-height: 190px;
  padding: 14px;
}

.mfa-qr-frame img {
  width: 168px;
  max-width: 100%;
  border-radius: 14px;
  background: #fff;
  padding: 10px;
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.28);
}

.mfa-manual-key {
  padding: 16px;
}

.mfa-manual-key span {
  display: block;
  color: rgba(213, 230, 255, 0.7);
  font-size: 0.72rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.mfa-manual-key code {
  display: block;
  margin-top: 9px;
  padding: 12px 13px;
  border: 1px solid rgba(212, 180, 106, 0.22);
  border-radius: 14px;
  color: #f7dd98;
  background: rgba(212, 180, 106, 0.07);
  overflow-wrap: anywhere;
  font-size: 0.86rem;
  line-height: 1.55;
}

.admin-mfa-form {
  display: flex;
  align-items: end;
  gap: 12px;
  margin-top: 16px;
  padding: 14px;
}

.admin-mfa-form label {
  display: grid;
  flex: 1;
  gap: 7px;
  color: rgba(213, 230, 255, 0.74);
  font-size: 0.78rem;
  font-weight: 720;
}

.admin-mfa-form input {
  width: 100%;
  min-height: 48px;
  border-color: rgba(121, 223, 246, 0.22);
  font-size: 1.18rem;
  letter-spacing: 0.22em;
  text-align: center;
  font-variant-numeric: tabular-nums;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.admin-mfa-form input:focus {
  border-color: rgba(121, 223, 246, 0.46);
  box-shadow: 0 0 0 3px rgba(61, 169, 255, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.mfa-error {
  margin: 14px 0 0;
  padding: 12px 13px;
  border: 1px solid rgba(255, 154, 167, 0.18);
  border-radius: 14px;
  color: #ffc4cc;
  background: rgba(255, 154, 167, 0.065);
  font-size: 0.87rem;
}

.mfa-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}

.mfa-progress-line {
  height: 4px;
  margin-top: 18px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(120, 190, 255, 0.12);
}

.mfa-progress-line span {
  display: block;
  width: 42%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(82, 166, 255, 0.2), rgba(121, 223, 246, 0.8));
  animation: mfaProgressSweep 1.35s ease-in-out infinite;
}

@keyframes mfaProgressSweep {
  0% { transform: translateX(-110%); }
  55% { transform: translateX(85%); }
  100% { transform: translateX(175%); }
}

@media (prefers-reduced-motion: reduce) {
  .mfa-progress-line span {
    animation: none;
    transform: none;
  }
}

.cloud-action-stack {
  align-content: start;
  flex-direction: column;
}

.portal-auth-screen {
  min-height: calc(100vh - 80px);
  display: grid;
  place-items: center;
  padding: clamp(24px, 5vw, 64px);
}

.portal-body.portal-secure-gated .portal-shell {
  grid-template-columns: minmax(0, 1fr);
}

.portal-body.portal-secure-gated .portal-sidebar {
  display: none;
}

.portal-body.portal-secure-gated .portal-main {
  max-width: none;
  min-height: 100vh;
  padding: 0;
}

.portal-body.portal-booting {
  min-height: 100vh;
  background:
    radial-gradient(circle at 50% 0%, rgba(50, 142, 255, 0.14), transparent 34%),
    linear-gradient(180deg, #04101f 0%, #061426 52%, #030914 100%);
}

.portal-body.portal-booting #portalApp {
  min-height: 100vh;
  visibility: hidden;
  opacity: 0;
}

.portal-body.portal-ready #portalApp {
  visibility: visible;
  opacity: 1;
  transition: opacity 150ms ease;
}

.portal-auth-card {
  width: min(560px, 100%);
  padding: clamp(24px, 5vw, 42px);
  border-radius: 26px;
}

.portal-secure-entry {
  position: relative;
  min-height: 100vh;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 8%, rgba(92, 181, 255, 0.16), transparent 26rem),
    radial-gradient(circle at 82% 18%, rgba(103, 232, 249, 0.09), transparent 28rem);
}

.portal-secure-entry::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(rgba(126, 199, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(126, 199, 255, 0.03) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: radial-gradient(circle at 50% 30%, #000, transparent 72%);
  opacity: 0.65;
}

.portal-secure-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-color: rgba(122, 202, 255, 0.24);
  background:
    radial-gradient(circle at 10% 0%, rgba(103, 232, 249, 0.14), transparent 36%),
    linear-gradient(145deg, rgba(9, 24, 47, 0.86), rgba(3, 9, 22, 0.96));
  box-shadow:
    0 34px 110px rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.085);
  backdrop-filter: blur(30px) saturate(145%);
  -webkit-backdrop-filter: blur(30px) saturate(145%);
}

.portal-secure-card::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  content: "";
  background: linear-gradient(120deg, transparent 18%, rgba(255, 255, 255, 0.07), transparent 42%);
  opacity: 0.7;
}

.portal-secure-orb {
  position: absolute;
  top: -92px;
  right: -74px;
  width: 210px;
  aspect-ratio: 1;
  border: 1px solid rgba(121, 223, 246, 0.16);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(96, 189, 255, 0.15), transparent 66%);
  box-shadow: 0 0 80px rgba(49, 151, 255, 0.18);
}

.portal-secure-orb span {
  position: absolute;
  inset: 38px;
  border: 1px solid rgba(255, 255, 255, 0.11);
  border-radius: inherit;
}

.portal-secure-stepper {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 22px;
}

.portal-secure-stepper span {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  padding: 8px 9px;
  border: 1px solid rgba(117, 180, 235, 0.12);
  border-radius: 999px;
  color: rgba(199, 221, 247, 0.58);
  background: rgba(255, 255, 255, 0.025);
  font-size: 0.7rem;
  font-weight: 680;
}

.portal-secure-stepper i {
  display: grid;
  flex: 0 0 19px;
  width: 19px;
  height: 19px;
  place-items: center;
  border-radius: 50%;
  color: rgba(220, 238, 255, 0.72);
  background: rgba(82, 166, 255, 0.12);
  font-style: normal;
  font-size: 0.64rem;
}

.portal-secure-stepper .is-active {
  color: #f7fbff;
  border-color: rgba(121, 223, 246, 0.34);
  background: linear-gradient(180deg, rgba(65, 149, 255, 0.15), rgba(255, 255, 255, 0.035));
  box-shadow: 0 12px 34px rgba(40, 130, 255, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.portal-secure-stepper .is-complete i,
.portal-secure-stepper .is-active i {
  color: #03101f;
  background: linear-gradient(135deg, #8de7ff, #4fa8ff);
}

.portal-secure-loader {
  height: 4px;
  margin-top: 24px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(120, 190, 255, 0.12);
}

.portal-secure-loader span {
  display: block;
  width: 42%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(82, 166, 255, 0.18), rgba(121, 223, 246, 0.82));
  animation: portalSecureSweep 1.35s ease-in-out infinite;
}

.portal-auth-card h1 {
  margin: 0;
  color: #f7fbff;
  font-size: clamp(1.75rem, 4vw, 2.65rem);
  line-height: 1.04;
  font-weight: 690;
}

.portal-auth-card p {
  color: rgba(219, 234, 255, 0.72);
  line-height: 1.6;
}

.portal-auth-form {
  display: grid;
  gap: 13px;
  margin-top: 22px;
}

.portal-client-entry {
  display: grid;
  place-items: center;
  padding: clamp(18px, 4vw, 44px);
}

.portal-client-entry-card {
  width: min(520px, 100%);
  padding: clamp(24px, 4vw, 38px);
}

.portal-entry-mark {
  display: grid;
  width: 52px;
  height: 52px;
  margin-bottom: 20px;
  place-items: center;
  border: 1px solid rgba(130, 211, 255, 0.28);
  border-radius: 16px;
  color: #f7fbff;
  background: linear-gradient(145deg, rgba(67, 150, 255, 0.28), rgba(255, 255, 255, 0.045));
  box-shadow: 0 18px 48px rgba(32, 128, 255, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.16);
  font-weight: 760;
  letter-spacing: 0.04em;
}

.portal-entry-copy h1 {
  font-size: clamp(1.78rem, 4vw, 2.35rem);
  font-weight: 720;
  letter-spacing: -0.022em;
  line-height: 1.08;
}

.portal-client-login-form label {
  display: grid;
  gap: 8px;
  color: rgba(219, 234, 255, 0.78);
  font-size: 0.8rem;
  font-weight: 650;
}

.portal-client-login-form input {
  width: 100%;
  min-height: 50px;
  padding: 0 16px;
  border: 1px solid rgba(137, 199, 248, 0.18);
  border-radius: 13px;
  color: #f8fbff;
  font-size: 0.95rem;
  letter-spacing: 0.004em;
  background: rgba(3, 12, 25, 0.58);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}
.portal-client-login-form input::placeholder { color: rgba(150, 176, 208, 0.5); }

.portal-password-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  border: 1px solid rgba(137, 199, 248, 0.18);
  border-radius: 13px;
  background: rgba(3, 12, 25, 0.58);
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

.portal-password-field input {
  min-height: 50px;
  padding: 0 4px 0 16px;
  border: 0;
  font-size: 0.95rem;
  background: transparent;
  box-shadow: none;
}
/* Focus lands on the wrapper so the toggle stays inside the ring. */
.portal-password-field:focus-within {
  border-color: rgba(127, 216, 247, 0.55);
  box-shadow: 0 0 0 3px rgba(108, 168, 247, 0.16);
}
.portal-password-field input:focus { outline: none; }

.portal-password-field button {
  min-height: 38px;
  margin-right: 6px;
  border: 1px solid rgba(136, 207, 255, 0.16);
  border-radius: 10px;
  color: rgba(226, 241, 255, 0.82);
  background: rgba(255, 255, 255, 0.045);
  cursor: pointer;
}

.portal-login-submit {
  margin-top: 4px;
  min-height: 50px;
  border-radius: 13px;
  font-size: 0.95rem;
  letter-spacing: 0.01em;
}

.portal-entry-actions,
.portal-entry-action-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 18px;
}

.portal-entry-actions a {
  color: rgba(205, 228, 255, 0.76);
  text-decoration: none;
  font-size: 0.84rem;
}

.portal-entry-actions a:hover {
  color: #f7fbff;
}

.portal-entry-action-grid .primary-button,
.portal-entry-action-grid .secondary-button {
  flex: 1 1 150px;
  justify-content: center;
}

.portal-entry-status {
  align-items: flex-start;
  flex-direction: column;
}

.portal-login-trust-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 14px;
}

.portal-login-trust-strip span {
  min-height: 42px;
  padding: 9px 10px;
  border: 1px solid rgba(132, 204, 255, 0.14);
  border-radius: 12px;
  color: rgba(219, 236, 255, 0.76);
  background: rgba(255, 255, 255, 0.035);
  font-size: 0.72rem;
  line-height: 1.25;
}

.portal-client-entry-card {
  border-radius: 18px;
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(70, 152, 240, 0.1), transparent 60%),
    linear-gradient(165deg, rgba(13, 27, 50, 0.72), rgba(6, 13, 26, 0.86));
  box-shadow:
    0 34px 120px rgba(0, 0, 0, 0.52),
    0 0 0 1px rgba(122, 214, 255, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.09),
    inset 0 -1px 0 rgba(122, 214, 255, 0.06);
}

.portal-client-login-form input:focus,
.portal-password-field:focus-within {
  border-color: rgba(137, 232, 255, 0.44);
  box-shadow: 0 0 0 3px rgba(67, 170, 255, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.07);
  outline: none;
}

.portal-client-entry-card .portal-entry-actions {
  justify-content: space-between;
  padding-top: 14px;
  border-top: 1px solid rgba(130, 198, 255, 0.1);
}

.cloud-auth-status {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 18px;
  color: rgba(180, 213, 248, 0.72);
  font-size: 0.86rem;
}

.cloud-auth-status strong {
  color: #ff9aa7;
}

@keyframes portalSecureSweep {
  0% { transform: translateX(-112%); }
  55% { transform: translateX(88%); }
  100% { transform: translateX(176%); }
}

@media (prefers-reduced-motion: reduce) {
  .portal-secure-loader span {
    animation: none;
    transform: none;
  }

  .portal-body.portal-ready #portalApp {
    transition: none;
  }
}

@media (max-width: 560px) {
  .portal-client-entry {
    align-items: stretch;
    padding: 16px;
  }

  .portal-client-entry-card {
    border-radius: 22px;
  }

  .portal-login-trust-strip {
    grid-template-columns: 1fr;
  }
}

/* Premium Pro access conversion page. */
.pro-conversion-page {
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto;
  padding: 22px 0 70px;
}

.pro-conversion-nav {
  margin-bottom: clamp(22px, 4vw, 44px);
}

.pro-hero,
.pro-path-strip,
.pro-pillar-card,
.pro-cta-panel,
.pro-activation-panel,
.pro-trust-panel,
.pro-membership-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(137, 216, 255, 0.16);
  border-radius: 18px;
  background:
    radial-gradient(circle at 12% 0%, rgba(101, 192, 255, 0.11), transparent 34%),
    linear-gradient(145deg, rgba(9, 25, 48, 0.82), rgba(4, 12, 28, 0.94));
  box-shadow:
    0 28px 90px rgba(0, 0, 0, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(26px) saturate(140%);
  -webkit-backdrop-filter: blur(26px) saturate(140%);
}

.pro-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(280px, 0.65fr);
  gap: clamp(18px, 4vw, 34px);
  align-items: stretch;
  padding: clamp(26px, 5vw, 52px);
}

.pro-hero-copy {
  display: grid;
  align-content: center;
  gap: 18px;
}

.pro-hero h1 {
  max-width: 760px;
  margin: 0;
  color: #f7fbff;
  font-size: clamp(2.35rem, 6vw, 4.8rem);
  line-height: 0.98;
  font-weight: 720;
  letter-spacing: 0;
}

.pro-hero p:not(.eyebrow),
.pro-section-head p,
.pro-cta-panel p,
.pro-activation-panel p,
.pro-trust-panel li,
.pro-membership-card p,
.pro-membership-card li,
.pro-pillar-card p,
.pro-path-strip p {
  color: rgba(207, 224, 244, 0.76);
  line-height: 1.58;
}

.pro-hero-copy > p:not(.eyebrow) {
  max-width: 680px;
  font-size: clamp(1rem, 2vw, 1.15rem);
}

.pro-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 11px;
  align-items: center;
}

.pro-cta-row.centered {
  justify-content: center;
}

.pro-trust-line {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.pro-trust-line span {
  padding: 8px 10px;
  border: 1px solid rgba(127, 216, 255, 0.14);
  border-radius: 999px;
  color: rgba(220, 236, 255, 0.76);
  background: rgba(255, 255, 255, 0.035);
  font-size: 0.76rem;
}

.pro-membership-card {
  display: grid;
  align-content: space-between;
  gap: 16px;
  padding: 22px;
  border-radius: 16px;
}

.pro-membership-card > span,
.pro-pillar-card > span {
  color: #c6a86a;
  font-size: 0.72rem;
  font-weight: 760;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.pro-membership-card strong {
  color: #f7fbff;
  font-size: clamp(2rem, 5vw, 3rem);
  line-height: 1;
}

.pro-membership-card ul,
.pro-trust-panel ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.pro-membership-card li,
.pro-trust-panel li {
  padding-left: 18px;
  background: linear-gradient(90deg, rgba(133, 230, 255, 0.8), rgba(133, 230, 255, 0.8)) 0 0.7em / 7px 1px no-repeat;
}

.pro-path-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
  padding: 14px;
}

.pro-path-strip article {
  display: grid;
  gap: 8px;
  padding: 16px;
  border: 1px solid rgba(127, 216, 255, 0.11);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.035);
}

.pro-path-strip span {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 10px;
  color: #04111f;
  background: linear-gradient(135deg, #9af2ff, #5caeff);
  font-weight: 760;
}

.pro-path-strip strong,
.pro-pillar-card h3,
.pro-cta-panel h2,
.pro-activation-panel h2,
.pro-trust-panel h2,
.pro-section-head h2 {
  margin: 0;
  color: #f5fbff;
}

.pro-section-head {
  display: grid;
  gap: 10px;
  max-width: 780px;
  margin: clamp(34px, 6vw, 64px) 0 18px;
}

.pro-section-head.compact {
  max-width: 720px;
  margin: 0 0 18px;
}

.pro-section-head h2 {
  font-size: clamp(1.65rem, 4vw, 3rem);
  line-height: 1.03;
}

.pro-pillar-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.pro-pillar-card {
  display: grid;
  gap: 12px;
  min-height: 230px;
  padding: clamp(20px, 3vw, 28px);
}

.pro-pillar-card h3 {
  font-size: clamp(1.18rem, 2.5vw, 1.6rem);
}

.pro-cta-panel,
.pro-trust-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-top: 16px;
  padding: clamp(20px, 4vw, 30px);
}

.pro-activation-panel {
  margin-top: 16px;
  padding: clamp(22px, 4vw, 34px);
}

.pro-activation-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}

.pro-activation-grid article {
  padding: 16px;
  border: 1px solid rgba(127, 216, 255, 0.12);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.035);
}

.pro-activation-grid strong {
  color: #f5fbff;
}

.pro-trust-panel {
  align-items: flex-start;
}

@media (max-width: 920px) {
  .pro-hero,
  .pro-path-strip,
  .pro-pillar-grid,
  .pro-activation-grid {
    grid-template-columns: 1fr;
  }

  .pro-cta-panel,
  .pro-trust-panel {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 560px) {
  .pro-conversion-page {
    width: min(100% - 24px, 1180px);
    padding-top: 14px;
  }

  .pro-hero {
    padding: 22px;
  }

  .pro-cta-row .primary-button,
  .pro-cta-row .secondary-button {
    width: 100%;
    justify-content: center;
  }
}

/* Emotional Pro Access experience. */
.pro-experience-page {
  width: min(1220px, calc(100% - 32px));
}

.pro-experience-hero,
.cashback-simulator,
.trial-journey,
.pro-story-card,
.pro-live-preview {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(144, 224, 255, 0.18);
  border-radius: 20px;
  background:
    radial-gradient(circle at 14% 0%, rgba(116, 207, 255, 0.13), transparent 34%),
    linear-gradient(145deg, rgba(9, 25, 48, 0.84), rgba(4, 12, 28, 0.95));
  box-shadow:
    0 34px 110px rgba(0, 0, 0, 0.36),
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    inset 0 -1px 0 rgba(116, 207, 255, 0.06);
  backdrop-filter: blur(28px) saturate(142%);
  -webkit-backdrop-filter: blur(28px) saturate(142%);
}

.pro-experience-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.75fr);
  gap: clamp(18px, 4vw, 34px);
  align-items: stretch;
  padding: clamp(28px, 6vw, 62px);
}

.pro-experience-hero h1 {
  max-width: 760px;
  margin: 0;
  color: #f7fbff;
  font-size: clamp(2.7rem, 7vw, 5.8rem);
  line-height: 0.93;
  font-weight: 720;
}

.pro-live-preview {
  display: grid;
  align-content: space-between;
  gap: 18px;
  min-height: 360px;
  padding: 22px;
  border-radius: 18px;
}

.preview-topline,
.preview-metric-row {
  display: flex;
  gap: 10px;
}

.preview-topline {
  justify-content: space-between;
  color: rgba(220, 236, 255, 0.72);
  font-size: 0.82rem;
}

.preview-topline strong {
  color: #c6a86a;
}

.preview-metric-row article {
  flex: 1;
  padding: 14px;
  border: 1px solid rgba(127, 216, 255, 0.12);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.04);
}

.preview-metric-row span,
.simulator-output span,
.trial-track span,
.service-preview-grid span,
.performance-preview-card > span,
.cashback-preview-card > span,
.support-preview-card > span {
  color: rgba(162, 191, 222, 0.82);
  font-size: 0.72rem;
  font-weight: 740;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.preview-metric-row strong {
  display: block;
  margin: 8px 0 3px;
  color: #f7fbff;
  font-size: 1.4rem;
}

.mini-carlos-bubble {
  padding: 18px;
  border: 1px solid rgba(132, 226, 255, 0.16);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(67, 150, 255, 0.11), rgba(255, 255, 255, 0.035));
}

.mini-carlos-bubble p {
  margin: 8px 0 0;
  color: #f7fbff;
  font-size: 1.08rem;
}

.cashback-simulator {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(320px, 1.1fr);
  gap: clamp(18px, 4vw, 32px);
  margin-top: 18px;
  padding: clamp(22px, 5vw, 42px);
}

.simulator-copy {
  display: grid;
  align-content: center;
  gap: 15px;
}

.simulator-copy h2,
.trial-journey h2,
.pro-story-card h2 {
  margin: 0;
  color: #f7fbff;
  font-size: clamp(1.65rem, 4vw, 3.1rem);
  line-height: 1.02;
}

.lots-control,
.lots-number-control {
  display: grid;
  gap: 8px;
  color: rgba(220, 236, 255, 0.78);
  font-size: 0.82rem;
  font-weight: 700;
}

.lots-control input[type="range"] {
  width: 100%;
  accent-color: #82e7ff;
}

.lots-number-control input {
  max-width: 180px;
  min-height: 44px;
  border: 1px solid rgba(137, 216, 255, 0.2);
  border-radius: 12px;
  color: #f7fbff;
  background: rgba(3, 12, 25, 0.62);
}

.simulator-output {
  display: grid;
  gap: 12px;
}

.simulator-primary,
.simulator-grid article,
.next-tier-progress {
  padding: 16px;
  border: 1px solid rgba(127, 216, 255, 0.13);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.04);
}

.simulator-primary strong {
  display: block;
  margin: 10px 0 5px;
  color: #f7fbff;
  font-size: clamp(2.1rem, 5vw, 3.8rem);
  line-height: 1;
  transition: color 140ms ease;
}

.simulator-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.simulator-grid strong {
  display: block;
  margin-top: 8px;
  color: #f7fbff;
  font-size: 1.08rem;
}

.next-tier-progress {
  display: grid;
  gap: 12px;
}

.next-tier-progress div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}

.next-tier-progress strong {
  color: #f7fbff;
  font-size: 0.86rem;
}

.next-tier-progress i,
.strategy-preview-card i,
.cashback-preview-card i,
.score-bars i {
  display: block;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(123, 194, 255, 0.13);
}

.next-tier-progress b,
.strategy-preview-card b,
.cashback-preview-card b,
.score-bars b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #4fa8ff, #93f2ff);
  transition: width 140ms ease;
}

.estimate-note {
  margin: 0;
  color: rgba(202, 218, 238, 0.68);
  font-size: 0.82rem;
}

.trial-journey {
  margin-top: 18px;
  padding: clamp(22px, 5vw, 38px);
}

.trial-track {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.trial-track article {
  display: grid;
  gap: 9px;
  min-height: 180px;
  padding: 16px;
  border: 1px solid rgba(127, 216, 255, 0.12);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.04);
}

.trial-track strong {
  color: #f7fbff;
  line-height: 1.25;
}

.trial-track p {
  margin: 0;
  color: rgba(207, 224, 244, 0.72);
  font-size: 0.88rem;
}

.pro-story-stack {
  display: grid;
  gap: 18px;
  margin-top: 18px;
}

.pro-story-card {
  display: grid;
  grid-template-columns: minmax(0, 0.86fr) minmax(320px, 1.14fr);
  gap: clamp(18px, 4vw, 34px);
  align-items: center;
  padding: clamp(22px, 5vw, 42px);
}

.pro-story-card ul {
  display: grid;
  gap: 8px;
  margin: 16px 0 20px;
  padding: 0;
  list-style: none;
}

.pro-story-card li {
  padding-left: 18px;
  color: rgba(213, 231, 251, 0.78);
  background: linear-gradient(90deg, rgba(133, 230, 255, 0.8), rgba(133, 230, 255, 0.8)) 0 0.7em / 7px 1px no-repeat;
}

.service-preview-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

.carlos-preview-card,
.chart-preview-card,
.strategy-preview-card,
.performance-preview-card,
.cashback-preview-card,
.support-preview-card {
  padding: 18px;
  border: 1px solid rgba(127, 216, 255, 0.13);
  border-radius: 16px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.025));
}

.carlos-preview-card {
  grid-column: 1 / -1;
}

.carlos-preview-card p,
.chart-preview-card strong,
.strategy-preview-card strong,
.performance-preview-card strong,
.cashback-preview-card strong {
  display: block;
  margin: 9px 0;
  color: #f7fbff;
  font-size: clamp(1.15rem, 2.5vw, 1.65rem);
}

.performance-preview-card,
.cashback-preview-card,
.support-preview-card {
  min-height: 260px;
}

.performance-preview-card strong {
  font-size: clamp(3rem, 8vw, 5rem);
  line-height: 1;
}

.score-bars {
  display: grid;
  gap: 12px;
  margin-top: 16px;
}

.score-bars label {
  display: grid;
  gap: 6px;
  color: rgba(213, 231, 251, 0.76);
  font-size: 0.82rem;
}

.support-preview-card ol {
  display: grid;
  gap: 12px;
  margin: 14px 0 0;
  padding-left: 20px;
  color: #f7fbff;
}

.pro-trust-panel.final {
  margin-top: 18px;
}

@media (prefers-reduced-motion: reduce) {
  .next-tier-progress b,
  .strategy-preview-card b,
  .cashback-preview-card b,
  .score-bars b,
  .simulator-primary strong {
    transition: none;
  }
}

@media (max-width: 980px) {
  .pro-experience-hero,
  .cashback-simulator,
  .pro-story-card,
  .trial-track {
    grid-template-columns: 1fr;
  }

  .pro-live-preview {
    min-height: auto;
  }
}

@media (max-width: 640px) {
  .simulator-grid,
  .service-preview-grid,
  .preview-metric-row {
    grid-template-columns: 1fr;
  }

  .preview-metric-row {
    display: grid;
  }

  .next-tier-progress div {
    align-items: flex-start;
    flex-direction: column;
  }
}

@media (max-width: 1180px) {
  .context-strip,
  .admin-analytics-grid,
  .activity-feed,
  .education-admin-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .unified-page-header {
    align-items: stretch;
    flex-direction: column;
  }

  .context-strip,
  .admin-analytics-grid,
  .activity-feed,
  .education-admin-grid,
  .cloud-control-grid,
  .mfa-enrollment-grid,
  .education-library-controls,
  .education-editor-grid,
  .quiz-question-form {
    grid-template-columns: 1fr;
  }

  .cloud-status-row {
    flex-direction: column;
  }

  .admin-mfa-form {
    align-items: stretch;
    flex-direction: column;
  }

  .security-stepper {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .security-stepper span {
    padding: 8px 9px;
  }

  .portal-secure-stepper {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .portal-secure-stepper span {
    padding: 8px 9px;
  }
}

/* AUREX Client Intelligence System V1 */
.admin-intelligence-body,
.public-intelligence-body {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  color: var(--text);
  background:
    linear-gradient(rgba(255, 255, 255, 0.01) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.008) 1px, transparent 1px),
    linear-gradient(135deg, #02050b 0%, var(--bg) 42%, var(--bg-2) 100%);
  background-size: 42px 42px, 42px 42px, auto;
}

.admin-intelligence-shell {
  grid-template-columns: 282px minmax(0, 1fr);
}

.admin-sidebar .nav-list {
  gap: 8px;
}

.admin-sidebar .nav-item {
  min-height: 48px;
}

.admin-main {
  padding-bottom: 70px;
}

.admin-topbar {
  margin-bottom: 28px;
}

.admin-topbar .topbar-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.admin-stat-card strong {
  font-size: clamp(1.7rem, 3vw, 2.5rem);
}

.status-badge {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(148, 177, 220, 0.18);
  border-radius: 999px;
  padding: 5px 10px;
  color: var(--muted-strong);
  background: rgba(129, 147, 174, 0.08);
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.status-badge.positive {
  border-color: rgba(89, 211, 144, 0.32);
  color: #a7f3c6;
  background: rgba(89, 211, 144, 0.1);
}

.status-badge.warning {
  border-color: rgba(231, 199, 106, 0.34);
  color: #f7dfa1;
  background: rgba(231, 199, 106, 0.1);
}

.status-badge.danger {
  border-color: rgba(255, 100, 116, 0.34);
  color: #ffb4bd;
  background: rgba(255, 100, 116, 0.1);
}

.admin-table-panel {
  overflow: hidden;
  border: 1px solid rgba(148, 177, 220, 0.13);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(9, 23, 42, 0.9), rgba(4, 12, 24, 0.93)),
    var(--panel);
  box-shadow: var(--module-shadow);
}

.admin-table-panel .panel-header {
  padding: 24px 26px;
  border-bottom: 1px solid rgba(148, 177, 220, 0.11);
}

.admin-table-wrap {
  overflow-x: auto;
}

.admin-table {
  width: 100%;
  min-width: 980px;
  border-collapse: collapse;
}

.admin-table th,
.admin-table td {
  padding: 15px 18px;
  border-bottom: 1px solid rgba(148, 177, 220, 0.09);
  text-align: left;
  vertical-align: middle;
}

.admin-table th {
  color: var(--muted);
  background: rgba(103, 232, 249, 0.035);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  white-space: nowrap;
}

.admin-table td {
  color: #dbe8fb;
  font-size: 0.9rem;
}

.admin-table tbody tr:hover {
  background: rgba(103, 232, 249, 0.035);
}

.admin-split-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: 22px;
  margin-top: 24px;
}

.admin-split-grid .admin-table {
  min-width: 760px;
}

.leaderboard-manager {
  display: grid;
  gap: 22px;
}

.manager-note {
  border: 1px solid rgba(148, 177, 220, 0.13);
  border-radius: 8px;
  padding: 28px;
  background: linear-gradient(180deg, rgba(9, 23, 42, 0.84), rgba(4, 12, 24, 0.9));
  box-shadow: var(--module-shadow);
}

.manager-note h3 {
  margin-bottom: 8px;
  font-size: clamp(1.35rem, 2vw, 2rem);
}

.manager-note p:not(.eyebrow) {
  max-width: 820px;
  margin-bottom: 0;
  color: var(--muted-strong);
  line-height: 1.65;
}

.leaderboard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: 16px;
}

.leaderboard-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  border: 1px solid rgba(148, 177, 220, 0.13);
  border-radius: 8px;
  padding: 20px;
  background: linear-gradient(180deg, rgba(10, 25, 45, 0.84), rgba(4, 12, 24, 0.9));
  box-shadow: var(--module-shadow);
}

.leaderboard-rank {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.3);
  border-radius: 8px;
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.08);
  font-weight: 900;
}

.leaderboard-card h3 {
  margin-bottom: 4px;
}

.leaderboard-card span:not(.status-badge) {
  color: var(--muted-strong);
}

.leaderboard-card .status-badge {
  grid-column: 1 / -1;
  justify-self: start;
}

.leaderboard-controls {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding-top: 8px;
}

.draft-control {
  display: flex;
  min-height: 38px;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(148, 177, 220, 0.12);
  border-radius: 8px;
  padding: 8px 10px;
  color: var(--muted-strong);
  background: rgba(255, 255, 255, 0.025);
  font-size: 0.8rem;
  font-weight: 700;
}

.draft-control input {
  accent-color: var(--cyan);
}

.public-shell {
  width: min(1120px, calc(100% - 36px));
  margin: 0 auto;
  padding: 24px 0 72px;
}

.public-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 34px;
  border-bottom: 1px solid rgba(148, 177, 220, 0.12);
  padding-bottom: 18px;
}

.public-brand,
.public-header nav {
  display: flex;
  align-items: center;
  gap: 12px;
}

.public-brand,
.public-header a {
  color: var(--muted-strong);
  text-decoration: none;
}

.public-brand span {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.36);
  border-radius: 8px;
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.08);
  font-weight: 900;
}

.public-brand strong {
  color: var(--text);
}

.public-header nav {
  flex-wrap: wrap;
  justify-content: flex-end;
}

.public-header nav a:not(.primary-button) {
  font-size: 0.9rem;
  font-weight: 800;
}

.public-page {
  display: grid;
  gap: 26px;
}

.public-hero {
  border: 1px solid rgba(148, 177, 220, 0.13);
  border-radius: 8px;
  padding: clamp(30px, 6vw, 62px);
  background:
    linear-gradient(120deg, rgba(10, 25, 45, 0.9), rgba(4, 12, 24, 0.68)),
    var(--panel);
  box-shadow: var(--module-shadow);
}

.public-hero h1 {
  max-width: 760px;
  margin-bottom: 14px;
  font-size: clamp(2.1rem, 7vw, 4.7rem);
  line-height: 0.98;
}

.public-hero p:not(.eyebrow) {
  max-width: 720px;
  color: var(--muted-strong);
  font-size: 1.05rem;
  line-height: 1.7;
}

.public-board {
  overflow: hidden;
  border: 1px solid rgba(148, 177, 220, 0.13);
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(9, 23, 42, 0.9), rgba(4, 12, 24, 0.94));
  box-shadow: var(--module-shadow);
}

.public-board-head,
.public-rank-row {
  display: grid;
  grid-template-columns: 0.7fr 1.6fr 1fr 1fr 1fr;
  gap: 14px;
  align-items: center;
  padding: 18px 22px;
}

.public-board-head {
  color: var(--muted);
  background: rgba(103, 232, 249, 0.04);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.public-rank-row {
  border-top: 1px solid rgba(148, 177, 220, 0.09);
}

.public-rank-row strong {
  color: var(--cyan);
  font-size: 1.35rem;
}

.public-rank-row span {
  color: var(--text);
  font-weight: 900;
}

.public-rank-row em,
.public-rank-row time {
  color: var(--muted-strong);
  font-style: normal;
}

.public-rank-row small {
  justify-self: start;
  border: 1px solid rgba(213, 176, 106, 0.28);
  border-radius: 999px;
  padding: 6px 10px;
  color: #f0d99d;
  background: rgba(213, 176, 106, 0.1);
  font-weight: 900;
}

.rewards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 16px;
}

.reward-item,
.reward-disclaimer {
  border: 1px solid rgba(148, 177, 220, 0.13);
  border-radius: 8px;
  padding: 24px;
  background: linear-gradient(180deg, rgba(9, 23, 42, 0.86), rgba(4, 12, 24, 0.92));
  box-shadow: var(--module-shadow);
}

.reward-item h3 {
  margin-bottom: 10px;
  font-size: 1.08rem;
}

.reward-item p,
.reward-disclaimer p {
  margin-bottom: 0;
  color: var(--muted-strong);
  line-height: 1.65;
}

.reward-disclaimer {
  border-color: rgba(231, 199, 106, 0.22);
}

.reward-disclaimer strong {
  display: block;
  margin-bottom: 8px;
  color: var(--gold);
}

@media (max-width: 1080px) {
  .admin-intelligence-shell,
  .admin-split-grid {
    grid-template-columns: 1fr;
  }

  .admin-sidebar {
    position: static;
    height: auto;
  }

  .admin-sidebar .nav-list {
    display: flex;
    overflow-x: auto;
    padding-bottom: 4px;
  }

  .admin-sidebar .nav-item {
    min-width: max-content;
  }
}

@media (max-width: 720px) {
  .admin-main {
    padding: 26px 18px 54px;
  }

  .admin-topbar,
  .public-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .admin-topbar .topbar-actions,
  .admin-topbar .primary-button,
  .admin-topbar .secondary-button,
  .public-header nav,
  .public-header .primary-button {
    width: 100%;
  }

  .public-header nav {
    align-items: stretch;
    flex-direction: column;
  }

  .leaderboard-controls,
  .public-board-head,
  .public-rank-row {
    grid-template-columns: 1fr;
  }

  .public-board-head {
    display: none;
  }

  .public-rank-row {
    gap: 8px;
  }
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  color: var(--text);
  background:
    linear-gradient(rgba(255, 255, 255, 0.01) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.008) 1px, transparent 1px),
    radial-gradient(circle at 22% 4%, rgba(103, 232, 249, 0.055), transparent 24rem),
    radial-gradient(circle at 84% 18%, rgba(104, 168, 255, 0.04), transparent 25rem),
    linear-gradient(135deg, #02050b 0%, var(--bg) 38%, var(--bg-2) 100%);
  background-size: 42px 42px, 42px 42px, auto, auto, auto;
  font-family: "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

svg {
  display: block;
  fill: currentColor;
}

.app-shell {
  display: grid;
  grid-template-columns: 292px minmax(0, 1fr);
  min-height: 100vh;
}

.sidebar {
  position: sticky;
  top: 0;
  display: flex;
  height: 100vh;
  flex-direction: column;
  gap: 36px;
  padding: 32px 20px;
  border-right: 1px solid rgba(121, 196, 255, 0.14);
  background:
    radial-gradient(circle at 50% 0%, rgba(103, 232, 249, 0.09), transparent 18rem),
    linear-gradient(180deg, rgba(4, 10, 19, 0.98), rgba(3, 8, 17, 0.94)),
    rgba(5, 13, 25, 0.94);
  box-shadow: 18px 0 70px rgba(0, 0, 0, 0.34), inset -1px 0 0 rgba(255, 255, 255, 0.025);
}

.brand-lockup {
  display: flex;
  align-items: center;
  gap: 14px;
  border: 1px solid rgba(148, 177, 220, 0.12);
  border-radius: 8px;
  padding: 16px;
  background: linear-gradient(180deg, rgba(10, 24, 43, 0.66), rgba(3, 10, 19, 0.42));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.brand-mark {
  display: grid;
  width: 62px;
  height: 62px;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.42);
  border-radius: 8px;
  color: var(--cyan);
  background:
    radial-gradient(circle at 50% 0%, rgba(221, 247, 255, 0.2), transparent 62%),
    linear-gradient(145deg, rgba(103, 232, 249, 0.16), rgba(104, 168, 255, 0.045));
  box-shadow: inset 0 0 24px rgba(103, 232, 249, 0.08), 0 0 36px rgba(103, 232, 249, 0.12);
  font-size: 0.92rem;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.brand-kicker,
.eyebrow {
  margin: 0 0 6px;
  color: var(--gold);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

h1,
h2,
h3,
p {
  margin-top: 0;
}

h1 {
  margin-bottom: 0;
  font-size: 1.08rem;
  line-height: 1.25;
}

.nav-list {
  display: grid;
  gap: 10px;
  padding-top: 2px;
}

.nav-item {
  position: relative;
  display: flex;
  min-height: 56px;
  align-items: center;
  gap: 12px;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 0 16px;
  color: #aebcd2;
  font-size: 0.98rem;
  text-decoration: none;
  transition: border-color 180ms ease, background 180ms ease, color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

.nav-item svg {
  width: 18px;
  height: 18px;
  color: var(--blue);
  opacity: 0.86;
}

.nav-item:hover,
.nav-item.is-active {
  color: var(--text);
  border-color: var(--line-strong);
  background:
    linear-gradient(90deg, rgba(103, 232, 249, 0.13), rgba(104, 168, 255, 0.045)),
    rgba(8, 20, 37, 0.46);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035), 0 14px 32px rgba(0, 0, 0, 0.18);
  transform: translateX(2px);
}

.nav-item.is-active::before {
  position: absolute;
  left: -1px;
  width: 2px;
  height: 22px;
  border-radius: 999px;
  background: var(--cyan);
  content: "";
}

.sidebar-note {
  margin-top: auto;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  color: var(--muted);
  background:
    radial-gradient(circle at 0% 0%, rgba(213, 176, 106, 0.07), transparent 70%),
    linear-gradient(180deg, rgba(16, 35, 61, 0.62), rgba(5, 14, 26, 0.82));
  font-size: 0.88rem;
  line-height: 1.55;
}

.sidebar-note p {
  margin-bottom: 0;
}

.note-label {
  display: inline-flex;
  margin-bottom: 10px;
  color: var(--cyan);
  font-weight: 800;
}

.dashboard-main {
  min-width: 0;
  padding: 48px 48px 92px;
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 48px;
  border: 1px solid rgba(148, 177, 220, 0.13);
  border-radius: 8px;
  padding: 34px;
  background:
    radial-gradient(circle at 0% 0%, rgba(103, 232, 249, 0.07), transparent 34rem),
    linear-gradient(90deg, rgba(7, 17, 31, 0.48), rgba(7, 17, 31, 0.18));
  box-shadow: var(--module-shadow);
}

.page-load-panel {
  animation: pageFadeIn 420ms ease both;
}

.page-rise {
  animation: pageRise 520ms ease both;
}

@keyframes pageFadeIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes pageRise {
  from {
    opacity: 0;
    transform: translateY(14px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.topbar h2 {
  margin-bottom: 6px;
  font-size: clamp(2.15rem, 2.55vw, 3rem);
  font-weight: 850;
  letter-spacing: 0;
}

.topbar-subtitle {
  margin: 0 0 10px;
  color: var(--muted-strong);
  font-size: 1.12rem;
}

.date-line {
  color: var(--muted);
  font-size: 0.92rem;
}

.topbar-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.search-field input {
  width: min(340px, 26vw);
  min-height: 54px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0 16px;
  color: var(--text);
  background: rgba(3, 10, 19, 0.88);
  outline: none;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

.search-field input:focus,
.client-form input:focus,
.client-form select:focus,
.client-form textarea:focus {
  border-color: rgba(103, 232, 249, 0.72);
  box-shadow: 0 0 0 3px rgba(103, 232, 249, 0.1), 0 0 28px rgba(103, 232, 249, 0.08);
}

.primary-button,
.secondary-button,
.icon-button,
.alert-button,
.row-action {
  border: 0;
  border-radius: 8px;
  font-weight: 800;
}

.primary-button {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 18px;
  border: 1px solid rgba(103, 232, 249, 0.28);
  color: #031016;
  background:
    linear-gradient(180deg, rgba(230, 253, 255, 0.98) 0%, rgba(103, 232, 249, 0.92) 48%, rgba(54, 174, 190, 0.94) 100%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.42), 0 18px 42px rgba(103, 232, 249, 0.15);
  transition: transform 160ms ease, box-shadow 160ms ease, filter 160ms ease, border-color 160ms ease;
}

.secondary-button,
.row-action {
  min-height: 44px;
  padding: 0 16px;
  color: var(--text);
  background: rgba(19, 39, 66, 0.82);
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease;
}

.primary-button:hover,
.row-action:hover,
.secondary-button:hover,
.alert-button:hover,
.icon-button:hover {
  transform: translateY(-1px);
}

.primary-button:hover {
  border-color: rgba(221, 247, 255, 0.52);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.54), 0 24px 52px rgba(103, 232, 249, 0.23);
  filter: saturate(1.06);
}

.primary-button:active {
  transform: translateY(0);
  filter: brightness(0.96);
}

.icon-button,
.alert-button {
  display: inline-grid;
  width: 44px;
  height: 44px;
  place-items: center;
  color: var(--text);
  background: rgba(14, 29, 50, 0.86);
}

.alert-button {
  position: relative;
  border: 1px solid var(--line);
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
}

.alert-button svg {
  width: 18px;
  height: 18px;
  color: var(--gold);
}

.alert-button span {
  position: absolute;
  top: -7px;
  right: -7px;
  display: grid;
  min-width: 22px;
  height: 22px;
  place-items: center;
  border-radius: 999px;
  color: #250408;
  background: var(--red);
  font-size: 0.72rem;
  font-weight: 900;
}

.kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: auto;
  gap: 24px;
  margin-bottom: 66px;
}

.page-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(360px, 0.88fr);
  gap: 34px;
  margin-bottom: 54px;
  border: 1px solid rgba(150, 175, 210, 0.13);
  border-radius: 8px;
  padding: 42px;
  background:
    radial-gradient(circle at 0% 0%, rgba(103, 232, 249, 0.08), transparent 34rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.84), rgba(2, 8, 17, 0.94));
  box-shadow: var(--module-shadow);
}

.page-hero-copy h3 {
  max-width: 860px;
  margin: 0 0 16px;
  color: var(--text);
  font-size: clamp(2.4rem, 4vw, 4.4rem);
  line-height: 1.02;
}

.page-hero-copy p:not(.eyebrow) {
  max-width: 780px;
  color: var(--muted-strong);
  font-size: 1.12rem;
  line-height: 1.66;
}

.page-status-line {
  display: inline-flex;
  margin-top: 14px;
  border: 1px solid rgba(103, 232, 249, 0.22);
  border-radius: 999px;
  padding: 10px 14px;
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.07);
  font-size: 0.88rem;
  font-weight: 850;
}

.page-hero-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.metric-mini {
  display: grid;
  gap: 12px;
  min-height: 168px;
  border: 1px solid rgba(148, 177, 220, 0.14);
  border-radius: 8px;
  padding: 20px;
  background:
    radial-gradient(circle at 12% 0%, rgba(103, 232, 249, 0.05), transparent 70%),
    rgba(2, 8, 16, 0.48);
}

.metric-mini span {
  color: #95a8c2;
  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.metric-mini strong {
  color: var(--text);
  font-size: clamp(2.1rem, 3vw, 3.2rem);
  line-height: 1;
}

.metric-mini em {
  font-style: normal;
}

.metric-mini p {
  margin: 0;
  color: var(--muted);
  font-size: 0.94rem;
  line-height: 1.5;
}

.executive-grid,
.page-section-grid {
  display: grid;
  gap: 34px;
  margin-bottom: 68px;
}

.executive-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.page-section-grid.two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.page-section-grid.three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.preview-module {
  min-height: 260px;
}

.module-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.portal-preview-link {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  justify-content: center;
  margin-top: 24px;
  border: 1px solid rgba(103, 232, 249, 0.2);
  text-decoration: none;
}

.compact-record {
  min-height: 300px;
}

.performance-grid.compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.settings-placeholder {
  min-height: 360px;
}

.kpi-card,
.glass-panel,
.client-ledger,
.service-layer,
.client-access-panel {
  border: 1px solid rgba(150, 175, 210, 0.13);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(8, 22, 40, 0.82), rgba(2, 8, 17, 0.93)),
    rgba(7, 16, 29, 0.9);
  box-shadow: var(--shadow);
  backdrop-filter: blur(18px);
}

.kpi-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 230px;
  overflow: hidden;
  padding: 26px;
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.kpi-card::after {
  position: absolute;
  inset: auto 24px 22px 24px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(103, 232, 249, 0.16), rgba(103, 232, 249, 0.72), rgba(213, 176, 106, 0.28));
  content: "";
  opacity: 0.58;
}

.kpi-card::before {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 18% 8%, rgba(238, 246, 255, 0.06), transparent 22%),
    radial-gradient(circle at 22% 0%, rgba(103, 232, 249, 0.06), transparent 40%);
  content: "";
  opacity: 0.82;
  pointer-events: none;
}

.kpi-card:nth-child(1) {
  order: 1;
}

.kpi-card:nth-child(2) {
  order: 2;
}

.kpi-card:nth-child(3) {
  order: 3;
}

.kpi-card:nth-child(6) {
  order: 4;
}

.kpi-card:nth-child(4) {
  order: 5;
}

.kpi-card:nth-child(7) {
  order: 6;
}

.kpi-card:nth-child(8) {
  order: 7;
}

.kpi-card:nth-child(5) {
  order: 8;
}

.kpi-card:nth-child(1),
.kpi-card:nth-child(2),
.kpi-card:nth-child(3),
.kpi-card:nth-child(6) {
  grid-column: span 2;
  min-height: 356px;
  padding: 34px;
}

.kpi-card:nth-child(4),
.kpi-card:nth-child(5),
.kpi-card:nth-child(7),
.kpi-card:nth-child(8) {
  min-height: 224px;
}

.kpi-card:hover,
.glass-panel:hover {
  transform: translateY(-2px);
  border-color: var(--line-strong);
  box-shadow: 0 34px 96px rgba(0, 0, 0, 0.48), 0 0 28px rgba(103, 232, 249, 0.035);
}

.alert-card::after {
  background: linear-gradient(90deg, transparent, rgba(255, 104, 117, 0.82), transparent);
}

.warning-card::after {
  background: linear-gradient(90deg, transparent, rgba(231, 199, 106, 0.78), transparent);
}

.kpi-topline,
.panel-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}

.kpi-topline p {
  flex: 1;
  margin-bottom: 0;
  color: #a9b8cf;
  font-size: 0.9rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.kpi-icon {
  position: relative;
  display: grid;
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.2);
  border-radius: 8px;
  color: var(--cyan);
  background:
    radial-gradient(circle at 50% 0%, rgba(221, 247, 255, 0.18), transparent 62%),
    rgba(103, 232, 249, 0.07);
  box-shadow: inset 0 0 18px rgba(103, 232, 249, 0.07), 0 0 24px rgba(103, 232, 249, 0.075);
}

.kpi-icon svg {
  width: 20px;
  height: 20px;
}

.kpi-card strong {
  position: relative;
  display: block;
  margin: 38px 0 18px;
  font-size: clamp(3rem, 4.6vw, 4.6rem);
  font-weight: 850;
  line-height: 1;
  letter-spacing: 0;
  text-shadow: 0 0 28px rgba(238, 246, 255, 0.1);
}

.kpi-card:nth-child(1) strong,
.kpi-card:nth-child(2) strong,
.kpi-card:nth-child(3) strong,
.kpi-card:nth-child(6) strong {
  margin-top: 50px;
  font-size: clamp(4rem, 6vw, 5.65rem);
  text-shadow: 0 0 34px rgba(238, 246, 255, 0.14), 0 0 42px rgba(103, 232, 249, 0.06);
}

.kpi-card:nth-child(1) .kpi-caption,
.kpi-card:nth-child(2) .kpi-caption,
.kpi-card:nth-child(3) .kpi-caption,
.kpi-card:nth-child(6) .kpi-caption {
  max-width: 420px;
  font-size: 1.02rem;
}

.service-layer {
  display: grid;
  grid-template-columns: 1fr;
  gap: 36px;
  margin-bottom: 54px;
  padding: 42px;
  position: relative;
  overflow: hidden;
}

.service-layer::before {
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 8% 0%, rgba(103, 232, 249, 0.11), transparent 28rem);
  content: "";
  pointer-events: none;
}

.service-copy,
.service-card-grid {
  position: relative;
}

.service-copy h3 {
  max-width: 860px;
  margin: 0;
  color: var(--text);
  font-size: clamp(1.65rem, 2.1vw, 2.35rem);
  line-height: 1.28;
}

.service-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
}

.service-card {
  min-height: 208px;
  border: 1px solid rgba(148, 177, 220, 0.15);
  border-radius: 8px;
  padding: 28px;
  background:
    radial-gradient(circle at 12% 0%, rgba(103, 232, 249, 0.07), transparent 64%),
    linear-gradient(180deg, rgba(3, 10, 19, 0.62), rgba(6, 17, 31, 0.4));
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.service-card:hover {
  transform: translateY(-2px);
  border-color: var(--line-strong);
  box-shadow: 0 20px 54px rgba(0, 0, 0, 0.28);
}

.service-icon {
  display: grid;
  width: 50px;
  height: 50px;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 8px;
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.065);
}

.service-icon svg {
  width: 23px;
  height: 23px;
}

.service-card h4 {
  margin: 24px 0 12px;
  color: var(--text);
  font-size: 1.2rem;
}

.service-card p {
  margin-bottom: 0;
  color: var(--muted);
  font-size: 1rem;
  line-height: 1.62;
}

.kpi-indicator,
.panel-pill,
.ledger-meta {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 13px;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.03em;
  white-space: nowrap;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.positive {
  color: var(--green);
  background: rgba(98, 212, 155, 0.09);
  border-color: rgba(89, 211, 144, 0.22);
}

.neutral {
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.09);
  border-color: rgba(103, 232, 249, 0.22);
}

.danger {
  color: var(--red);
  background: rgba(255, 104, 117, 0.09);
  border-color: rgba(255, 100, 116, 0.24);
}

.warning {
  color: var(--yellow);
  background: rgba(231, 199, 106, 0.1);
  border-color: rgba(231, 199, 106, 0.24);
}

.kpi-caption {
  position: relative;
  color: var(--muted);
  font-size: 1rem;
  line-height: 1.62;
}

.mini-progress {
  height: 11px;
  margin: auto 0 16px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(129, 147, 174, 0.16);
}

.mini-progress span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--cyan), var(--gold));
  transition: width 260ms ease;
}

.intelligence-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 34px;
  margin-bottom: 68px;
}

.performance-panel {
  grid-column: span 2;
}

.glass-panel {
  min-height: 380px;
  padding: 34px;
  overflow: hidden;
  box-shadow: var(--module-shadow);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.growth-panel,
.activity-panel {
  min-height: 500px;
}

.intelligence-grid > article:nth-child(3),
.intelligence-grid > article:nth-child(4) {
  min-height: 400px;
}

.intelligence-grid > article:nth-child(5) {
  grid-column: span 2;
  min-height: 320px;
}

.panel-header {
  padding: 24px;
  border-bottom: 1px solid var(--line);
}

.panel-header.compact {
  padding: 0 0 28px;
  border-bottom: 0;
}

.panel-header h3 {
  margin-bottom: 0;
  font-size: 1.42rem;
  font-weight: 800;
}

.line-chart {
  width: 100%;
  height: 270px;
  overflow: visible;
}

.chart-grid {
  stroke: rgba(139, 165, 205, 0.12);
  stroke-width: 1;
}

.chart-area {
  fill: rgba(103, 232, 249, 0.08);
}

.chart-line {
  fill: none;
  stroke: var(--cyan);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 4;
  filter: drop-shadow(0 0 10px rgba(103, 232, 249, 0.3));
}

.chart-dot {
  fill: var(--bg);
  stroke: var(--gold);
  stroke-width: 3;
}

.chart-footer {
  display: flex;
  justify-content: space-between;
  color: var(--muted);
  font-size: 0.76rem;
}

.donut-wrap {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 30px;
  align-items: center;
  min-height: 285px;
}

.donut {
  display: grid;
  width: 220px;
  height: 220px;
  place-items: center;
  border-radius: 50%;
  background: conic-gradient(var(--cyan) 0deg, var(--cyan) 0deg, rgba(129, 147, 174, 0.16) 0deg);
  box-shadow: inset 0 0 28px rgba(0, 0, 0, 0.28), 0 0 40px rgba(103, 232, 249, 0.08);
}

.donut::before {
  position: absolute;
  width: 144px;
  height: 144px;
  border-radius: 50%;
  background: #07111f;
  content: "";
}

.donut span {
  position: relative;
  z-index: 1;
  font-size: 2rem;
  font-weight: 900;
}

.donut-legend {
  display: grid;
  gap: 14px;
}

.donut-legend p {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 0;
  color: var(--muted-strong);
}

.legend-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
}

.legend-dot.active {
  background: var(--cyan);
}

.legend-dot.inactive {
  background: var(--red);
}

.legend-dot.pending {
  background: var(--gold);
}

.priority-list {
  display: grid;
  gap: 14px;
}

.priority-item {
  display: grid;
  gap: 10px;
  border: 1px solid rgba(148, 177, 220, 0.15);
  border-radius: 8px;
  padding: 16px;
  background:
    radial-gradient(circle at 0% 0%, rgba(103, 232, 249, 0.045), transparent 68%),
    linear-gradient(180deg, rgba(3, 10, 19, 0.56), rgba(4, 12, 23, 0.38));
  transition: border-color 160ms ease, transform 160ms ease, background 160ms ease, box-shadow 160ms ease;
}

.priority-item:hover {
  transform: translateY(-1px);
  border-color: var(--line-strong);
  background: rgba(11, 27, 48, 0.54);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.2);
}

.priority-item strong {
  color: var(--text);
  font-size: 1rem;
}

.priority-item span {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.48;
}

.performance-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px;
}

.performance-stat {
  display: grid;
  gap: 12px;
  min-height: 126px;
  border: 1px solid rgba(148, 177, 220, 0.15);
  border-radius: 8px;
  padding: 22px;
  background:
    radial-gradient(circle at 12% 0%, rgba(103, 232, 249, 0.055), transparent 72%),
    linear-gradient(180deg, rgba(3, 10, 19, 0.66), rgba(4, 12, 23, 0.42));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.performance-stat small {
  color: #95a8c2;
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.performance-stat strong {
  color: var(--text);
  font-size: 1.52rem;
  letter-spacing: 0;
}

.preview-note {
  margin: 28px 0 0;
  color: var(--muted);
  font-size: 0.98rem;
  line-height: 1.62;
}

.client-ledger {
  overflow: hidden;
  margin-top: 6px;
}

.client-access-panel {
  margin-bottom: 68px;
  padding: 44px;
  overflow: hidden;
  position: relative;
}

.client-access-panel::before {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 8% 0%, rgba(103, 232, 249, 0.1), transparent 24rem),
    radial-gradient(circle at 100% 16%, rgba(213, 176, 106, 0.055), transparent 20rem);
  content: "";
  pointer-events: none;
}

.access-header,
.access-layout {
  position: relative;
}

.access-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 34px;
  border-bottom: 1px solid rgba(148, 177, 220, 0.12);
  padding-bottom: 38px;
}

.access-title-block {
  display: flex;
  gap: 22px;
}

.access-title-block h3 {
  margin: 0 0 12px;
  font-size: clamp(1.65rem, 2vw, 2.35rem);
}

.access-title-block span:not(.access-shield) {
  color: var(--muted);
  font-size: 1.05rem;
  line-height: 1.62;
}

.access-shield {
  display: grid;
  width: 72px;
  height: 72px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.22);
  border-radius: 8px;
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.07);
  box-shadow: 0 0 34px rgba(103, 232, 249, 0.08);
}

.access-shield svg {
  width: 34px;
  height: 34px;
}

.access-badges {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.access-badge {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 13px;
  font-size: 0.76rem;
  font-weight: 900;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}

.access-badge.info {
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.08);
}

.access-badge.gold {
  color: var(--gold);
  background: rgba(213, 176, 106, 0.1);
}

.access-badge.neutral {
  color: var(--muted-strong);
  background: rgba(129, 147, 174, 0.1);
}

.access-badge.warning {
  color: var(--yellow);
  background: rgba(231, 199, 106, 0.1);
}

.access-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 390px;
  gap: 36px;
  padding-top: 38px;
}

.access-form {
  display: grid;
  gap: 28px;
}

.access-field-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.access-form label {
  display: grid;
  gap: 12px;
  color: var(--muted-strong);
  font-size: 0.95rem;
  font-weight: 850;
}

.access-form input {
  width: 100%;
  min-height: 60px;
  border: 1px solid rgba(148, 177, 220, 0.16);
  border-radius: 8px;
  padding: 0 17px;
  color: var(--text);
  background: linear-gradient(180deg, rgba(2, 8, 16, 0.92), rgba(8, 18, 32, 0.78));
  outline: none;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.access-form input:focus {
  border-color: rgba(103, 232, 249, 0.72);
  box-shadow: 0 0 0 3px rgba(103, 232, 249, 0.1), 0 0 28px rgba(103, 232, 249, 0.08);
}

.consent-field {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: flex-start;
  border: 1px solid rgba(148, 177, 220, 0.12);
  border-radius: 8px;
  padding: 20px;
  background: rgba(3, 10, 19, 0.38);
  line-height: 1.62;
}

.consent-field input {
  width: 20px;
  height: 20px;
  min-height: 20px;
  accent-color: var(--cyan);
}

.access-actions {
  display: flex;
  align-items: center;
  gap: 18px;
}

.access-helper {
  color: var(--muted);
  font-size: 0.9rem;
  line-height: 1.45;
}

.access-status-card {
  display: grid;
  gap: 18px;
  align-content: start;
  border: 1px solid rgba(148, 177, 220, 0.16);
  border-radius: 8px;
  padding: 26px;
  background:
    radial-gradient(circle at 100% 0%, rgba(213, 176, 106, 0.07), transparent 58%),
    linear-gradient(180deg, rgba(3, 10, 19, 0.66), rgba(6, 17, 31, 0.44));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid rgba(148, 177, 220, 0.09);
  padding-bottom: 18px;
}

.status-row span {
  color: var(--muted);
  font-size: 0.82rem;
  font-weight: 850;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.status-row strong {
  color: var(--text);
  font-size: 1.08rem;
  text-align: right;
}

.security-note {
  border: 1px solid rgba(213, 176, 106, 0.16);
  border-radius: 8px;
  padding: 20px;
  background: rgba(213, 176, 106, 0.055);
}

.security-note strong {
  color: var(--gold);
  font-size: 0.9rem;
}

.security-note p {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 0.96rem;
  line-height: 1.62;
}

.ai-analyst-panel {
  position: relative;
  overflow: hidden;
  margin-bottom: 68px;
  border: 1px solid rgba(121, 196, 255, 0.18);
  border-radius: 8px;
  padding: 48px;
  background:
    radial-gradient(circle at 8% 0%, rgba(103, 232, 249, 0.105), transparent 28rem),
    radial-gradient(circle at 92% 6%, rgba(213, 176, 106, 0.04), transparent 22rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.94), rgba(2, 8, 17, 0.94));
  box-shadow: 0 36px 120px rgba(0, 0, 0, 0.54), inset 0 1px 0 rgba(255, 255, 255, 0.04);
  backdrop-filter: blur(18px);
}

.ai-analyst-panel::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent, rgba(103, 232, 249, 0.035), transparent);
  content: "";
  pointer-events: none;
}

.ai-header,
.ai-grid {
  position: relative;
  z-index: 1;
}

.ai-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 38px;
  border-bottom: 1px solid rgba(148, 177, 220, 0.12);
  padding-bottom: 42px;
}

.ai-title-block {
  display: flex;
  gap: 24px;
}

.ai-orb {
  display: grid;
  width: 76px;
  height: 76px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.24);
  border-radius: 8px;
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.075);
  box-shadow: 0 0 36px rgba(103, 232, 249, 0.08);
}

.ai-orb svg {
  width: 36px;
  height: 36px;
}

.ai-title-block h3 {
  max-width: 820px;
  margin: 0 0 16px;
  font-size: clamp(1.85rem, 2.35vw, 2.75rem);
  line-height: 1.25;
}

.ai-title-block span:not(.ai-orb) {
  color: var(--muted);
  font-size: 1.03rem;
  line-height: 1.58;
}

.ai-disclaimer {
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  border: 1px solid rgba(213, 176, 106, 0.18);
  border-radius: 999px;
  padding: 0 16px;
  color: var(--muted-strong);
  background: rgba(213, 176, 106, 0.055);
  font-size: 0.94rem;
}

.ai-generate {
  flex: 0 0 auto;
}

.ai-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  gap: 30px;
  padding-top: 42px;
}

.ai-card {
  display: grid;
  align-content: start;
  gap: 26px;
  min-height: 405px;
  border: 1px solid rgba(148, 177, 220, 0.15);
  border-radius: 8px;
  padding: 30px;
  background:
    radial-gradient(circle at 16% 0%, rgba(103, 232, 249, 0.06), transparent 62%),
    linear-gradient(180deg, rgba(3, 10, 19, 0.68), rgba(6, 17, 31, 0.46));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.ai-card:nth-child(1) {
  grid-column: 1;
  grid-row: 1;
}

.ai-card:nth-child(2) {
  grid-column: 1;
  grid-row: 2;
}

.ai-card:nth-child(3) {
  grid-column: 2;
  grid-row: 1;
}

.ai-card:nth-child(4) {
  grid-column: 2;
  grid-row: 2;
}

.ai-card:hover {
  transform: translateY(-2px);
  border-color: var(--line-strong);
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.28), 0 0 34px rgba(103, 232, 249, 0.045);
}

.ai-card-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}

.ai-card h4 {
  margin: 0;
  color: var(--text);
  font-size: 1.34rem;
  line-height: 1.25;
}

.market-bias-badge,
.strategy-badge,
.risk-badge {
  display: inline-flex;
  min-height: 36px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 0 14px;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.03em;
  white-space: nowrap;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.market-bias-badge.positive,
.risk-badge.positive {
  color: var(--green);
  background: rgba(89, 211, 144, 0.09);
  border-color: rgba(89, 211, 144, 0.22);
}

.market-bias-badge.info,
.risk-badge.info,
.market-bias-badge.neutral {
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.08);
  border-color: rgba(103, 232, 249, 0.22);
}

.market-bias-badge.danger,
.risk-badge.danger {
  color: var(--red);
  background: rgba(255, 100, 116, 0.1);
  border-color: rgba(255, 100, 116, 0.24);
}

.risk-badge.warning,
.strategy-badge {
  color: var(--gold);
  background: rgba(213, 176, 106, 0.1);
  border-color: rgba(213, 176, 106, 0.24);
}

.ai-stat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.ai-stat-grid.compact {
  grid-template-columns: 1fr;
}

.ai-stat-grid div {
  display: grid;
  gap: 12px;
  border: 1px solid rgba(148, 177, 220, 0.11);
  border-radius: 8px;
  padding: 18px;
  background: rgba(2, 8, 16, 0.46);
}

.ai-stat-grid small {
  color: #95a8c2;
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.ai-stat-grid strong {
  color: var(--text);
  font-size: 1.18rem;
}

.strategy-checks {
  display: grid;
  gap: 16px;
}

.strategy-checks p,
.analysis-text-block p {
  margin: 0;
  color: var(--muted-strong);
  font-size: 1rem;
  line-height: 1.62;
}

.strategy-checks p {
  border: 1px solid rgba(148, 177, 220, 0.12);
  border-left-color: rgba(103, 232, 249, 0.34);
  border-radius: 8px;
  padding: 16px;
  background: rgba(2, 8, 16, 0.46);
}

.quality-meter {
  height: 18px;
  overflow: hidden;
  border: 1px solid rgba(148, 177, 220, 0.12);
  border-radius: 999px;
  background: rgba(2, 8, 16, 0.72);
  box-shadow: inset 0 0 18px rgba(0, 0, 0, 0.28);
}

.quality-meter span {
  display: block;
  width: 0;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(103, 232, 249, 0.96), rgba(213, 176, 106, 0.88));
  box-shadow: 0 0 18px rgba(103, 232, 249, 0.18);
  transition: width 220ms ease;
}

.analysis-text,
.developer-note {
  margin: 0;
  color: var(--muted);
  font-size: 1rem;
  line-height: 1.64;
}

.analysis-text-block {
  display: grid;
  gap: 14px;
}

.analysis-text-block strong {
  color: var(--text);
}

.developer-note {
  border: 1px solid rgba(213, 176, 106, 0.18);
  border-radius: 8px;
  padding: 18px;
  background: linear-gradient(180deg, rgba(213, 176, 106, 0.07), rgba(213, 176, 106, 0.035));
  color: var(--muted-strong);
}

.client-row-list {
  display: grid;
  gap: 28px;
  padding: 38px;
}

.client-row {
  display: grid;
  grid-template-columns: minmax(260px, 1.18fr) minmax(190px, 0.86fr) minmax(210px, 0.94fr) minmax(230px, 1fr);
  gap: 28px;
  align-items: center;
  border: 1px solid rgba(148, 177, 220, 0.15);
  border-radius: 8px;
  min-height: 210px;
  padding: 32px;
  background:
    radial-gradient(circle at 0% 0%, rgba(103, 232, 249, 0.065), transparent 36%),
    linear-gradient(180deg, rgba(8, 19, 34, 0.92), rgba(3, 10, 19, 0.86));
  transition: border-color 180ms ease, transform 180ms ease, box-shadow 180ms ease;
}

.client-row:hover {
  transform: translateY(-2px);
  border-color: var(--line-strong);
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.28), 0 0 32px rgba(103, 232, 249, 0.04);
}

.client-identity {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 16px;
}

.status-light {
  width: 11px;
  height: 86px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: var(--cyan);
  box-shadow: 0 0 22px rgba(103, 232, 249, 0.44);
}

.status-light.risk-high,
.status-light.review-due {
  background: var(--red);
  box-shadow: 0 0 22px rgba(255, 104, 117, 0.42);
}

.status-light.review-soon,
.status-light.risk-medium {
  background: var(--gold);
  box-shadow: 0 0 22px rgba(217, 181, 109, 0.34);
}

.client-name {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.client-name strong {
  color: var(--text);
  font-size: 1.28rem;
  font-weight: 820;
}

.client-name span {
  overflow: hidden;
  color: var(--muted);
  font-size: 0.98rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.data-stack {
  display: grid;
  gap: 10px;
  color: var(--muted-strong);
  font-size: 1rem;
}

.data-stack small {
  color: #95a8c2;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.badge-group {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.badge {
  display: inline-flex;
  min-height: 34px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(148, 177, 220, 0.14);
  border-radius: 999px;
  padding: 0 13px;
  font-size: 0.8rem;
  font-weight: 900;
  letter-spacing: 0.02em;
  white-space: nowrap;
  background: rgba(2, 8, 16, 0.42);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.badge.active-cycle,
.badge.low {
  border-color: rgba(89, 211, 144, 0.28);
  color: var(--green);
  background: rgba(89, 211, 144, 0.1);
  box-shadow: 0 0 18px rgba(89, 211, 144, 0.08);
}

.badge.review-soon,
.badge.medium {
  border-color: rgba(231, 199, 106, 0.3);
  color: var(--yellow);
  background: rgba(231, 199, 106, 0.11);
  box-shadow: 0 0 18px rgba(231, 199, 106, 0.08);
}

.badge.review-due,
.badge.high,
.badge.risk {
  border-color: rgba(255, 100, 116, 0.28);
  color: var(--red);
  background: rgba(255, 100, 116, 0.1);
  box-shadow: 0 0 18px rgba(255, 100, 116, 0.08);
}

.badge.checked {
  border-color: rgba(104, 168, 255, 0.28);
  color: #9dc5ff;
  background: rgba(104, 168, 255, 0.1);
  box-shadow: 0 0 18px rgba(104, 168, 255, 0.08);
}

.badge.potential {
  border-color: rgba(143, 191, 255, 0.28);
  color: #9dc5ff;
  background: rgba(143, 191, 255, 0.1);
}

.badge.high-value {
  border-color: rgba(213, 176, 106, 0.32);
  color: var(--gold);
  background: rgba(213, 176, 106, 0.12);
  box-shadow: 0 0 18px rgba(213, 176, 106, 0.1);
}

.badge.activity,
.badge.normal {
  color: var(--text);
  background: rgba(129, 147, 174, 0.1);
}

.notes-text {
  color: var(--muted);
  font-size: 0.98rem;
  line-height: 1.62;
}

.row-action {
  grid-column: 1 / -1;
  justify-self: end;
  border: 1px solid var(--line);
  min-width: 172px;
  white-space: nowrap;
  background: linear-gradient(180deg, rgba(23, 48, 82, 0.9), rgba(12, 27, 48, 0.86));
}

.row-action:hover {
  border-color: var(--line-strong);
  background: linear-gradient(180deg, rgba(30, 61, 104, 0.94), rgba(13, 31, 56, 0.92));
}

.empty-state {
  padding: 30px;
  color: var(--muted);
  text-align: center;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 20;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(1, 5, 11, 0.78);
}

.modal-backdrop.is-open {
  display: flex;
}

.modal {
  width: min(980px, 100%);
  max-height: min(92vh, 860px);
  overflow: auto;
  border: 1px solid var(--line-strong);
  border-radius: 8px;
  background:
    radial-gradient(circle at 18% 0%, rgba(103, 232, 249, 0.08), transparent 22rem),
    #07111f;
  box-shadow: var(--shadow);
}

.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 22px;
  border-bottom: 1px solid var(--line);
}

.modal-header h3 {
  margin-bottom: 0;
}

.modal-helper {
  display: block;
  margin-top: 8px;
  color: var(--muted);
  font-size: 0.86rem;
}

.client-form {
  display: grid;
  gap: 16px;
  padding: 22px;
}

.form-section {
  display: grid;
  gap: 14px;
  border: 1px solid rgba(148, 177, 220, 0.12);
  border-radius: 8px;
  padding: 16px;
  background: rgba(3, 10, 19, 0.34);
}

.form-section-title {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
  border-bottom: 1px solid rgba(148, 177, 220, 0.1);
  padding-bottom: 12px;
}

.form-section-title span {
  color: var(--text);
  font-size: 0.94rem;
  font-weight: 850;
}

.form-section-title small {
  color: var(--muted);
  font-size: 0.78rem;
  text-align: right;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}

.client-form label {
  display: grid;
  gap: 8px;
  color: var(--muted-strong);
  font-size: 0.82rem;
  font-weight: 800;
}

.client-form input,
.client-form select,
.client-form textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 11px 12px;
  color: var(--text);
  background: rgba(2, 8, 16, 0.9);
  outline: none;
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.client-form textarea {
  resize: vertical;
}

.check-field {
  align-content: end;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  min-height: 68px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: rgba(15, 33, 57, 0.48);
}

.check-field input {
  width: 18px;
  height: 18px;
  accent-color: var(--cyan);
}

.form-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Client portal: a separate, single-account surface from the admin command center. */
.portal-body {
  background:
    linear-gradient(rgba(255, 255, 255, 0.008) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.006) 1px, transparent 1px),
    radial-gradient(circle at 72% 2%, rgba(103, 232, 249, 0.055), transparent 30rem),
    linear-gradient(145deg, #02050c 0%, #030914 48%, #06111f 100%);
  background-size: 52px 52px, 52px 52px, auto, auto;
}

.portal-shell {
  grid-template-columns: 276px minmax(0, 1fr);
}

.portal-sidebar {
  gap: 44px;
}

.portal-sidebar .nav-list {
  gap: 12px;
}

.portal-sidebar .nav-item {
  min-height: 62px;
  padding-inline: 20px;
  font-size: 1rem;
}

.portal-sidebar .nav-item::after {
  width: 6px;
  height: 6px;
  margin-left: auto;
  border: 1px solid currentColor;
  border-radius: 50%;
  content: "";
  opacity: 0.36;
}

.portal-sidebar .nav-item.is-active::after {
  border-color: var(--cyan);
  background: var(--cyan);
  box-shadow: 0 0 14px rgba(103, 232, 249, 0.34);
  opacity: 1;
}

.portal-main {
  max-width: 1760px;
  width: 100%;
  margin: 0 auto;
  padding: 48px 52px 100px;
}

.portal-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  margin-bottom: 46px;
  border-bottom: 1px solid var(--line);
  padding: 0 0 28px;
}

.portal-topbar h2 {
  margin: 0 0 8px;
  font-size: clamp(2.2rem, 3vw, 3.5rem);
  line-height: 1.05;
}

.portal-topbar p:not(.eyebrow) {
  max-width: 760px;
  margin: 0;
  color: var(--muted-strong);
  font-size: 1.05rem;
  line-height: 1.6;
}

.portal-identity,
.portal-person {
  display: flex;
  align-items: center;
  gap: 14px;
}

.portal-identity {
  min-width: 280px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px 16px;
  background: rgba(5, 15, 29, 0.74);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.portal-identity div,
.portal-person div {
  display: grid;
  gap: 4px;
}

.portal-identity strong,
.portal-person strong {
  color: var(--text);
  font-size: 0.98rem;
}

.portal-identity span:not(.portal-avatar),
.portal-person span:not(.portal-avatar) {
  color: var(--muted);
  font-size: 0.84rem;
}

.portal-identity em {
  width: fit-content;
  margin-top: 3px;
  color: var(--green);
  font-size: 0.68rem;
  font-style: normal;
  font-weight: 850;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.portal-avatar {
  display: grid;
  width: 46px;
  height: 46px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.28);
  border-radius: 8px;
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.07);
  font-weight: 900;
}

.portal-avatar.large {
  width: 72px;
  height: 72px;
  font-size: 1.1rem;
}

.portal-hero {
  min-height: 430px;
  align-items: stretch;
  margin-bottom: 64px;
  padding: 48px;
}

.portal-hero .metric-mini {
  min-height: 176px;
}

.portal-overview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 34px;
  margin-bottom: 38px;
}

.portal-overview-grid > article {
  min-height: 360px;
}

.portal-profile-card,
.portal-performance-card,
.portal-ai-preview,
.portal-access-preview,
.portal-visibility-panel {
  padding: 34px;
}

.portal-profile-card {
  grid-column: span 2;
  min-height: 420px;
}

.portal-profile-grid {
  display: grid;
  grid-template-columns: minmax(240px, 0.75fr) minmax(0, 1.25fr);
  gap: 32px;
  align-items: center;
  margin: 42px 0;
}

.portal-detail-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--line);
}

.portal-detail-list div {
  padding: 18px;
  background: rgba(3, 10, 20, 0.92);
}

.portal-detail-list dt {
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.portal-detail-list dd {
  margin: 0;
  color: var(--text);
  font-size: 1rem;
  font-weight: 750;
}

.portal-cycle {
  display: grid;
  gap: 14px;
  border-top: 1px solid var(--line);
  padding-top: 24px;
}

.portal-cycle > div:first-child,
.portal-quality > div:first-child {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  color: var(--muted-strong);
}

.portal-cycle strong {
  color: var(--text);
}

.portal-progress {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(129, 147, 174, 0.13);
}

.portal-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #4bbbd0, var(--cyan));
  box-shadow: 0 0 18px rgba(103, 232, 249, 0.24);
}

.portal-stat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 30px 0;
}

.portal-stat {
  display: grid;
  gap: 8px;
  min-height: 134px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 18px;
  background: rgba(2, 8, 16, 0.52);
}

.portal-stat > span {
  color: var(--muted);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.portal-stat strong {
  color: var(--text);
  font-size: clamp(2rem, 3vw, 3rem);
  line-height: 1;
}

.portal-stat small {
  color: var(--muted);
}

.portal-card-footer {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  border-top: 1px solid var(--line);
  padding-top: 20px;
  color: var(--muted);
  font-size: 0.88rem;
}

.portal-ai-preview {
  display: flex;
  flex-direction: column;
}

.portal-ai-preview > p,
.portal-access-preview p,
.portal-visibility-panel > p {
  color: var(--muted-strong);
  font-size: 1rem;
  line-height: 1.7;
}

.portal-inline-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 20px 0 28px;
}

.portal-inline-metrics span {
  display: grid;
  gap: 7px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  color: var(--muted);
  font-size: 0.78rem;
}

.portal-inline-metrics strong {
  color: var(--text);
  font-size: 0.9rem;
}

.portal-card-link {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  justify-content: center;
  margin-top: auto;
  text-decoration: none;
}

.portal-access-preview {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  border-color: rgba(213, 176, 106, 0.2);
  background:
    radial-gradient(circle at 100% 0%, rgba(213, 176, 106, 0.07), transparent 62%),
    var(--panel);
}

.portal-onboarding-note {
  display: flex;
  align-items: center;
  gap: 16px;
  border: 1px solid rgba(103, 232, 249, 0.16);
  border-radius: 8px;
  padding: 22px 26px;
  color: var(--muted-strong);
  background: rgba(6, 18, 33, 0.66);
}

.portal-onboarding-note strong {
  color: var(--text);
}

.portal-onboarding-note p {
  margin: 4px 0 0;
  line-height: 1.5;
}

.portal-note-icon {
  display: grid;
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.32);
  border-radius: 50%;
  color: var(--cyan);
  font-weight: 900;
}

.portal-performance-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(360px, 0.75fr);
  gap: 34px;
}

.portal-performance-layout > article {
  min-height: 480px;
}

.portal-quality {
  display: grid;
  gap: 14px;
  margin: 34px 0;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 22px;
  background: rgba(2, 8, 16, 0.55);
}

.portal-quality strong {
  color: var(--text);
  font-size: 1.12rem;
}

.portal-quality em {
  color: var(--yellow);
  font-style: normal;
  font-weight: 800;
}

.portal-ai-console {
  overflow: hidden;
  border: 1px solid rgba(116, 190, 235, 0.22);
  border-radius: 8px;
  background:
    radial-gradient(circle at 8% 0%, rgba(103, 232, 249, 0.07), transparent 36rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.96), rgba(2, 8, 17, 0.98));
  box-shadow: var(--module-shadow);
}

.portal-ai-console-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 26px;
  border-bottom: 1px solid var(--line);
  padding: 36px 40px;
}

.portal-ai-console-head h3 {
  margin-bottom: 8px;
  font-size: clamp(1.8rem, 3vw, 2.8rem);
}

.portal-ai-console-head p:not(.eyebrow) {
  margin: 0;
  color: var(--muted);
}

.portal-ai-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: var(--line);
}

.portal-ai-module {
  min-height: 330px;
  padding: 38px;
  background: rgba(3, 10, 20, 0.96);
}

.portal-ai-module > span {
  color: var(--cyan);
  font-size: 0.74rem;
  font-weight: 850;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.portal-ai-module h4 {
  margin: 28px 0 18px;
  color: var(--text);
  font-size: clamp(1.5rem, 2.4vw, 2.25rem);
}

.portal-ai-module p {
  color: var(--muted-strong);
  font-size: 1rem;
  line-height: 1.75;
}

.portal-checklist {
  display: grid;
  gap: 14px;
  margin: 28px 0 0;
  padding: 0;
  list-style: none;
}

.portal-checklist li {
  display: flex;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid var(--line);
  padding: 0 0 14px;
  color: var(--muted-strong);
}

.portal-checklist i {
  width: 9px;
  height: 9px;
  flex: 0 0 auto;
  border: 1px solid rgba(103, 232, 249, 0.48);
  border-radius: 50%;
  background: rgba(103, 232, 249, 0.12);
}

.portal-ai-disclaimer {
  border-top: 1px solid rgba(213, 176, 106, 0.18);
  padding: 24px 40px 28px;
  background: rgba(213, 176, 106, 0.045);
}

.portal-ai-disclaimer strong {
  color: var(--gold);
}

.portal-ai-disclaimer p {
  margin: 6px 0 0;
  color: var(--muted-strong);
  line-height: 1.6;
}

.portal-access-panel {
  margin-bottom: 0;
}

.portal-access-panel input[readonly] {
  color: var(--muted-strong);
  background: rgba(12, 25, 43, 0.58);
}

@media (max-width: 1120px) {
  .portal-shell {
    grid-template-columns: minmax(0, 1fr);
    max-width: 100vw;
    overflow-x: hidden;
  }

  .portal-sidebar .nav-list {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .portal-sidebar,
  .portal-main {
    min-width: 0;
    max-width: 100%;
  }

  .portal-sidebar {
    width: 100%;
  }

  .portal-main {
    width: 100%;
    padding: 38px 34px 80px;
  }

  .portal-performance-layout {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1500px) {
  .intelligence-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .performance-panel {
    grid-column: span 2;
  }

  .ai-grid {
    grid-template-columns: minmax(0, 1.06fr) minmax(0, 0.94fr);
  }

  .growth-panel,
  .activity-panel {
    grid-column: span 1;
  }
}

@media (max-width: 1320px) {
  .app-shell {
    grid-template-columns: 268px minmax(0, 1fr);
  }

  .dashboard-main {
    padding: 38px 34px 78px;
  }

  .kpi-card:nth-child(1),
  .kpi-card:nth-child(2),
  .kpi-card:nth-child(3),
  .kpi-card:nth-child(6) {
    min-height: 320px;
    padding: 30px;
  }

  .kpi-card:nth-child(1) strong,
  .kpi-card:nth-child(2) strong,
  .kpi-card:nth-child(3) strong,
  .kpi-card:nth-child(6) strong {
    font-size: clamp(3.65rem, 5vw, 4.75rem);
  }

  .access-field-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1120px) {
  .app-shell {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: static;
    height: auto;
  }

  .nav-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .sidebar-note {
    display: none;
  }

  .topbar,
  .topbar-actions {
    align-items: stretch;
    flex-direction: column;
  }

  .topbar-actions {
    width: 100%;
  }

  .search-field input,
  .top-search,
  .primary-button {
    width: 100%;
  }

  .intelligence-grid,
  .kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .kpi-card:nth-child(1),
  .kpi-card:nth-child(2),
  .kpi-card:nth-child(3),
  .kpi-card:nth-child(6),
  .intelligence-grid > article:nth-child(5),
  .performance-panel {
    grid-column: span 2;
  }

  .service-layer,
  .page-hero,
  .access-layout,
  .ai-header {
    grid-template-columns: 1fr;
  }

  .ai-header {
    align-items: stretch;
    flex-direction: column;
  }

  .service-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .executive-grid,
  .page-section-grid.two,
  .page-section-grid.three {
    grid-template-columns: 1fr;
  }

  .ai-grid {
    grid-template-columns: 1fr;
  }

  .ai-card:nth-child(1),
  .ai-card:nth-child(2),
  .ai-card:nth-child(3),
  .ai-card:nth-child(4) {
    grid-column: auto;
    grid-row: auto;
  }

  .client-row {
    grid-template-columns: 1fr 1fr;
  }

  .performance-panel {
    grid-column: span 2;
  }
}

@media (max-width: 720px) {
  .dashboard-main,
  .sidebar {
    padding: 20px 16px;
  }

  .topbar,
  .page-hero,
  .service-layer,
  .ai-analyst-panel,
  .client-access-panel {
    padding: 22px;
  }

  .nav-list,
  .intelligence-grid,
  .kpi-grid,
    .service-card-grid,
    .page-hero-metrics,
    .ai-grid,
  .ai-stat-grid,
  .access-field-grid,
  .form-grid,
  .client-row,
  .donut-wrap,
  .performance-grid {
    grid-template-columns: 1fr;
  }

  .kpi-card:nth-child(1),
  .kpi-card:nth-child(2),
  .kpi-card:nth-child(3),
  .kpi-card:nth-child(4),
  .kpi-card:nth-child(5),
  .kpi-card:nth-child(6),
  .kpi-card:nth-child(7),
  .kpi-card:nth-child(8),
  .intelligence-grid > article:nth-child(5),
  .performance-panel {
    grid-column: auto;
  }

  .kpi-card:nth-child(1),
  .kpi-card:nth-child(2),
  .kpi-card:nth-child(3),
  .kpi-card:nth-child(6) {
    min-height: 292px;
    padding: 26px;
  }

  .kpi-card:nth-child(1) strong,
  .kpi-card:nth-child(2) strong,
  .kpi-card:nth-child(3) strong,
  .kpi-card:nth-child(6) strong {
    margin-top: 38px;
    font-size: clamp(3.4rem, 15vw, 4.65rem);
  }

  .kpi-grid,
  .intelligence-grid,
  .executive-grid,
  .page-section-grid,
  .ai-grid,
  .client-row-list {
    gap: 16px;
  }

  .page-hero {
    margin-bottom: 28px;
  }

  .page-hero-copy h3 {
    font-size: clamp(2rem, 12vw, 3.2rem);
  }

  .metric-mini {
    min-height: 0;
  }

  .client-row-list {
    padding: 18px;
  }

  .client-row {
    padding: 18px;
    min-height: 0;
  }

  .ai-title-block,
  .access-title-block {
    flex-direction: column;
  }

  .panel-header {
    align-items: flex-start;
    flex-direction: column;
  }

  .form-section-title {
    align-items: flex-start;
    flex-direction: column;
  }

  .form-section-title small {
    text-align: left;
  }

  .donut {
    margin: 0 auto;
  }
}

@media (max-width: 720px) {
  .portal-main {
    padding: 20px 16px 64px;
  }

  .portal-sidebar {
    gap: 24px;
  }

  .portal-sidebar .nav-list {
    display: flex;
    width: 100%;
    min-width: 0;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 6px;
    scrollbar-width: thin;
  }

  .portal-sidebar .nav-item {
    min-width: max-content;
    min-height: 48px;
    padding-inline: 14px;
  }

  .portal-topbar,
  .portal-ai-console-head,
  .portal-cycle > div:first-child,
  .portal-quality > div:first-child {
    align-items: flex-start;
    flex-direction: column;
  }

  .portal-topbar {
    margin-bottom: 28px;
  }

  .portal-identity {
    width: 100%;
    min-width: 0;
  }

  .portal-hero {
    min-height: 0;
    padding: 26px 22px;
  }

  .portal-overview-grid,
  .portal-profile-grid,
  .portal-detail-list,
  .portal-stat-grid,
  .portal-inline-metrics,
  .portal-performance-layout,
  .portal-ai-grid {
    grid-template-columns: 1fr;
  }

  .portal-overview-grid {
    gap: 18px;
  }

  .portal-overview-grid > article,
  .portal-performance-layout > article,
  .portal-ai-module {
    min-height: 0;
  }

  .portal-profile-card {
    grid-column: auto;
  }

  .portal-profile-card,
  .portal-performance-card,
  .portal-ai-preview,
  .portal-access-preview,
  .portal-visibility-panel {
    padding: 24px 20px;
  }

  .portal-profile-grid {
    gap: 24px;
    margin: 30px 0;
  }

  .portal-person,
  .portal-card-footer {
    align-items: flex-start;
    flex-direction: column;
  }

  .portal-ai-console-head,
  .portal-ai-module,
  .portal-ai-disclaimer {
    padding: 26px 22px;
  }

  .portal-ai-console-head .primary-button,
  .portal-card-link {
    width: 100%;
  }

  .portal-onboarding-note {
    align-items: flex-start;
    padding: 20px;
  }
}

/* Premium refinement pass for the AUREX Client Intelligence V1 surfaces. */
.admin-intelligence-body,
.public-intelligence-body {
  position: relative;
  overflow-x: hidden;
  background:
    linear-gradient(rgba(103, 232, 249, 0.024) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 232, 249, 0.018) 1px, transparent 1px),
    radial-gradient(circle at 18% -6%, rgba(103, 232, 249, 0.12), transparent 30rem),
    radial-gradient(circle at 78% 0%, rgba(104, 168, 255, 0.085), transparent 34rem),
    linear-gradient(135deg, #01040b 0%, #030916 42%, #06111f 100%);
  background-size: 52px 52px, 52px 52px, auto, auto, auto;
}

.admin-intelligence-body::before,
.public-intelligence-body::before {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 8%, rgba(103, 232, 249, 0.06), transparent 28rem),
    linear-gradient(115deg, transparent 0%, rgba(103, 232, 249, 0.035) 42%, transparent 62%);
  content: "";
}

#adminApp,
#publicLeaderboardApp,
#proRewardsApp {
  position: relative;
  z-index: 1;
}

.admin-intelligence-shell {
  grid-template-columns: 292px minmax(0, 1fr);
}

.admin-sidebar {
  position: sticky;
  top: 0;
  gap: 24px;
  border-right-color: rgba(103, 232, 249, 0.2);
  background:
    radial-gradient(circle at 50% 0%, rgba(103, 232, 249, 0.16), transparent 18rem),
    linear-gradient(180deg, rgba(5, 14, 28, 0.98), rgba(2, 7, 15, 0.98));
  box-shadow: 22px 0 80px rgba(0, 0, 0, 0.38), inset -1px 0 0 rgba(103, 232, 249, 0.08);
}

.admin-brand-lockup {
  align-items: flex-start;
  padding: 18px;
  background:
    radial-gradient(circle at 0% 0%, rgba(103, 232, 249, 0.16), transparent 80%),
    linear-gradient(150deg, rgba(14, 31, 55, 0.92), rgba(4, 13, 25, 0.78));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 20px 48px rgba(0, 0, 0, 0.26);
}

.admin-brand-lockup .brand-mark {
  width: 66px;
  height: 66px;
  border-color: rgba(103, 232, 249, 0.58);
  box-shadow: inset 0 0 24px rgba(103, 232, 249, 0.14), 0 0 42px rgba(103, 232, 249, 0.18);
}

.admin-brand-lockup h1 {
  font-size: 1.14rem;
}

.admin-brand-signal {
  display: inline-flex;
  margin-top: 8px;
  color: var(--muted-strong);
  font-size: 0.74rem;
  font-weight: 800;
}

.admin-sidebar .nav-list {
  gap: 7px;
}

.admin-sidebar .nav-item {
  min-height: 46px;
  border-color: rgba(148, 177, 220, 0.06);
  border-radius: 8px;
  color: #aab9cf;
  font-size: 0.92rem;
}

.admin-sidebar .nav-item:hover,
.admin-sidebar .nav-item.is-active {
  border-color: rgba(103, 232, 249, 0.36);
  background:
    linear-gradient(90deg, rgba(103, 232, 249, 0.16), rgba(104, 168, 255, 0.055)),
    rgba(8, 21, 39, 0.64);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055), 0 12px 30px rgba(0, 0, 0, 0.22);
}

.admin-sidebar-card {
  display: block;
  border-color: rgba(103, 232, 249, 0.22);
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.13), transparent 62%),
    linear-gradient(180deg, rgba(13, 30, 52, 0.76), rgba(4, 12, 23, 0.9));
}

.sidebar-card-grid {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 7px 12px;
  margin-top: 14px;
  border-top: 1px solid rgba(148, 177, 220, 0.11);
  padding-top: 14px;
}

.sidebar-card-grid span {
  color: var(--muted);
}

.sidebar-card-grid strong {
  color: var(--cyan);
  font-size: 0.78rem;
  text-transform: uppercase;
}

.admin-main {
  width: min(100%, 1560px);
  margin: 0 auto;
  padding: 30px 34px 68px;
}

.admin-topbar {
  align-items: center;
  margin-bottom: 22px;
  border-color: rgba(103, 232, 249, 0.2);
  padding: 24px 26px;
  background:
    radial-gradient(circle at 0% 0%, rgba(103, 232, 249, 0.11), transparent 28rem),
    linear-gradient(105deg, rgba(9, 23, 42, 0.86), rgba(3, 10, 20, 0.7));
}

.admin-topbar h2 {
  margin-bottom: 5px;
  font-size: clamp(1.65rem, 3vw, 2.65rem);
}

.admin-topbar .topbar-subtitle {
  max-width: 760px;
  color: #aebdd2;
  line-height: 1.5;
}

.admin-header-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.admin-header-meta span {
  border: 1px solid rgba(148, 177, 220, 0.13);
  border-radius: 999px;
  padding: 5px 9px;
  color: var(--muted);
  background: rgba(255, 255, 255, 0.025);
  font-size: 0.74rem;
  font-weight: 800;
}

.admin-intelligence-body .primary-button,
.public-intelligence-body .primary-button,
.admin-intelligence-body .secondary-button,
.public-intelligence-body .secondary-button {
  min-height: 42px;
  border-radius: 8px;
  font-weight: 900;
}

.admin-intelligence-body .primary-button,
.public-intelligence-body .primary-button {
  border: 1px solid rgba(103, 232, 249, 0.46);
  color: #00131d;
  background: linear-gradient(135deg, #8af3ff, #68a8ff);
  box-shadow: 0 12px 34px rgba(103, 232, 249, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.admin-intelligence-body .secondary-button,
.public-intelligence-body .secondary-button {
  border: 1px solid rgba(103, 232, 249, 0.24);
  color: var(--muted-strong);
  background: rgba(8, 22, 40, 0.74);
}

.control-room-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
}

.control-room-grid .admin-stat-card {
  grid-column: auto !important;
  min-height: 168px !important;
  border-color: rgba(103, 232, 249, 0.18);
  padding: 20px !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.1), transparent 64%),
    linear-gradient(180deg, rgba(12, 29, 51, 0.84), rgba(4, 12, 24, 0.92));
  box-shadow: 0 20px 52px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.control-room-grid .admin-stat-card strong {
  margin-top: 18px !important;
  color: #f4fbff;
  font-size: clamp(1.75rem, 2.6vw, 2.55rem) !important;
  line-height: 1;
}

.control-room-grid .kpi-topline {
  gap: 8px;
}

.control-room-grid .kpi-icon {
  width: 34px;
  height: 34px;
  border-color: rgba(103, 232, 249, 0.24);
  background: rgba(103, 232, 249, 0.08);
}

.control-room-grid .kpi-caption {
  color: #8fa0b8;
  font-size: 0.78rem;
}

.overview-preview-grid {
  align-items: start;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  gap: 16px;
  margin-top: 16px;
}

.admin-table-panel {
  border-color: rgba(103, 232, 249, 0.19);
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.085), transparent 24rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.93), rgba(3, 10, 20, 0.97));
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.052);
}

.admin-table-panel .panel-header {
  padding: 19px 20px;
  background: linear-gradient(90deg, rgba(103, 232, 249, 0.045), transparent);
}

.admin-table-panel .panel-header h3 {
  font-size: 1.05rem;
}

.admin-table-wrap {
  overflow-x: visible;
}

.admin-table {
  min-width: 0;
  table-layout: auto;
}

.admin-table th,
.admin-table td {
  padding: 12px 13px;
}

.admin-table.dense th,
.admin-table.dense td {
  padding: 10px 8px;
  font-size: 0.78rem;
}

.admin-table th {
  border-bottom: 1px solid rgba(103, 232, 249, 0.18);
  color: #8da8c5;
  background: rgba(103, 232, 249, 0.045);
}

.admin-table td {
  color: #d9e8fa;
  line-height: 1.35;
}

.admin-table tbody tr {
  transition: background 160ms ease, box-shadow 160ms ease;
}

.admin-table tbody tr:hover {
  background: rgba(103, 232, 249, 0.055);
  box-shadow: inset 2px 0 0 var(--cyan);
}

.status-badge {
  min-height: 24px;
  border-radius: 999px;
  padding: 4px 9px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  font-size: 0.68rem;
}

.leaderboard-manager {
  gap: 16px;
}

.manager-note,
.leaderboard-card,
.settings-card,
.reward-item,
.reward-disclaimer,
.public-hero,
.public-board,
.public-signal-grid article {
  border-color: rgba(103, 232, 249, 0.19);
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.08), transparent 18rem),
    linear-gradient(180deg, rgba(9, 23, 42, 0.9), rgba(3, 10, 20, 0.96));
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.052);
}

.leaderboard-card {
  position: relative;
  overflow: hidden;
}

.leaderboard-card::before {
  position: absolute;
  inset: 0 0 auto;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(103, 232, 249, 0.8), transparent);
  content: "";
}

.leaderboard-card small {
  display: block;
  margin-top: 6px;
  color: var(--muted);
  font-size: 0.76rem;
}

.draft-control {
  border-color: rgba(103, 232, 249, 0.16);
  background: rgba(4, 14, 27, 0.72);
}

.draft-control input:checked + span {
  color: var(--cyan);
}

.settings-command-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
}

.settings-card {
  min-height: 230px;
  padding: 22px;
}

.settings-card .panel-header {
  margin-bottom: 18px;
}

.settings-card h3 {
  font-size: 1.06rem;
}

.settings-card small {
  display: block;
  margin-top: 14px;
  color: var(--muted);
  font-weight: 800;
}

.setting-meter {
  height: 6px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(129, 147, 174, 0.13);
}

.setting-meter span {
  display: block;
  width: 34%;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--cyan), var(--blue));
}

.public-shell {
  width: min(1160px, calc(100% - 36px));
}

.public-header {
  border-color: rgba(103, 232, 249, 0.18);
}

.public-hero {
  position: relative;
  overflow: hidden;
}

.public-hero::after {
  position: absolute;
  right: 28px;
  bottom: 24px;
  width: 160px;
  height: 160px;
  border: 1px solid rgba(103, 232, 249, 0.12);
  background:
    linear-gradient(rgba(103, 232, 249, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 232, 249, 0.07) 1px, transparent 1px);
  background-size: 18px 18px;
  content: "";
  opacity: 0.6;
}

.public-signal-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.public-signal-grid article {
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 8px;
  padding: 18px;
}

.public-signal-grid span {
  display: block;
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.public-signal-grid strong {
  color: var(--text);
  font-size: 1.45rem;
}

.public-rank-row:hover {
  background: rgba(103, 232, 249, 0.045);
}

@media (max-width: 1380px) {
  .control-room-grid,
  .settings-command-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .settings-card:last-child {
    grid-column: span 2;
  }
}

@media (max-width: 1160px) {
  .admin-intelligence-shell,
  .overview-preview-grid {
    grid-template-columns: 1fr;
  }

  .admin-sidebar {
    position: static;
    height: auto;
  }

  .admin-sidebar-card {
    display: none;
  }

  .admin-sidebar .nav-list {
    display: flex;
    overflow-x: auto;
    padding-bottom: 6px;
  }

  .admin-sidebar .nav-item {
    min-width: max-content;
  }

  .control-room-grid,
  .settings-command-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .admin-table thead {
    display: none;
  }

  .admin-table,
  .admin-table tbody,
  .admin-table tr,
  .admin-table td {
    display: block;
    width: 100%;
  }

  .admin-table tr {
    margin: 10px;
    border: 1px solid rgba(103, 232, 249, 0.14);
    border-radius: 8px;
    background: rgba(3, 11, 22, 0.74);
  }

  .admin-table td,
  .admin-table.dense td {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    padding: 10px 12px;
    font-size: 0.86rem;
  }

  .admin-table td::before {
    flex: 0 0 42%;
    color: var(--muted);
    font-size: 0.68rem;
    font-weight: 900;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    content: attr(data-label);
  }
}

@media (max-width: 720px) {
  .admin-main {
    padding: 20px 16px 56px;
  }

  .admin-topbar {
    padding: 22px;
  }

  .control-room-grid,
  .settings-command-grid,
  .public-signal-grid,
  .rewards-grid {
    grid-template-columns: 1fr;
  }

  .settings-card:last-child {
    grid-column: auto;
  }

  .public-hero::after {
    display: none;
  }
}

/* Client Registry + Data Quality readiness layer */
.import-readiness-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: 22px;
  align-items: center;
  margin-top: 16px;
  border: 1px solid rgba(103, 232, 249, 0.22);
  border-radius: 8px;
  padding: 24px;
  background:
    radial-gradient(circle at 0% 0%, rgba(103, 232, 249, 0.12), transparent 30rem),
    linear-gradient(135deg, rgba(10, 26, 47, 0.9), rgba(3, 10, 20, 0.95));
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.import-readiness-panel h3 {
  margin-bottom: 8px;
  font-size: clamp(1.25rem, 2vw, 1.9rem);
}

.import-readiness-panel p:not(.eyebrow) {
  max-width: 760px;
  margin-bottom: 0;
  color: var(--muted-strong);
  line-height: 1.62;
}

.next-action-callout {
  margin-top: 18px;
  border: 1px solid rgba(231, 199, 106, 0.22);
  border-radius: 8px;
  padding: 14px 16px;
  background:
    linear-gradient(135deg, rgba(231, 199, 106, 0.09), rgba(103, 232, 249, 0.035)),
    rgba(2, 9, 18, 0.55);
}

.next-action-callout span {
  display: block;
  margin-bottom: 6px;
  color: var(--gold);
  font-size: 0.68rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.next-action-callout strong {
  color: #edf7ff;
  font-size: 0.92rem;
  font-weight: 650;
  line-height: 1.45;
}

.import-readiness-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.import-readiness-metrics article {
  min-height: 82px;
  border: 1px solid rgba(148, 177, 220, 0.12);
  border-radius: 8px;
  padding: 14px;
  background: rgba(2, 9, 18, 0.62);
}

.import-readiness-metrics span {
  display: block;
  margin-bottom: 9px;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.import-readiness-metrics strong {
  color: var(--text);
  font-size: 1.45rem;
}

.quality-card-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}

.quality-summary-card {
  display: grid;
  min-width: 0;
  min-height: 118px;
  align-content: space-between;
  gap: 10px;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 8px;
  padding: 14px;
  background:
    linear-gradient(140deg, rgba(255, 255, 255, 0.04), transparent 38%),
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.11), transparent 16rem),
    rgba(3, 12, 24, 0.82);
  box-shadow: 0 18px 46px rgba(0, 0, 0, 0.26), inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.quality-summary-card > div {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 8px;
}

.quality-summary-card p {
  margin: 0;
  color: #c5d5ea;
  font-size: 0.7rem;
  font-weight: 760;
  letter-spacing: 0.075em;
  line-height: 1.25;
  text-transform: uppercase;
}

.quality-summary-card .quality-number {
  color: #f6fbff;
  font-size: clamp(1.45rem, 2vw, 2rem);
  font-weight: 760;
  line-height: 1;
  letter-spacing: 0;
}

.quality-summary-card small {
  color: var(--muted-strong);
  font-size: 0.72rem;
  line-height: 1.35;
}

.issue-badge-list {
  display: flex;
  max-width: 360px;
  flex-wrap: wrap;
  gap: 5px;
}

.admin-table.dense {
  table-layout: fixed;
}

.admin-table.dense th,
.admin-table.dense td {
  overflow-wrap: anywhere;
}

.admin-table td[data-label="Suggested Fix"] {
  min-width: 190px;
  color: #b9c8dc;
}

.admin-table td[data-label="Email"],
.admin-table td[data-label="Phone"],
.admin-table td[data-label="Telegram"],
.admin-table td[data-label="Primary Account"],
.admin-table td[data-label="Linked Accounts"] {
  font-family: "Segoe UI", system-ui, sans-serif;
  font-size: 0.78rem;
}

@media (max-width: 1500px) {
  .quality-card-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 1180px) {
  .quality-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1160px) {
  .import-readiness-panel {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 720px) {
  .import-readiness-metrics,
  .quality-card-grid {
    grid-template-columns: 1fr;
  }

  .import-readiness-panel {
    padding: 20px;
  }
}

/* Typography, metric motion, and card polish pass */
:root {
  --font-fintech: "Plus Jakarta Sans", "Manrope", "Inter", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  --font-numeric: "Inter", "Plus Jakarta Sans", "Segoe UI", system-ui, sans-serif;
}

body,
button,
input,
select,
textarea {
  font-family: var(--font-fintech);
  font-weight: 450;
  letter-spacing: 0;
}

h1,
h2,
h3,
h4,
.public-hero h1,
.admin-topbar h2,
.brand-lockup h1 {
  font-family: var(--font-fintech);
  font-weight: 760;
  letter-spacing: 0;
}

p,
.topbar-subtitle,
.kpi-caption,
.preview-note,
.admin-table td,
.reward-item p,
.public-hero p:not(.eyebrow) {
  line-height: 1.62;
}

.eyebrow,
.brand-kicker,
.admin-table th,
.public-signal-grid span,
.reward-item > span {
  font-weight: 760;
  letter-spacing: 0.08em;
}

.metric-number,
.kpi-card strong,
.public-rank-row strong,
.import-readiness-metrics strong,
.public-signal-grid strong {
  font-family: var(--font-numeric);
  font-variant-numeric: tabular-nums;
  font-weight: 720;
  letter-spacing: 0;
}

.count-up {
  display: inline-block;
  min-width: 2ch;
}

.admin-stat-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(103, 232, 249, 0.22) !important;
  background:
    linear-gradient(140deg, rgba(255, 255, 255, 0.045), transparent 34%),
    radial-gradient(circle at 92% 0%, rgba(103, 232, 249, 0.15), transparent 60%),
    linear-gradient(180deg, rgba(12, 29, 51, 0.88), rgba(3, 10, 20, 0.94)) !important;
  box-shadow:
    0 28px 72px rgba(0, 0, 0, 0.42),
    0 0 0 1px rgba(103, 232, 249, 0.035),
    inset 0 1px 0 rgba(255, 255, 255, 0.07) !important;
}

.admin-stat-card::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, transparent, rgba(103, 232, 249, 0.18), transparent) 0 0 / 100% 1px no-repeat,
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), transparent 36%);
  content: "";
}

.admin-stat-card::after {
  position: absolute;
  right: 18px;
  bottom: 16px;
  width: 58px;
  height: 58px;
  border: 1px solid rgba(103, 232, 249, 0.1);
  background:
    linear-gradient(rgba(103, 232, 249, 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 232, 249, 0.055) 1px, transparent 1px);
  background-size: 12px 12px;
  content: "";
  opacity: 0.66;
}

.admin-stat-card .kpi-topline,
.admin-stat-card .metric-number,
.admin-stat-card .kpi-caption {
  position: relative;
  z-index: 1;
}

.admin-stat-card .kpi-icon {
  border: 1px solid rgba(103, 232, 249, 0.28);
  color: #92f4ff;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.14), transparent 72%),
    linear-gradient(145deg, rgba(103, 232, 249, 0.16), rgba(104, 168, 255, 0.055));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), 0 10px 24px rgba(103, 232, 249, 0.09);
}

.admin-stat-card .kpi-topline p {
  color: #c5d5ea;
  font-size: 0.78rem;
  font-weight: 720;
}

.admin-stat-card .metric-number {
  color: #f6fbff;
  text-shadow: 0 0 28px rgba(103, 232, 249, 0.12);
}

.admin-table th {
  font-family: var(--font-fintech);
  font-size: 0.67rem;
  font-weight: 760;
}

.admin-table td {
  font-family: var(--font-fintech);
  font-size: 0.84rem;
  font-weight: 480;
}

.status-badge,
.kpi-indicator {
  font-family: var(--font-fintech);
  font-weight: 720;
}

.public-board {
  display: grid;
  gap: 10px;
  padding: 12px;
}

.public-board-head {
  border: 1px solid rgba(103, 232, 249, 0.11);
  border-radius: 8px;
}

.public-ranking-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 8px;
  background:
    radial-gradient(circle at 0% 0%, rgba(103, 232, 249, 0.11), transparent 58%),
    linear-gradient(180deg, rgba(10, 25, 45, 0.86), rgba(3, 10, 20, 0.94));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 16px 36px rgba(0, 0, 0, 0.22);
}

.public-ranking-card::before {
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(103, 232, 249, 0.75), transparent);
  content: "";
}

.public-rank-medal {
  display: grid;
  width: 54px;
  height: 54px;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.32);
  border-radius: 8px;
  color: #8af3ff !important;
  background: rgba(103, 232, 249, 0.08);
  font-size: 1rem !important;
}

.public-trader-name {
  color: #f3f8ff;
  font-size: 1rem;
}

.public-lots .metric-number {
  color: #e8f7ff;
  font-size: 1.08rem;
}

.public-trader-badge {
  border-color: rgba(213, 176, 106, 0.36) !important;
  color: #f5dfaa !important;
  background:
    linear-gradient(135deg, rgba(213, 176, 106, 0.18), rgba(103, 232, 249, 0.04)) !important;
}

.premium-reward-module {
  position: relative;
  min-height: 218px;
  overflow: hidden;
}

.premium-reward-module::before {
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background: linear-gradient(90deg, rgba(103, 232, 249, 0.62), transparent);
  content: "";
}

.premium-reward-module > span {
  display: inline-flex;
  margin-bottom: 28px;
  border: 1px solid rgba(103, 232, 249, 0.2);
  border-radius: 999px;
  padding: 6px 10px;
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.07);
  font-size: 0.7rem;
}

.premium-reward-module h3 {
  margin-bottom: 12px;
  color: #f2f8ff;
  font-size: 1.16rem;
  font-weight: 740;
}

.public-cta-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  border: 1px solid rgba(103, 232, 249, 0.2);
  border-radius: 8px;
  padding: 26px;
  background:
    radial-gradient(circle at 0% 0%, rgba(103, 232, 249, 0.12), transparent 28rem),
    linear-gradient(135deg, rgba(10, 26, 47, 0.9), rgba(3, 10, 20, 0.95));
  box-shadow: 0 22px 58px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.public-cta-panel h2 {
  margin-bottom: 8px;
  font-size: 1.45rem;
}

.public-cta-panel p:not(.eyebrow) {
  max-width: 680px;
  margin-bottom: 0;
  color: var(--muted-strong);
}

@media (prefers-reduced-motion: reduce) {
  .count-up {
    transition: none;
  }
}

@media (max-width: 820px) {
  .public-board {
    padding: 10px;
  }

  .public-ranking-card {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
  }

  .public-ranking-card time,
  .public-ranking-card .public-trader-badge,
  .public-ranking-card .public-lots {
    grid-column: 2;
  }

  .public-cta-panel {
    align-items: flex-start;
    flex-direction: column;
  }
}

/* Broker Import Engine V1 */
.import-stepper {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}

.import-stepper article {
  display: flex;
  min-height: 82px;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(148, 177, 220, 0.12);
  border-radius: 8px;
  padding: 15px;
  color: var(--muted);
  background: rgba(3, 11, 22, 0.68);
}

.import-stepper article.is-active {
  border-color: rgba(103, 232, 249, 0.26);
  color: var(--text);
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.12), transparent 70%),
    linear-gradient(180deg, rgba(9, 23, 42, 0.9), rgba(3, 10, 20, 0.94));
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.import-stepper span {
  display: grid;
  width: 36px;
  height: 36px;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.24);
  border-radius: 8px;
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.07);
  font-weight: 760;
}

.import-stepper strong {
  font-size: 0.92rem;
  font-weight: 700;
}

.import-panel,
.import-report {
  display: grid;
  gap: 18px;
  margin-bottom: 16px;
  border: 1px solid rgba(103, 232, 249, 0.19);
  border-radius: 8px;
  padding: 22px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.08), transparent 24rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.92), rgba(3, 10, 20, 0.96));
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.052);
}

.import-form-grid,
.mapping-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.mapping-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.import-form-grid label,
.mapping-grid label {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-size: 0.72rem;
  font-weight: 760;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.mapping-grid label.required span {
  color: #dcecff;
}

.import-form-grid input,
.import-form-grid select,
.mapping-grid select {
  min-height: 42px;
  width: 100%;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 8px;
  padding: 0 12px;
  color: var(--text);
  background: rgba(2, 9, 18, 0.68);
  outline: none;
}

.import-file-field {
  grid-column: span 1;
}

.import-file-field input {
  padding: 9px 12px;
}

.import-file-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border: 1px solid rgba(148, 177, 220, 0.11);
  border-radius: 8px;
  padding: 14px 16px;
  background: rgba(2, 9, 18, 0.55);
}

.import-file-summary strong {
  color: #eff8ff;
  font-weight: 700;
}

.import-file-summary span {
  color: var(--muted);
  font-size: 0.86rem;
  line-height: 1.45;
}

.import-validation-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.import-validation-strip article {
  border: 1px solid rgba(103, 232, 249, 0.14);
  border-radius: 8px;
  padding: 16px;
  background: rgba(2, 9, 18, 0.58);
}

.import-validation-strip span {
  display: block;
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.import-validation-strip strong {
  color: var(--text);
  font-size: 1.55rem;
}

.import-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.import-actions button:disabled,
.table-action-group button:disabled {
  cursor: not-allowed;
  opacity: 0.62;
}

.import-summary-grid {
  margin-bottom: 16px;
}

.import-report > .admin-table-panel {
  margin-top: 0;
}

.table-action-group {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.table-action-group button {
  min-height: 30px;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 8px;
  padding: 0 9px;
  color: var(--muted-strong);
  background: rgba(8, 22, 40, 0.72);
  font-size: 0.72rem;
  font-weight: 700;
}

.registry-actions {
  min-width: 220px;
}

.registry-actions button {
  flex: 1 1 96px;
}

.registry-view-toggle,
.report-action-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
  border: 1px solid rgba(103, 232, 249, 0.16);
  border-radius: 10px;
  padding: 16px;
  background:
    linear-gradient(135deg, rgba(103, 232, 249, 0.08), rgba(10, 20, 38, 0.72)),
    rgba(2, 9, 18, 0.74);
  box-shadow: 0 18px 54px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.registry-view-toggle strong,
.report-action-panel h3 {
  display: block;
  margin: 2px 0 4px;
  color: var(--text);
  font-size: 1rem;
  font-weight: 680;
}

.registry-view-toggle span,
.report-action-panel span {
  color: var(--muted-strong);
  font-size: 0.84rem;
}

.segmented-control {
  display: inline-flex;
  gap: 4px;
  border: 1px solid rgba(103, 232, 249, 0.14);
  border-radius: 8px;
  padding: 4px;
  background: rgba(4, 12, 24, 0.72);
}

.segmented-control button {
  min-height: 34px;
  border: 0;
  border-radius: 6px;
  padding: 0 13px;
  color: var(--muted-strong);
  background: transparent;
  font: inherit;
  font-size: 0.82rem;
  font-weight: 720;
  cursor: pointer;
}

.segmented-control button.active {
  color: #eaffff;
  background: linear-gradient(135deg, rgba(103, 232, 249, 0.22), rgba(24, 92, 255, 0.2));
  box-shadow: inset 0 0 0 1px rgba(103, 232, 249, 0.22);
}

.segmented-control button:disabled {
  cursor: not-allowed;
  opacity: 0.46;
}

.account-chip-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 9rem;
}

.account-chip-list span {
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 999px;
  padding: 4px 8px;
  color: #dff7ff;
  background: rgba(103, 232, 249, 0.08);
  font-size: 0.78rem;
  font-weight: 680;
}

.muted-cell {
  color: var(--muted-strong);
}

.table-client-intelligence-ledger .admin-table,
.table-client-registry-readiness .admin-table {
  table-layout: auto;
}

.table-client-intelligence-ledger .admin-table th,
.table-client-intelligence-ledger .admin-table td,
.table-client-registry-readiness .admin-table th,
.table-client-registry-readiness .admin-table td {
  padding: 10px 10px;
  border-right: 1px solid rgba(103, 232, 249, 0.075);
  overflow-wrap: normal;
  word-break: normal;
  vertical-align: top;
}

.table-client-intelligence-ledger .admin-table th:last-child,
.table-client-intelligence-ledger .admin-table td:last-child,
.table-client-registry-readiness .admin-table th:last-child,
.table-client-registry-readiness .admin-table td:last-child {
  border-right: 0;
}

.table-client-intelligence-ledger .admin-table th,
.table-client-registry-readiness .admin-table th {
  min-width: 76px;
  white-space: normal;
  line-height: 1.25;
  letter-spacing: 0.075em;
}

.table-client-intelligence-ledger .admin-table td,
.table-client-registry-readiness .admin-table td {
  font-size: 0.76rem;
  line-height: 1.38;
}

.client-name-cell {
  display: block;
  min-width: 8.5rem;
  color: #eef8ff;
  font-weight: 740;
  line-height: 1.3;
}

.primary-account-cell {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 6px;
  padding: 3px 7px;
  color: #e5fbff;
  background: rgba(103, 232, 249, 0.075);
  font-family: var(--font-numeric);
  font-weight: 760;
  white-space: nowrap;
}

.private-field-cell {
  display: block;
  max-width: 13.5rem;
  overflow: hidden;
  color: #c7d8ee;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.issue-reason-cell {
  display: block;
  max-width: 16rem;
  color: #bfcee1;
  line-height: 1.42;
}

.table-client-intelligence-ledger .account-chip-list,
.table-client-registry-readiness .account-chip-list {
  min-width: 7.5rem;
  max-width: 12rem;
  gap: 4px;
}

.table-client-intelligence-ledger .account-chip-list span,
.table-client-registry-readiness .account-chip-list span {
  padding: 3px 7px;
  font-size: 0.72rem;
  line-height: 1.2;
}

.table-client-registry-readiness .issue-badge-list {
  max-width: 17rem;
  gap: 4px;
}

.table-client-registry-readiness .status-badge,
.table-client-intelligence-ledger .status-badge {
  min-height: 22px;
  padding: 3px 7px;
  white-space: nowrap;
}

.table-icon-button {
  min-height: 28px;
  border: 1px solid rgba(103, 232, 249, 0.22);
  border-radius: 7px;
  padding: 0 10px;
  color: #dff7ff;
  background: rgba(103, 232, 249, 0.08);
  font: inherit;
  font-size: 0.72rem;
  font-weight: 760;
  cursor: pointer;
}

.admin-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(0, 6, 14, 0.76);
  backdrop-filter: blur(16px);
}

.admin-edit-modal {
  display: grid;
  width: min(920px, 100%);
  max-height: min(88vh, 820px);
  overflow: auto;
  gap: 18px;
  border: 1px solid rgba(103, 232, 249, 0.22);
  border-radius: 12px;
  padding: 20px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.12), transparent 24rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.98), rgba(2, 8, 17, 0.98));
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.modal-close-button {
  min-height: 34px;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 8px;
  padding: 0 12px;
  color: var(--muted-strong);
  background: rgba(2, 9, 18, 0.72);
  font: inherit;
  font-weight: 720;
  cursor: pointer;
}

.edit-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.edit-form-grid label {
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 760;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.edit-form-grid input,
.edit-form-grid select,
.edit-form-grid textarea {
  min-height: 40px;
  width: 100%;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 8px;
  padding: 0 11px;
  color: var(--text);
  background: rgba(2, 9, 18, 0.72);
  font: inherit;
  outline: none;
}

.edit-form-grid input:disabled {
  color: var(--muted-strong);
  background: rgba(148, 177, 220, 0.06);
}

.edit-form-grid textarea {
  min-height: 96px;
  padding: 11px;
  resize: vertical;
}

.edit-notes-field {
  grid-column: 1 / -1;
}

.modal-action-row {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}

.import-context-note {
  border: 1px solid rgba(103, 232, 249, 0.16);
  border-radius: 8px;
  padding: 16px 18px;
  background:
    radial-gradient(circle at 0% 0%, rgba(103, 232, 249, 0.08), transparent 24rem),
    rgba(2, 9, 18, 0.56);
}

.import-context-note strong {
  display: block;
  margin-bottom: 6px;
  color: var(--cyan);
  font-size: 0.78rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.import-context-note p {
  margin: 0;
  color: var(--muted-strong);
  line-height: 1.58;
}

.import-report .admin-table-panel.dense .admin-table th,
.import-report .admin-table-panel.dense .admin-table td {
  padding-inline: 7px;
}

.import-report .admin-table th {
  white-space: normal;
  word-break: keep-all;
}

.import-report .admin-table td {
  vertical-align: top;
}

.import-report .admin-table td[data-label="Account Logins"],
.import-report .admin-table td[data-label="Suggested Fix"] {
  min-width: 150px;
}

.leaderboard-draft-controls {
  display: flex;
  max-width: 340px;
  flex-wrap: wrap;
  gap: 6px;
}

.leaderboard-draft-controls .draft-control {
  min-height: 30px;
  padding: 5px 8px;
  font-size: 0.68rem;
}

.planned-client-dashboard-note {
  border: 1px solid rgba(213, 176, 106, 0.22);
  border-radius: 8px;
  padding: 18px 20px;
  background:
    radial-gradient(circle at 0% 0%, rgba(213, 176, 106, 0.09), transparent 24rem),
    linear-gradient(180deg, rgba(9, 23, 42, 0.82), rgba(3, 10, 20, 0.94));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.planned-client-dashboard-note p:not(.eyebrow) {
  margin-bottom: 0;
  color: var(--muted-strong);
  line-height: 1.62;
}

.import-alert {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
  border: 1px solid rgba(89, 211, 144, 0.24);
  border-radius: 8px;
  padding: 14px 16px;
  background:
    radial-gradient(circle at 0% 0%, rgba(89, 211, 144, 0.1), transparent 24rem),
    rgba(2, 9, 18, 0.72);
}

.import-alert strong {
  color: #b8f8d1;
  font-weight: 720;
}

.import-alert.warning {
  border-color: rgba(245, 158, 11, 0.28);
  background:
    radial-gradient(circle at 0% 0%, rgba(245, 158, 11, 0.12), transparent 24rem),
    rgba(2, 9, 18, 0.72);
}

.import-alert.warning strong {
  color: #f8d58a;
}

.import-alert span {
  color: var(--muted-strong);
  line-height: 1.45;
}

.save-report-button {
  box-shadow: 0 16px 42px rgba(103, 232, 249, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.6) !important;
}

.save-report-note {
  border-color: rgba(103, 232, 249, 0.2);
}

.registry-identity-note {
  border-color: rgba(231, 199, 106, 0.22);
}

.sticky-import-actions {
  position: sticky;
  z-index: 20;
  bottom: 16px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin: 20px 0;
  border: 1px solid rgba(103, 232, 249, 0.24);
  border-radius: 8px;
  padding: 12px;
  background:
    linear-gradient(180deg, rgba(8, 22, 40, 0.94), rgba(3, 10, 20, 0.96));
  box-shadow: 0 22px 64px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(16px);
}

.sticky-import-actions .secondary-button,
.sticky-import-actions .primary-button {
  min-height: 38px;
}

.danger-action {
  border-color: rgba(255, 100, 116, 0.24) !important;
  color: #ffb4bd !important;
}

@media (max-width: 1300px) {
  .import-form-grid,
  .mapping-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 820px) {
  .import-stepper,
  .import-validation-strip {
    grid-template-columns: 1fr;
  }

  .import-form-grid,
  .mapping-grid {
    grid-template-columns: 1fr;
  }

  .import-file-summary {
    align-items: flex-start;
    flex-direction: column;
  }

  .import-alert,
  .sticky-import-actions,
  .registry-view-toggle,
  .report-action-panel {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Reports and local ledger */
.reports-control-room {
  display: grid;
  gap: 16px;
}

.reports-control-room .manager-note {
  margin-bottom: 0;
}

.reports-control-room .admin-table-panel {
  margin-top: 0;
}

.reports-control-room .admin-table td[data-label="Account Logins"],
.reports-control-room .admin-table td[data-label="File Name"] {
  overflow-wrap: anywhere;
}

.export-center,
.final-month-summary {
  display: grid;
  gap: 14px;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 10px;
  padding: 18px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.09), transparent 24rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.9), rgba(3, 10, 20, 0.96));
  box-shadow: 0 20px 56px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.export-controls {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(220px, 1.2fr) auto;
  gap: 12px;
  align-items: end;
}

.export-controls label {
  display: grid;
  gap: 8px;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.export-controls select {
  min-height: 40px;
  width: 100%;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 8px;
  padding: 0 12px;
  color: var(--text);
  background: rgba(2, 9, 18, 0.72);
}

.final-summary-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.final-summary-grid article {
  min-height: 78px;
  border: 1px solid rgba(103, 232, 249, 0.13);
  border-radius: 8px;
  padding: 12px;
  background: rgba(2, 9, 18, 0.54);
}

.final-summary-grid span {
  display: block;
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.final-summary-grid strong {
  color: #eef8ff;
  font-size: 1rem;
  font-weight: 720;
}

.status-timeline {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px;
  width: 100%;
}

.status-timeline span {
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 999px;
  padding: 7px 8px;
  color: var(--muted-strong);
  background: rgba(2, 9, 18, 0.5);
  font-size: 0.68rem;
  font-weight: 760;
  text-align: center;
}

.status-timeline span.active {
  border-color: rgba(103, 232, 249, 0.25);
  color: #dff7ff;
  background: rgba(103, 232, 249, 0.08);
}

.status-timeline span.current {
  color: #ffffff;
  background: linear-gradient(135deg, rgba(103, 232, 249, 0.2), rgba(24, 92, 255, 0.16));
  box-shadow: inset 0 0 0 1px rgba(103, 232, 249, 0.18);
}

.local-v1-tools {
  display: grid;
  gap: 14px;
  margin-top: 18px;
  border: 1px solid rgba(245, 158, 11, 0.2);
  border-radius: 10px;
  padding: 18px;
  background:
    radial-gradient(circle at 0% 0%, rgba(245, 158, 11, 0.09), transparent 24rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.9), rgba(3, 10, 20, 0.96));
  box-shadow: 0 20px 56px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.local-tool-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.local-tool-grid article {
  display: grid;
  gap: 10px;
  align-content: start;
  border: 1px solid rgba(103, 232, 249, 0.13);
  border-radius: 8px;
  padding: 14px;
  background: rgba(2, 9, 18, 0.56);
}

.local-tool-grid strong {
  color: #edf8ff;
  font-size: 0.92rem;
  font-weight: 720;
}

.local-tool-grid span {
  color: var(--muted-strong);
  font-size: 0.82rem;
  line-height: 1.45;
}

button:disabled,
.primary-button:disabled,
.secondary-button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
  box-shadow: none !important;
}

@media (max-width: 980px) {
  .export-controls,
  .final-summary-grid,
  .status-timeline,
  .local-tool-grid,
  .edit-form-grid {
    grid-template-columns: 1fr;
  }
}

/* Revenue center and portal intelligence surfaces. */
.revenue-center,
.ai-interface-panel,
.portal-chart-card {
  border: 1px solid rgba(103, 232, 249, 0.16);
  border-radius: 10px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.1), transparent 24rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.9), rgba(3, 10, 20, 0.96));
  box-shadow: 0 22px 62px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.revenue-center {
  display: grid;
  gap: 16px;
  margin: 16px 0;
  padding: 18px;
}

.revenue-metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.revenue-metric-grid article {
  min-height: 112px;
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 8px;
  padding: 14px;
  background: rgba(2, 9, 18, 0.46);
}

.revenue-metric-grid span,
.revenue-settings-panel label,
.portal-chart-card .eyebrow,
.ai-form-grid label {
  color: var(--muted);
  font-size: 0.67rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.revenue-metric-grid strong {
  display: block;
  margin-top: 10px;
  color: #f5fbff;
  font-size: clamp(1.25rem, 2.4vw, 1.8rem);
  font-weight: 680;
  line-height: 1;
}

.revenue-metric-grid small {
  display: block;
  margin-top: 10px;
  color: var(--muted-strong);
  line-height: 1.35;
}

.revenue-settings-panel,
.ai-form-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
}

.revenue-note-field {
  grid-column: span 2;
}

.revenue-settings-panel input,
.ai-form-grid input,
.ai-form-grid textarea {
  width: 100%;
  min-height: 42px;
  margin-top: 7px;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 8px;
  padding: 0 11px;
  color: #eef8ff;
  background: rgba(2, 9, 18, 0.7);
}

.ai-form-grid textarea {
  min-height: 96px;
  padding-top: 10px;
  resize: vertical;
}

.revenue-chart-grid,
.portal-chart-grid,
.ai-module-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.revenue-chart-card,
.portal-chart-card {
  display: grid;
  gap: 12px;
  min-height: 220px;
  padding: 14px;
}

.mini-bar-chart,
.portal-mini-chart {
  display: flex;
  min-height: 150px;
  align-items: end;
  gap: 8px;
  border-top: 1px solid rgba(103, 232, 249, 0.08);
  padding-top: 14px;
}

.mini-bar-chart span,
.portal-mini-chart span {
  position: relative;
  display: grid;
  flex: 1;
  min-width: 22px;
  align-items: end;
  border: 1px solid rgba(103, 232, 249, 0.2);
  border-radius: 7px 7px 3px 3px;
  background: linear-gradient(180deg, rgba(103, 232, 249, 0.45), rgba(57, 112, 255, 0.22));
}

.mini-bar-chart i,
.portal-mini-chart i,
.mini-bar-chart em,
.portal-mini-chart em {
  position: absolute;
  left: 50%;
  color: var(--muted-strong);
  font-size: 0.62rem;
  font-style: normal;
  transform: translateX(-50%);
  white-space: nowrap;
}

.mini-bar-chart i,
.portal-mini-chart i {
  bottom: -20px;
}

.mini-bar-chart em,
.portal-mini-chart em {
  top: -22px;
  color: #eaf8ff;
}

.portal-tier-progress {
  grid-column: span 2;
}

.ai-interface-panel {
  display: grid;
  gap: 18px;
  padding: clamp(22px, 4vw, 34px);
}

.ai-interface-panel h2 {
  margin: 0 0 8px;
  color: #f5fbff;
  font-size: clamp(1.6rem, 3vw, 2.6rem);
  font-weight: 680;
}

.ai-interface-panel p {
  max-width: 780px;
  color: var(--muted-strong);
  line-height: 1.6;
}

.ai-module-grid article {
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 8px;
  padding: 14px;
  background: rgba(2, 9, 18, 0.46);
}

.ai-module-grid span {
  display: block;
  margin-bottom: 8px;
  color: #dff9ff;
  font-weight: 720;
}

@media (max-width: 1180px) {
  .revenue-metric-grid,
  .revenue-chart-grid,
  .portal-chart-grid,
  .ai-module-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .revenue-settings-panel,
  .ai-form-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .revenue-metric-grid,
  .revenue-chart-grid,
  .portal-chart-grid,
  .ai-module-grid,
  .revenue-settings-panel,
  .ai-form-grid {
    grid-template-columns: 1fr;
  }

  .portal-tier-progress,
  .revenue-note-field {
    grid-column: auto;
  }
}

/* Public access and navigation premiumization. */
.public-intelligence-body a,
.public-intelligence-body a:visited,
.public-intelligence-body a:hover,
.public-intelligence-body a:active,
.public-intelligence-body .primary-button,
.public-intelligence-body .secondary-button,
.public-intelligence-body .premium-button,
.public-intelligence-body .premium-nav-link {
  color: inherit;
  text-decoration: none;
}

.public-intelligence-body {
  color: #edf6ff;
  font-family: Manrope, Inter, "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 450;
  letter-spacing: 0;
  line-height: 1.55;
}

.public-header {
  min-height: 68px;
  border-color: rgba(127, 216, 255, 0.18);
  background:
    linear-gradient(180deg, rgba(8, 22, 40, 0.92), rgba(3, 10, 20, 0.84));
}

.public-brand {
  min-width: max-content;
}

.public-brand strong {
  color: #f5fbff;
  font-size: 1rem;
  font-weight: 680;
  letter-spacing: 0;
}

.public-brand small {
  display: block;
  margin-left: -4px;
  color: #8da3bd;
  font-size: 0.68rem;
  font-weight: 650;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.public-header nav {
  gap: 6px;
}

.premium-nav-link {
  position: relative;
  min-height: 40px;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 0 12px;
  color: #aebdd2 !important;
  font-size: 0.84rem;
  font-weight: 650;
  line-height: 1;
  transition: color 160ms ease, border-color 160ms ease, background 160ms ease, transform 160ms ease;
}

.premium-nav-link:hover,
.premium-nav-link.is-active {
  border-color: rgba(103, 232, 249, 0.22);
  color: #f2fbff !important;
  background: rgba(103, 232, 249, 0.07);
}

.premium-nav-link:focus-visible,
.premium-button:focus-visible,
.glass-access-card:focus-within {
  outline: 2px solid rgba(138, 243, 255, 0.7);
  outline-offset: 3px;
}

.premium-button,
.public-intelligence-body .primary-button,
.public-intelligence-body .secondary-button {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  padding: 0 18px;
  font-size: 0.88rem;
  font-weight: 720;
  line-height: 1;
  transition: transform 170ms ease, border-color 170ms ease, box-shadow 170ms ease, background 170ms ease;
}

.premium-primary,
.public-intelligence-body .primary-button {
  border: 1px solid rgba(138, 243, 255, 0.5);
  color: #03111b !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.36), transparent 42%),
    linear-gradient(135deg, #8cf4ff, #5c9cff);
  box-shadow:
    0 14px 32px rgba(48, 145, 255, 0.18),
    inset 0 1px 0 rgba(255, 255, 255, 0.68),
    inset 0 -1px 0 rgba(3, 18, 35, 0.2);
}

.premium-secondary,
.public-intelligence-body .secondary-button {
  border: 1px solid rgba(127, 216, 255, 0.24);
  color: #d7e9ff !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.055), transparent 50%),
    rgba(8, 22, 40, 0.72);
  box-shadow:
    0 12px 28px rgba(0, 0, 0, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.07);
}

.premium-button:hover,
.public-intelligence-body .primary-button:hover,
.public-intelligence-body .secondary-button:hover {
  transform: translateY(-2px);
}

.premium-primary:hover,
.public-intelligence-body .primary-button:hover {
  border-color: rgba(194, 250, 255, 0.72);
  box-shadow:
    0 18px 38px rgba(48, 145, 255, 0.22),
    inset 0 1px 0 rgba(255, 255, 255, 0.74);
}

.premium-secondary:hover,
.public-intelligence-body .secondary-button:hover {
  border-color: rgba(138, 243, 255, 0.38);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.07), transparent 50%),
    rgba(11, 30, 54, 0.86);
}

.status-pill {
  display: inline-flex;
  width: fit-content;
  min-height: 26px;
  align-items: center;
  border: 1px solid rgba(148, 177, 220, 0.16);
  border-radius: 999px;
  padding: 0 9px;
  color: #aebdd2;
  background: rgba(255, 255, 255, 0.025);
  font-size: 0.66rem;
  font-weight: 760;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.status-pill.positive {
  border-color: rgba(103, 232, 249, 0.3);
  color: #c9f8ff;
  background: rgba(103, 232, 249, 0.08);
}

.status-pill.warning {
  border-color: rgba(245, 158, 11, 0.28);
  color: #f7d89a;
  background: rgba(245, 158, 11, 0.08);
}

.public-access-section {
  display: grid;
  gap: 14px;
}

.access-section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 16px;
}

.access-section-head h2 {
  margin: 0;
  color: #f5fbff;
  font-size: clamp(1.22rem, 2.3vw, 1.82rem);
  font-weight: 660;
  letter-spacing: 0;
}

.access-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.glass-access-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 13px;
  align-items: start;
  min-height: 166px;
  border: 1px solid rgba(127, 216, 255, 0.14);
  border-radius: 14px;
  padding: 16px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.075), transparent 22rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.86), rgba(3, 10, 20, 0.95));
  box-shadow:
    0 18px 52px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.055);
  transition: transform 170ms ease, border-color 170ms ease, box-shadow 170ms ease;
}

.glass-access-card:hover {
  transform: translateY(-3px);
  border-color: rgba(103, 232, 249, 0.3);
  box-shadow:
    0 24px 64px rgba(0, 0, 0, 0.34),
    0 0 28px rgba(103, 232, 249, 0.07),
    inset 0 1px 0 rgba(255, 255, 255, 0.065);
}

.access-card-icon {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.2);
  border-radius: 12px;
  color: var(--cyan);
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.07), transparent),
    rgba(103, 232, 249, 0.08);
}

.access-card-icon svg {
  width: 22px;
  height: 22px;
  fill: currentColor;
}

.access-card-copy {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.access-card-title-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}

.access-card-title-row h3 {
  margin: 0;
  color: #f5fbff;
  font-size: 0.98rem;
  font-weight: 660;
  line-height: 1.2;
}

.glass-access-card p {
  margin: 0;
  color: #aebdd2;
  font-size: 0.86rem;
  line-height: 1.58;
}

.access-card-action {
  grid-column: 1 / -1;
  align-self: end;
  width: 100%;
}

@media (max-width: 900px) {
  .public-header {
    align-items: flex-start;
  }

  .public-header nav {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .premium-nav-link {
    justify-content: center;
  }

  .access-card-grid {
    grid-template-columns: 1fr;
  }
}

/* Institutional admin and portal production polish. */
.admin-intelligence-body a,
.portal-body a,
.admin-intelligence-body a:visited,
.portal-body a:visited,
.admin-intelligence-body a:hover,
.portal-body a:hover,
.admin-intelligence-body .nav-item,
.portal-body .nav-item,
.admin-intelligence-body .primary-button,
.portal-body .primary-button,
.admin-intelligence-body .secondary-button,
.portal-body .secondary-button {
  color: inherit;
  text-decoration: none;
}

.admin-intelligence-body,
.portal-body {
  font-family: Manrope, Inter, "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: 0;
}

.admin-intelligence-body .nav-item,
.portal-body .nav-item {
  font-weight: 650;
}

.admin-intelligence-body .nav-item:focus-visible,
.portal-body .nav-item:focus-visible,
.admin-intelligence-body button:focus-visible,
.portal-body button:focus-visible,
.admin-intelligence-body a:focus-visible,
.portal-body a:focus-visible,
.admin-intelligence-body input:focus-visible,
.portal-body input:focus-visible,
.admin-intelligence-body select:focus-visible,
.portal-body select:focus-visible {
  outline: 2px solid rgba(138, 243, 255, 0.72);
  outline-offset: 3px;
}

.admin-empty-state,
.portal-onboarding-empty,
.portal-empty-module,
.portal-welcome-panel,
.portal-support-card {
  border: 1px solid rgba(103, 232, 249, 0.16);
  border-radius: 10px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.11), transparent 24rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.9), rgba(3, 10, 20, 0.96));
  box-shadow: 0 22px 62px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.admin-empty-state,
.portal-onboarding-empty {
  display: flex;
  min-height: 240px;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: clamp(24px, 4vw, 42px);
}

.admin-empty-state h3,
.portal-onboarding-empty h2,
.portal-welcome-panel h3,
.portal-empty-module h3 {
  margin: 0 0 8px;
  color: #f5fbff;
  font-size: clamp(1.5rem, 3vw, 2.45rem);
  font-weight: 680;
  letter-spacing: 0;
}

.admin-empty-state p:not(.eyebrow),
.portal-onboarding-empty p,
.portal-welcome-panel p:not(.eyebrow),
.portal-empty-module p {
  max-width: 700px;
  margin: 0;
  color: var(--muted-strong);
  line-height: 1.62;
}

.portal-onboarding-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.portal-welcome-panel {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  padding: 24px;
}

.portal-month-selector {
  display: grid;
  min-width: 220px;
  gap: 8px;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.portal-month-selector select {
  min-height: 42px;
  border: 1px solid rgba(103, 232, 249, 0.2);
  border-radius: 8px;
  padding: 0 12px;
  color: #eef8ff;
  background: rgba(2, 9, 18, 0.74);
}

.portal-kpi-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.portal-kpi-grid .portal-stat {
  min-height: 142px;
  border: 1px solid rgba(103, 232, 249, 0.15);
  border-radius: 10px;
  padding: 18px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.1), transparent 20rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.84), rgba(3, 10, 20, 0.95));
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.portal-kpi-grid .portal-stat span {
  display: block;
  margin-bottom: 14px;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.portal-kpi-grid .portal-stat strong {
  display: block;
  color: #f5fbff;
  font-size: clamp(1.55rem, 3vw, 2.35rem);
  font-weight: 680;
  line-height: 1;
}

.portal-kpi-grid .portal-stat small {
  display: block;
  margin-top: 12px;
  color: var(--muted-strong);
  line-height: 1.4;
}

.portal-status-pill {
  display: inline-flex;
  width: fit-content;
  min-height: 28px;
  align-items: center;
  border: 1px solid rgba(103, 232, 249, 0.22);
  border-radius: 999px;
  padding: 0 10px;
  color: #c9f8ff;
  background: rgba(103, 232, 249, 0.08);
  font-size: 0.66rem;
  font-weight: 780;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.portal-focus-number {
  display: grid;
  gap: 8px;
}

.portal-focus-number span {
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.portal-focus-number strong {
  color: #f5fbff;
  font-size: clamp(1.6rem, 3vw, 2.35rem);
  font-weight: 680;
  line-height: 1;
}

.portal-focus-number p {
  margin: 0;
  color: var(--muted-strong);
  line-height: 1.55;
}

.portal-detail-list {
  gap: 10px;
}

.portal-detail-list div {
  border-color: rgba(103, 232, 249, 0.12);
  background: rgba(2, 9, 18, 0.42);
}

.portal-support-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.portal-support-card {
  display: grid;
  gap: 12px;
  align-content: start;
  padding: 18px;
}

.portal-support-card h3 {
  margin: 0;
  color: #f5fbff;
  font-size: 1.06rem;
  font-weight: 700;
}

.portal-support-card p {
  margin: 0;
  color: var(--muted-strong);
  line-height: 1.58;
}

.portal-empty-module {
  padding: 24px;
}

.portal-topbar h2,
.admin-topbar h2 {
  font-weight: 680;
}

.portal-topbar p,
.admin-topbar .topbar-subtitle {
  line-height: 1.58;
}

.admin-table th,
.admin-table td {
  border-right: 1px solid rgba(103, 232, 249, 0.05);
}

.admin-table th:last-child,
.admin-table td:last-child {
  border-right: 0;
}

@media (max-width: 980px) {
  .portal-kpi-grid,
  .portal-support-grid {
    grid-template-columns: 1fr;
  }

  .admin-empty-state,
  .portal-onboarding-empty,
  .portal-welcome-panel {
    align-items: flex-start;
    flex-direction: column;
  }

  .portal-month-selector,
  .portal-onboarding-actions,
  .portal-onboarding-actions .primary-button,
  .portal-onboarding-actions .secondary-button {
    width: 100%;
  }
}

/* Brick 6 public leaderboard publishing and premium frontend polish. */
.public-publish-panel,
.public-safety-checklist,
.public-empty-preview,
.reward-tier-panel {
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 10px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.11), transparent 26rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.9), rgba(3, 10, 20, 0.96));
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.public-publish-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin: 16px 0;
  padding: 18px;
}

.public-publish-panel h3,
.public-empty-preview h3 {
  margin: 0 0 6px;
  color: #f2fbff;
  font-size: 1.15rem;
  font-weight: 720;
}

.public-publish-panel p:not(.eyebrow),
.public-empty-preview p {
  max-width: 680px;
  margin: 0;
  color: var(--muted-strong);
  line-height: 1.55;
}

.public-publish-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.public-safety-checklist {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 14px;
}

.public-safety-checklist article {
  display: grid;
  gap: 8px;
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 8px;
  padding: 12px;
  background: rgba(2, 9, 18, 0.52);
}

.public-safety-checklist span:not(.status-badge) {
  color: var(--muted-strong);
  font-size: 0.78rem;
  line-height: 1.45;
}

.public-empty-preview {
  display: grid;
  gap: 6px;
  padding: 22px;
}

.draft-control input:not(:disabled) {
  accent-color: var(--cyan);
  cursor: pointer;
}

.draft-control:has(input:not(:disabled)) {
  cursor: pointer;
}

.draft-control.is-selected {
  border-color: rgba(103, 232, 249, 0.32);
  color: #e9fbff;
  background: rgba(103, 232, 249, 0.09);
  box-shadow: inset 0 0 0 1px rgba(103, 232, 249, 0.08);
}

.public-intelligence-body {
  color: #edf6ff;
  font-family: var(--font-fintech, Inter, Manrope, "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
}

.public-shell {
  width: min(1180px, calc(100% - 32px));
  margin: 0 auto;
  padding: 24px 0 76px;
}

.public-header {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 22px;
  border: 1px solid rgba(103, 232, 249, 0.16);
  border-radius: 12px;
  padding: 12px 14px;
  background: rgba(3, 10, 20, 0.82);
  box-shadow: 0 18px 56px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  backdrop-filter: blur(18px);
}

.public-brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: #f3fbff;
  text-decoration: none;
}

.public-brand span {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.42);
  border-radius: 9px;
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.08);
  font-weight: 820;
}

.public-brand strong {
  font-size: 0.98rem;
  font-weight: 730;
}

.public-header nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

.public-header nav a:not(.primary-button) {
  color: var(--muted-strong);
  font-size: 0.86rem;
  font-weight: 700;
  text-decoration: none;
}

.public-page {
  display: grid;
  gap: 18px;
}

.public-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.38fr);
  gap: 18px;
  align-items: stretch;
  min-height: auto;
  border: 1px solid rgba(103, 232, 249, 0.17);
  border-radius: 16px;
  padding: clamp(24px, 4vw, 42px);
  background:
    linear-gradient(rgba(103, 232, 249, 0.024) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 232, 249, 0.018) 1px, transparent 1px),
    radial-gradient(circle at 10% 0%, rgba(103, 232, 249, 0.13), transparent 30rem),
    linear-gradient(135deg, rgba(9, 23, 42, 0.95), rgba(2, 8, 17, 0.98));
  background-size: 42px 42px, 42px 42px, auto, auto;
  box-shadow: 0 24px 72px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.public-hero-copy {
  align-self: center;
}

.public-hero h1 {
  max-width: 820px;
  margin: 7px 0 10px;
  color: #f5fbff;
  font-size: clamp(2rem, 4.8vw, 4.1rem);
  font-weight: 680;
  letter-spacing: 0;
  line-height: 1.02;
}

.public-hero p:not(.eyebrow) {
  max-width: 720px;
  margin: 0;
  color: #aebdd2;
  font-size: clamp(0.96rem, 1.35vw, 1.06rem);
  line-height: 1.62;
}

.public-hero-actions,
.cta-button-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}

.leaderboard-meta-panel {
  display: grid;
  align-content: end;
  gap: 10px;
  border: 1px solid rgba(103, 232, 249, 0.16);
  border-radius: 14px;
  padding: 18px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.12), transparent 20rem),
    rgba(2, 9, 18, 0.58);
}

.leaderboard-meta-panel span {
  color: var(--muted);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.leaderboard-meta-panel strong {
  color: #effaff;
  font-size: clamp(1.28rem, 2.4vw, 1.75rem);
  font-weight: 670;
  line-height: 1.05;
}

.leaderboard-meta-panel small {
  color: #93a7c0;
  line-height: 1.45;
}

.public-signal-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.public-signal-grid article,
.public-ranking-card,
.public-rank-row,
.reward-item,
.reward-tier-grid article,
.reward-disclaimer,
.public-cta-panel {
  border: 1px solid rgba(103, 232, 249, 0.14);
  border-radius: 14px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.075), transparent 20rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.86), rgba(3, 10, 20, 0.95));
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.048);
}

.public-signal-grid article {
  min-height: 96px;
  padding: 14px;
}

.public-signal-grid span {
  display: block;
  margin-bottom: 10px;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.public-signal-grid strong {
  color: #f2fbff;
  font-size: clamp(1.18rem, 2.2vw, 1.72rem);
  font-weight: 680;
  line-height: 1;
}

.public-top-three {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.public-ranking-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  padding: 20px;
}

.public-ranking-card.podium:first-child {
  border-color: rgba(103, 232, 249, 0.34);
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.18), transparent 22rem),
    linear-gradient(180deg, rgba(12, 32, 57, 0.95), rgba(3, 10, 20, 0.97));
}

.public-rank-medal {
  display: grid;
  width: 52px;
  height: 52px;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.36);
  border-radius: 10px;
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.09);
  font-size: 1rem;
  font-weight: 820;
}

.public-ranking-card h3 {
  margin: 8px 0 4px;
  color: #f4fbff;
  font-size: 1.22rem;
  font-weight: 730;
}

.public-ranking-card p {
  margin: 0;
  color: var(--muted-strong);
  font-size: 0.86rem;
}

.public-lots {
  grid-column: 1 / -1;
  color: #f5fbff;
  font-style: normal;
  font-size: 1.5rem;
  font-weight: 720;
}

.public-trader-badge {
  display: inline-flex;
  width: fit-content;
  border: 1px solid rgba(103, 232, 249, 0.24);
  border-radius: 999px;
  padding: 5px 9px;
  color: #bff7ff;
  background: rgba(103, 232, 249, 0.08);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.public-board {
  display: grid;
  gap: 8px;
}

.public-board-head,
.public-rank-row {
  display: grid;
  grid-template-columns: 0.5fr 1.4fr 1.1fr 0.8fr 1fr;
  gap: 12px;
  align-items: center;
}

.public-board-head {
  padding: 0 16px 4px;
  color: var(--muted);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.public-rank-row {
  min-height: 70px;
  padding: 14px 16px;
}

.public-rank-row strong {
  color: var(--cyan);
  font-size: 1rem;
}

.public-rank-row span {
  color: #edf8ff;
  font-weight: 710;
}

.public-rank-row em {
  color: #f7fbff;
  font-style: normal;
  font-weight: 720;
}

.public-rank-row time {
  color: var(--muted-strong);
  font-size: 0.86rem;
}

.public-empty-state {
  display: grid;
  justify-items: start;
  gap: 8px;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 12px;
  padding: 38px;
  background:
    radial-gradient(circle at 0% 0%, rgba(103, 232, 249, 0.12), transparent 28rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.86), rgba(3, 10, 20, 0.96));
}

.public-empty-state h2 {
  margin: 0;
  color: #f4fbff;
  font-size: clamp(1.5rem, 3vw, 2.35rem);
  font-weight: 720;
}

.public-empty-state p {
  max-width: 620px;
  margin: 0;
  color: var(--muted-strong);
  line-height: 1.6;
}

.public-cta-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 20px;
}

.public-cta-panel h2,
.reward-tier-panel h2 {
  margin: 0 0 8px;
  color: #f4fbff;
  font-size: clamp(1.28rem, 2.35vw, 1.92rem);
  font-weight: 670;
  letter-spacing: 0;
}

.public-cta-panel p:not(.eyebrow),
.reward-tier-panel p {
  max-width: 720px;
  margin: 0;
  color: var(--muted-strong);
  font-size: 0.92rem;
  line-height: 1.58;
}

.rewards-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}

.reward-item {
  min-height: 174px;
  padding: 16px;
}

.reward-item > span {
  display: inline-flex;
  margin-bottom: 18px;
  border: 1px solid rgba(103, 232, 249, 0.2);
  border-radius: 999px;
  padding: 5px 9px;
  color: #bceeff;
  background: rgba(103, 232, 249, 0.055);
  font-size: 0.68rem;
  font-weight: 760;
  text-transform: uppercase;
}

.reward-item h3 {
  margin: 0 0 8px;
  color: #f4fbff;
  font-size: 1rem;
  font-weight: 670;
}

.reward-item p,
.reward-disclaimer p {
  color: var(--muted-strong);
  font-size: 0.9rem;
  line-height: 1.56;
}

.reward-tier-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
  gap: 18px;
  align-items: start;
  border: 1px solid rgba(103, 232, 249, 0.15);
  border-radius: 16px;
  padding: 20px;
  background:
    radial-gradient(circle at 0% 0%, rgba(103, 232, 249, 0.085), transparent 24rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.82), rgba(3, 10, 20, 0.94));
  box-shadow: 0 18px 52px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.048);
}


.reward-tier-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.reward-tier-grid article {
  display: grid;
  gap: 7px;
  min-height: 116px;
  padding: 13px;
}

.reward-tier-grid strong {
  color: #f4fbff;
  font-size: 0.96rem;
  font-weight: 680;
}

.reward-tier-grid span {
  color: #bceeff;
  font-size: 0.82rem;
  font-weight: 760;
}

.reward-tier-grid p {
  font-size: 0.84rem;
}

.reward-disclaimer {
  padding: 18px;
}

.reward-disclaimer strong {
  color: #f4fbff;
  font-weight: 730;
}

@media (max-width: 1100px) {
  .public-hero,
  .reward-tier-panel,
  .public-safety-checklist,
  .public-signal-grid,
  .public-top-three,
  .rewards-grid {
    grid-template-columns: 1fr 1fr;
  }

  .public-hero-copy,
  .leaderboard-meta-panel {
    grid-column: 1 / -1;
  }
}

@media (max-width: 760px) {
  .public-shell {
    width: min(100% - 20px, 1180px);
    padding-top: 12px;
  }

  .public-header,
  .public-publish-panel,
  .public-cta-panel {
    align-items: flex-start;
    flex-direction: column;
  }

  .public-header nav,
  .public-publish-actions,
  .cta-button-row,
  .public-hero-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .public-header .primary-button,
  .public-hero-actions .primary-button,
  .public-hero-actions .secondary-button,
  .cta-button-row .primary-button,
  .cta-button-row .secondary-button {
    width: 100%;
  }

  .public-hero,
  .reward-tier-panel,
  .reward-tier-grid,
  .public-safety-checklist,
  .public-signal-grid,
  .public-top-three,
  .rewards-grid {
    grid-template-columns: 1fr;
  }

  .public-board-head {
    display: none;
  }


  .public-rank-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .public-rank-row > *::before {
    display: block;
    margin-bottom: 3px;
    color: var(--muted);
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }
}

/* Premium leaderboard redesign pass. */
.public-intelligence-body,
.admin-intelligence-body {
  font-family: Manrope, Inter, "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.public-header {
  border-radius: 10px;
  padding: 10px 12px;
}

.public-header nav a {
  min-height: 38px;
  display: inline-flex;
  align-items: center;
}

.public-header nav .primary-button {
  padding-inline: 16px;
}

.public-leaderboard-page .leaderboard-hero {
  grid-template-columns: minmax(0, 1fr) minmax(260px, 360px);
  padding: clamp(30px, 5vw, 58px);
}

.public-leaderboard-page .public-hero h1 {
  max-width: 760px;
  font-size: clamp(2.6rem, 6vw, 5.2rem);
  font-weight: 690;
  line-height: 0.98;
}

.public-leaderboard-page .public-hero p:not(.eyebrow) {
  max-width: 650px;
}

.public-leaderboard-page .leaderboard-meta-panel {
  align-content: stretch;
  gap: 10px;
  padding: 14px;
}

.public-leaderboard-page .leaderboard-meta-panel article {
  display: grid;
  align-content: end;
  min-height: 118px;
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 8px;
  padding: 14px;
  background: rgba(2, 9, 18, 0.52);
}

.public-leaderboard-page .leaderboard-meta-panel strong {
  font-size: clamp(1.15rem, 2vw, 1.6rem);
}

.public-leaderboard-metrics {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.public-leaderboard-metrics article {
  min-height: 124px;
  padding: 18px;
}

.public-top-three {
  align-items: stretch;
}

.public-ranking-card.podium {
  position: relative;
  overflow: hidden;
  min-height: 240px;
  transform: translateY(0);
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}

.public-ranking-card.podium::after {
  position: absolute;
  inset: auto 16px 14px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(103, 232, 249, 0.5), transparent);
  content: "";
}

.public-ranking-card.podium:hover {
  transform: translateY(-3px);
  border-color: rgba(103, 232, 249, 0.3);
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.38), 0 0 28px rgba(103, 232, 249, 0.08);
}

.public-ranking-card.first {
  order: 2;
  border-color: rgba(103, 232, 249, 0.34);
}

.public-ranking-card.second {
  order: 1;
  margin-top: 18px;
}

.public-ranking-card.third {
  order: 3;
  margin-top: 18px;
}

.public-ranking-card .public-rank-medal span {
  display: grid;
  width: 100%;
  height: 100%;
  place-items: center;
}

.public-board {
  border: 1px solid rgba(103, 232, 249, 0.14);
  border-radius: 10px;
  padding: 12px;
  background: rgba(2, 9, 18, 0.34);
}

.public-rank-row {
  border-radius: 8px;
  box-shadow: none;
  transition: background 180ms ease, transform 180ms ease;
}

.public-rank-row:hover {
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.08), transparent 18rem),
    rgba(8, 22, 40, 0.82);
  transform: translateX(2px);
}

.public-empty-state {
  min-height: 360px;
  align-content: center;
  justify-items: start;
  padding: clamp(28px, 5vw, 56px);
}

.public-empty-state h2 {
  max-width: 720px;
}

.leaderboard-cta {
  margin-top: 4px;
}

.leaderboard-command-panel,
.leaderboard-summary-strip,
.leaderboard-privacy-checklist,
.leaderboard-admin-row,
.leaderboard-live-preview {
  border: 1px solid rgba(103, 232, 249, 0.16);
  border-radius: 10px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.08), transparent 24rem),
    linear-gradient(180deg, rgba(8, 22, 40, 0.88), rgba(3, 10, 20, 0.96));
  box-shadow: 0 18px 52px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.leaderboard-command-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px;
}

.leaderboard-command-panel h3 {
  margin: 0 0 4px;
  color: #f4fbff;
  font-size: clamp(1.28rem, 2vw, 1.75rem);
  font-weight: 700;
}

.leaderboard-command-panel p:not(.eyebrow) {
  margin: 0;
  color: var(--muted-strong);
}

.leaderboard-command-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.leaderboard-summary-strip {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px;
  overflow: hidden;
  padding: 0;
}

.leaderboard-summary-strip article {
  min-height: 92px;
  padding: 16px;
  background: rgba(2, 9, 18, 0.32);
}

.leaderboard-summary-strip span {
  display: block;
  margin-bottom: 12px;
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.leaderboard-summary-strip strong {
  color: #f3fbff;
  font-size: 1.65rem;
  font-weight: 680;
  line-height: 1;
}

.leaderboard-privacy-checklist {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 12px;
}

.leaderboard-admin-list {
  display: grid;
  gap: 10px;
}

.leaderboard-admin-row {
  display: grid;
  grid-template-columns: 64px minmax(220px, 1fr) minmax(120px, auto) minmax(280px, auto);
  gap: 14px;
  align-items: center;
  padding: 14px;
}

.leaderboard-row-rank {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.24);
  border-radius: 8px;
  color: var(--cyan);
  background: rgba(103, 232, 249, 0.08);
  font-weight: 760;
}

.leaderboard-row-client {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.leaderboard-row-client strong {
  color: #f3fbff;
  font-size: 1rem;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.leaderboard-row-client span {
  color: var(--muted-strong);
  font-size: 0.82rem;
}

.publish-switch {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 38px;
  border: 1px solid rgba(148, 177, 220, 0.14);
  border-radius: 999px;
  padding: 0 13px;
  color: var(--muted-strong);
  background: rgba(255, 255, 255, 0.025);
  font-size: 0.78rem;
  font-weight: 760;
  cursor: pointer;
}

.publish-switch input {
  accent-color: var(--cyan);
}

.publish-switch.is-on {
  border-color: rgba(103, 232, 249, 0.32);
  color: #e9fbff;
  background: rgba(103, 232, 249, 0.08);
}

.name-mode-control {
  display: inline-grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px;
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 999px;
  padding: 4px;
  background: rgba(2, 9, 18, 0.54);
}

.name-mode-control button {
  min-height: 32px;
  border: 0;
  border-radius: 999px;
  padding: 0 10px;
  color: var(--muted-strong);
  background: transparent;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 760;
  cursor: pointer;
}

.name-mode-control button.is-active,
.name-mode-control button:hover {
  color: #03101b;
  background: linear-gradient(135deg, #8af3ff, #68a8ff);
}

.leaderboard-live-preview {
  display: grid;
  gap: 12px;
  padding: 16px;
}

.leaderboard-live-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.leaderboard-live-grid article {
  display: grid;
  gap: 6px;
  border: 1px solid rgba(103, 232, 249, 0.11);
  border-radius: 8px;
  padding: 12px;
  background: rgba(2, 9, 18, 0.52);
}

.leaderboard-live-grid strong {
  color: #f4fbff;
  font-size: 0.92rem;
  font-weight: 700;
}

.leaderboard-live-grid span {
  color: var(--muted-strong);
  font-size: 0.8rem;
}

@media (prefers-reduced-motion: no-preference) {
  .public-ranking-card.podium {
    animation: leaderboardPodiumIn 520ms ease both;
  }

  .public-ranking-card.second {
    animation-delay: 90ms;
  }

  .public-ranking-card.third {
    animation-delay: 140ms;
  }
}

@keyframes leaderboardPodiumIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 980px) {
  .public-leaderboard-page .leaderboard-hero,
  .public-leaderboard-metrics,
  .leaderboard-summary-strip,
  .leaderboard-live-grid {
    grid-template-columns: 1fr;
  }

  .leaderboard-admin-row {
    grid-template-columns: 52px minmax(0, 1fr);
  }

  .publish-switch,
  .name-mode-control {
    grid-column: 1 / -1;
    width: 100%;
  }

  .leaderboard-command-panel {
    align-items: flex-start;
    flex-direction: column;
  }

  .leaderboard-command-actions,
  .leaderboard-command-actions .primary-button,
  .leaderboard-command-actions .secondary-button {
    width: 100%;
  }

  .public-ranking-card.first,
  .public-ranking-card.second,
  .public-ranking-card.third {
    order: initial;
    margin-top: 0;
  }
}

/* Premium institutional client portal redesign. */
.portal-body {
  min-height: 100vh;
  overflow-x: hidden;
  color: #eaf4ff;
  background:
    linear-gradient(rgba(103, 232, 249, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 232, 249, 0.026) 1px, transparent 1px),
    radial-gradient(circle at 15% 0%, rgba(50, 120, 255, 0.15), transparent 34rem),
    radial-gradient(circle at 92% 18%, rgba(103, 232, 249, 0.09), transparent 30rem),
    #020812;
  background-size: 72px 72px, 72px 72px, auto, auto, auto;
  font-family: Manrope, Inter, "Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  letter-spacing: 0;
}

.portal-body a,
.portal-body a:visited,
.portal-body a:hover,
.portal-body a:active {
  color: inherit;
  text-decoration: none;
}

.portal-body * {
  box-sizing: border-box;
}

.portal-shell {
  display: grid;
  grid-template-columns: 274px minmax(0, 1fr);
  gap: 0;
  width: 100%;
  min-height: 100vh;
}

.portal-sidebar {
  position: sticky;
  top: 0;
  display: flex;
  height: 100vh;
  flex-direction: column;
  gap: 22px;
  border-right: 1px solid rgba(103, 232, 249, 0.12);
  padding: 24px 18px;
  background:
    linear-gradient(180deg, rgba(6, 18, 34, 0.96), rgba(2, 8, 18, 0.98)),
    rgba(3, 10, 20, 0.96);
  box-shadow: 18px 0 52px rgba(0, 0, 0, 0.26), inset -1px 0 0 rgba(255, 255, 255, 0.035);
}

.portal-sidebar .brand-lockup {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  border: 1px solid rgba(103, 232, 249, 0.15);
  border-radius: 12px;
  padding: 12px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.13), transparent 13rem),
    rgba(255, 255, 255, 0.025);
}

.portal-sidebar .brand-mark {
  display: grid;
  width: 46px;
  height: 46px;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.28);
  border-radius: 10px;
  color: #dffbff;
  background: linear-gradient(145deg, rgba(103, 232, 249, 0.14), rgba(56, 113, 255, 0.12));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 14px 34px rgba(33, 120, 255, 0.12);
  font-size: 0.82rem;
  font-weight: 780;
  letter-spacing: 0.08em;
}

.portal-sidebar .brand-kicker {
  margin: 0 0 4px;
  color: #7fb7d4;
  font-size: 0.62rem;
  font-weight: 760;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.portal-sidebar h1 {
  margin: 0;
  color: #f3fbff;
  font-size: 0.96rem;
  font-weight: 720;
  letter-spacing: 0;
  line-height: 1.15;
}

.portal-sidebar .nav-list {
  display: grid;
  gap: 6px;
}

.portal-sidebar .nav-item {
  position: relative;
  display: flex;
  min-height: 42px;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 10px;
  padding: 0 12px;
  color: #9fb4ca;
  background: transparent;
  font-size: 0.84rem;
  font-weight: 640;
  letter-spacing: 0;
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, color 160ms ease;
}

.portal-sidebar .nav-item:hover {
  transform: translateX(2px);
  border-color: rgba(103, 232, 249, 0.13);
  color: #eaf8ff;
  background: rgba(255, 255, 255, 0.035);
}

.portal-sidebar .nav-item.is-active {
  border-color: rgba(103, 232, 249, 0.26);
  color: #f6fcff;
  background:
    linear-gradient(90deg, rgba(103, 232, 249, 0.13), rgba(59, 130, 246, 0.045)),
    rgba(255, 255, 255, 0.035);
  box-shadow: inset 3px 0 0 rgba(103, 232, 249, 0.72), 0 12px 30px rgba(0, 0, 0, 0.18);
}

.portal-sidebar .sidebar-note {
  margin-top: auto;
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 12px;
  padding: 14px;
  background: rgba(255, 255, 255, 0.026);
}

.portal-sidebar .note-label {
  color: #c9f8ff;
  font-size: 0.64rem;
  font-weight: 780;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.portal-sidebar .sidebar-note p {
  margin: 8px 0 0;
  color: #91a7bd;
  font-size: 0.78rem;
  line-height: 1.55;
}

.portal-main {
  width: 100%;
  max-width: 1440px;
  min-width: 0;
  margin: 0 auto;
  padding: 28px clamp(18px, 3vw, 42px) 44px;
}

.portal-topbar,
.portal-welcome-panel,
.portal-onboarding-empty,
.portal-empty-module,
.portal-body .glass-panel,
.portal-chart-card,
.ai-interface-panel {
  border: 1px solid rgba(103, 232, 249, 0.14);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(12, 30, 52, 0.82), rgba(3, 10, 20, 0.91)),
    rgba(4, 12, 24, 0.86);
  box-shadow: 0 20px 58px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  backdrop-filter: blur(18px);
}

.portal-topbar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, auto);
  gap: 18px;
  align-items: center;
  margin-bottom: 16px;
  padding: 18px;
}

.portal-topbar h2,
.portal-welcome-panel h3,
.portal-onboarding-empty h2,
.portal-empty-module h3,
.ai-interface-panel h2 {
  margin: 0;
  color: #f4fbff;
  font-weight: 680;
  letter-spacing: 0;
  line-height: 1.06;
}

.portal-topbar h2 {
  font-size: clamp(1.25rem, 2.2vw, 1.85rem);
}

.portal-topbar p:not(.eyebrow),
.portal-welcome-panel p:not(.eyebrow),
.portal-onboarding-empty p,
.portal-empty-module p,
.ai-interface-panel p {
  max-width: 740px;
  margin: 8px 0 0;
  color: #9fb4ca;
  font-size: 0.92rem;
  line-height: 1.58;
}

.portal-body .eyebrow {
  margin: 0 0 7px;
  color: #7edff0;
  font-size: 0.66rem;
  font-weight: 780;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.portal-identity {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-width: 260px;
  border: 1px solid rgba(103, 232, 249, 0.13);
  border-radius: 12px;
  padding: 10px;
  background: rgba(2, 8, 18, 0.46);
}

.portal-avatar {
  display: grid;
  width: 48px;
  height: 48px;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.25);
  border-radius: 11px;
  color: #e9fdff;
  background: radial-gradient(circle at 30% 20%, rgba(103, 232, 249, 0.22), rgba(42, 94, 206, 0.13));
  font-weight: 760;
  letter-spacing: 0.06em;
}

.portal-identity div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.portal-identity strong {
  overflow: hidden;
  color: #f5fbff;
  font-size: 0.92rem;
  font-weight: 680;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.portal-identity span:not(.portal-avatar) {
  color: #8ea4ba;
  font-size: 0.78rem;
}

.portal-welcome-panel {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(210px, auto);
  gap: 18px;
  align-items: end;
  margin-bottom: 14px;
  padding: 20px;
}

.portal-welcome-panel h3,
.portal-onboarding-empty h2,
.portal-empty-module h3 {
  font-size: clamp(1.42rem, 2.6vw, 2.15rem);
}

.portal-month-selector {
  display: grid;
  min-width: 210px;
  gap: 8px;
  color: #7f94aa;
  font-size: 0.64rem;
  font-weight: 760;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.portal-month-selector select,
.ai-form-grid input,
.ai-form-grid textarea {
  width: 100%;
  border: 1px solid rgba(103, 232, 249, 0.16);
  border-radius: 10px;
  color: #eaf8ff;
  background: rgba(1, 7, 16, 0.62);
  font: inherit;
}

.portal-month-selector select {
  min-height: 42px;
  padding: 0 12px;
}

.portal-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 14px;
}

.portal-kpi-grid .portal-stat {
  display: grid;
  min-height: 116px;
  align-content: space-between;
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 12px;
  padding: 15px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.08), transparent 13rem),
    linear-gradient(180deg, rgba(9, 24, 43, 0.76), rgba(3, 10, 20, 0.88));
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.portal-kpi-grid .portal-stat span,
.portal-focus-number span,
.portal-detail-list dt {
  color: #8199af;
  font-size: 0.64rem;
  font-weight: 760;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.portal-kpi-grid .portal-stat strong,
.portal-focus-number strong {
  display: block;
  margin-top: 10px;
  color: #f7fcff;
  font-size: clamp(1.35rem, 2.2vw, 1.95rem);
  font-weight: 660;
  line-height: 1;
  letter-spacing: -0.01em;
}

.portal-kpi-grid .portal-stat small {
  margin-top: 10px;
  color: #8da4ba;
  font-size: 0.78rem;
  line-height: 1.4;
}

.portal-overview-grid,
.portal-support-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.portal-profile-card,
.portal-performance-card,
.portal-support-card {
  min-height: 0;
  padding: 18px;
}

.portal-body .panel-header.compact {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.portal-body .panel-header.compact h3,
.portal-support-card h3,
.portal-tier-progress h3 {
  margin: 0;
  color: #f4fbff;
  font-size: 1.02rem;
  font-weight: 670;
}

.portal-status-pill {
  display: inline-flex;
  width: fit-content;
  min-height: 26px;
  align-items: center;
  border: 1px solid rgba(103, 232, 249, 0.19);
  border-radius: 999px;
  padding: 0 9px;
  color: #cbf8ff;
  background: rgba(103, 232, 249, 0.075);
  font-size: 0.62rem;
  font-weight: 760;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  white-space: nowrap;
}

.portal-detail-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin: 0;
}

.portal-detail-list div {
  border: 1px solid rgba(103, 232, 249, 0.1);
  border-radius: 10px;
  padding: 12px;
  background: rgba(1, 7, 16, 0.44);
}

.portal-detail-list dd {
  margin: 7px 0 0;
  overflow-wrap: anywhere;
  color: #edf8ff;
  font-size: 0.9rem;
  font-weight: 630;
}

.portal-focus-number {
  display: grid;
  gap: 8px;
}

.portal-focus-number p,
.portal-support-card p {
  margin: 0;
  color: #9fb4ca;
  font-size: 0.88rem;
  line-height: 1.55;
}

.account-opening-workspace,
.account-request-detail {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(103, 232, 249, 0.15);
  border-radius: 18px;
  padding: 18px;
  background:
    radial-gradient(circle at 0% 0%, rgba(103, 232, 249, 0.09), transparent 24rem),
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.014)),
    rgba(1, 7, 16, 0.48);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055), 0 24px 54px rgba(0, 0, 0, 0.2);
}

.account-opening-status-panel {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 16px;
}

.account-opening-status-panel h3,
.account-opening-review-card strong {
  margin: 0;
  color: #f5fbff;
  font-size: clamp(1.05rem, 1.8vw, 1.45rem);
  font-weight: 680;
}

.account-opening-status-panel p:not(.eyebrow),
.account-opening-review-card,
.request-detail-list dd {
  color: rgba(204, 219, 236, 0.74);
}

.account-opening-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, 0.9fr);
  gap: 16px;
}

.account-opening-form,
.account-request-review-form {
  display: grid;
  gap: 12px;
}

.account-opening-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.account-opening-form label,
.account-request-review-form label {
  display: grid;
  gap: 7px;
  color: rgba(154, 177, 204, 0.88);
  font-size: 0.74rem;
  font-weight: 760;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.account-opening-form input,
.account-opening-form select,
.account-opening-form textarea,
.account-request-review-form select,
.account-request-review-form textarea {
  min-height: 42px;
  border: 1px solid rgba(103, 232, 249, 0.16);
  border-radius: 12px;
  padding: 10px 12px;
  color: #eaf8ff;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
    rgba(1, 7, 16, 0.68);
  font: inherit;
  text-transform: none;
}

.account-opening-form textarea,
.account-request-review-form textarea {
  min-height: 92px;
  resize: vertical;
}

.account-opening-notes,
.account-opening-actions {
  grid-column: 1 / -1;
}

.account-opening-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.account-opening-review-card {
  border: 1px solid rgba(103, 232, 249, 0.11);
  border-radius: 16px;
  padding: 16px;
  background: rgba(255, 255, 255, 0.025);
}

.client-updates-panel {
  display: grid;
  gap: 14px;
  min-height: 100%;
  border: 1px solid rgba(103, 232, 249, 0.14);
  border-radius: 18px;
  padding: 16px;
  background:
    radial-gradient(circle at 100% 0%, rgba(88, 179, 255, 0.12), transparent 18rem),
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
    rgba(1, 7, 16, 0.42);
}

.client-updates-panel > p {
  margin: 0;
  color: rgba(204, 219, 236, 0.72);
  font-size: 0.88rem;
  line-height: 1.55;
}

.client-event-list {
  display: grid;
  gap: 10px;
}

.client-event-section {
  display: grid;
  gap: 8px;
}

.client-event-section > span {
  color: rgba(198, 211, 229, 0.58);
  font-size: 0.68rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.client-event-item {
  border-left: 2px solid rgba(103, 232, 249, 0.38);
  border-radius: 12px;
  padding: 8px 10px 8px 12px;
  background: rgba(1, 7, 16, 0.18);
}

.client-event-item.is-unread {
  border-left-color: rgba(245, 184, 75, 0.78);
  box-shadow: inset 0 0 0 1px rgba(245, 184, 75, 0.1);
}

.client-event-item span,
.client-next-action span {
  display: block;
  color: var(--gold);
  font-size: 0.68rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.client-event-item strong,
.client-next-action strong {
  display: block;
  margin-top: 5px;
  color: #f4fbff;
  font-size: 0.9rem;
  line-height: 1.3;
}

.client-event-item p {
  margin: 5px 0 0;
  color: rgba(204, 219, 236, 0.7);
  font-size: 0.82rem;
  line-height: 1.45;
}

.client-event-item .compact-action {
  margin-top: 8px;
}

.client-next-action {
  border: 1px solid rgba(103, 232, 249, 0.1);
  border-radius: 14px;
  padding: 12px;
  background: rgba(1, 7, 16, 0.36);
}

.cashback-engine-panel {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(103, 232, 249, 0.15);
  border-radius: 20px;
  padding: 18px;
  background:
    radial-gradient(circle at 12% 0%, rgba(103, 232, 249, 0.1), transparent 22rem),
    linear-gradient(145deg, rgba(10, 24, 44, 0.78), rgba(3, 10, 24, 0.92));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055), 0 28px 64px rgba(0, 0, 0, 0.24);
  backdrop-filter: blur(22px);
}

.cashback-import-grid,
.cashback-mapping-grid,
.loyalty-editor-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 16px;
}

.cashback-import-grid label,
.cashback-mapping-grid label,
.loyalty-editor-grid label {
  display: grid;
  gap: 7px;
  color: rgba(164, 188, 214, 0.86);
  font-size: 0.72rem;
  font-weight: 760;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.cashback-import-grid input,
.cashback-import-grid select,
.cashback-mapping-grid select,
.loyalty-editor-grid input,
.loyalty-editor-grid textarea {
  min-height: 42px;
  border: 1px solid rgba(103, 232, 249, 0.15);
  border-radius: 12px;
  padding: 10px 12px;
  color: #eef9ff;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
    rgba(1, 7, 16, 0.7);
  font: inherit;
  text-transform: none;
}

.cashback-warning-list {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.cashback-warning-list span {
  border: 1px solid rgba(245, 158, 11, 0.22);
  border-radius: 12px;
  padding: 10px 12px;
  color: #fde8b5;
  background: rgba(245, 158, 11, 0.08);
  font-size: 0.86rem;
}

.loyalty-editor-grid fieldset {
  min-width: 0;
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 16px;
  padding: 14px;
  background: rgba(1, 7, 16, 0.34);
}

.loyalty-editor-grid legend {
  padding: 0 6px;
  color: var(--gold);
  font-size: 0.72rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.loyalty-editor-grid textarea {
  min-height: 88px;
  resize: vertical;
}

.loyalty-editor-grid .primary-button {
  grid-column: 1 / -1;
  justify-self: end;
}

.cashback-history-card .portal-history-list {
  display: grid;
  gap: 10px;
}

.cashback-history-card .portal-history-list div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(103, 232, 249, 0.1);
  border-radius: 12px;
  padding: 10px;
  background: rgba(1, 7, 16, 0.34);
}

.cashback-history-card .portal-history-list span {
  color: rgba(181, 204, 230, 0.78);
  font-size: 0.82rem;
}

.cashback-history-card .portal-history-list strong {
  color: #f6fbff;
  font-size: 0.94rem;
}

.intelligence-timeline-panel,
.admin-intelligence-timeline {
  border: 1px solid rgba(103, 232, 249, 0.14);
  border-radius: 22px;
  padding: 18px;
  background:
    radial-gradient(circle at 12% 0%, rgba(103, 232, 249, 0.1), transparent 24rem),
    linear-gradient(145deg, rgba(10, 24, 44, 0.78), rgba(3, 10, 24, 0.92));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055), 0 28px 64px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(22px);
}

.intelligence-next-action {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 14px;
  margin: 14px 0;
}

.intelligence-next-action span,
.intelligence-next-action strong,
.intelligence-next-action p {
  grid-column: 1;
}

.intelligence-next-action .secondary-button {
  grid-column: 2;
  grid-row: 1 / span 3;
}

.intelligence-timeline-groups,
.timeline-group {
  display: grid;
  gap: 12px;
}

.timeline-group h4 {
  margin: 8px 0 0;
  color: rgba(177, 210, 245, 0.72);
  font-size: 0.72rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.timeline-event-card {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  border: 1px solid rgba(103, 232, 249, 0.11);
  border-radius: 16px;
  padding: 13px;
  background: rgba(1, 7, 16, 0.34);
}

.timeline-event-card.warning {
  border-color: rgba(245, 158, 11, 0.24);
}

.timeline-event-card.positive {
  border-color: rgba(34, 197, 94, 0.22);
}

.timeline-icon {
  display: inline-grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px solid rgba(103, 232, 249, 0.2);
  border-radius: 12px;
  color: #c7f7ff;
  background: rgba(103, 232, 249, 0.08);
  font-size: 0.74rem;
  font-weight: 820;
}

.timeline-event-card strong {
  display: block;
  color: #f7fbff;
  font-size: 0.92rem;
  line-height: 1.25;
}

.timeline-event-card p {
  margin: 5px 0 0;
  color: rgba(204, 219, 236, 0.72);
  font-size: 0.84rem;
  line-height: 1.45;
}

.timeline-event-card small {
  display: block;
  margin-top: 7px;
  color: rgba(157, 183, 210, 0.7);
  font-size: 0.72rem;
}

.timeline-filter-panel {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 16px 0;
}

.timeline-filter-panel label {
  display: grid;
  gap: 7px;
  color: rgba(164, 188, 214, 0.86);
  font-size: 0.72rem;
  font-weight: 760;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.timeline-filter-panel select {
  min-height: 40px;
  border: 1px solid rgba(103, 232, 249, 0.15);
  border-radius: 12px;
  padding: 9px 11px;
  color: #eef9ff;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
    rgba(1, 7, 16, 0.7);
  font: inherit;
  text-transform: none;
}

@media (max-width: 980px) {
  .cashback-import-grid,
  .cashback-mapping-grid,
  .loyalty-editor-grid,
  .timeline-filter-panel {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .cashback-import-grid,
  .cashback-mapping-grid,
  .loyalty-editor-grid,
  .timeline-filter-panel,
  .intelligence-next-action,
  .cashback-history-card .portal-history-list div {
    grid-template-columns: 1fr;
  }

  .intelligence-next-action .secondary-button {
    grid-column: 1;
    grid-row: auto;
  }

  .loyalty-editor-grid .primary-button {
    justify-self: stretch;
  }
}

.account-opening-review-card > span,
.account-request-timeline span,
.request-detail-list dt {
  color: var(--gold);
  font-size: 0.68rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.account-request-timeline {
  display: grid;
  gap: 10px;
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
}

.account-request-timeline li {
  border-left: 2px solid rgba(103, 232, 249, 0.35);
  padding-left: 12px;
}

.account-request-timeline strong {
  display: block;
  margin-top: 3px;
  color: #edf8ff;
  font-size: 0.86rem;
}

.account-request-timeline p {
  margin: 5px 0 0;
  color: rgba(204, 219, 236, 0.72);
  font-size: 0.82rem;
  line-height: 1.45;
}

.account-request-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-top: 16px;
}

.request-detail-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin: 12px 0 0;
}

.request-detail-list div {
  border: 1px solid rgba(103, 232, 249, 0.1);
  border-radius: 10px;
  padding: 10px;
  background: rgba(1, 7, 16, 0.34);
}

.request-detail-list dd {
  margin: 6px 0 0;
  overflow-wrap: anywhere;
}

.account-request-review-form {
  min-width: min(420px, 100%);
}

.portal-chart-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 14px;
}

.portal-chart-card {
  min-height: 238px;
  padding: 16px;
}

.portal-chart-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
}

.portal-chart-head strong {
  color: #f4fbff;
  font-size: 1.16rem;
  font-weight: 660;
  letter-spacing: -0.01em;
  white-space: nowrap;
}

.portal-line-chart {
  display: grid;
  gap: 9px;
  min-height: 174px;
}

.portal-line-chart svg {
  width: 100%;
  height: 154px;
  overflow: visible;
}

.portal-line-chart line {
  stroke: rgba(138, 174, 206, 0.12);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.portal-line-chart polyline {
  fill: none;
  stroke: #77e6f5;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.5;
  filter: drop-shadow(0 0 7px rgba(103, 232, 249, 0.16));
  vector-effect: non-scaling-stroke;
}

.portal-line-chart circle {
  fill: #eafcff;
  stroke: rgba(11, 31, 54, 0.98);
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

.portal-chart-axis {
  display: flex;
  justify-content: space-between;
  color: #748da4;
  font-size: 0.72rem;
}

.portal-chart-empty {
  display: grid;
  min-height: 156px;
  place-items: center;
  border: 1px dashed rgba(103, 232, 249, 0.18);
  border-radius: 12px;
  color: #91a8bf;
  background: rgba(1, 7, 16, 0.38);
  font-size: 0.88rem;
  text-align: center;
}

.portal-tier-progress {
  display: grid;
  align-content: space-between;
  gap: 16px;
}

.portal-progress {
  position: relative;
  height: 8px;
  overflow: hidden;
  border: 1px solid rgba(103, 232, 249, 0.13);
  border-radius: 999px;
  background: rgba(1, 7, 16, 0.74);
}

.portal-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #6bd6ff, #8af3ff);
}

.portal-tier-progress p {
  margin: 0;
  color: #9fb4ca;
  font-size: 0.88rem;
  line-height: 1.5;
}

.portal-onboarding-empty,
.portal-empty-module {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px;
  align-items: center;
  min-height: 220px;
  padding: 28px;
}

.portal-onboarding-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.portal-body .primary-button,
.portal-body .secondary-button {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  padding: 0 15px;
  font-size: 0.82rem;
  font-weight: 720;
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}

.portal-body .primary-button {
  border: 1px solid rgba(138, 243, 255, 0.34);
  color: #03111e;
  background: linear-gradient(135deg, #8af3ff, #66a6ff);
  box-shadow: 0 14px 30px rgba(47, 126, 255, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.42);
}

.portal-body .secondary-button {
  border: 1px solid rgba(103, 232, 249, 0.2);
  color: #dff8ff;
  background: rgba(255, 255, 255, 0.035);
}

.portal-body .primary-button:hover,
.portal-body .secondary-button:hover {
  transform: translateY(-1px);
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.24);
}

.portal-support-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.ai-interface-panel {
  display: grid;
  gap: 22px;
  padding: clamp(20px, 3vw, 30px);
}

.ai-interface-panel h2 {
  max-width: 820px;
  font-size: clamp(1.55rem, 3vw, 2.35rem);
}

.ai-module-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.ai-module-grid article,
.security-note {
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 12px;
  padding: 14px;
  background: rgba(1, 7, 16, 0.42);
}

.ai-module-grid span,
.security-note strong,
.ai-form-grid label {
  color: #dff8ff;
  font-size: 0.72rem;
  font-weight: 740;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.ai-module-grid p,
.security-note p {
  margin: 8px 0 0;
  color: #91a8bf;
  font-size: 0.82rem;
  line-height: 1.5;
}

.ai-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.ai-form-grid label {
  display: grid;
  gap: 8px;
}

.ai-form-grid input,
.ai-form-grid textarea {
  min-height: 44px;
  padding: 11px 12px;
}

.ai-form-grid textarea {
  min-height: 112px;
  resize: vertical;
}

.ai-form-grid input:disabled,
.ai-form-grid textarea:disabled {
  opacity: 1;
  color: #88a0b7;
  background:
    linear-gradient(180deg, rgba(7, 20, 36, 0.72), rgba(1, 7, 16, 0.78));
}

.portal-body a:focus-visible,
.portal-body button:focus-visible,
.portal-body input:focus-visible,
.portal-body select:focus-visible,
.portal-body textarea:focus-visible {
  outline: 2px solid rgba(138, 243, 255, 0.72);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: no-preference) {
  .portal-sidebar .nav-item,
  .portal-chart-card,
  .portal-kpi-grid .portal-stat,
  .ai-module-grid article {
    transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
  }

  .portal-chart-card:hover,
  .portal-kpi-grid .portal-stat:hover,
  .ai-module-grid article:hover {
    transform: translateY(-2px);
    border-color: rgba(103, 232, 249, 0.22);
  }

  .page-rise,
  .page-load-panel {
    animation: portalRise 420ms ease both;
  }
}

@keyframes portalRise {
  from {
    opacity: 0;
    transform: translateY(8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 1180px) {
  .portal-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ai-module-grid,
  .ai-form-grid,
  .portal-support-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .portal-shell {
    grid-template-columns: 1fr;
  }

  .portal-sidebar {
    position: relative;
    height: auto;
    min-height: 0;
    border-right: 0;
    border-bottom: 1px solid rgba(103, 232, 249, 0.12);
  }

  .portal-sidebar .nav-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .portal-main {
    padding: 18px 14px 32px;
  }

  .portal-topbar,
  .portal-welcome-panel,
  .portal-onboarding-empty,
  .portal-empty-module {
    grid-template-columns: 1fr;
  }

  .portal-identity,
  .portal-month-selector,
  .portal-onboarding-actions,
  .portal-onboarding-actions .primary-button,
  .portal-onboarding-actions .secondary-button {
    width: 100%;
  }

  .portal-overview-grid,
  .portal-chart-grid,
  .portal-detail-list,
  .account-opening-grid,
  .account-opening-form,
  .account-request-detail-grid,
  .ai-module-grid,
  .ai-form-grid,
  .portal-support-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 560px) {
  .portal-sidebar {
    padding: 16px 12px;
  }

  .portal-sidebar .nav-list,
  .portal-kpi-grid {
    grid-template-columns: 1fr;
  }

  .portal-topbar,
  .portal-welcome-panel,
  .portal-onboarding-empty,
  .portal-empty-module,
  .portal-profile-card,
  .portal-performance-card,
  .portal-chart-card,
  .carlos-workspace,
  .ai-interface-panel {
    border-radius: 12px;
    padding: 16px;
  }

  .portal-main .carlos-context-strip {
    grid-template-columns: 1fr;
  }

  .portal-main .carlos-message {
    width: 100%;
  }
}

/* Chart Reader evidence workspace. */

.portal-main .candle-import-zone {
  grid-column: span 3;
}

.portal-main .candle-import-zone textarea {
  min-height: 150px;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 0.78rem;
  line-height: 1.5;
  resize: vertical;
  white-space: pre;
  overflow: auto;
}

.portal-main .candle-import-zone span,
.portal-main .candle-validation-state p,
.portal-main .recent-analysis-empty,
.portal-main .recent-analysis-item span,
.portal-main .recent-analysis-item small {
  color: rgba(190, 208, 230, 0.66);
  font-size: 0.78rem;
  line-height: 1.45;
}

.portal-main .candle-file-action {
  min-height: 100%;
  align-self: stretch;
  text-align: center;
}

.portal-main .candle-validation-state,
.portal-main .recent-chart-analyses,
.portal-main .insufficient-data-state,
.portal-main .evidence-hierarchy-grid article,
.portal-main .evidence-scenario-grid article {
  border: 1px solid rgba(124, 205, 255, 0.13);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.012)),
    rgba(1, 7, 16, 0.48);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 18px 44px rgba(0, 0, 0, 0.18);
}

.portal-main .candle-validation-state {
  display: grid;
  align-content: center;
  gap: 6px;
  min-height: 110px;
  padding: 14px;
  border-color: rgba(200, 169, 106, 0.18);
}

.portal-main .candle-validation-state.is-valid {
  border-color: rgba(103, 232, 249, 0.28);
  background:
    radial-gradient(circle at 18% 0%, rgba(103, 232, 249, 0.12), transparent 16rem),
    rgba(1, 7, 16, 0.48);
}

.portal-main .candle-validation-state.is-invalid {
  border-color: rgba(248, 113, 113, 0.24);
}

.portal-main .candle-validation-state strong,
.portal-main .recent-chart-analyses > div strong,
.portal-main .recent-analysis-item strong {
  color: rgba(245, 250, 255, 0.94);
  font-weight: 680;
}

.portal-main .evidence-reader-output {
  animation: chartEvidenceFade 150ms ease both;
}

.portal-main .evidence-command-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.1fr);
  gap: 12px;
  margin-top: 14px;
}

.portal-main .evidence-command-grid .scenario-reasoning-card,
.portal-main .evidence-command-grid .scenario-risk-card {
  grid-column: span 1;
}

.portal-main .insufficient-data-state {
  margin-top: 14px;
  padding: 14px 16px;
  border-color: rgba(200, 169, 106, 0.2);
}

.portal-main .insufficient-data-state strong {
  color: #f4dfac;
}

.portal-main .insufficient-data-state p {
  margin: 6px 0 0;
  color: rgba(225, 214, 190, 0.78);
}

.portal-main .evidence-hierarchy-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.portal-main .evidence-hierarchy-grid article,
.portal-main .evidence-scenario-grid article {
  padding: 14px;
}

.portal-main .evidence-hierarchy-grid span,
.portal-main .evidence-output-card span,
.portal-main .recent-chart-analyses > div span,
.portal-main .evidence-scenario-grid span {
  color: var(--gold);
  font-size: 0.66rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.portal-main .evidence-hierarchy-grid ul {
  display: grid;
  gap: 8px;
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
}

.portal-main .evidence-hierarchy-grid li {
  display: flex;
  gap: 10px;
  justify-content: space-between;
  border: 1px solid rgba(124, 205, 255, 0.08);
  border-radius: 10px;
  padding: 9px 10px;
  color: rgba(217, 230, 245, 0.82);
  background: rgba(255, 255, 255, 0.018);
}

.portal-main .evidence-hierarchy-grid li span {
  color: inherit;
  font-size: 0.8rem;
  font-weight: 520;
  letter-spacing: 0;
  text-transform: none;
}

.portal-main .evidence-hierarchy-grid li em {
  flex: 0 0 auto;
  color: rgba(128, 226, 255, 0.82);
  font-style: normal;
  font-size: 0.72rem;
}

.portal-main .evidence-output-grid {
  margin-top: 14px;
}

.portal-main .evidence-output-card {
  display: grid;
  gap: 8px;
  min-width: 0;
}

.portal-main .evidence-output-card strong {
  color: rgba(245, 250, 255, 0.9);
  font-size: 0.9rem;
  font-weight: 650;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.portal-main .evidence-output-card p,
.portal-main .evidence-scenario-grid p {
  margin: 0;
  color: rgba(190, 208, 230, 0.68);
  font-size: 0.8rem;
  line-height: 1.48;
}

.portal-main .evidence-output-card.warning {
  border-color: rgba(200, 169, 106, 0.18);
}

.portal-main .evidence-scenario-grid {
  margin-top: 14px;
}

.portal-main .recent-chart-analyses {
  display: grid;
  gap: 10px;
  margin-top: 14px;
  padding: 14px;
}

.portal-main .recent-chart-analyses > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.portal-main .recent-analysis-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  border: 1px solid rgba(124, 205, 255, 0.09);
  border-radius: 12px;
  padding: 10px 12px;
  background: rgba(255, 255, 255, 0.018);
}

.portal-main .recent-analysis-item span {
  display: block;
  margin-top: 3px;
}

@keyframes chartEvidenceFade {
  from { opacity: 0.72; }
  to { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .portal-main .evidence-reader-output {
    animation: none;
  }
}

@media (max-width: 1180px) {
  .portal-main .candle-import-zone,
  .portal-main .candle-file-action {
    grid-column: 1 / -1;
  }

  .portal-main .evidence-hierarchy-grid,
  .portal-main .evidence-output-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .portal-main .evidence-command-grid,
  .portal-main .evidence-hierarchy-grid,
  .portal-main .evidence-output-grid,
  .portal-main .recent-analysis-item {
    grid-template-columns: 1fr;
  }

  .portal-main .recent-chart-analyses > div {
    align-items: flex-start;
    flex-direction: column;
  }

  .portal-main .candle-import-zone textarea {
    min-height: 180px;
  }
}

/* Alive visual layer for the AUREX Client Portal. */
.portal-body {
  position: relative;
  isolation: isolate;
}

.portal-body::before,
.portal-body::after {
  position: fixed;
  inset: -20%;
  z-index: -2;
  pointer-events: none;
  content: "";
}

.portal-body::before {
  background:
    radial-gradient(circle at 22% 18%, rgba(67, 139, 255, 0.16), transparent 28rem),
    radial-gradient(circle at 86% 8%, rgba(103, 232, 249, 0.11), transparent 24rem),
    radial-gradient(circle at 74% 86%, rgba(20, 68, 150, 0.2), transparent 32rem);
  filter: blur(6px);
}

.portal-body::after {
  z-index: -1;
  background:
    linear-gradient(115deg, transparent 0%, rgba(255, 255, 255, 0.028) 45%, transparent 62%),
    linear-gradient(rgba(103, 232, 249, 0.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 232, 249, 0.02) 1px, transparent 1px);
  background-size: auto, 92px 92px, 92px 92px;
  mask-image: radial-gradient(circle at 50% 28%, black, transparent 76%);
  opacity: 0.82;
}

.portal-topbar,
.portal-welcome-panel,
.portal-onboarding-empty,
.portal-empty-module,
.portal-body .glass-panel,
.portal-chart-card,
.ai-interface-panel,
.portal-kpi-grid .portal-stat,
.portal-sidebar .brand-lockup,
.portal-sidebar .sidebar-note {
  position: relative;
  overflow: hidden;
}

.portal-topbar::before,
.portal-welcome-panel::before,
.portal-onboarding-empty::before,
.portal-empty-module::before,
.portal-body .glass-panel::before,
.portal-chart-card::before,
.ai-interface-panel::before,
.portal-kpi-grid .portal-stat::before {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  content: "";
  background:
    radial-gradient(circle at 10% 0%, rgba(255, 255, 255, 0.075), transparent 17rem),
    linear-gradient(115deg, transparent 10%, rgba(255, 255, 255, 0.045) 48%, transparent 65%);
  opacity: 0.42;
}

.portal-topbar::after,
.portal-welcome-panel::after,
.portal-chart-card::after,
.ai-interface-panel::after {
  position: absolute;
  inset: -1px;
  z-index: 0;
  pointer-events: none;
  content: "";
  border-radius: inherit;
  background: linear-gradient(90deg, transparent, rgba(138, 243, 255, 0.08), transparent);
  opacity: 0;
  transform: translateX(-65%);
}

.portal-topbar > *,
.portal-welcome-panel > *,
.portal-onboarding-empty > *,
.portal-empty-module > *,
.portal-body .glass-panel > *,
.portal-chart-card > *,
.ai-interface-panel > *,
.portal-kpi-grid .portal-stat > * {
  position: relative;
  z-index: 1;
}

.portal-topbar {
  background:
    radial-gradient(circle at 86% 0%, rgba(103, 232, 249, 0.14), transparent 19rem),
    linear-gradient(180deg, rgba(15, 36, 62, 0.86), rgba(3, 10, 20, 0.92));
  box-shadow:
    0 24px 70px rgba(0, 0, 0, 0.34),
    0 0 0 1px rgba(103, 232, 249, 0.035),
    inset 0 1px 0 rgba(255, 255, 255, 0.075),
    inset 0 -18px 42px rgba(4, 13, 25, 0.38);
}

.portal-welcome-panel {
  background:
    radial-gradient(circle at 12% 0%, rgba(103, 232, 249, 0.12), transparent 18rem),
    linear-gradient(180deg, rgba(10, 29, 52, 0.82), rgba(3, 10, 20, 0.9));
}

.portal-kpi-grid .portal-stat:first-child {
  border-color: rgba(138, 243, 255, 0.28);
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.16), transparent 14rem),
    linear-gradient(180deg, rgba(12, 32, 58, 0.9), rgba(2, 8, 18, 0.9));
  box-shadow:
    0 18px 48px rgba(0, 0, 0, 0.28),
    0 0 34px rgba(60, 140, 255, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.075);
}

.portal-kpi-grid .portal-stat strong {
  text-shadow: 0 0 18px rgba(103, 232, 249, 0.09);
}

.portal-identity {
  border-color: rgba(138, 243, 255, 0.18);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055), 0 12px 34px rgba(0, 0, 0, 0.2);
}

.portal-avatar {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.16),
    0 0 26px rgba(103, 232, 249, 0.1);
}

.portal-sidebar {
  background:
    radial-gradient(circle at 0% 8%, rgba(103, 232, 249, 0.08), transparent 18rem),
    linear-gradient(180deg, rgba(6, 18, 34, 0.97), rgba(1, 6, 14, 0.985));
}

.portal-sidebar .brand-lockup::after,
.portal-sidebar .sidebar-note::after {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.065), transparent 38%);
  opacity: 0.5;
}

.portal-sidebar .nav-item.is-active {
  box-shadow:
    inset 3px 0 0 rgba(103, 232, 249, 0.82),
    0 14px 34px rgba(0, 0, 0, 0.22),
    0 0 28px rgba(103, 232, 249, 0.065);
}

.portal-sidebar .nav-item.is-active::after {
  position: absolute;
  right: 10px;
  width: 6px;
  height: 6px;
  border-radius: 999px;
  background: #8af3ff;
  box-shadow: 0 0 16px rgba(138, 243, 255, 0.65);
  content: "";
}

.portal-status-pill[class*="Active"],
.portal-status-pill[class*="Eligible"],
.portal-status-pill[class*="Gold"],
.portal-status-pill[class*="Elite"] {
  border-color: rgba(138, 243, 255, 0.34);
  color: #e9fdff;
  background: rgba(103, 232, 249, 0.11);
  box-shadow: 0 0 18px rgba(103, 232, 249, 0.08);
}

.portal-body .primary-button {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.2), transparent 45%),
    linear-gradient(135deg, #8af3ff, #6aa8ff 58%, #88b8ff);
}

.portal-body .secondary-button {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.052), rgba(255, 255, 255, 0.018)),
    rgba(4, 15, 29, 0.72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.portal-body .primary-button:active,
.portal-body .secondary-button:active {
  transform: translateY(0);
}

.portal-line-chart svg {
  border-radius: 10px;
}

.portal-line-chart .chart-area-fill {
  fill: rgba(103, 232, 249, 0.075);
  opacity: 0.9;
}

.portal-line-chart .chart-line-reveal {
  stroke-width: 2.15;
}

.portal-line-chart circle {
  opacity: 0.74;
}

.portal-line-chart circle.is-latest {
  r: 4;
  fill: #ffffff;
  stroke: #8af3ff;
  opacity: 1;
  filter: drop-shadow(0 0 8px rgba(138, 243, 255, 0.42));
}

.portal-chart-head strong {
  color: #f7fdff;
  text-shadow: 0 0 16px rgba(103, 232, 249, 0.1);
}

.portal-progress {
  height: 10px;
  box-shadow: inset 0 1px 8px rgba(0, 0, 0, 0.38);
}

.portal-progress::after {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.18), transparent);
  opacity: 0.7;
}

.portal-progress span {
  position: relative;
  box-shadow: 0 0 18px rgba(103, 232, 249, 0.22);
  transform-origin: left center;
}

.ai-interface-panel {
  background:
    radial-gradient(circle at 12% 0%, rgba(103, 232, 249, 0.13), transparent 22rem),
    radial-gradient(circle at 92% 18%, rgba(61, 121, 255, 0.1), transparent 18rem),
    linear-gradient(180deg, rgba(11, 27, 48, 0.86), rgba(2, 8, 18, 0.93));
}

.ai-interface-panel::before {
  opacity: 0.52;
}

.ai-module-grid article {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.038), rgba(255, 255, 255, 0.014)),
    rgba(1, 7, 16, 0.5);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

.ai-form-grid input,
.ai-form-grid textarea {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}

.ai-form-grid input[type="file"] {
  min-height: 74px;
  border-style: dashed;
  padding: 20px 12px;
  color: #8ca5bc;
  background:
    radial-gradient(circle at 50% 0%, rgba(103, 232, 249, 0.08), transparent 15rem),
    rgba(1, 7, 16, 0.58);
}

.ai-form-grid input::file-selector-button {
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 9px;
  margin-right: 12px;
  padding: 9px 12px;
  color: #dff8ff;
  background: rgba(255, 255, 255, 0.04);
  font: inherit;
  font-size: 0.78rem;
  font-weight: 700;
}

.security-note {
  background:
    linear-gradient(180deg, rgba(103, 232, 249, 0.055), rgba(255, 255, 255, 0.016)),
    rgba(1, 7, 16, 0.48);
}

@supports not ((backdrop-filter: blur(18px)) or (-webkit-backdrop-filter: blur(18px))) {
  .portal-topbar,
  .portal-welcome-panel,
  .portal-onboarding-empty,
  .portal-empty-module,
  .portal-body .glass-panel,
  .portal-chart-card,
  .ai-interface-panel {
    background-color: rgba(4, 13, 26, 0.97);
  }
}

@media (prefers-reduced-motion: no-preference) {
  .portal-body::before {
    animation: portalAmbientDrift 18s ease-in-out infinite alternate;
  }

  .portal-body::after {
    animation: portalGridDrift 24s linear infinite;
  }

  .portal-topbar::after,
  .portal-welcome-panel::after,
  .portal-chart-card::after,
  .ai-interface-panel::after {
    animation: portalLightSweep 5.8s ease-in-out infinite;
  }

  .portal-sidebar .nav-item.is-active::after,
  .portal-status-pill[class*="Active"],
  .portal-status-pill[class*="Eligible"] {
    animation: portalSoftPulse 3.4s ease-in-out infinite;
  }

  .portal-line-chart .chart-area-fill {
    animation: portalAreaRise 760ms ease both;
    transform-box: fill-box;
    transform-origin: bottom;
  }

  .portal-line-chart .chart-line-reveal {
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    animation: portalChartReveal 1100ms cubic-bezier(0.2, 0.8, 0.2, 1) 120ms forwards;
  }

  .portal-line-chart circle:not(.is-latest) {
    animation: portalPointIn 420ms ease both;
  }

  .portal-progress span {
    animation: portalProgressIn 850ms cubic-bezier(0.2, 0.8, 0.2, 1) both;
  }

  .portal-main {
    animation: portalRouteFade 240ms ease both;
  }
}

@keyframes portalAmbientDrift {
  from {
    transform: translate3d(-1.5%, -1%, 0) scale(1);
  }

  to {
    transform: translate3d(1.5%, 1%, 0) scale(1.03);
  }
}

@keyframes portalGridDrift {
  from {
    background-position: 0 0, 0 0, 0 0;
  }

  to {
    background-position: 0 0, 92px 92px, 92px 92px;
  }
}

@keyframes portalLightSweep {
  0%,
  72% {
    opacity: 0;
    transform: translateX(-70%);
  }

  82% {
    opacity: 0.42;
  }

  100% {
    opacity: 0;
    transform: translateX(70%);
  }
}

@keyframes portalSoftPulse {
  0%,
  100% {
    box-shadow: 0 0 14px rgba(103, 232, 249, 0.08);
  }

  50% {
    box-shadow: 0 0 24px rgba(103, 232, 249, 0.16);
  }
}

@keyframes portalChartReveal {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes portalAreaRise {
  from {
    opacity: 0;
    transform: scaleY(0.25);
  }

  to {
    opacity: 0.9;
    transform: scaleY(1);
  }
}

@keyframes portalPointIn {
  from {
    opacity: 0;
    transform: scale(0.5);
  }

  to {
    opacity: 0.74;
    transform: scale(1);
  }
}

@keyframes portalProgressIn {
  from {
    transform: scaleX(0);
  }

  to {
    transform: scaleX(1);
  }
}

@keyframes portalRouteFade {
  from {
    opacity: 0.96;
  }

  to {
    opacity: 1;
  }
}

/* Live Market Workspace inside Chart Reader. */

.chart-reader-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
}

.chart-reader-head h2 {
  margin: 0;
  color: #f5fbff;
  font-size: clamp(1.5rem, 3vw, 2.35rem);
  font-weight: 680;
  letter-spacing: 0;
  line-height: 1.04;
}

.chart-reader-head p:not(.eyebrow) {
  max-width: 820px;
  margin: 9px 0 0;
  color: #9fb4ca;
  line-height: 1.58;
}

.chart-mode-switch {
  display: inline-grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 4px;
  border: 1px solid rgba(103, 232, 249, 0.14);
  border-radius: 999px;
  padding: 4px;
  background: rgba(1, 7, 16, 0.56);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.chart-mode-switch button {
  min-height: 36px;
  border: 0;
  border-radius: 999px;
  padding: 0 14px;
  color: #93a9bf;
  background: transparent;
  font: inherit;
  font-size: 0.76rem;
  font-weight: 740;
  cursor: pointer;
}

.chart-mode-switch button.is-active {
  color: #041220;
  background: linear-gradient(135deg, #8af3ff, #70aaff);
  box-shadow: 0 10px 24px rgba(47, 126, 255, 0.18);
}

.chart-reader-terminal {
  display: grid;
  grid-template-columns: 230px minmax(0, 1fr);
  gap: 14px;
  min-height: 680px;
}

.chart-control-rail {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 14px;
}

.chart-control-rail label,
.analysis-input-grid label {
  display: grid;
  gap: 8px;
  color: #dff8ff;
  font-size: 0.68rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.chart-control-rail select,
.analysis-input-grid select,
.analysis-input-grid textarea {
  min-height: 42px;
  border: 1px solid rgba(103, 232, 249, 0.16);
  border-radius: 10px;
  padding: 0 11px;
  color: #eaf8ff;
  background:
    linear-gradient(180deg, rgba(7, 20, 36, 0.82), rgba(1, 7, 16, 0.84));
  font: inherit;
  text-transform: none;
}

.chart-terminal-note {
  margin-top: 2px;
  border: 1px solid rgba(103, 232, 249, 0.11);
  border-radius: 12px;
  padding: 12px;
  background: rgba(103, 232, 249, 0.045);
}

.chart-terminal-note strong {
  color: #c9f8ff;
  font-size: 0.68rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.chart-terminal-note p {
  margin: 7px 0 0;
  color: #91a8bf;
  font-size: 0.78rem;
  line-height: 1.5;
}

.live-chart-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid rgba(103, 232, 249, 0.1);
  padding: 12px 14px;
  background: rgba(1, 7, 16, 0.44);
}

.live-chart-toolbar span {
  color: #7f96ad;
  font-size: 0.68rem;
  font-weight: 780;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.live-chart-toolbar strong {
  color: #f4fbff;
  font-size: 0.9rem;
  font-weight: 700;
}

#tradingViewChartMount,
#tradingViewChartMount .tradingview-widget-container__widget,
#tradingViewChartMount iframe {
  width: 100%;
  height: 100%;
  min-height: 620px;
}

.tv-widget-fallback {
  display: grid;
  height: 100%;
  min-height: 620px;
  place-items: center;
  padding: 24px;
  color: #9fb4ca;
  text-align: center;
}

.analysis-input-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}

.analysis-input-grid .upload-zone,
.analysis-input-grid .analysis-notes {
  grid-column: span 2;
}

.analysis-input-grid .upload-zone {
  min-height: 118px;
  align-content: center;
  border: 1px dashed rgba(103, 232, 249, 0.2);
  border-radius: 13px;
  padding: 16px;
  background:
    radial-gradient(circle at 50% 0%, rgba(103, 232, 249, 0.09), transparent 16rem),
    rgba(1, 7, 16, 0.52);
}

.analysis-input-grid input[type="file"] {
  color: #91a8bf;
  font-size: 0.82rem;
  text-transform: none;
}

.analysis-input-grid .upload-zone span {
  color: #91a8bf;
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.45;
  text-transform: none;
}

.analysis-input-grid textarea {
  min-height: 118px;
  padding: 11px 12px;
  resize: vertical;
}

.analysis-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.analysis-action-row .primary-button span,
.analysis-action-row .secondary-button span {
  margin-left: 8px;
  opacity: 0.72;
  font-size: 0.72rem;
}

.portal-body .is-disabled {
  cursor: not-allowed;
  filter: saturate(0.74);
  opacity: 0.62;
}

.analysis-output-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.analysis-output-grid article {
  min-height: 120px;
  padding: 14px;
}

.analysis-output-grid span {
  color: #dff8ff;
  font-size: 0.7rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.analysis-output-grid p {
  margin: 10px 0 0;
  color: #8fa7bf;
  font-size: 0.84rem;
  line-height: 1.52;
}

@media (prefers-reduced-motion: no-preference) {

  .chart-mode-switch button,
  .chart-control-rail select,
  .analysis-input-grid select,
  .analysis-input-grid textarea {
    transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease, background 160ms ease;
  }

  .chart-mode-switch button:hover,
  .chart-control-rail select:hover,
  .analysis-input-grid select:hover,
  .analysis-input-grid textarea:hover {
    border-color: rgba(103, 232, 249, 0.28);
  }
}

@media (max-width: 1180px) {
  .chart-reader-terminal {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .chart-control-rail {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .chart-terminal-note {
    grid-column: 1 / -1;
  }

  .analysis-input-grid,
  .analysis-output-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .chart-reader-head,
  .analysis-input-grid,
  .analysis-output-grid,
  .chart-control-rail {
    grid-template-columns: 1fr;
  }

  .chart-mode-switch,
  .analysis-input-grid .upload-zone,
  .analysis-input-grid .analysis-notes {
    grid-column: 1 / -1;
    width: 100%;
  }

  #tradingViewChartMount,
  #tradingViewChartMount .tradingview-widget-container__widget,
  #tradingViewChartMount iframe,
  .tv-widget-fallback {
    min-height: 520px;
  }
}

/* Premium trading intelligence workspace refinements. */
.chart-rail-group {
  display: grid;
  gap: 8px;
}

.chart-rail-group > span {
  color: #dff8ff;
  font-size: 0.68rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.market-chip-row,
.timeframe-preset-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.market-chip-row.compact {
  gap: 5px;
}

.market-chip-row em {
  color: #748da4;
  font-size: 0.78rem;
  font-style: normal;
}

.market-chip,
.timeframe-preset-row button {
  min-height: 31px;
  border: 1px solid rgba(103, 232, 249, 0.13);
  border-radius: 999px;
  padding: 0 10px;
  color: #9fb4ca;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.012)),
    rgba(1, 7, 16, 0.46);
  font: inherit;
  font-size: 0.73rem;
  font-weight: 700;
  cursor: pointer;
}

.market-chip.is-active,
.timeframe-preset-row button.is-active {
  border-color: rgba(138, 243, 255, 0.38);
  color: #eaffff;
  background: rgba(103, 232, 249, 0.11);
  box-shadow: 0 0 18px rgba(103, 232, 249, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.chart-control-rail input,
.analysis-input-grid input {
  min-height: 42px;
  border: 1px solid rgba(103, 232, 249, 0.16);
  border-radius: 10px;
  padding: 0 11px;
  color: #eaf8ff;
  background:
    linear-gradient(180deg, rgba(7, 20, 36, 0.82), rgba(1, 7, 16, 0.84));
  font: inherit;
  text-transform: none;
}

.market-status-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

.market-status-grid article {
  border: 1px solid rgba(103, 232, 249, 0.11);
  border-radius: 11px;
  padding: 10px;
  background: rgba(103, 232, 249, 0.045);
}

.market-status-grid span {
  display: block;
  color: #7f96ad;
  font-size: 0.62rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.market-status-grid strong {
  display: block;
  margin-top: 6px;
  color: #f4fbff;
  font-size: 0.84rem;
  font-weight: 700;
}

.tv-loading-state {
  position: absolute;
  inset: 49px 0 0;
  z-index: 2;
  display: grid;
  place-items: center;
  color: #c9f8ff;
  background:
    radial-gradient(circle at 50% 40%, rgba(103, 232, 249, 0.12), transparent 18rem),
    rgba(2, 8, 18, 0.78);
  font-size: 0.82rem;
  font-weight: 740;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.tv-loading-state.is-hidden {
  display: none;
}

.scenario-support-note {
  border: 1px solid rgba(103, 232, 249, 0.13);
  border-radius: 12px;
  padding: 13px;
  background:
    linear-gradient(180deg, rgba(103, 232, 249, 0.06), rgba(255, 255, 255, 0.014)),
    rgba(1, 7, 16, 0.48);
}

.scenario-support-note strong {
  color: #c9f8ff;
  font-size: 0.7rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.scenario-support-note p {
  margin: 8px 0 0;
  color: #91a8bf;
  font-size: 0.84rem;
  line-height: 1.52;
}

.strategy-lab-workspace {
  position: relative;
  display: grid;
  gap: 16px;
  overflow: hidden;
  border: 1px solid rgba(103, 232, 249, 0.15);
  border-radius: 16px;
  padding: clamp(16px, 2.4vw, 24px);
  background:
    radial-gradient(circle at 16% 0%, rgba(103, 232, 249, 0.13), transparent 24rem),
    radial-gradient(circle at 92% 14%, rgba(64, 122, 255, 0.11), transparent 22rem),
    linear-gradient(180deg, rgba(8, 24, 45, 0.9), rgba(2, 8, 18, 0.95));
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.065);
  backdrop-filter: blur(20px);
}

.strategy-lab-workspace::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(115deg, transparent 8%, rgba(255, 255, 255, 0.04) 48%, transparent 68%),
    linear-gradient(rgba(103, 232, 249, 0.023) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 232, 249, 0.018) 1px, transparent 1px);
  background-size: auto, 54px 54px, 54px 54px;
  opacity: 0.55;
}

.strategy-lab-workspace > * {
  position: relative;
  z-index: 1;
}

.strategy-lab-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(170px, auto);
  gap: 16px;
  align-items: start;
}

.strategy-lab-head h2 {
  margin: 0;
  color: #f5fbff;
  font-size: clamp(1.5rem, 3vw, 2.35rem);
  font-weight: 680;
  line-height: 1.04;
}

.strategy-lab-head p:not(.eyebrow) {
  max-width: 760px;
  margin: 9px 0 0;
  color: #9fb4ca;
  line-height: 1.58;
}

.strategy-score-card {
  border: 1px solid rgba(138, 243, 255, 0.18);
  border-radius: 14px;
  padding: 14px;
  background: rgba(1, 7, 16, 0.5);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
}

.strategy-score-card span {
  color: #7f96ad;
  font-size: 0.66rem;
  font-weight: 780;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.strategy-score-card strong {
  display: block;
  margin-top: 8px;
  color: #f7fdff;
  font-size: 1.8rem;
  font-weight: 680;
}

.strategy-score-card p {
  margin: 7px 0 0;
  color: #8fa7bf;
  font-size: 0.78rem;
}

.strategy-builder-grid {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr) 240px;
  gap: 14px;
}

.strategy-stepper,
.strategy-builder-panel,
.recent-strategy-panel,
.strategy-output-grid article {
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.012)),
    rgba(1, 7, 16, 0.52);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045), 0 16px 40px rgba(0, 0, 0, 0.2);
}

.strategy-stepper {
  display: grid;
  align-content: start;
  gap: 8px;
  padding: 12px;
}

.strategy-stepper article {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  border: 1px solid rgba(103, 232, 249, 0.08);
  border-radius: 10px;
  padding: 9px;
  background: rgba(1, 7, 16, 0.34);
}

.strategy-stepper article.is-complete {
  border-color: rgba(138, 243, 255, 0.24);
  background: rgba(103, 232, 249, 0.07);
}

.strategy-stepper span {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 999px;
  color: #c9f8ff;
  background: rgba(103, 232, 249, 0.09);
  font-size: 0.74rem;
  font-weight: 780;
}

.strategy-stepper strong {
  color: #dfefff;
  font-size: 0.82rem;
  font-weight: 690;
}

.strategy-builder-panel {
  display: grid;
  gap: 14px;
  padding: 14px;
}

.strategy-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.strategy-form-grid label {
  display: grid;
  gap: 8px;
  color: #dff8ff;
  font-size: 0.68rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.strategy-form-grid input,
.strategy-form-grid select,
.strategy-form-grid textarea {
  min-height: 42px;
  border: 1px solid rgba(103, 232, 249, 0.16);
  border-radius: 10px;
  padding: 0 11px;
  color: #eaf8ff;
  background: linear-gradient(180deg, rgba(7, 20, 36, 0.82), rgba(1, 7, 16, 0.84));
  font: inherit;
  text-transform: none;
}

.strategy-form-grid textarea {
  min-height: 96px;
  padding: 11px;
  resize: vertical;
  line-height: 1.5;
}

.strategy-form-grid input:focus,
.strategy-form-grid select:focus,
.strategy-form-grid textarea:focus {
  outline: 2px solid rgba(103, 232, 249, 0.22);
  border-color: rgba(138, 243, 255, 0.38);
  box-shadow: 0 0 0 4px rgba(103, 232, 249, 0.08);
}

.strategy-wide-field {
  grid-column: 1 / -1;
}

.strategy-checklist {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  border: 1px solid rgba(103, 232, 249, 0.11);
  border-radius: 12px;
  padding: 10px;
  background: rgba(1, 7, 16, 0.34);
}

.strategy-checklist label {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 36px;
  border: 1px solid rgba(103, 232, 249, 0.08);
  border-radius: 10px;
  padding: 8px 9px;
  background: rgba(8, 24, 45, 0.52);
  color: #c8d8e8;
  font-size: 0.76rem;
  font-weight: 650;
  letter-spacing: 0;
  text-transform: none;
}

.strategy-checklist input {
  min-height: auto;
  width: 15px;
  height: 15px;
  accent-color: #67e8f9;
}

.strategy-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.strategy-action-row .primary-button span {
  margin-left: 8px;
  opacity: 0.72;
  font-size: 0.72rem;
}

.strategy-save-status {
  margin: 0;
  color: #8fa7bf;
  font-size: 0.84rem;
}

.recent-strategy-panel {
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 14px;
}

.recent-strategy-panel > span {
  color: #dff8ff;
  font-size: 0.7rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

#recentStrategyList {
  display: grid;
  gap: 8px;
}

#recentStrategyList article {
  border: 1px solid rgba(103, 232, 249, 0.09);
  border-radius: 10px;
  padding: 10px;
  background: rgba(1, 7, 16, 0.38);
}

#recentStrategyList strong {
  color: #f4fbff;
  font-size: 0.82rem;
}

#recentStrategyList p {
  margin: 5px 0 0;
  color: #8fa7bf;
  font-size: 0.76rem;
  line-height: 1.4;
}

.strategy-review-card,
.strategy-summary-card {
  display: grid;
  gap: 12px;
}

.strategy-readiness-bar {
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(148, 177, 220, 0.13);
}

.strategy-readiness-bar i {
  display: block;
  width: var(--score, 0%);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(103, 232, 249, 0.74), rgba(213, 176, 106, 0.78));
  box-shadow: 0 0 18px rgba(103, 232, 249, 0.22);
}

.strategy-review-lists {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.strategy-review-lists div,
.strategy-checklist-summary,
.strategy-rule-grid > div {
  border: 1px solid rgba(103, 232, 249, 0.09);
  border-radius: 10px;
  padding: 10px;
  background: rgba(1, 7, 16, 0.32);
}

.strategy-review-lists strong,
.strategy-checklist-summary strong,
.strategy-rule-grid strong {
  display: block;
  color: #dff8ff;
  font-size: 0.68rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.strategy-review-lists ul,
.strategy-checklist-summary ul {
  display: grid;
  gap: 7px;
  margin: 9px 0 0;
  padding: 0;
  list-style: none;
}

.strategy-review-lists li,
.strategy-checklist-summary li {
  color: #9fb4ca;
  font-size: 0.78rem;
  line-height: 1.45;
}

.strategy-summary-grid,
.strategy-rule-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.strategy-summary-grid span {
  display: block;
  color: #7f96ad;
  font-size: 0.66rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.strategy-summary-grid strong {
  display: block;
  margin-top: 6px;
  color: #f4fbff;
  font-size: 0.9rem;
  line-height: 1.25;
}

.strategy-rule-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.strategy-rule-grid p {
  margin: 8px 0 0;
  color: #93aabf;
  font-size: 0.8rem;
  line-height: 1.48;
}

.performance-import-panel,
.performance-coach-panel {
  border-color: rgba(103, 232, 249, 0.15);
  background:
    radial-gradient(circle at 18% 0%, rgba(103, 232, 249, 0.09), transparent 20rem),
    linear-gradient(180deg, rgba(8, 24, 45, 0.78), rgba(1, 7, 16, 0.82));
}

.performance-mapping-grid {
  margin-top: 14px;
}

.coach-score-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 14px;
}

.coach-insight-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 14px 0;
}

.coach-list-card {
  border: 1px solid rgba(103, 232, 249, 0.1);
  border-radius: 12px;
  padding: 12px;
  background: rgba(1, 7, 16, 0.42);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

.coach-list-card.positive {
  border-color: rgba(84, 214, 164, 0.22);
}

.coach-list-card.warning {
  border-color: rgba(213, 176, 106, 0.24);
}

.coach-list-card.danger {
  border-color: rgba(255, 117, 117, 0.24);
}

.coach-list-card span {
  display: block;
  color: #dff8ff;
  font-size: 0.68rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.coach-list-card ul {
  display: grid;
  gap: 7px;
  margin: 9px 0 0;
  padding: 0;
  list-style: none;
}

.coach-list-card li {
  color: #9fb4ca;
  font-size: 0.8rem;
  line-height: 1.45;
}

.strategy-output-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.strategy-output-grid article {
  min-height: 116px;
  padding: 14px;
}

.strategy-output-grid span {
  color: #dff8ff;
  font-size: 0.7rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.strategy-output-grid p {
  margin: 10px 0 0;
  color: #8fa7bf;
  font-size: 0.84rem;
  line-height: 1.52;
}

.portal-stat,
.portal-performance-card,
.portal-profile-card,
.portal-support-card {
  border-color: rgba(103, 232, 249, 0.14);
}

@media (prefers-reduced-motion: no-preference) {
  .market-chip,
  .timeframe-preset-row button,
  .strategy-stepper article,
  .strategy-output-grid article,
  .analysis-output-grid article {
    transition: transform 160ms ease, border-color 160ms ease, background 160ms ease, box-shadow 160ms ease;
  }

  .market-chip:hover,
  .timeframe-preset-row button:hover,
  .strategy-output-grid article:hover,
  .analysis-output-grid article:hover {
    transform: translateY(-1px);
    border-color: rgba(103, 232, 249, 0.24);
  }
}

@media (max-width: 1280px) {
  .strategy-builder-grid {
    grid-template-columns: 1fr;
  }

  .strategy-stepper {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 860px) {
  .strategy-lab-head,
  .strategy-form-grid,
  .strategy-checklist,
  .strategy-review-lists,
  .strategy-summary-grid,
  .strategy-rule-grid,
  .coach-score-grid,
  .coach-insight-grid,
  .strategy-output-grid {
    grid-template-columns: 1fr;
  }

  .strategy-stepper {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .market-status-grid,
  .strategy-stepper {
    grid-template-columns: 1fr;
  }
}

/* Education Hub and advanced chart analysis workspace. */
.education-hub {
  position: relative;
  display: grid;
  gap: 16px;
  overflow: hidden;
  border: 1px solid rgba(103, 232, 249, 0.15);
  border-radius: 16px;
  padding: clamp(16px, 2.4vw, 24px);
  background:
    radial-gradient(circle at 16% 0%, rgba(103, 232, 249, 0.12), transparent 24rem),
    radial-gradient(circle at 92% 16%, rgba(64, 122, 255, 0.1), transparent 22rem),
    linear-gradient(180deg, rgba(8, 24, 45, 0.9), rgba(2, 8, 18, 0.95));
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.065);
  backdrop-filter: blur(20px);
}

.education-hub::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background:
    linear-gradient(115deg, transparent 8%, rgba(255, 255, 255, 0.038) 48%, transparent 68%),
    linear-gradient(rgba(103, 232, 249, 0.022) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 232, 249, 0.018) 1px, transparent 1px);
  background-size: auto, 54px 54px, 54px 54px;
  opacity: 0.54;
}

.education-hub > * {
  position: relative;
  z-index: 1;
}

.education-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, auto);
  gap: 16px;
  align-items: start;
}

.education-head h2 {
  margin: 0;
  color: #f5fbff;
  font-size: clamp(1.5rem, 3vw, 2.35rem);
  font-weight: 680;
  line-height: 1.04;
}

.education-head p:not(.eyebrow) {
  max-width: 760px;
  margin: 9px 0 0;
  color: #9fb4ca;
  line-height: 1.58;
}

.education-progress-card,
.featured-lesson-card,
.continue-lesson-card,
.learning-path-card,
.education-controls,
.lesson-card,
.education-empty-state,
.education-quiz-panel,
.chart-capture-grid > *,
.trade-plan-card {
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.012)),
    rgba(1, 7, 16, 0.52);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.045), 0 16px 40px rgba(0, 0, 0, 0.2);
}

.education-progress-card {
  padding: 14px;
}

.education-progress-card span,
.lesson-label {
  color: #7edff0;
  font-size: 0.68rem;
  font-weight: 780;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.education-progress-card strong {
  display: block;
  margin-top: 8px;
  color: #f7fdff;
  font-size: 1.8rem;
  font-weight: 680;
}

.education-progress-card p,
.featured-lesson-card p,
.continue-lesson-card p,
.lesson-card p {
  margin: 8px 0 0;
  color: #91a8bf;
  line-height: 1.52;
}

.education-feature-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(240px, 0.8fr) minmax(240px, 0.8fr);
  gap: 14px;
}

.featured-lesson-card,
.continue-lesson-card,
.learning-path-card {
  display: grid;
  align-content: start;
  gap: 12px;
  padding: 16px;
}

.featured-lesson-card h3,
.continue-lesson-card h3 {
  margin: 0;
  color: #f5fbff;
  font-size: 1.25rem;
  font-weight: 680;
}

.lesson-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.lesson-meta-row span {
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 999px;
  padding: 6px 9px;
  color: #b9d3e7;
  background: rgba(103, 232, 249, 0.055);
  font-size: 0.72rem;
  font-weight: 700;
}

.lesson-progress {
  height: 8px;
  overflow: hidden;
  border: 1px solid rgba(103, 232, 249, 0.13);
  border-radius: 999px;
  background: rgba(1, 7, 16, 0.72);
}

.lesson-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #6bd6ff, #8af3ff);
  box-shadow: 0 0 18px rgba(103, 232, 249, 0.18);
}

.learning-path-steps {
  display: grid;
  gap: 8px;
}

.learning-path-steps div {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  border: 1px solid rgba(103, 232, 249, 0.09);
  border-radius: 10px;
  padding: 9px;
  background: rgba(1, 7, 16, 0.38);
}

.learning-path-steps strong {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 999px;
  color: #c9f8ff;
  background: rgba(103, 232, 249, 0.09);
  font-size: 0.74rem;
}

.learning-path-steps span {
  color: #dfefff;
  font-size: 0.84rem;
  font-weight: 680;
}

.education-controls {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px 220px;
  gap: 12px;
  padding: 14px;
}

.education-controls label {
  display: grid;
  gap: 8px;
  color: #dff8ff;
  font-size: 0.68rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.education-controls input,
.education-controls select {
  min-height: 42px;
  border: 1px solid rgba(103, 232, 249, 0.16);
  border-radius: 10px;
  padding: 0 11px;
  color: #eaf8ff;
  background: linear-gradient(180deg, rgba(7, 20, 36, 0.82), rgba(1, 7, 16, 0.84));
  font: inherit;
  text-transform: none;
}

.education-category-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.education-category-tabs button,
.lesson-card-head button {
  min-height: 32px;
  border: 1px solid rgba(103, 232, 249, 0.13);
  border-radius: 999px;
  padding: 0 10px;
  color: #9fb4ca;
  background: rgba(1, 7, 16, 0.46);
  font: inherit;
  font-size: 0.74rem;
  font-weight: 700;
  cursor: pointer;
}

.education-category-tabs button.is-active,
.lesson-card-head button.is-favorite {
  border-color: rgba(138, 243, 255, 0.34);
  color: #eaffff;
  background: rgba(103, 232, 249, 0.11);
}

.education-lesson-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.lesson-card {
  display: grid;
  align-content: start;
  gap: 11px;
  padding: 14px;
}

.lesson-card.is-hidden {
  display: none;
}

.education-empty-state {
  padding: 22px;
  text-align: center;
}

.education-empty-state h3 {
  margin: 0;
  color: #f5fbff;
  font-size: 1.25rem;
  font-weight: 680;
}

.education-empty-state p:not(.eyebrow) {
  margin: 8px auto 0;
  max-width: 520px;
  color: #91a8bf;
}

.education-quiz-panel {
  display: grid;
  gap: 14px;
  padding: 16px;
}

.quiz-head {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(150px, auto);
  gap: 14px;
  align-items: start;
}

.quiz-head h3,
.quiz-question-card h3,
.quiz-final h3 {
  margin: 0;
  color: #f5fbff;
  font-size: 1.25rem;
  font-weight: 680;
}

.quiz-head p,
.quiz-final p {
  margin: 8px 0 0;
  color: #91a8bf;
}

.quiz-score-card {
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 12px;
  padding: 12px;
  background: rgba(1, 7, 16, 0.4);
}

.quiz-score-card span,
.quiz-question-card > span {
  color: #7edff0;
  font-size: 0.68rem;
  font-weight: 780;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.quiz-score-card strong {
  display: block;
  margin-top: 6px;
  color: #f7fdff;
  font-size: 1.45rem;
  font-weight: 680;
}

.quiz-score-card p {
  margin: 5px 0 0;
  color: #8fa7bf;
  font-size: 0.78rem;
}

.quiz-progress {
  height: 8px;
  overflow: hidden;
  border: 1px solid rgba(103, 232, 249, 0.13);
  border-radius: 999px;
  background: rgba(1, 7, 16, 0.72);
}

.quiz-progress span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, #6bd6ff, #8af3ff);
}

.quiz-question-card {
  display: grid;
  gap: 12px;
}

.quiz-options {
  display: grid;
  gap: 8px;
}

.quiz-options button {
  min-height: 42px;
  border: 1px solid rgba(103, 232, 249, 0.13);
  border-radius: 10px;
  padding: 0 12px;
  color: #dfefff;
  background: rgba(1, 7, 16, 0.42);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.quiz-options button.is-correct {
  border-color: rgba(52, 211, 153, 0.42);
  background: rgba(52, 211, 153, 0.1);
}

.quiz-options button.is-wrong {
  border-color: rgba(248, 113, 113, 0.42);
  background: rgba(248, 113, 113, 0.1);
}

.quiz-explanation {
  border: 1px solid rgba(103, 232, 249, 0.12);
  border-radius: 10px;
  padding: 12px;
  background: rgba(103, 232, 249, 0.045);
}

.quiz-explanation strong {
  color: #c9f8ff;
  font-size: 0.76rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.quiz-explanation p {
  margin: 7px 0 0;
  color: #9fb4ca;
}

.quiz-final {
  display: grid;
  gap: 10px;
}

.lesson-card-head {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

.lesson-card-head > span {
  color: #7edff0;
  font-size: 0.68rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.lesson-card h3 {
  margin: 0;
  color: #f5fbff;
  font-size: 1.02rem;
  font-weight: 680;
}

.lesson-card-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.analysis-workflow-steps {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}

.analysis-workflow-steps article {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 9px;
  align-items: center;
  border: 1px solid rgba(103, 232, 249, 0.1);
  border-radius: 12px;
  padding: 10px;
  background: rgba(1, 7, 16, 0.42);
}

.analysis-workflow-steps article.is-active {
  border-color: rgba(138, 243, 255, 0.25);
  background: rgba(103, 232, 249, 0.075);
}

.analysis-workflow-steps span {
  display: grid;
  width: 28px;
  height: 28px;
  place-items: center;
  border-radius: 999px;
  color: #c9f8ff;
  background: rgba(103, 232, 249, 0.09);
  font-size: 0.74rem;
  font-weight: 780;
}

.analysis-workflow-steps strong {
  color: #dfefff;
  font-size: 0.8rem;
  font-weight: 680;
}

.chart-capture-grid {
  display: grid;
  grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr);
  gap: 12px;
}

.capture-action-panel,
.screenshot-preview-panel,
.trade-plan-card {
  padding: 14px;
}

.capture-action-panel p,
.capture-status {
  margin: 8px 0 0;
  color: #91a8bf;
  font-size: 0.84rem;
  line-height: 1.52;
}

.capture-action-row {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 12px;
}

.file-action-label {
  cursor: pointer;
}

.file-action-label input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.screenshot-preview-panel {
  position: relative;
  display: grid;
  min-height: 260px;
  place-items: center;
  overflow: hidden;
}

.screenshot-empty-state {
  color: #91a8bf;
  font-size: 0.88rem;
}

#chartScreenshotPreview {
  display: block;
  width: 100%;
  max-height: 360px;
  object-fit: contain;
  border-radius: 12px;
}

.crop-placeholder {
  position: absolute;
  inset: 18%;
  display: grid;
  place-items: center;
  border: 1px dashed rgba(138, 243, 255, 0.38);
  border-radius: 12px;
  color: #c9f8ff;
  background: rgba(1, 7, 16, 0.18);
  font-size: 0.74rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.trade-plan-card {
  display: grid;
  gap: 14px;
}

.trade-plan-card span,
.trade-plan-levels span {
  color: #7f96ad;
  font-size: 0.66rem;
  font-weight: 780;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.trade-plan-card strong {
  display: block;
  margin-top: 6px;
  color: #f7fdff;
  font-size: 1.15rem;
  font-weight: 680;
}

.trade-plan-card p {
  margin: 6px 0 0;
  color: #91a8bf;
  font-size: 0.84rem;
  line-height: 1.5;
}

.trade-plan-levels {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}

.trade-plan-levels article {
  border: 1px solid rgba(103, 232, 249, 0.1);
  border-radius: 10px;
  padding: 10px;
  background: rgba(1, 7, 16, 0.4);
}

.risk-reward-line {
  position: relative;
  display: grid;
  grid-template-columns: 0.7fr 1.3fr;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(1, 7, 16, 0.74);
}

.risk-reward-line span {
  background: rgba(248, 113, 113, 0.52);
}

.risk-reward-line i {
  background: linear-gradient(90deg, rgba(103, 232, 249, 0.55), rgba(138, 243, 255, 0.72));
}

.risk-reward-line em {
  position: absolute;
  left: 35%;
  top: -4px;
  width: 2px;
  height: 16px;
  border-radius: 999px;
  background: #f7fdff;
  box-shadow: 0 0 12px rgba(138, 243, 255, 0.55);
}

.analysis-output-grid.compact article {
  min-height: 96px;
}

.aurex-native-select {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.aurex-select {
  position: relative;
  z-index: 20;
  min-width: 0;
}

.aurex-select-button {
  display: flex;
  width: 100%;
  min-height: 42px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid rgba(103, 232, 249, 0.18);
  border-radius: 10px;
  padding: 0 12px;
  color: #eaf8ff;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.012)),
    rgba(1, 7, 16, 0.72);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 10px 24px rgba(0, 0, 0, 0.16);
  font: inherit;
  font-size: 0.86rem;
  cursor: pointer;
}

.aurex-select-button::after {
  width: 8px;
  height: 8px;
  border-right: 1px solid #8af3ff;
  border-bottom: 1px solid #8af3ff;
  content: "";
  transform: rotate(45deg) translateY(-2px);
}

.aurex-select-list {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  z-index: 9999;
  display: none;
  width: 100%;
  max-height: 260px;
  overflow: auto;
  border: 1px solid rgba(103, 232, 249, 0.2);
  border-radius: 12px;
  padding: 6px;
  background:
    radial-gradient(circle at 100% 0%, rgba(103, 232, 249, 0.11), transparent 14rem),
    rgba(2, 8, 18, 0.98);
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.055);
  backdrop-filter: blur(18px);
}

.aurex-select.is-open {
  z-index: 10000;
}

.aurex-select.is-open .aurex-select-list {
  display: grid;
  gap: 4px;
}

.aurex-select-option {
  min-height: 36px;
  border: 0;
  border-radius: 8px;
  padding: 0 10px;
  color: #aebfd2;
  background: transparent;
  font: inherit;
  font-size: 0.84rem;
  text-align: left;
  cursor: pointer;
}

.aurex-select-option:hover,
.aurex-select-option[aria-selected="true"] {
  color: #f4fbff;
  background: rgba(103, 232, 249, 0.1);
}

.aurex-select:focus-visible .aurex-select-button,
.aurex-select-button:focus-visible {
  outline: 2px solid rgba(138, 243, 255, 0.72);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: no-preference) {
  .lesson-card,
  .featured-lesson-card,
  .continue-lesson-card,
  .learning-path-card,
  .trade-plan-card {
    transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease;
  }

  .lesson-card:hover,
  .featured-lesson-card:hover,
  .continue-lesson-card:hover,
  .trade-plan-card:hover {
    transform: translateY(-2px);
    border-color: rgba(103, 232, 249, 0.24);
  }
}

@media (max-width: 1180px) {
  .education-feature-grid,
  .education-lesson-grid,
  .chart-capture-grid {
    grid-template-columns: 1fr;
  }

  .analysis-workflow-steps,
  .trade-plan-levels {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .education-head,
  .education-controls,
  .analysis-workflow-steps,
  .trade-plan-levels {
    grid-template-columns: 1fr;
  }
}

/* Maximum premium Pro polish: simulators, eligibility, evidence, and value moments. */
.pro-premium-page .pro-section-head h2,
.pro-premium-page .pro-story-card h2,
.pro-premium-page .copy-eligibility-panel h2,
.pro-premium-page .verified-evidence-panel h2,
.pro-premium-page .pip-lot-simulator h2,
.pro-premium-page .rewards-moments-panel h2 {
  letter-spacing: 0;
  text-wrap: balance;
}

.pro-hero-premium {
  margin-bottom: 18px;
}

.hero-system-preview .system-orbit-preview {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.hero-system-preview .system-orbit-preview span {
  min-height: 86px;
  padding: 14px;
  border: 1px solid rgba(136, 218, 255, 0.14);
  border-radius: 16px;
  color: #f7fbff;
  background:
    radial-gradient(circle at 20% 0%, rgba(143, 238, 255, 0.12), transparent 60%),
    rgba(255, 255, 255, 0.04);
  font-size: 0.88rem;
  font-weight: 720;
}

.core-essentials,
.copy-eligibility-panel,
.verified-evidence-panel,
.pip-lot-simulator,
.rewards-moments-panel {
  position: relative;
  overflow: hidden;
  margin-top: 18px;
  padding: clamp(22px, 5vw, 42px);
  border: 1px solid rgba(144, 224, 255, 0.18);
  border-radius: 20px;
  background:
    radial-gradient(circle at 12% 0%, rgba(116, 207, 255, 0.12), transparent 34%),
    linear-gradient(145deg, rgba(9, 25, 48, 0.84), rgba(4, 12, 28, 0.95));
  box-shadow:
    0 34px 110px rgba(0, 0, 0, 0.34),
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    inset 0 -1px 0 rgba(116, 207, 255, 0.06);
  backdrop-filter: blur(28px) saturate(142%);
  -webkit-backdrop-filter: blur(28px) saturate(142%);
}

.essentials-flow {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr 1.2fr;
  gap: 10px;
  margin-top: 18px;
  align-items: stretch;
}

.essentials-flow article,
.eligibility-steps article,
.evidence-grid article,
.value-moments-grid span {
  border: 1px solid rgba(127, 216, 255, 0.12);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.04);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

.essentials-flow article {
  display: grid;
  gap: 9px;
  min-height: 170px;
  padding: 16px;
}

.essentials-flow span,
.eligibility-steps span,
.evidence-grid span,
.pip-summary-grid span,
.lot-results span,
.value-moments-grid span {
  color: rgba(166, 197, 229, 0.82);
  font-size: 0.72rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.essentials-flow strong,
.eligibility-steps strong,
.evidence-grid strong {
  color: #f7fbff;
}

.essentials-flow p,
.copy-eligibility-panel p,
.verified-evidence-panel p,
.pip-lot-simulator p,
.rewards-moments-panel p {
  margin: 0;
  color: rgba(207, 224, 244, 0.74);
  line-height: 1.55;
}

.copy-eligibility-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(340px, 1.18fr);
  gap: clamp(18px, 4vw, 34px);
  align-items: center;
}

.copy-eligibility-panel > div:first-child {
  display: grid;
  gap: 14px;
}

.eligibility-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.eligibility-steps article {
  display: grid;
  gap: 10px;
  min-height: 126px;
  padding: 16px;
}

.eligibility-steps span {
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border-radius: 11px;
  color: #03111b;
  background: linear-gradient(135deg, #9af2ff, #5caeff);
}

.evidence-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.evidence-grid article {
  display: grid;
  align-content: end;
  gap: 10px;
  min-height: 112px;
  padding: 15px;
}

.evidence-grid article:nth-child(1),
.evidence-grid article:nth-child(10) {
  grid-column: span 2;
}

.positive-text { color: #8df2c4 !important; }
.negative-text { color: #ff9aa7 !important; }

.pip-sim-layout {
  display: grid;
  grid-template-columns: minmax(280px, 0.75fr) minmax(0, 1.25fr);
  gap: clamp(18px, 4vw, 32px);
  margin-top: 18px;
}

.pip-input-panel {
  display: grid;
  gap: 12px;
  align-content: start;
}

.pip-input-panel label {
  display: grid;
  gap: 8px;
  color: rgba(220, 236, 255, 0.78);
  font-size: 0.82rem;
  font-weight: 700;
}

.pip-input-panel input,
.pip-input-panel select {
  min-height: 44px;
  border: 1px solid rgba(137, 216, 255, 0.2);
  border-radius: 12px;
  color: #f7fbff;
  background: rgba(3, 12, 25, 0.62);
}

.pip-output-panel {
  display: grid;
  gap: 12px;
}

.pip-summary-grid,
.lot-results {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.lot-results {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.pip-summary-grid article,
.lot-results article {
  display: grid;
  gap: 8px;
  min-height: 118px;
  padding: 16px;
  border: 1px solid rgba(127, 216, 255, 0.12);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.04);
}

.pip-summary-grid strong,
.lot-results strong {
  color: #f7fbff;
  font-size: clamp(1.2rem, 2.5vw, 1.7rem);
}

.lot-results small {
  color: rgba(207, 224, 244, 0.7);
  line-height: 1.4;
}

.pip-warning {
  padding: 12px 14px;
  border: 1px solid rgba(255, 154, 167, 0.24);
  border-radius: 14px;
  color: #ffd3d8;
  background: rgba(255, 91, 116, 0.08);
}

.simulator-safety-list {
  display: grid;
  gap: 8px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.simulator-safety-list li {
  padding-left: 18px;
  color: rgba(207, 224, 244, 0.72);
  background: linear-gradient(90deg, rgba(133, 230, 255, 0.75), rgba(133, 230, 255, 0.75)) 0 0.72em / 7px 1px no-repeat;
}

.rewards-moments-panel {
  display: grid;
  grid-template-columns: minmax(0, 0.72fr) minmax(0, 1.28fr);
  gap: clamp(18px, 4vw, 34px);
  align-items: center;
}

.value-moments-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.value-moments-grid span {
  display: grid;
  min-height: 78px;
  padding: 12px;
  place-items: center start;
  color: rgba(231, 243, 255, 0.86);
  text-transform: none;
  letter-spacing: 0;
}

@media (max-width: 980px) {
  .essentials-flow,
  .copy-eligibility-panel,
  .eligibility-steps,
  .evidence-grid,
  .pip-sim-layout,
  .pip-summary-grid,
  .lot-results,
  .rewards-moments-panel,
  .value-moments-grid {
    grid-template-columns: 1fr;
  }

  .evidence-grid article:nth-child(1),
  .evidence-grid article:nth-child(10) {
    grid-column: auto;
  }
}

@media (max-width: 640px) {
  .core-essentials,
  .copy-eligibility-panel,
  .verified-evidence-panel,
  .pip-lot-simulator,
  .rewards-moments-panel {
    padding: 20px;
    border-radius: 18px;
  }
}

/* Final Phase 1 AUREX Pro world-class polish. */
.aurex-pro-world {
  width: min(1240px, calc(100% - 32px));
  margin: 0 auto;
  padding: 22px 0 76px;
}

.aurex-pro-world h1,
.aurex-pro-world h2,
.aurex-pro-world h3 {
  letter-spacing: 0;
  text-wrap: balance;
}

.aurex-pro-world p {
  font-size: clamp(0.95rem, 1.4vw, 1.08rem);
}

.pro-cinematic-hero,
.aurex-essentials,
.cashback-centerpiece,
.trial-experience,
.carlos-stage,
.chart-strategy-stage,
.performance-dashboard,
.copy-trading-flow,
.verified-results-calculator,
.rewards-progression,
.activation-simple,
.final-trust-cta {
  position: relative;
  overflow: hidden;
  margin-top: 18px;
  border: 1px solid rgba(161, 229, 255, 0.2);
  border-radius: 22px;
  background:
    radial-gradient(circle at 12% 0%, rgba(148, 235, 255, 0.16), transparent 32%),
    radial-gradient(circle at 86% 14%, rgba(99, 112, 255, 0.08), transparent 36%),
    linear-gradient(145deg, rgba(9, 26, 52, 0.88), rgba(4, 12, 28, 0.96));
  box-shadow:
    0 38px 120px rgba(0, 0, 0, 0.38),
    0 0 0 1px rgba(111, 204, 255, 0.06),
    inset 0 1px 0 rgba(255, 255, 255, 0.11),
    inset 0 -1px 0 rgba(132, 226, 255, 0.06);
  backdrop-filter: blur(30px) saturate(145%);
  -webkit-backdrop-filter: blur(30px) saturate(145%);
}

.pro-cinematic-hero::before,
.cashback-centerpiece::before,
.final-trust-cta::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background: linear-gradient(115deg, transparent 18%, rgba(255, 255, 255, 0.075), transparent 42%);
  opacity: 0.58;
}

.pro-cinematic-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, 0.92fr);
  gap: clamp(22px, 5vw, 48px);
  align-items: center;
  min-height: 650px;
  padding: clamp(30px, 6vw, 72px);
}

.pro-cinematic-hero h1 {
  max-width: 820px;
  margin: 0;
  color: #f8fcff;
  font-size: clamp(3rem, 8vw, 6.8rem);
  line-height: 0.91;
  font-weight: 760;
}

.pro-cinematic-hero .pro-hero-copy > p:not(.eyebrow) {
  max-width: 650px;
  color: rgba(220, 236, 255, 0.78);
  font-size: clamp(1.04rem, 1.7vw, 1.22rem);
  line-height: 1.58;
}

.aurex-system-preview,
.hero-preview-grid article,
.essentials-rail article,
.carlos-conversation-preview,
.chart-evidence-preview,
.strategy-builder-preview,
.main-score,
.score-rail-grid,
.copy-flow-rail article,
.results-evidence-grid article,
.pip-calculator-panel,
.lot-outcome-row article,
.activation-steps article {
  border: 1px solid rgba(142, 224, 255, 0.14);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.025));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

.aurex-system-preview {
  position: relative;
  display: grid;
  gap: 16px;
  padding: 20px;
  border-radius: 20px;
}

.system-status-row,
.preview-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: rgba(208, 228, 250, 0.74);
  font-size: 0.84rem;
}

.system-status-row strong,
.preview-topline strong {
  color: #9df1ff;
}

.hero-preview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.hero-preview-grid article {
  min-height: 138px;
  padding: 16px;
  border-radius: 17px;
}

.hero-carlos-card {
  grid-column: 1 / -1;
}

.hero-preview-grid span,
.essentials-rail span,
.cashback-command span,
.tier-gauge span,
.trial-active-card span,
.carlos-conversation-preview span,
.chart-evidence-preview dt,
.performance-dashboard span,
.results-evidence-grid span,
.net-pip-display span,
.lot-outcome-row span,
.loyalty-progress span {
  color: rgba(169, 200, 232, 0.84);
  font-size: 0.72rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.hero-preview-grid strong,
.hero-preview-grid p,
.trial-active-card h3,
.carlos-conversation-preview p,
.main-score strong,
.net-pip-display strong {
  color: #f8fcff;
}

.hero-preview-grid strong {
  display: block;
  margin: 10px 0 8px;
  font-size: clamp(1.4rem, 3vw, 2.1rem);
}

.hero-preview-grid i,
.score-rail-grid i,
.next-tier-progress i,
.loyalty-progress i {
  display: block;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(134, 209, 255, 0.12);
}

.hero-preview-grid b,
.score-rail-grid b,
.next-tier-progress b,
.loyalty-progress b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #4fa8ff, #9df1ff);
  transition: width 150ms ease;
}

.aurex-essentials,
.trial-experience,
.performance-dashboard,
.activation-simple,
.rewards-progression {
  padding: clamp(24px, 5vw, 44px);
}

.essentials-rail {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin-top: 20px;
}

.essentials-rail::before {
  position: absolute;
  top: 50%;
  right: 8%;
  left: 8%;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(147, 242, 255, 0.55), transparent);
}

.essentials-rail article {
  position: relative;
  display: grid;
  gap: 8px;
  min-height: 132px;
  padding: 16px;
  border-radius: 18px;
}

.essentials-rail strong {
  color: #f8fcff;
  font-size: 1.1rem;
}

.cashback-centerpiece {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(320px, 1.05fr);
  gap: clamp(22px, 5vw, 44px);
  align-items: center;
  padding: clamp(26px, 6vw, 54px);
}

.cashback-command h2,
.trial-copy h2,
.carlos-stage h2,
.chart-strategy-stage h2,
.performance-dashboard h2,
.copy-trading-flow h2,
.results-panel h2,
.pip-calculator-panel h2,
.rewards-progression h2,
.activation-simple h2,
.final-trust-cta h2 {
  margin: 0;
  color: #f8fcff;
  font-size: clamp(1.85rem, 4.6vw, 3.8rem);
  line-height: 1;
}

.cashback-amount-block {
  display: grid;
  gap: 8px;
  margin: 22px 0;
}

.cashback-amount-block strong {
  color: #f8fcff;
  font-size: clamp(3.4rem, 10vw, 7.2rem);
  line-height: 0.9;
  font-variant-numeric: tabular-nums;
}

.cashback-toggle {
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  border: 1px solid rgba(142, 224, 255, 0.16);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
}

.cashback-toggle button,
.trial-path button {
  border: 0;
  color: rgba(218, 235, 255, 0.76);
  background: transparent;
  cursor: pointer;
}

.cashback-toggle button {
  min-height: 34px;
  padding: 0 14px;
  border-radius: 999px;
}

.cashback-toggle button.is-active,
.trial-path button.is-active {
  color: #04111f;
  background: linear-gradient(135deg, #9df1ff, #63afff);
}

.cashback-controls {
  display: grid;
  gap: 15px;
}

.tier-gauge {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.tier-gauge div,
.next-tier-progress {
  padding: 14px;
  border: 1px solid rgba(142, 224, 255, 0.13);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.04);
}

.tier-gauge strong,
.next-tier-progress small {
  display: block;
  margin-top: 8px;
  color: #f8fcff;
}

.trial-experience {
  display: grid;
  grid-template-columns: minmax(0, 0.74fr) minmax(300px, 0.7fr) minmax(320px, 1fr);
  gap: 18px;
  align-items: stretch;
}

.trial-path {
  display: grid;
  gap: 8px;
}

.trial-path button {
  min-height: 46px;
  border: 1px solid rgba(142, 224, 255, 0.13);
  border-radius: 14px;
  text-align: left;
  padding: 0 14px;
  background: rgba(255, 255, 255, 0.04);
}

.trial-active-card {
  display: grid;
  align-content: center;
  gap: 12px;
  min-height: 260px;
  padding: 24px;
  border: 1px solid rgba(142, 224, 255, 0.16);
  border-radius: 18px;
  background: radial-gradient(circle at 20% 0%, rgba(154, 242, 255, 0.11), transparent 50%), rgba(255, 255, 255, 0.04);
}

.carlos-stage,
.chart-strategy-stage,
.copy-trading-flow,
.verified-results-calculator,
.final-trust-cta {
  display: grid;
  grid-template-columns: minmax(0, 0.86fr) minmax(320px, 1.14fr);
  gap: clamp(20px, 5vw, 42px);
  align-items: center;
  padding: clamp(26px, 6vw, 52px);
}

.carlos-stage p,
.copy-trading-flow p,
.results-panel p,
.pip-calculator-panel p,
.rewards-progression p,
.final-trust-cta li {
  color: rgba(214, 232, 252, 0.75);
  line-height: 1.56;
}

.carlos-conversation-preview {
  display: grid;
  gap: 16px;
  padding: 22px;
  border-radius: 20px;
}

.carlos-conversation-preview p {
  font-size: clamp(1.18rem, 2.7vw, 1.7rem);
}

.context-chip-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.context-chip-row b,
.copy-flow-rail article,
.loyalty-track span {
  padding: 8px 10px;
  border: 1px solid rgba(142, 224, 255, 0.13);
  border-radius: 999px;
  color: rgba(226, 241, 255, 0.82);
  background: rgba(255, 255, 255, 0.04);
  font-size: 0.8rem;
}

.carlos-conversation-preview button {
  justify-self: start;
  min-height: 38px;
  border: 1px solid rgba(143, 241, 255, 0.22);
  border-radius: 999px;
  color: #eaffff;
  background: rgba(255, 255, 255, 0.05);
}

.chart-evidence-preview,
.strategy-builder-preview {
  min-height: 420px;
  padding: 24px;
  border-radius: 20px;
}

.chart-evidence-preview dl {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 20px 0 0;
}

.chart-evidence-preview div {
  padding: 12px;
  border: 1px solid rgba(142, 224, 255, 0.11);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.035);
}

.chart-evidence-preview dd {
  margin: 6px 0 0;
  color: #f8fcff;
}

.strategy-score-ring {
  display: grid;
  width: 160px;
  height: 160px;
  margin: 22px 0;
  place-items: center;
  border: 1px solid rgba(151, 232, 255, 0.25);
  border-radius: 50%;
  background: conic-gradient(from 180deg, #9df1ff 0 82%, rgba(255,255,255,0.08) 82% 100%);
  box-shadow: 0 18px 58px rgba(68, 176, 255, 0.16);
}

.strategy-score-ring strong {
  color: #03111b;
  font-size: 2rem;
}

.performance-score-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.45fr) minmax(0, 1fr);
  gap: 18px;
  margin-top: 18px;
}

.main-score {
  display: grid;
  place-items: center;
  min-height: 280px;
  border-radius: 20px;
}

.main-score strong {
  font-size: clamp(4rem, 10vw, 7rem);
  line-height: 1;
}

.score-rail-grid {
  display: grid;
  gap: 14px;
  padding: 18px;
  border-radius: 20px;
}

.score-rail-grid label {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr) 82px;
  gap: 12px;
  align-items: center;
  color: rgba(226, 241, 255, 0.82);
}

.copy-flow-rail {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 9px;
}

.copy-flow-rail article {
  display: grid;
  min-height: 92px;
  place-items: center;
  text-align: center;
  border-radius: 16px;
  white-space: normal;
}

.verified-results-calculator {
  align-items: stretch;
}

.results-evidence-grid,
.lot-outcome-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.results-evidence-grid article,
.lot-outcome-row article {
  display: grid;
  gap: 8px;
  min-height: 112px;
  padding: 14px;
  border-radius: 16px;
}

.results-evidence-grid strong,
.lot-outcome-row strong,
.net-pip-display strong {
  color: #f8fcff;
  font-variant-numeric: tabular-nums;
}

.pip-calculator-panel {
  padding: 22px;
  border-radius: 20px;
}

.pip-input-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

.pip-input-panel label {
  display: grid;
  gap: 7px;
  color: rgba(220, 236, 255, 0.78);
  font-size: 0.84rem;
}

.pip-input-panel input,
.pip-input-panel select {
  min-height: 42px;
  border: 1px solid rgba(142, 224, 255, 0.16);
  border-radius: 12px;
  color: #f8fcff;
  background: rgba(3, 12, 25, 0.62);
}

.net-pip-display {
  display: grid;
  gap: 4px;
  margin: 18px 0 12px;
}

.net-pip-display strong {
  font-size: clamp(2.4rem, 6vw, 4rem);
}

.pip-warning {
  margin-top: 12px;
  padding: 12px 14px;
  border: 1px solid rgba(255, 190, 118, 0.25);
  border-radius: 14px;
  color: #ffe1b8;
  background: rgba(255, 176, 77, 0.08);
}

.positive-text { color: #8df2c4 !important; }
.negative-text { color: #ff9aa7 !important; }

.rewards-progression {
  display: grid;
  gap: 18px;
}

.loyalty-track {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
}

.loyalty-track::before {
  position: absolute;
  top: 50%;
  right: 6%;
  left: 6%;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, rgba(143, 241, 255, 0.7), rgba(101, 112, 255, 0.24));
}

.loyalty-track span {
  position: relative;
  display: grid;
  min-height: 58px;
  place-items: center;
  border-radius: 14px;
  text-align: center;
}

.loyalty-track .is-active {
  color: #03111b;
  background: linear-gradient(135deg, #9df1ff, #63afff);
}

.loyalty-progress {
  display: grid;
  gap: 10px;
  max-width: 620px;
}

.activation-steps {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-top: 18px;
}

.activation-steps article {
  display: grid;
  gap: 8px;
  min-height: 150px;
  padding: 16px;
  border-radius: 16px;
}

.activation-steps span {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border-radius: 10px;
  color: #03111b;
  background: linear-gradient(135deg, #9df1ff, #63afff);
}

.final-trust-cta {
  align-items: center;
}

.final-trust-cta ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.final-trust-cta li {
  padding-left: 18px;
  background: linear-gradient(90deg, rgba(143, 241, 255, 0.78), rgba(143, 241, 255, 0.78)) 0 0.72em / 7px 1px no-repeat;
}

@media (prefers-reduced-motion: reduce) {
  .aurex-pro-world *,
  .aurex-pro-world *::before,
  .aurex-pro-world *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
    animation-duration: 0.001ms !important;
  }
}

@media (max-width: 1080px) {
  .pro-cinematic-hero,
  .cashback-centerpiece,
  .trial-experience,
  .carlos-stage,
  .chart-strategy-stage,
  .copy-trading-flow,
  .verified-results-calculator,
  .final-trust-cta,
  .performance-score-layout {
    grid-template-columns: 1fr;
  }

  .essentials-rail,
  .copy-flow-rail,
  .loyalty-track,
  .activation-steps {
    grid-template-columns: 1fr;
  }

  .essentials-rail::before,
  .loyalty-track::before {
    display: none;
  }
}

@media (max-width: 720px) {
  .aurex-pro-world {
    width: min(100% - 24px, 1240px);
    padding-top: 14px;
  }

  .pro-cinematic-hero,
  .cashback-centerpiece,
  .trial-experience,
  .carlos-stage,
  .chart-strategy-stage,
  .performance-dashboard,
  .copy-trading-flow,
  .verified-results-calculator,
  .rewards-progression,
  .activation-simple,
  .final-trust-cta {
    padding: 20px;
    border-radius: 18px;
  }

  .hero-preview-grid,
  .tier-gauge,
  .chart-evidence-preview dl,
  .results-evidence-grid,
  .lot-outcome-row,
  .pip-input-panel {
    grid-template-columns: 1fr;
  }

  .score-rail-grid label {
    grid-template-columns: 1fr;
  }

  .cashback-amount-block strong {
    font-size: clamp(3rem, 18vw, 5rem);
  }

  .pro-cta-row .primary-button,
  .pro-cta-row .secondary-button {
    width: 100%;
    justify-content: center;
  }
}

/* Cinematic AUREX Pro conversion experience. */
.pro-cinema {
  --cinema-bg: #020a15;
  --cinema-panel: rgba(9, 24, 45, 0.58);
  --cinema-panel-strong: rgba(11, 31, 58, 0.74);
  --cinema-line: rgba(145, 225, 255, 0.2);
  --cinema-text: #f6fbff;
  --cinema-muted: rgba(215, 232, 250, 0.72);
  --cinema-cyan: #8cecff;
  --cinema-blue: #4b8dff;
  --cinema-violet: #7c7dff;
  --cinema-emerald: #82f4bd;
  --cinema-amber: #ffd28a;
  --cinema-red: #ff8da0;
  position: relative;
  isolation: isolate;
  color: var(--cinema-text);
}

.pro-cinema::before {
  position: fixed;
  inset: 0;
  z-index: -2;
  content: "";
  background:
    radial-gradient(circle at 18% 8%, rgba(73, 153, 255, 0.18), transparent 31%),
    radial-gradient(circle at 82% 2%, rgba(124, 125, 255, 0.14), transparent 28%),
    linear-gradient(180deg, #020915 0%, #03101f 48%, #020713 100%);
}

.pro-cinema::after {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  content: "";
  opacity: 0.34;
  background-image:
    linear-gradient(rgba(140, 236, 255, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(140, 236, 255, 0.05) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: radial-gradient(circle at 50% 14%, #000 0%, transparent 72%);
}

.pro-cinema h1,
.pro-cinema h2,
.pro-cinema h3 {
  max-width: 860px;
  letter-spacing: 0;
  line-height: 1.03;
}

.pro-cinema h1 {
  font-size: clamp(2.9rem, 7vw, 5.8rem);
  font-weight: 680;
}

.pro-cinema h2 {
  font-size: clamp(1.75rem, 3.4vw, 3.15rem);
  font-weight: 640;
}

.pro-cinema h3 {
  font-size: clamp(1.15rem, 2vw, 1.7rem);
  font-weight: 640;
}

.pro-cinema p,
.pro-cinema small,
.pro-cinema span,
.pro-cinema li,
.pro-cinema dd {
  line-height: 1.6;
}

.cinema-hero,
.essentials-scene,
.market-visual-scene,
.cashback-cinema,
.trial-cinema,
.connected-services,
.copy-trading-cinema,
.verified-results-cinema,
.rewards-cinema,
.activation-cinema,
.final-cinema-cta {
  position: relative;
  overflow: hidden;
  margin-top: 22px;
  border: 1px solid var(--cinema-line);
  border-radius: 28px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.075), rgba(255, 255, 255, 0.018)),
    var(--cinema-panel);
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(28px);
}

.cinema-hero::before,
.cashback-cinema::before,
.connected-services::before,
.final-cinema-cta::before {
  position: absolute;
  inset: -1px;
  pointer-events: none;
  content: "";
  background: linear-gradient(105deg, transparent 0%, rgba(140, 236, 255, 0.11) 42%, transparent 62%);
  transform: translateX(-35%);
  animation: aurexLightSweep 8s ease-in-out infinite;
}

.cinema-hero {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(420px, 1.08fr);
  gap: clamp(24px, 4vw, 54px);
  min-height: min(760px, calc(100vh - 84px));
  align-items: center;
  padding: clamp(28px, 5vw, 74px);
}

.cinema-copy {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 20px;
}

.cinema-copy > p:not(.eyebrow) {
  max-width: 620px;
  color: var(--cinema-muted);
  font-size: clamp(1rem, 1.5vw, 1.17rem);
}

.trust-microcopy,
.demo-disclaimer {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  color: rgba(220, 238, 255, 0.72);
  font-size: 0.85rem;
}

.trust-microcopy span,
.demo-disclaimer {
  border: 1px solid rgba(140, 236, 255, 0.14);
  border-radius: 999px;
  padding: 8px 11px;
  background: rgba(140, 236, 255, 0.055);
}

.command-preview {
  position: relative;
  display: grid;
  gap: 16px;
  min-height: 560px;
  padding: 24px;
  border: 1px solid rgba(140, 236, 255, 0.22);
  border-radius: 26px;
  background:
    radial-gradient(circle at 70% 14%, rgba(140, 236, 255, 0.14), transparent 30%),
    linear-gradient(150deg, rgba(10, 31, 58, 0.84), rgba(5, 14, 29, 0.68));
  box-shadow: 0 22px 72px rgba(2, 9, 18, 0.54), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.command-chart-bg {
  position: absolute;
  inset: 16px;
  opacity: 0.62;
  pointer-events: none;
}

.command-chart-bg svg {
  width: 100%;
  height: 100%;
}

.chart-area { fill: url(#heroArea); }
.chart-line {
  fill: none;
  stroke: url(#heroLine);
  stroke-width: 4;
  stroke-linecap: round;
  stroke-dasharray: 740;
  stroke-dashoffset: 740;
  animation: chartDraw 1.2s ease-out forwards;
}

.chart-zone {
  stroke-width: 1.4;
  stroke-dasharray: 7 8;
}

.chart-zone.resistance { stroke: rgba(255, 210, 138, 0.45); }
.chart-zone.support { stroke: rgba(130, 244, 189, 0.38); }

.command-status-row,
.carlos-insight,
.hero-metrics,
.command-rails,
.command-preview .demo-disclaimer {
  position: relative;
  z-index: 1;
}

.command-status-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  color: var(--cinema-muted);
  font-size: 0.88rem;
}

.command-status-row strong {
  color: var(--cinema-cyan);
}

.carlos-insight {
  margin-top: 146px;
  padding: 18px;
  border: 1px solid rgba(140, 236, 255, 0.16);
  border-radius: 20px;
  background: rgba(4, 15, 30, 0.6);
}

.carlos-insight span,
.hero-metrics span,
.command-rails span,
.tier-console span,
.formula-console span,
.result-ledger span {
  color: rgba(211, 232, 252, 0.68);
  font-size: 0.78rem;
}

.carlos-insight p {
  margin: 8px 0 0;
  color: #eff9ff;
}

.hero-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.hero-metrics article,
.tier-console article,
.result-ledger article,
.activation-steps article,
.service-scene {
  border: 1px solid rgba(140, 236, 255, 0.13);
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.018));
}

.hero-metrics article {
  display: grid;
  gap: 5px;
  min-height: 106px;
  padding: 14px;
}

.hero-metrics strong {
  color: var(--cinema-text);
  font-size: clamp(1.7rem, 4vw, 3rem);
  font-variant-numeric: tabular-nums;
}

.command-rails,
.coach-lines {
  display: grid;
  gap: 11px;
}

.command-rails label,
.coach-lines label {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  color: rgba(230, 243, 255, 0.82);
  font-size: 0.86rem;
}

.command-rails i,
.coach-lines i,
.tier-progress i,
.loyalty-progress i {
  overflow: hidden;
  height: 7px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
}

.command-rails b,
.coach-lines b,
.tier-progress b,
.loyalty-progress b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--cinema-cyan), var(--cinema-blue));
  transition: width 160ms ease;
}

.coach-lines b.danger {
  background: linear-gradient(90deg, var(--cinema-amber), var(--cinema-red));
}

.essentials-scene,
.connected-services,
.rewards-cinema,
.activation-cinema {
  padding: clamp(24px, 4vw, 44px);
}

.essentials-flow,
.service-flow-line {
  position: relative;
  display: grid;
  gap: 10px;
  margin-top: 22px;
}

.essentials-flow {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.essentials-flow::before,
.service-flow-line::before {
  position: absolute;
  top: 50%;
  right: 4%;
  left: 4%;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(140, 236, 255, 0.48), transparent);
}

.essentials-flow article,
.service-flow-line span {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 8px;
  min-height: 126px;
  padding: 16px;
  border: 1px solid rgba(140, 236, 255, 0.14);
  border-radius: 18px;
  background: rgba(4, 14, 29, 0.68);
}

.essentials-flow article span {
  color: var(--cinema-cyan);
  font-size: 0.76rem;
}

.essentials-flow article small {
  color: var(--cinema-muted);
}

.market-visual-scene,
.cashback-cinema,
.trial-cinema,
.copy-trading-cinema,
.verified-results-cinema,
.final-cinema-cta {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(420px, 1.18fr);
  gap: clamp(20px, 4vw, 42px);
  align-items: center;
  padding: clamp(24px, 4vw, 48px);
}

.scene-copy {
  display: grid;
  gap: 14px;
}

.scene-copy p:not(.eyebrow),
.pro-section-head p:not(.eyebrow) {
  max-width: 610px;
  color: var(--cinema-muted);
}

.market-stage,
.formula-console,
.copy-eligibility-panel,
.results-chart-panel,
.cinema-pip,
.trial-screen {
  border: 1px solid rgba(140, 236, 255, 0.15);
  border-radius: 24px;
  background: rgba(4, 14, 29, 0.58);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.09);
}

.market-stage {
  padding: 14px;
}

.market-demo-chart,
.transparent-performance-chart {
  display: block;
  width: 100%;
  height: auto;
}

.market-demo-chart .chart-grid {
  fill: rgba(2, 9, 18, 0.42);
  stroke: rgba(140, 236, 255, 0.14);
}

.market-demo-chart .zone.gain { fill: url(#gainFill); }
.market-demo-chart .zone.loss { fill: url(#lossFill); }
.market-demo-chart .level {
  stroke-width: 1.3;
  stroke-dasharray: 8 7;
}
.market-demo-chart .resistance { stroke: rgba(255, 210, 138, 0.6); }
.market-demo-chart .liquidity { stroke: rgba(140, 236, 255, 0.52); }
.market-demo-chart .support { stroke: rgba(130, 244, 189, 0.5); }
.market-demo-chart .invalidation { stroke: rgba(255, 141, 160, 0.55); }
.market-demo-chart .candles {
  fill: rgba(140, 236, 255, 0.18);
  stroke: rgba(216, 246, 255, 0.72);
  stroke-width: 2;
}
.market-demo-chart .structure-line {
  fill: none;
  stroke: var(--cinema-cyan);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-dasharray: 820;
  stroke-dashoffset: 820;
  animation: chartDraw 1.4s ease-out forwards;
}
.market-demo-chart .entry-marker {
  fill: var(--cinema-cyan);
  filter: drop-shadow(0 0 14px rgba(140, 236, 255, 0.7));
}
.market-demo-chart text,
.transparent-performance-chart text {
  fill: rgba(226, 241, 255, 0.72);
  font-size: 13px;
}

.cashback-story,
.formula-console {
  position: relative;
  z-index: 1;
}

.cashback-main-number {
  display: grid;
  gap: 6px;
  margin: 22px 0;
}

.cashback-main-number strong {
  font-size: clamp(3rem, 7vw, 6rem);
  font-variant-numeric: tabular-nums;
  line-height: 0.95;
}

.formula-console {
  display: grid;
  gap: 17px;
  padding: 22px;
}

.formula-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
  gap: 10px;
  align-items: center;
}

.formula-line strong {
  min-height: 70px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(140, 236, 255, 0.14);
  border-radius: 16px;
  color: #f9fdff;
  background: rgba(255, 255, 255, 0.045);
  font-size: clamp(1rem, 1.8vw, 1.35rem);
  font-variant-numeric: tabular-nums;
}

.cinema-slider,
.lots-number-control,
.pip-input-panel label {
  color: var(--cinema-muted);
}

.cinema-slider {
  display: grid;
  gap: 10px;
}

.cinema-slider input[type="range"] {
  width: 100%;
  accent-color: var(--cinema-cyan);
}

.tier-console {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.tier-console article {
  display: grid;
  gap: 6px;
  padding: 14px;
}

.tier-console strong,
.result-ledger strong,
.lot-outcome-row strong,
.net-pip-display strong {
  font-variant-numeric: tabular-nums;
}

.tier-progress {
  display: grid;
  gap: 8px;
}

.trial-cinema {
  grid-template-columns: minmax(0, 0.9fr) minmax(360px, 1.1fr);
}

.trial-rail {
  display: grid;
  gap: 18px;
}

.trial-path {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.trial-path button,
.cashback-toggle button {
  min-height: 42px;
  border: 1px solid rgba(140, 236, 255, 0.16);
  border-radius: 999px;
  color: rgba(230, 243, 255, 0.78);
  background: rgba(255, 255, 255, 0.045);
}

.trial-path button.is-active,
.cashback-toggle button.is-active {
  color: #03111b;
  background: linear-gradient(135deg, var(--cinema-cyan), #6aa7ff);
  box-shadow: 0 12px 30px rgba(77, 166, 255, 0.18);
}

.trial-screen {
  min-height: 280px;
  padding: 26px;
}

.trial-screen > span {
  color: var(--cinema-cyan);
}

.trial-preview-lines {
  display: grid;
  gap: 14px;
  margin-top: 28px;
}

.trial-preview-lines i {
  display: block;
  height: 12px;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(140, 236, 255, 0.72), rgba(106, 125, 255, 0.14));
}

.service-flow-line {
  grid-template-columns: repeat(6, minmax(0, 1fr));
}

.service-flow-line span {
  min-height: 78px;
  place-items: center;
  text-align: center;
  color: rgba(235, 247, 255, 0.82);
}

.service-scenes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-top: 18px;
}

.service-scene {
  display: grid;
  gap: 12px;
  min-height: 310px;
  padding: 18px;
}

.chat-preview {
  display: grid;
  gap: 10px;
}

.chat-preview p {
  margin: 0;
  padding: 12px;
  border: 1px solid rgba(140, 236, 255, 0.12);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.04);
}

.scene-note,
.warning-text,
.strategy-scene .warning {
  color: var(--cinema-amber);
}

.mini-evidence-chart {
  position: relative;
  min-height: 92px;
  border-radius: 16px;
  background:
    linear-gradient(rgba(140, 236, 255, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(140, 236, 255, 0.07) 1px, transparent 1px);
  background-size: 24px 24px;
}

.mini-evidence-chart i {
  position: absolute;
  right: 10%;
  bottom: 26%;
  left: 8%;
  height: 3px;
  border-radius: 99px;
  background: linear-gradient(90deg, var(--cinema-blue), var(--cinema-cyan));
  transform: rotate(-10deg);
}

.mini-evidence-chart b,
.mini-evidence-chart span {
  position: absolute;
  right: 15%;
  left: 15%;
  height: 1px;
  border-top: 1px dashed rgba(255, 210, 138, 0.5);
}

.mini-evidence-chart b { top: 26%; }
.mini-evidence-chart span { bottom: 18%; border-color: rgba(255, 141, 160, 0.5); }

.chart-scene dl {
  display: grid;
  gap: 8px;
  margin: 0;
}

.chart-scene dl div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  padding-bottom: 6px;
}

.chart-scene dt {
  color: var(--cinema-muted);
}

.segmented-gauge {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 5px;
}

.segmented-gauge span {
  height: 42px;
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(140, 236, 255, 0.78), rgba(75, 141, 255, 0.2));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

.segmented-gauge span:nth-last-child(-n+2) {
  background: rgba(255, 255, 255, 0.08);
}

.strategy-scene > strong {
  color: var(--cinema-cyan);
  font-size: 2.4rem;
}

.strategy-scene ul,
.final-cinema-cta ul {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.strategy-scene li,
.final-cinema-cta li {
  padding-left: 18px;
  background: linear-gradient(90deg, rgba(140, 236, 255, 0.72), rgba(140, 236, 255, 0.72)) 0 0.72em / 7px 1px no-repeat;
}

.copy-eligibility-panel {
  display: grid;
  gap: 18px;
  padding: 18px;
}

.transparent-performance-chart .loss-fill {
  fill: rgba(255, 141, 160, 0.12);
}

.transparent-performance-chart .performance-line {
  fill: none;
  stroke: var(--cinema-cyan);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-dasharray: 520;
  stroke-dashoffset: 520;
  animation: chartDraw 1.25s ease-out forwards;
}

.transparent-performance-chart line {
  stroke: rgba(255, 255, 255, 0.14);
  stroke-dasharray: 7 7;
}

.verified-results-cinema {
  align-items: stretch;
}

.results-chart-panel,
.cinema-pip {
  display: grid;
  gap: 16px;
  padding: 22px;
}

.monthly-bars {
  position: relative;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
  align-items: center;
  min-height: 240px;
  border: 1px solid rgba(140, 236, 255, 0.12);
  border-radius: 20px;
  padding: 18px;
  background:
    linear-gradient(rgba(140, 236, 255, 0.06) 1px, transparent 1px),
    rgba(255, 255, 255, 0.025);
  background-size: 100% 48px;
}

.monthly-bars::before {
  position: absolute;
  top: 50%;
  right: 18px;
  left: 18px;
  height: 1px;
  content: "";
  background: rgba(255, 255, 255, 0.18);
}

.monthly-bars span {
  position: relative;
  align-self: center;
  height: var(--h);
  min-height: 20px;
  border-radius: 999px 999px 8px 8px;
  background: linear-gradient(180deg, var(--cinema-emerald), rgba(130, 244, 189, 0.22));
  transform-origin: center bottom;
  animation: barGrow 760ms ease-out both;
}

.monthly-bars span.is-negative {
  border-radius: 8px 8px 999px 999px;
  background: linear-gradient(180deg, rgba(255, 141, 160, 0.25), var(--cinema-red));
  transform-origin: center top;
}

.monthly-bars span::after {
  position: absolute;
  right: 0;
  bottom: -28px;
  left: 0;
  content: attr(data-label);
  text-align: center;
  color: rgba(220, 238, 255, 0.58);
  font-size: 0.75rem;
}

.result-ledger {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.result-ledger article {
  display: grid;
  gap: 5px;
  padding: 13px;
}

.rewards-cinema {
  display: grid;
  gap: 18px;
}

.loyalty-track.cinematic span {
  min-height: 68px;
}

.activation-cinema .activation-steps {
  margin-top: 20px;
}

.final-cinema-cta {
  align-items: center;
}

.positive-text { color: var(--cinema-emerald) !important; }
.negative-text { color: var(--cinema-red) !important; }

@keyframes chartDraw {
  to { stroke-dashoffset: 0; }
}

@keyframes barGrow {
  from { transform: scaleY(0.1); opacity: 0.35; }
  to { transform: scaleY(1); opacity: 1; }
}

@keyframes aurexLightSweep {
  0%, 100% { transform: translateX(-42%); opacity: 0; }
  35%, 55% { opacity: 1; }
  85% { transform: translateX(42%); opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .pro-cinema *,
  .pro-cinema *::before,
  .pro-cinema *::after {
    animation-duration: 0.001ms !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}

@media (max-width: 1180px) {
  .cinema-hero,
  .market-visual-scene,
  .cashback-cinema,
  .trial-cinema,
  .copy-trading-cinema,
  .verified-results-cinema,
  .final-cinema-cta {
    grid-template-columns: 1fr;
  }

  .command-preview {
    min-height: 500px;
  }

  .service-scenes {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .essentials-flow,
  .service-flow-line,
  .copy-flow-rail {
    grid-template-columns: 1fr;
  }

  .essentials-flow::before,
  .service-flow-line::before {
    display: none;
  }
}

@media (max-width: 760px) {
  .cinema-hero,
  .essentials-scene,
  .market-visual-scene,
  .cashback-cinema,
  .trial-cinema,
  .connected-services,
  .copy-trading-cinema,
  .verified-results-cinema,
  .rewards-cinema,
  .activation-cinema,
  .final-cinema-cta {
    border-radius: 20px;
    padding: 20px;
  }

  .pro-cinema h1 {
    font-size: clamp(2.45rem, 13vw, 3.45rem);
  }

  .command-preview {
    min-height: 0;
    padding: 18px;
  }

  .command-chart-bg {
    position: relative;
    inset: auto;
    min-height: 190px;
  }

  .carlos-insight {
    margin-top: 0;
  }

  .hero-metrics,
  .tier-console,
  .service-scenes,
  .result-ledger,
  .lot-outcome-row,
  .pip-input-panel,
  .activation-steps,
  .formula-line {
    grid-template-columns: 1fr;
  }

  .command-rails label,
  .coach-lines label {
    grid-template-columns: 1fr;
  }

  .monthly-bars {
    gap: 8px;
    min-height: 200px;
    padding: 14px;
  }

  .cashback-main-number strong {
    font-size: clamp(2.7rem, 15vw, 4rem);
  }
}

/* ============================================================
   AUREX Pro cinematic experience — v2 design system.
   Scoped to .pro-cinema (pro-rewards page only).
   Semantic accents: cyan = intelligence, blue = system flow,
   violet = advanced tools, emerald = positive, amber = review,
   red = losses. Sharper square glass, luminous connecting rails.
   ============================================================ */
.pro-cinema {
  --ax-panel: rgba(9, 21, 39, 0.55);
  --ax-panel-deep: rgba(6, 15, 30, 0.74);
  --ax-line: rgba(148, 196, 240, 0.14);
  --ax-line-strong: rgba(150, 214, 252, 0.3);
  --ax-text: #eef5fd;
  --ax-muted: rgba(199, 216, 236, 0.75);
  --ax-faint: rgba(168, 190, 216, 0.56);
  --ax-cyan: #7fd8f7;
  --ax-blue: #5f8dff;
  --ax-violet: #a08dff;
  --ax-emerald: #62d9a5;
  --ax-amber: #eec488;
  --ax-red: #ec8299;
  --ax-radius: 16px;
  --ax-radius-sm: 10px;
  position: relative;
  isolation: isolate;
  color: var(--ax-text);
}

.pro-cinema::before {
  position: fixed;
  inset: 0;
  z-index: -2;
  content: "";
  background:
    radial-gradient(circle at 16% 6%, rgba(64, 120, 220, 0.16), transparent 34%),
    radial-gradient(circle at 84% 0%, rgba(120, 110, 255, 0.1), transparent 30%),
    linear-gradient(180deg, #030b18 0%, #041020 46%, #02070f 100%);
}

.pro-cinema::after {
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  content: "";
  opacity: 0.3;
  background-image:
    linear-gradient(rgba(127, 216, 247, 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(127, 216, 247, 0.04) 1px, transparent 1px);
  background-size: 88px 88px;
  -webkit-mask-image: radial-gradient(circle at 50% 10%, #000 0%, transparent 68%);
  mask-image: radial-gradient(circle at 50% 10%, #000 0%, transparent 68%);
}

/* ---------- Editorial type scale ---------- */
.pro-cinema h1 {
  max-width: 640px;
  margin: 0;
  font-size: clamp(2.1rem, 1.2rem + 2.6vw, 3.4rem);
  font-weight: 650;
  letter-spacing: -0.015em;
  line-height: 1.08;
}

.pro-cinema h2 {
  max-width: 760px;
  margin: 0;
  font-size: clamp(1.55rem, 1.1rem + 1.7vw, 2.35rem);
  font-weight: 630;
  letter-spacing: -0.012em;
  line-height: 1.16;
}

.pro-cinema h3 {
  margin: 0;
  font-size: clamp(1.05rem, 0.95rem + 0.5vw, 1.3rem);
  font-weight: 630;
  line-height: 1.25;
}

.pro-cinema p,
.pro-cinema li,
.pro-cinema dd {
  line-height: 1.6;
}

.pro-cinema .eyebrow {
  margin: 0;
  color: var(--ax-cyan);
  font-size: 0.74rem;
  font-weight: 650;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.pro-cinema .ax-lede {
  max-width: 56ch;
  margin: 0;
  color: var(--ax-muted);
  font-size: clamp(0.98rem, 0.9rem + 0.3vw, 1.08rem);
  line-height: 1.65;
}

.ax-label {
  color: var(--ax-faint);
  font-size: 0.72rem;
  font-weight: 620;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.ax-quiet-note {
  margin: 0;
  color: var(--ax-faint);
  font-size: 0.82rem;
  line-height: 1.55;
}

.ax-demo-note {
  margin: 0;
  color: var(--ax-faint);
  font-size: 0.76rem;
  letter-spacing: 0.02em;
}

.ax-amber { color: var(--ax-amber); }
.ax-emerald { color: var(--ax-emerald); }
.ax-red { color: var(--ax-red); }
.pro-cinema .positive-text { color: var(--ax-emerald) !important; }
.pro-cinema .negative-text { color: var(--ax-red) !important; }
.pro-cinema .warning-text { color: var(--ax-amber); }

.pro-cinema .primary-button,
.pro-cinema .secondary-button {
  border-radius: 12px;
}

.pro-cinema .secondary-button.quiet {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
}

/* ---------- Scene rhythm + connecting stems ---------- */
.ax-scene {
  position: relative;
  margin-top: clamp(76px, 9vw, 124px);
}

.ax-scene.ax-hero {
  margin-top: clamp(20px, 4vw, 44px);
}

.ax-scene:not(.ax-hero)::before {
  position: absolute;
  top: calc(clamp(76px, 9vw, 124px) * -0.72);
  left: 50%;
  width: 1px;
  height: calc(clamp(76px, 9vw, 124px) * 0.48);
  content: "";
  background: linear-gradient(180deg, transparent, var(--ax-line-strong));
}

.ax-scene-head {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  margin-bottom: clamp(24px, 3.5vw, 40px);
}

.ax-scene-head > div {
  display: grid;
  gap: 10px;
}

.ax-index {
  padding: 6px 9px;
  border: 1px solid var(--ax-line);
  border-radius: var(--ax-radius-sm);
  color: var(--ax-cyan);
  background: rgba(127, 216, 247, 0.06);
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.08em;
}

/* ---------- Shared glass panel ---------- */
.ax-panel {
  position: relative;
  border: 1px solid var(--ax-line);
  border-radius: var(--ax-radius);
  background:
    linear-gradient(165deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.01)),
    var(--ax-panel);
  box-shadow: 0 20px 54px rgba(1, 6, 14, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  transition: transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
}

@media (hover: hover) {
  .ax-panel:hover {
    transform: translateY(-2px);
    border-color: var(--ax-line-strong);
    box-shadow: 0 26px 62px rgba(1, 6, 14, 0.48), inset 0 1px 0 rgba(255, 255, 255, 0.11);
  }
}

.ax-chip {
  padding: 4px 9px;
  border: 1px solid var(--ax-line);
  border-radius: 7px;
  color: var(--ax-muted);
  background: rgba(255, 255, 255, 0.03);
  font-size: 0.68rem;
  font-weight: 620;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.ax-chip.is-demo {
  border-color: rgba(127, 216, 247, 0.3);
  color: var(--ax-cyan);
  background: rgba(127, 216, 247, 0.07);
}

.ax-chip.is-amber {
  border-color: rgba(238, 196, 136, 0.3);
  color: var(--ax-amber);
  background: rgba(238, 196, 136, 0.07);
}

.ax-console-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.ax-console-id {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--ax-muted);
  font-size: 0.8rem;
  letter-spacing: 0.04em;
}

.ax-console-id i {
  width: 7px;
  height: 7px;
  border-radius: 2px;
  background: var(--ax-cyan);
  box-shadow: 0 0 10px rgba(127, 216, 247, 0.8);
}

/* ---------- Rails (risk / discipline / progress) ---------- */
.ax-rails {
  display: grid;
  gap: 10px;
}

.ax-rails label {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  color: var(--ax-muted);
  font-size: 0.82rem;
}

.ax-rails label > span {
  font-size: 0.8rem;
  font-variant-numeric: tabular-nums;
}

.ax-rails i,
.ax-progress i,
.ax-loyalty-progress i {
  overflow: hidden;
  height: 5px;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.07);
}

.ax-rails b,
.ax-progress b,
.ax-loyalty-progress b {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--ax-blue), var(--ax-cyan));
  transition: width 240ms ease;
}

.ax-rails b.is-amber { background: linear-gradient(90deg, rgba(238, 196, 136, 0.5), var(--ax-amber)); }
.ax-rails b.is-emerald { background: linear-gradient(90deg, rgba(98, 217, 165, 0.5), var(--ax-emerald)); }
.ax-rails b.is-red { background: linear-gradient(90deg, rgba(236, 130, 153, 0.45), var(--ax-red)); }

.ax-progress {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  color: var(--ax-muted);
  font-size: 0.82rem;
}

/* ---------- 01 · Hero — command environment ---------- */
.ax-hero {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(420px, 1.1fr);
  gap: clamp(28px, 5vw, 64px);
  align-items: center;
  min-height: min(660px, calc(100vh - 140px));
}

.ax-hero-copy {
  display: grid;
  gap: 22px;
  justify-items: start;
}

.ax-trust-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--ax-faint);
  font-size: 0.82rem;
}

.ax-trust-row li {
  position: relative;
  padding-left: 14px;
}

.ax-trust-row li::before {
  position: absolute;
  top: 0.52em;
  left: 0;
  width: 5px;
  height: 5px;
  border-radius: 1px;
  content: "";
  background: var(--ax-cyan);
  opacity: 0.7;
}

.ax-trust-row.centered {
  justify-content: center;
}

.ax-console {
  position: relative;
  display: grid;
  gap: 14px;
  overflow: hidden;
  padding: clamp(14px, 2vw, 20px);
  border: 1px solid var(--ax-line-strong);
  border-radius: var(--ax-radius);
  background: linear-gradient(160deg, rgba(15, 32, 58, 0.78), rgba(6, 14, 28, 0.86));
  box-shadow: 0 34px 90px rgba(1, 5, 12, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.09);
  backdrop-filter: blur(22px);
  -webkit-backdrop-filter: blur(22px);
}

.ax-console::after {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  background: linear-gradient(110deg, transparent 32%, rgba(160, 225, 255, 0.08) 46%, transparent 60%);
  transform: translateX(-120%);
}

.pro-anim .ax-hero.is-in .ax-console::after {
  animation: axSweep 1.9s ease-out 0.5s 1 forwards;
}

.ax-console-chart {
  padding: 10px;
  border: 1px solid var(--ax-line);
  border-radius: var(--ax-radius-sm);
  background: rgba(3, 9, 19, 0.5);
}

.ax-console-chart svg {
  display: block;
  width: 100%;
  height: auto;
}

.chart-area { fill: url(#heroArea); }

.chart-line {
  fill: none;
  stroke: url(#heroLine);
  stroke-width: 3;
  stroke-linecap: round;
}

.chart-zone {
  stroke-width: 1.2;
  stroke-dasharray: 6 7;
}

.chart-zone.resistance { stroke: rgba(238, 196, 136, 0.4); }
.chart-zone.support { stroke: rgba(98, 217, 165, 0.35); }

.ax-console-insight {
  display: grid;
  gap: 7px;
  padding: 14px;
  border: 1px solid rgba(127, 216, 247, 0.18);
  border-left: 2px solid var(--ax-cyan);
  border-radius: var(--ax-radius-sm);
  background: rgba(127, 216, 247, 0.05);
}

.ax-console-insight p {
  margin: 0;
  color: #f2f9ff;
  font-size: 0.95rem;
}

.ax-console-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.ax-console-metrics article {
  display: grid;
  gap: 4px;
  align-content: start;
  padding: 12px;
  border: 1px solid var(--ax-line);
  border-radius: var(--ax-radius-sm);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.015));
}

.ax-console-metrics strong {
  font-size: clamp(1.3rem, 1.8vw, 1.75rem);
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  line-height: 1.1;
}

.ax-console-metrics small {
  color: var(--ax-faint);
  font-size: 0.74rem;
}

/* ---------- 02 · Connected system rail ---------- */
.ax-rail {
  position: relative;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 16px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ax-rail::before {
  position: absolute;
  top: 4px;
  right: 1%;
  left: 1%;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(95, 141, 255, 0.5) 10%, rgba(127, 216, 247, 0.5) 90%, transparent);
}

.ax-rail li {
  position: relative;
  display: grid;
  gap: 6px;
  align-content: start;
  padding-top: 24px;
}

.ax-rail li i {
  position: absolute;
  top: 0;
  left: 0;
  width: 9px;
  height: 9px;
  border-radius: 2px;
  background: var(--ax-blue);
  box-shadow: 0 0 0 3px rgba(95, 141, 255, 0.15), 0 0 12px rgba(95, 141, 255, 0.45);
}

.ax-rail li.is-cyan i { background: var(--ax-cyan); box-shadow: 0 0 0 3px rgba(127, 216, 247, 0.14), 0 0 12px rgba(127, 216, 247, 0.45); }
.ax-rail li.is-violet i { background: var(--ax-violet); box-shadow: 0 0 0 3px rgba(160, 141, 255, 0.15), 0 0 12px rgba(160, 141, 255, 0.45); }
.ax-rail li.is-emerald i { background: var(--ax-emerald); box-shadow: 0 0 0 3px rgba(98, 217, 165, 0.14), 0 0 12px rgba(98, 217, 165, 0.45); }

.ax-rail strong {
  font-size: 0.95rem;
  font-weight: 630;
}

.ax-rail small {
  color: var(--ax-faint);
  font-size: 0.8rem;
  line-height: 1.45;
}

/* ---------- 03 · Cashback financial experience ---------- */
.ax-cashback {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(400px, 1.15fr);
  gap: clamp(28px, 4vw, 56px);
  align-items: center;
}

.ax-cashback .ax-scene-head {
  margin-bottom: 0;
}

.ax-cashback-story {
  display: grid;
  gap: 24px;
  justify-items: start;
}

.ax-cashback-figure {
  display: grid;
  gap: 8px;
}

.ax-cashback-figure strong {
  font-size: clamp(2.8rem, 2rem + 3.4vw, 4.6rem);
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  line-height: 1;
}

.ax-cashback-figure small {
  color: var(--ax-faint);
  font-size: 0.82rem;
}

.ax-toggle {
  display: inline-flex;
  gap: 4px;
  padding: 4px;
  border: 1px solid var(--ax-line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.03);
}

.ax-toggle button {
  min-height: 36px;
  padding: 0 16px;
  border: 0;
  border-radius: 9px;
  color: var(--ax-muted);
  background: transparent;
  font-size: 0.86rem;
  cursor: pointer;
  transition: background 0.25s ease, color 0.25s ease;
}

.ax-toggle button.is-active {
  color: #04121f;
  background: linear-gradient(135deg, var(--ax-cyan), #6f9dff);
}

.ax-formula-console {
  display: grid;
  gap: 18px;
  padding: clamp(20px, 3vw, 30px);
}

.ax-formula-line {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1.1fr);
  gap: 10px;
  align-items: stretch;
}

.ax-formula-line > div {
  display: grid;
  gap: 6px;
  align-content: center;
  min-height: 76px;
  padding: 12px 14px;
  border: 1px solid var(--ax-line);
  border-radius: var(--ax-radius-sm);
  background: rgba(3, 10, 20, 0.45);
}

.ax-formula-line strong {
  font-size: clamp(1rem, 0.9rem + 0.55vw, 1.28rem);
  font-weight: 630;
  font-variant-numeric: tabular-nums;
}

.ax-formula-line > b {
  align-self: center;
  color: var(--ax-faint);
  font-size: 1.1rem;
  font-weight: 400;
}

.ax-formula-line .is-result {
  border-color: rgba(127, 216, 247, 0.32);
  background: rgba(127, 216, 247, 0.07);
}

.ax-formula-line .is-result strong {
  color: var(--ax-cyan);
}

.ax-slider {
  display: grid;
  gap: 10px;
}

.ax-slider input[type="range"] {
  width: 100%;
  accent-color: var(--ax-cyan);
}

.ax-tier-gauge {
  display: grid;
  gap: 7px;
}

.ax-gauge-track {
  position: relative;
  display: flex;
  height: 12px;
  border-radius: 6px;
}

.ax-gauge-track i {
  height: 100%;
  border-right: 1px solid rgba(2, 8, 16, 0.8);
}

.ax-gauge-track i.z1 { width: 16.67%; border-radius: 6px 0 0 6px; background: rgba(95, 141, 255, 0.22); }
.ax-gauge-track i.z2 { width: 25%; background: rgba(160, 141, 255, 0.24); }
.ax-gauge-track i.z3 { width: 58.33%; border-right: 0; border-radius: 0 6px 6px 0; background: rgba(127, 216, 247, 0.24); }

.ax-gauge-marker {
  position: absolute;
  top: -4px;
  left: var(--pos, 50%);
  width: 2px;
  height: 20px;
  border-radius: 1px;
  background: #fff;
  box-shadow: 0 0 12px rgba(180, 235, 255, 0.9);
  transform: translateX(-50%);
  transition: left 240ms ease;
}

.ax-gauge-labels {
  display: flex;
  color: var(--ax-faint);
  font-size: 0.72rem;
  letter-spacing: 0.05em;
}

.ax-gauge-labels span:nth-child(1) { width: 16.67%; }
.ax-gauge-labels span:nth-child(2) { width: 25%; }
.ax-gauge-labels span:nth-child(3) { width: 58.33%; }

.ax-stat-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(110px, 0.8fr);
  border: 1px solid var(--ax-line);
  border-radius: var(--ax-radius-sm);
  background: rgba(3, 10, 20, 0.4);
}

.ax-stat-strip > div,
.ax-stat-strip > label {
  display: grid;
  gap: 5px;
  align-content: center;
  padding: 13px 14px;
  border-right: 1px solid var(--ax-line);
}

.ax-stat-strip > :last-child {
  border-right: 0;
}

.ax-stat-strip strong {
  font-size: 0.98rem;
  font-weight: 630;
  font-variant-numeric: tabular-nums;
}

.ax-lots-input input {
  width: 100%;
  min-height: 36px;
  padding: 0 10px;
  border: 1px solid var(--ax-line-strong);
  border-radius: 8px;
  color: var(--ax-text);
  background: rgba(3, 12, 25, 0.62);
  font-variant-numeric: tabular-nums;
}

/* ---------- 04 · Five-day guided trial ---------- */
.ax-trial {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(400px, 1.1fr);
  gap: clamp(24px, 4vw, 52px);
  align-items: stretch;
}

.ax-trial .ax-scene-head {
  margin-bottom: 6px;
}

.ax-trial-rail {
  display: grid;
  gap: 18px;
  align-content: start;
}

.ax-trial-days {
  display: grid;
  gap: 8px;
}

.ax-trial-days button {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  padding: 0 16px;
  border: 1px solid var(--ax-line);
  border-radius: var(--ax-radius-sm);
  color: var(--ax-muted);
  background: rgba(255, 255, 255, 0.025);
  font-size: 0.92rem;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.25s ease, background 0.25s ease, color 0.25s ease;
}

.ax-trial-days button b {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border: 1px solid var(--ax-line-strong);
  border-radius: 7px;
  color: var(--ax-cyan);
  background: rgba(127, 216, 247, 0.06);
  font-size: 0.8rem;
  font-weight: 630;
  flex: none;
}

.ax-trial-days button:hover {
  border-color: var(--ax-line-strong);
  color: var(--ax-text);
}

.ax-trial-days button.is-active {
  border-color: rgba(127, 216, 247, 0.4);
  color: var(--ax-text);
  background: linear-gradient(160deg, rgba(127, 216, 247, 0.1), rgba(95, 141, 255, 0.05));
}

.ax-trial-days button.is-active b {
  border-color: transparent;
  color: #04121f;
  background: linear-gradient(135deg, var(--ax-cyan), #6f9dff);
}

.ax-trial-screen {
  display: grid;
  gap: 14px;
  align-content: start;
  padding: clamp(20px, 3vw, 28px);
}

.ax-trial-screen h3 {
  font-size: clamp(1.25rem, 1.05rem + 0.8vw, 1.6rem);
}

.ax-trial-screen p {
  max-width: 52ch;
  margin: 0;
  color: var(--ax-muted);
}

.ax-trial-preview {
  display: grid;
  gap: 12px;
  margin-top: 8px;
  padding: 18px;
  border: 1px solid var(--ax-line);
  border-radius: var(--ax-radius-sm);
  background: rgba(3, 10, 20, 0.42);
}

.ax-trial-preview i {
  display: block;
  height: 9px;
  border-radius: 4px;
  background: linear-gradient(90deg, rgba(127, 216, 247, 0.55), rgba(95, 141, 255, 0.12));
  transition: width 0.5s cubic-bezier(0.25, 0.7, 0.25, 1);
}

.ax-trial-progress {
  margin-top: 4px;
}

/* ---------- 05 · Intelligence workflow ---------- */
.ax-intel-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(320px, 0.75fr);
  gap: 16px;
  align-items: stretch;
}

.ax-intel-chart {
  display: grid;
  gap: 10px;
  align-content: start;
  margin: 0;
  padding: 16px;
}

.ax-market-chart {
  display: block;
  width: 100%;
  height: auto;
}

.ax-market-chart .chart-grid {
  fill: rgba(2, 8, 17, 0.45);
  stroke: var(--ax-line);
}

.ax-market-chart .zone.gain { fill: url(#gainFill); }
.ax-market-chart .zone.loss { fill: url(#lossFill); }

.ax-market-chart .level {
  stroke-width: 1.2;
  stroke-dasharray: 7 7;
}

.ax-market-chart .resistance { stroke: rgba(238, 196, 136, 0.55); }
.ax-market-chart .liquidity { stroke: rgba(127, 216, 247, 0.5); }
.ax-market-chart .support { stroke: rgba(98, 217, 165, 0.48); }
.ax-market-chart .invalidation { stroke: rgba(236, 130, 153, 0.55); }

.ax-market-chart .candles {
  fill: rgba(127, 216, 247, 0.16);
  stroke: rgba(214, 238, 252, 0.6);
  stroke-width: 1.6;
}

.ax-market-chart .structure-line {
  fill: none;
  stroke: var(--ax-cyan);
  stroke-width: 2.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ax-market-chart .entry-marker {
  fill: var(--ax-cyan);
  filter: drop-shadow(0 0 10px rgba(127, 216, 247, 0.7));
}

.ax-market-chart text,
.ax-performance-chart text {
  fill: var(--ax-faint);
  font-size: 12px;
  letter-spacing: 0.03em;
}

.ax-intel-steps {
  position: relative;
  display: grid;
  gap: 14px;
  margin: 0;
  padding: 0 0 0 22px;
  list-style: none;
}

.ax-intel-steps::before {
  position: absolute;
  top: 18px;
  bottom: 18px;
  left: 4px;
  width: 1px;
  content: "";
  background: linear-gradient(180deg, var(--ax-cyan), var(--ax-violet) 62%, var(--ax-amber));
  opacity: 0.4;
}

.ax-intel-steps > li {
  display: grid;
  gap: 10px;
  align-content: start;
  padding: 16px;
}

.ax-intel-steps > li::before {
  position: absolute;
  top: 18px;
  left: -22px;
  width: 9px;
  height: 9px;
  border-radius: 2px;
  content: "";
  background: var(--ax-blue);
  box-shadow: 0 0 10px rgba(95, 141, 255, 0.6);
}

.ax-intel-steps > li.is-cyan::before { background: var(--ax-cyan); box-shadow: 0 0 10px rgba(127, 216, 247, 0.6); }
.ax-intel-steps > li.is-violet::before { background: var(--ax-violet); box-shadow: 0 0 10px rgba(160, 141, 255, 0.6); }
.ax-intel-steps > li.is-amber::before { background: var(--ax-amber); box-shadow: 0 0 10px rgba(238, 196, 136, 0.6); }

.ax-step-tag {
  color: var(--ax-faint);
  font-size: 0.7rem;
  font-weight: 630;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.ax-intel-steps > li.is-cyan .ax-step-tag { color: var(--ax-cyan); }
.ax-intel-steps > li.is-violet .ax-step-tag { color: var(--ax-violet); }
.ax-intel-steps > li.is-amber .ax-step-tag { color: var(--ax-amber); }

.ax-evidence-list {
  display: grid;
  margin: 0;
}

.ax-evidence-list div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.ax-evidence-list div:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.ax-evidence-list dt {
  color: var(--ax-faint);
  font-size: 0.84rem;
}

.ax-evidence-list dd {
  margin: 0;
  color: var(--ax-text);
  font-size: 0.86rem;
  text-align: right;
}

.ax-chat {
  display: grid;
  gap: 8px;
}

.ax-chat p {
  display: grid;
  gap: 4px;
  margin: 0;
  padding: 10px 12px;
  border: 1px solid var(--ax-line);
  border-radius: 10px 10px 10px 3px;
  color: var(--ax-text);
  background: rgba(127, 216, 247, 0.05);
  font-size: 0.88rem;
}

.ax-chat p.is-client {
  border-radius: 10px 10px 3px 10px;
  color: var(--ax-muted);
  background: rgba(255, 255, 255, 0.035);
}

.ax-chat b {
  color: var(--ax-faint);
  font-size: 0.66rem;
  font-weight: 630;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.ax-readiness {
  display: flex;
  align-items: center;
  gap: 14px;
}

.ax-gauge-seg {
  display: grid;
  flex: 1;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 4px;
}

.ax-gauge-seg span {
  height: 26px;
  border-radius: 5px;
  background: linear-gradient(180deg, rgba(160, 141, 255, 0.7), rgba(95, 141, 255, 0.25));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
}

.ax-gauge-seg span:nth-last-child(-n+2) {
  background: rgba(255, 255, 255, 0.07);
  box-shadow: none;
}

.ax-readiness strong {
  color: var(--ax-violet);
  font-size: 1.7rem;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
}

.ax-checklist {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--ax-muted);
  font-size: 0.86rem;
}

.ax-checklist li {
  position: relative;
  padding-left: 16px;
}

.ax-checklist li::before {
  position: absolute;
  top: 0.62em;
  left: 0;
  width: 6px;
  height: 2px;
  border-radius: 1px;
  content: "";
  background: var(--ax-emerald);
}

.ax-checklist li.is-warning {
  color: var(--ax-amber);
}

.ax-checklist li.is-warning::before {
  background: var(--ax-amber);
}

/* ---------- 06 · Performance experience ---------- */
.ax-performance-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(320px, 0.65fr);
  gap: 16px;
  align-items: stretch;
}

.ax-performance-chart {
  display: grid;
  gap: 12px;
  align-content: start;
  margin: 0;
  padding: 16px;
}

.ax-performance-chart svg {
  display: block;
  width: 100%;
  height: auto;
}

.ax-baseline {
  stroke: rgba(255, 255, 255, 0.22);
  stroke-dasharray: 6 7;
}

.ax-dd-fill {
  fill: rgba(236, 130, 153, 0.2);
}

.ax-perf-area {
  fill: url(#perfFill);
}

.ax-perf-line {
  fill: none;
  stroke: var(--ax-cyan);
  stroke-width: 2.6;
  stroke-linecap: round;
}

.ax-performance-chart text.is-dd {
  fill: var(--ax-red);
}

.ax-performance-side {
  display: grid;
  gap: 18px;
  align-content: start;
  padding: 18px;
}

.ax-consistency {
  display: grid;
  gap: 4px;
}

.ax-consistency strong {
  font-size: clamp(2.2rem, 3vw, 3rem);
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.ax-consistency small {
  color: var(--ax-faint);
}

.ax-split-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}

.ax-split-list > div {
  display: grid;
  gap: 9px;
  align-content: start;
}

/* ---------- 07 · Copy-trading eligibility ---------- */
.ax-copytrading {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(380px, 1.05fr);
  gap: clamp(24px, 4vw, 52px);
  align-items: center;
}

.ax-copytrading .ax-scene-head {
  margin-bottom: 0;
}

.ax-copy-story {
  display: grid;
  gap: 20px;
  justify-items: start;
}

.ax-review-path {
  display: grid;
  margin: 0;
  padding: clamp(18px, 2.5vw, 26px);
  list-style: none;
}

.ax-review-path li {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 14px;
  padding: 13px 0;
}

.ax-review-path li + li {
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.ax-review-path li i {
  width: 10px;
  height: 10px;
  margin-top: 6px;
  border-radius: 3px;
  background: var(--ax-blue);
  box-shadow: 0 0 0 3px rgba(95, 141, 255, 0.14), 0 0 12px rgba(95, 141, 255, 0.4);
}

.ax-review-path li.is-amber i {
  background: var(--ax-amber);
  box-shadow: 0 0 0 3px rgba(238, 196, 136, 0.14), 0 0 12px rgba(238, 196, 136, 0.4);
}

.ax-review-path li.is-emerald i {
  background: var(--ax-emerald);
  box-shadow: 0 0 0 3px rgba(98, 217, 165, 0.14), 0 0 12px rgba(98, 217, 165, 0.4);
}

.ax-review-path li div {
  display: grid;
  gap: 3px;
}

.ax-review-path strong {
  font-size: 0.96rem;
  font-weight: 630;
}

.ax-review-path small {
  color: var(--ax-faint);
  font-size: 0.82rem;
}

/* ---------- 08 · Verified results + position size ---------- */
.ax-evidence-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  align-items: stretch;
}

.ax-results-panel,
.ax-pip-panel {
  display: grid;
  gap: 14px;
  align-content: start;
  padding: clamp(18px, 2.5vw, 26px);
}

.ax-bars {
  position: relative;
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 12px;
  min-height: 230px;
  padding: 16px;
  border: 1px solid var(--ax-line);
  border-radius: var(--ax-radius-sm);
  background:
    linear-gradient(rgba(127, 216, 247, 0.05) 1px, transparent 1px) 0 0 / 100% 42px,
    rgba(3, 10, 20, 0.4);
}

.ax-bars::before {
  position: absolute;
  top: 50%;
  right: 16px;
  left: 16px;
  height: 1px;
  content: "";
  background: rgba(255, 255, 255, 0.18);
}

.ax-bars span {
  position: relative;
  height: 100%;
}

.ax-bars span::before {
  position: absolute;
  right: 14%;
  bottom: 50%;
  left: 14%;
  height: calc(var(--h, 40%) * 0.5);
  border-radius: 4px 4px 2px 2px;
  content: "";
  background: linear-gradient(180deg, rgba(98, 217, 165, 0.9), rgba(98, 217, 165, 0.18));
  transform-origin: center bottom;
}

.ax-bars span.is-negative::before {
  top: 50%;
  bottom: auto;
  border-radius: 2px 2px 4px 4px;
  background: linear-gradient(180deg, rgba(236, 130, 153, 0.2), rgba(236, 130, 153, 0.85));
  transform-origin: center top;
}

.ax-bars span::after {
  position: absolute;
  right: 0;
  bottom: 2px;
  left: 0;
  content: attr(data-label);
  color: var(--ax-faint);
  font-size: 0.72rem;
  text-align: center;
}

.ax-ledger {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 26px;
  margin: 0;
}

.ax-ledger > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.ax-ledger dt {
  color: var(--ax-faint);
  font-size: 0.84rem;
}

.ax-ledger dd {
  margin: 0;
  font-size: 0.9rem;
  font-weight: 630;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.ax-pip-inputs {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
}

.ax-pip-inputs label {
  color: var(--ax-faint);
  font-size: 0.74rem;
  font-weight: 620;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}

.ax-pip-inputs label:first-child {
  grid-column: 1 / -1;
}

.ax-pip-inputs input,
.ax-pip-inputs select {
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid var(--ax-line-strong);
  border-radius: var(--ax-radius-sm);
  color: var(--ax-text);
  background: rgba(3, 12, 25, 0.62);
  font-variant-numeric: tabular-nums;
}

.ax-netpips {
  display: grid;
  gap: 2px;
  padding: 14px 16px;
  border: 1px solid var(--ax-line);
  border-radius: var(--ax-radius-sm);
  background: rgba(3, 10, 20, 0.42);
}

.ax-netpips strong {
  font-size: clamp(2.2rem, 3.4vw, 3.2rem);
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.ax-lot-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.ax-lot-row article {
  display: grid;
  gap: 5px;
  padding: 12px;
  border: 1px solid var(--ax-line);
  border-radius: var(--ax-radius-sm);
  background: rgba(255, 255, 255, 0.03);
}

.ax-lot-row strong {
  font-size: 1.02rem;
  font-weight: 630;
  font-variant-numeric: tabular-nums;
}

/* ---------- 09 · Rewards progression ---------- */
.ax-loyalty {
  display: grid;
  gap: 26px;
  padding: clamp(20px, 3vw, 32px);
}

.ax-loyalty-rail {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.ax-loyalty-rail::before {
  position: absolute;
  top: 5px;
  right: 2%;
  left: 2%;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, var(--ax-emerald) 0%, var(--ax-cyan) 30%, rgba(148, 196, 240, 0.2) 44%, rgba(148, 196, 240, 0.14));
}

.ax-loyalty-rail li {
  position: relative;
  display: grid;
  gap: 5px;
  padding-top: 22px;
}

.ax-loyalty-rail li i {
  position: absolute;
  top: 0;
  left: 0;
  width: 11px;
  height: 11px;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.14);
}

.ax-loyalty-rail li.is-done i {
  background: var(--ax-emerald);
  box-shadow: 0 0 10px rgba(98, 217, 165, 0.5);
}

.ax-loyalty-rail li.is-current i {
  background: var(--ax-cyan);
  box-shadow: 0 0 0 4px rgba(127, 216, 247, 0.16), 0 0 14px rgba(127, 216, 247, 0.6);
}

.ax-loyalty-rail li.is-next i {
  background: rgba(127, 216, 247, 0.35);
}

.ax-loyalty-rail strong {
  font-size: 0.94rem;
  font-weight: 630;
}

.ax-loyalty-rail li.is-current strong {
  color: var(--ax-cyan);
}

.ax-loyalty-rail small {
  color: var(--ax-faint);
  font-size: 0.78rem;
}

.ax-loyalty-progress {
  display: grid;
  gap: 9px;
  max-width: 560px;
}

.ax-loyalty-progress > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.ax-loyalty-progress strong {
  font-variant-numeric: tabular-nums;
}

.ax-loyalty-progress b {
  background: linear-gradient(90deg, var(--ax-emerald), var(--ax-cyan));
}

.ax-loyalty-progress small {
  color: var(--ax-faint);
}

/* ---------- 10 · Final activation ---------- */
.ax-final {
  display: grid;
  gap: 28px;
  padding: clamp(28px, 5vw, 56px);
  border: 1px solid var(--ax-line);
  border-radius: 20px;
  background:
    radial-gradient(circle at 50% 0%, rgba(127, 216, 247, 0.08), transparent 55%),
    linear-gradient(165deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.01)),
    var(--ax-panel-deep);
  box-shadow: 0 30px 80px rgba(1, 5, 12, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.09);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.ax-activation-path {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 0;
  padding: 0 0 24px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  list-style: none;
}

.ax-activation-path li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 11px;
  align-items: start;
}

.ax-activation-path b {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  border-radius: 7px;
  color: #04121f;
  background: linear-gradient(135deg, var(--ax-cyan), #6f9dff);
  font-size: 0.8rem;
}

.ax-activation-path li div {
  display: grid;
  gap: 2px;
}

.ax-activation-path strong {
  font-size: 0.92rem;
  font-weight: 630;
}

.ax-activation-path small {
  color: var(--ax-faint);
  font-size: 0.8rem;
  line-height: 1.45;
}

.ax-final-core {
  display: grid;
  gap: 20px;
  justify-items: center;
  text-align: center;
}

.ax-final-core h2 {
  max-width: 560px;
  font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.4rem);
}

/* ---------- Motion (one-time, meaningful, reduced-motion aware) ---------- */
.pro-anim [data-reveal] {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.75s ease, transform 0.75s cubic-bezier(0.22, 0.7, 0.25, 1);
}

.pro-anim [data-reveal].is-in {
  opacity: 1;
  transform: none;
}

.pro-anim .ax-drawline {
  stroke-dasharray: var(--len, 800);
  stroke-dashoffset: var(--len, 800);
  transition: stroke-dashoffset 1.4s cubic-bezier(0.33, 0.6, 0.3, 1) 0.25s;
}

.pro-anim .is-in .ax-drawline {
  stroke-dashoffset: 0;
}

.pro-anim .ax-bars span::before {
  opacity: 0.35;
  transform: scaleY(0.12);
  transition: transform 0.7s cubic-bezier(0.2, 0.7, 0.2, 1), opacity 0.7s ease;
}

.pro-anim .is-in .ax-bars span::before {
  opacity: 1;
  transform: none;
}

.pro-anim .is-in .ax-bars span:nth-child(2)::before { transition-delay: 0.07s; }
.pro-anim .is-in .ax-bars span:nth-child(3)::before { transition-delay: 0.14s; }
.pro-anim .is-in .ax-bars span:nth-child(4)::before { transition-delay: 0.21s; }
.pro-anim .is-in .ax-bars span:nth-child(5)::before { transition-delay: 0.28s; }
.pro-anim .is-in .ax-bars span:nth-child(6)::before { transition-delay: 0.35s; }

@keyframes axSweep {
  to { transform: translateX(120%); }
}

@media (prefers-reduced-motion: reduce) {
  .pro-cinema *,
  .pro-cinema *::before,
  .pro-cinema *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }

  .pro-anim [data-reveal] {
    opacity: 1;
    transform: none;
  }

  .pro-anim .ax-drawline {
    stroke-dashoffset: 0;
  }

  .pro-anim .ax-bars span::before {
    opacity: 1;
    transform: none;
  }
}

/* ---------- Responsive ---------- */
@media (max-width: 1180px) {
  .ax-hero,
  .ax-cashback,
  .ax-trial,
  .ax-copytrading,
  .ax-intel-grid,
  .ax-performance-grid,
  .ax-evidence-grid {
    grid-template-columns: 1fr;
  }

  .ax-hero {
    min-height: 0;
  }

  .ax-rail {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .ax-rail::before {
    top: 6px;
    right: auto;
    bottom: 6px;
    left: 4px;
    width: 1px;
    height: auto;
    background: linear-gradient(180deg, rgba(95, 141, 255, 0.5), rgba(127, 216, 247, 0.5));
  }

  .ax-rail li {
    grid-template-columns: minmax(122px, auto) minmax(0, 1fr);
    gap: 4px 14px;
    align-items: baseline;
    padding: 12px 0 12px 26px;
  }

  .ax-rail li i {
    top: 17px;
  }

  .ax-loyalty-rail {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .ax-loyalty-rail::before {
    top: 6px;
    right: auto;
    bottom: 6px;
    left: 5px;
    width: 1px;
    height: auto;
    background: linear-gradient(180deg, var(--ax-emerald), var(--ax-cyan) 30%, rgba(148, 196, 240, 0.15));
  }

  .ax-loyalty-rail li {
    grid-template-columns: minmax(112px, auto) minmax(0, 1fr);
    gap: 2px 12px;
    align-items: baseline;
    padding: 10px 0 10px 28px;
  }

  .ax-loyalty-rail li i {
    top: 14px;
  }

  .ax-activation-path {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .pro-cinema h1 {
    font-size: clamp(1.9rem, 8vw, 2.5rem);
  }

  .ax-scene {
    margin-top: 64px;
  }

  .ax-scene:not(.ax-hero)::before {
    display: none;
  }

  .ax-scene-head {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .ax-index {
    justify-self: start;
  }

  .ax-console {
    padding: 14px;
  }

  .ax-console-metrics strong {
    font-size: 1.05rem;
  }

  .ax-rails label {
    grid-template-columns: 92px minmax(0, 1fr) auto;
    font-size: 0.78rem;
  }

  .ax-cashback-figure strong {
    font-size: clamp(2.4rem, 12vw, 3.2rem);
  }

  .ax-formula-line {
    grid-template-columns: 1fr;
  }

  .ax-formula-line > b {
    justify-self: center;
  }

  .ax-stat-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ax-stat-strip > div,
  .ax-stat-strip > label {
    border-right: 0;
    border-bottom: 1px solid var(--ax-line);
  }

  .ax-stat-strip > div:nth-child(odd) {
    border-right: 1px solid var(--ax-line);
  }

  .ax-stat-strip > :nth-last-child(-n+2) {
    border-bottom: 0;
  }

  .ax-trial-days button {
    min-height: 48px;
  }

  .ax-split-list,
  .ax-ledger,
  .ax-pip-inputs,
  .ax-lot-row,
  .ax-activation-path {
    grid-template-columns: 1fr;
  }

  .ax-bars {
    gap: 8px;
    min-height: 195px;
    padding: 12px;
  }

  .ax-final {
    padding: 22px;
  }

  .pro-cta-row .primary-button,
  .pro-cta-row .secondary-button {
    width: 100%;
    justify-content: center;
  }
}

/* ============================================================
   AUREX Pro — PREMIUM POLISH LAYER
   Refines the existing .ax-* system only. No structural change.
   Named glass materials, editorial type, deeper light, number
   emphasis, engineered hovers, and calm "alive" hero motion.
   ============================================================ */
.pro-cinema {
  --ax-white: #f5f9ff;
  --ax-edge: rgba(255, 255, 255, 0.12);
  --ax-edge-soft: rgba(255, 255, 255, 0.07);
  --ax-hair: rgba(150, 214, 252, 0.07);
  /* Layered depth shadows */
  --ax-sh-float: 0 44px 120px -28px rgba(1, 6, 16, 0.82), 0 18px 44px -22px rgba(1, 5, 14, 0.6);
  --ax-sh-cmd: 0 40px 100px -26px rgba(1, 6, 16, 0.72), 0 14px 34px -18px rgba(1, 5, 14, 0.55);
  --ax-sh-panel: 0 26px 66px -30px rgba(1, 6, 16, 0.6), 0 8px 22px -16px rgba(1, 5, 14, 0.45);
  --ax-inner-hi: inset 0 1px 0 var(--ax-edge), inset 0 0 0 1px var(--ax-hair);
  --ease-premium: cubic-bezier(0.22, 0.7, 0.2, 1);
}

/* ---------- Typography: lighter, tighter, better rhythm ---------- */
.pro-cinema h1 {
  font-weight: 600;
  letter-spacing: -0.024em;
  line-height: 1.045;
  text-wrap: balance;
}

.pro-cinema h2 {
  font-weight: 600;
  letter-spacing: -0.016em;
  line-height: 1.14;
  text-wrap: balance;
}

.pro-cinema h3 {
  font-weight: 600;
  letter-spacing: -0.008em;
}

.pro-cinema .eyebrow {
  font-weight: 600;
  letter-spacing: 0.16em;
  color: var(--ax-cyan);
  opacity: 0.92;
}

.pro-cinema .ax-lede {
  line-height: 1.72;
  color: rgba(206, 221, 240, 0.82);
  letter-spacing: 0.002em;
}

.pro-cinema .ax-scene-head > div {
  gap: 12px;
}

/* ---------- Numbers become the visual hero ---------- */
.ax-console-metrics strong,
.ax-cashback-figure strong,
.ax-formula-line strong,
.ax-stat-strip strong,
.ax-netpips strong,
.ax-consistency strong,
.ax-readiness strong,
.ax-lot-row strong,
.ax-ledger dd,
.ax-loyalty-progress strong,
.ax-evidence-list dd {
  font-family: var(--font-numeric, "Inter", system-ui, sans-serif);
  letter-spacing: -0.012em;
  font-feature-settings: "tnum" 1, "ss01" 1;
}

.ax-cashback-figure strong,
.ax-netpips strong,
.ax-consistency strong {
  color: var(--ax-white);
  text-shadow: 0 0 34px rgba(127, 216, 247, 0.22);
}

.ax-console-metrics strong {
  color: var(--ax-white);
  text-shadow: 0 0 20px rgba(127, 216, 247, 0.16);
}

.ax-readiness strong {
  text-shadow: 0 0 26px rgba(160, 141, 255, 0.28);
}

.ax-formula-line .is-result strong {
  text-shadow: 0 0 26px rgba(127, 216, 247, 0.35);
}

/* ============================================================
   GLASS MATERIALS — distinct opacity / blur / reflection / depth
   ============================================================ */

/* Base refinement: crisper edge-light + softer, deeper shadow */
.ax-panel {
  border-color: rgba(150, 200, 244, 0.16);
  box-shadow: var(--ax-sh-panel), var(--ax-inner-hi);
  transition: transform 0.4s var(--ease-premium), border-color 0.4s var(--ease-premium), box-shadow 0.4s var(--ease-premium);
}

@media (hover: hover) {
  .ax-panel:hover {
    transform: translateY(-3px);
    border-color: rgba(150, 214, 252, 0.34);
    box-shadow: var(--ax-sh-cmd), inset 0 1px 0 rgba(255, 255, 255, 0.15), inset 0 0 0 1px rgba(150, 214, 252, 0.08);
  }
}

/* Command Glass — hero console + trial screen (brightest, deepest) */
.ax-console,
.ax-trial-screen {
  border-color: rgba(150, 214, 252, 0.28);
  background:
    radial-gradient(130% 90% at 78% -6%, rgba(127, 216, 247, 0.14), transparent 46%),
    linear-gradient(158deg, rgba(20, 40, 70, 0.72), rgba(6, 14, 28, 0.9));
  box-shadow: var(--ax-sh-cmd), inset 0 1px 0 rgba(255, 255, 255, 0.14), inset 0 0 0 1px rgba(150, 214, 252, 0.08), inset 0 -30px 60px -40px rgba(0, 0, 0, 0.7);
  backdrop-filter: blur(26px) saturate(135%);
  -webkit-backdrop-filter: blur(26px) saturate(135%);
}

/* Dashboard Glass — chart/data surfaces (matte, precise) */
.ax-intel-chart,
.ax-performance-chart,
.ax-results-panel,
.ax-pip-panel {
  background:
    radial-gradient(120% 80% at 50% -10%, rgba(95, 141, 255, 0.07), transparent 44%),
    linear-gradient(165deg, rgba(10, 24, 45, 0.6), rgba(5, 13, 26, 0.78));
  box-shadow: var(--ax-sh-panel), inset 0 1px 0 var(--ax-edge-soft), inset 0 0 0 1px var(--ax-hair);
}

/* Primary Glass — formula console, loyalty, review path */
.ax-formula-console,
.ax-loyalty,
.ax-review-path {
  background:
    linear-gradient(168deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.012)),
    linear-gradient(165deg, rgba(12, 27, 50, 0.55), rgba(5, 13, 26, 0.72));
  box-shadow: var(--ax-sh-panel), var(--ax-inner-hi);
}

/* Floating Glass — final activation (most elevated, warm-lit) */
.ax-final {
  border-color: rgba(150, 214, 252, 0.2);
  background:
    radial-gradient(circle at 50% -8%, rgba(127, 216, 247, 0.12), transparent 52%),
    radial-gradient(circle at 50% 120%, rgba(95, 141, 255, 0.08), transparent 55%),
    linear-gradient(168deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.012)),
    var(--ax-panel-deep);
  box-shadow: var(--ax-sh-float), inset 0 1px 0 rgba(255, 255, 255, 0.14), inset 0 0 0 1px rgba(150, 214, 252, 0.07);
}

/* Secondary Glass — small inner tiles (subtle, layered) */
.ax-console-metrics article,
.ax-lot-row article,
.ax-formula-line > div,
.ax-netpips,
.ax-bars,
.ax-trial-preview,
.ax-stat-strip {
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.055), rgba(255, 255, 255, 0.014)),
    rgba(4, 12, 24, 0.4);
  box-shadow: inset 0 1px 0 var(--ax-edge-soft);
}

/* ============================================================
   MICRO-INTERACTIONS — engineered, restrained
   ============================================================ */
.pro-cinema .primary-button,
.pro-cinema .secondary-button {
  transition: transform 0.32s var(--ease-premium), box-shadow 0.32s var(--ease-premium), border-color 0.32s var(--ease-premium), background 0.32s var(--ease-premium);
  will-change: transform;
}

@media (hover: hover) {
  .pro-cinema .primary-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 40px -12px rgba(95, 141, 255, 0.5), 0 0 0 1px rgba(150, 214, 252, 0.3);
  }
  .pro-cinema .secondary-button:hover {
    transform: translateY(-2px);
    border-color: rgba(150, 214, 252, 0.4);
  }
  .pro-cinema .secondary-button.quiet:hover {
    background: rgba(127, 216, 247, 0.06);
  }
}

/* Interactive inner tiles: brighten edge + faint lift, no double-move */
.ax-rail li,
.ax-console-metrics article,
.ax-lot-row article,
.ax-intel-steps > li,
.ax-review-path li,
.ax-loyalty-rail li {
  transition: border-color 0.35s var(--ease-premium), background 0.35s var(--ease-premium), box-shadow 0.35s var(--ease-premium);
}

@media (hover: hover) {
  .ax-console-metrics article:hover,
  .ax-lot-row article:hover {
    border-color: rgba(150, 214, 252, 0.28);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12), 0 0 0 1px rgba(127, 216, 247, 0.12);
  }
  .ax-intel-steps > li:hover {
    border-color: rgba(150, 214, 252, 0.24);
  }
}

/* Trial + toggle buttons: smoother engineered feedback */
.ax-trial-days button,
.ax-toggle button {
  transition: border-color 0.3s var(--ease-premium), background 0.3s var(--ease-premium), color 0.3s var(--ease-premium), transform 0.3s var(--ease-premium);
}

@media (hover: hover) {
  .ax-trial-days button:not(.is-active):hover {
    transform: translateX(2px);
    background: rgba(127, 216, 247, 0.05);
  }
}

/* Range slider thumb — premium feel */
.ax-slider input[type="range"] {
  height: 4px;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 3px;
  background: linear-gradient(90deg, var(--ax-cyan), rgba(95, 141, 255, 0.35));
  cursor: pointer;
}
.ax-slider input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #ffffff, #cfeeff 60%, #7fd8f7);
  box-shadow: 0 2px 10px rgba(1, 8, 18, 0.7), 0 0 0 4px rgba(127, 216, 247, 0.16);
  cursor: pointer;
  transition: box-shadow 0.25s var(--ease-premium), transform 0.25s var(--ease-premium);
}
.ax-slider input[type="range"]::-webkit-slider-thumb:hover {
  transform: scale(1.08);
  box-shadow: 0 2px 12px rgba(1, 8, 18, 0.7), 0 0 0 6px rgba(127, 216, 247, 0.22);
}
.ax-slider input[type="range"]::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border: 0;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #ffffff, #cfeeff 60%, #7fd8f7);
  box-shadow: 0 2px 10px rgba(1, 8, 18, 0.7), 0 0 0 4px rgba(127, 216, 247, 0.16);
  cursor: pointer;
}

/* Inputs: refined focus ring */
.pro-cinema input,
.pro-cinema select {
  transition: border-color 0.25s var(--ease-premium), box-shadow 0.25s var(--ease-premium), background 0.25s var(--ease-premium);
}
.pro-cinema input:focus-visible,
.pro-cinema select:focus-visible {
  outline: none;
  border-color: rgba(127, 216, 247, 0.55);
  box-shadow: 0 0 0 3px rgba(127, 216, 247, 0.16);
}

/* ============================================================
   SECTION ACCENTS
   ============================================================ */

/* Carlos — living companion: online presence dot + accent bar */
.ax-console-insight {
  position: relative;
  border-left-width: 2px;
}
.ax-console-insight .ax-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.ax-console-insight .ax-label::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--ax-emerald);
  box-shadow: 0 0 0 3px rgba(98, 217, 165, 0.16), 0 0 10px rgba(98, 217, 165, 0.7);
}
.ax-intel-steps > li .ax-chat p:not(.is-client) {
  border-left: 2px solid rgba(127, 216, 247, 0.4);
}

/* Cashback — Bloomberg-grade console: faint data grid + result emphasis */
.ax-formula-console {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.ax-formula-console::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.5;
  background-image:
    linear-gradient(rgba(127, 216, 247, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(127, 216, 247, 0.03) 1px, transparent 1px);
  background-size: 34px 34px;
  -webkit-mask-image: radial-gradient(circle at 30% 0%, #000, transparent 78%);
  mask-image: radial-gradient(circle at 30% 0%, #000, transparent 78%);
}
.ax-formula-console > * {
  position: relative;
  z-index: 1;
}
.ax-formula-line .is-result {
  border-color: rgba(127, 216, 247, 0.4);
  background:
    radial-gradient(120% 120% at 50% 0%, rgba(127, 216, 247, 0.12), transparent 60%),
    rgba(127, 216, 247, 0.05);
}

/* Verified results — audited feel: monospace-precise ledger figures */
.ax-ledger dd {
  letter-spacing: 0;
}
.ax-results-panel .ax-chip.is-amber::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 6px;
  border-radius: 50%;
  background: var(--ax-amber);
  box-shadow: 0 0 8px rgba(238, 196, 136, 0.7);
  vertical-align: middle;
}

/* Copy-trading — exclusivity: refined divider + hover reveal */
@media (hover: hover) {
  .ax-review-path li:hover strong {
    color: var(--ax-white);
  }
}

/* Final — emotional close: primary CTA gets a slow living sheen */
.ax-final .primary-button {
  position: relative;
  overflow: hidden;
}
.ax-final .primary-button::after {
  content: "";
  position: absolute;
  top: 0;
  left: -70%;
  width: 45%;
  height: 100%;
  pointer-events: none;
  background: linear-gradient(105deg, transparent, rgba(255, 255, 255, 0.42), transparent);
  transform: skewX(-18deg);
  transition: left 0.7s var(--ease-premium);
}
@media (hover: hover) {
  .ax-final .primary-button:hover::after {
    left: 130%;
  }
}

/* ============================================================
   HERO — ALIVE (calm, premium ambient motion)
   ============================================================ */

/* Live status dot in console header */
.ax-console-id i {
  position: relative;
}
.pro-anim .ax-console-id i::after {
  content: "";
  position: absolute;
  inset: -3px;
  border-radius: 3px;
  border: 1px solid rgba(127, 216, 247, 0.7);
  animation: axLivePulse 2.6s ease-out infinite;
}

/* Endpoint intelligence pulse on the hero line */
.ax-hero-endcore {
  fill: #eafaff;
  filter: drop-shadow(0 0 8px rgba(127, 216, 247, 0.95));
  opacity: 0;
}
.ax-hero-endhalo {
  fill: rgba(127, 216, 247, 0.5);
  opacity: 0;
}
.pro-anim .ax-hero.is-in .ax-hero-endcore {
  animation: axCoreIn 0.5s ease-out 1.5s forwards;
}
.pro-anim .ax-hero.is-in .ax-hero-endhalo {
  transform-origin: 502px 53px;
  animation: axCoreIn 0.5s ease-out 1.5s forwards, axHaloPulse 2.8s ease-out 2s infinite;
}

/* Slow glass-light drift across the hero chart */
.ax-console-chart {
  position: relative;
  overflow: hidden;
}
.pro-anim .ax-hero.is-in .ax-console-chart::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 55%;
  height: 100%;
  pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(160, 220, 255, 0.06), transparent);
  animation: axDrift 7s ease-in-out 2.4s infinite;
}

/* Chart Reader workspace — slow scan line */
.ax-intel-chart {
  position: relative;
  overflow: hidden;
}
.pro-anim .ax-intel.is-in .ax-intel-chart::after {
  content: "";
  position: absolute;
  top: 16px;
  bottom: 16px;
  left: 0;
  width: 2px;
  pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(127, 216, 247, 0.35), transparent);
  box-shadow: 0 0 14px rgba(127, 216, 247, 0.5);
  animation: axScan 6.5s ease-in-out 1.2s infinite;
}

/* Loyalty — gentle breathing on the current node */
.pro-anim .ax-loyalty-rail li.is-current i {
  animation: axNodeBreath 3s ease-in-out infinite;
}

@keyframes axLivePulse {
  0% { opacity: 0.9; transform: scale(0.7); }
  70% { opacity: 0; transform: scale(1.9); }
  100% { opacity: 0; transform: scale(1.9); }
}
@keyframes axCoreIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes axHaloPulse {
  0% { transform: scale(0.6); opacity: 0.6; }
  70% { transform: scale(2.1); opacity: 0; }
  100% { transform: scale(2.1); opacity: 0; }
}
@keyframes axDrift {
  0% { transform: translateX(-30%); opacity: 0; }
  40% { opacity: 1; }
  60% { opacity: 1; }
  100% { transform: translateX(320%); opacity: 0; }
}
@keyframes axScan {
  0% { left: 3%; opacity: 0; }
  12% { opacity: 1; }
  88% { opacity: 1; }
  100% { left: 97%; opacity: 0; }
}
@keyframes axNodeBreath {
  0%, 100% { box-shadow: 0 0 0 4px rgba(127, 216, 247, 0.12), 0 0 14px rgba(127, 216, 247, 0.5); }
  50% { box-shadow: 0 0 0 5px rgba(127, 216, 247, 0.2), 0 0 20px rgba(127, 216, 247, 0.8); }
}

@media (prefers-reduced-motion: reduce) {
  .pro-anim .ax-console-id i::after,
  .pro-anim .ax-hero .ax-console-chart::after,
  .pro-anim .ax-intel .ax-intel-chart::after,
  .pro-anim .ax-loyalty-rail li.is-current i,
  .pro-anim .ax-hero .ax-hero-endhalo,
  .pro-anim .ax-hero .ax-hero-endcore {
    animation: none !important;
  }
  .ax-hero-endcore,
  .ax-hero-endhalo { opacity: 1; }
  .ax-hero-endhalo { opacity: 0.35; }
}

/* ============================================================
   AUREX CLIENT PORTAL — desktop polish + dedicated mobile companion.
   Scoped to .portal-body so the shared admin shell is untouched.
   Desktop keeps the operating-system layout; mobile switches to a
   bottom-nav companion. No business logic, IDs, or handlers change.
   ============================================================ */
.portal-body {
  --portal-mtop-h: 54px;
  --portal-nav-h: 62px;
}

/* Mobile chrome is hidden on desktop/tablet by default. */
.portal-mobile-topbar,
.portal-bottom-nav,
.portal-more-sheet,
.portal-sheet-scrim {
  display: none;
}

/* ---------- Desktop polish (subtle, non-breaking) ---------- */
.portal-body .portal-main .portal-topbar {
  gap: clamp(16px, 2vw, 28px);
}

.portal-body .portal-stat,
.portal-body .portal-chart-card {
  transition: transform 0.35s cubic-bezier(0.22, 0.7, 0.2, 1), border-color 0.35s ease, box-shadow 0.35s ease;
}

@media (hover: hover) and (min-width: 821px) {
  .portal-body .portal-stat:hover,
  .portal-body .portal-chart-card:hover {
    transform: translateY(-2px);
    border-color: var(--line-strong);
    box-shadow: 0 26px 60px rgba(0, 0, 0, 0.4), var(--glass-highlight);
  }
  .portal-body .portal-main .nav-item {
    will-change: transform;
  }
}

/* Stronger, tabular numerics across portal metrics */
.portal-body .portal-kpi-grid .portal-stat strong,
.portal-body .portal-metric-value {
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

/* Semantic status-pill tones (kept restrained) */
.portal-body .portal-status-pill.positive,
.portal-body .portal-status-pill.Active,
.portal-body .portal-status-pill.Verified { color: var(--green); }
.portal-body .portal-status-pill.warning,
.portal-body .portal-status-pill.Watch { color: var(--yellow); }
.portal-body .portal-status-pill.danger { color: var(--red); }

/* Focus visibility for keyboard users */
.portal-body .portal-tab:focus-visible,
.portal-body .portal-more-item:focus-visible,
.portal-body .portal-mobile-bell:focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: 2px;
}

/* ============================================================
   MOBILE COMPANION  (<= 820px)
   ============================================================ */
@media (max-width: 820px) {
  /* Shell becomes a single scrolling column; desktop sidebar retired. */
  .portal-body .app-shell.portal-shell,
  .portal-body .portal-shell {
    display: block;
  }
  .portal-body .portal-shell .portal-sidebar {
    display: none;
  }
  .portal-body .portal-main {
    width: 100%;
    padding: calc(var(--portal-mtop-h) + 14px) clamp(12px, 4vw, 18px)
             calc(var(--portal-nav-h) + env(safe-area-inset-bottom, 0px) + 20px);
  }

  /* Desktop topbar collapses: keep only the notification center (reused as a sheet). */
  .portal-body .portal-main .portal-topbar {
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
    backdrop-filter: none;
    transform: none;
    animation: none;
  }
  .portal-body .portal-topbar > div:first-child,
  .portal-body .portal-topbar .portal-identity {
    display: none;
  }

  /* ---- Persistent mobile top bar ---- */
  .portal-body:not(.portal-secure-gated) .portal-mobile-topbar {
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    z-index: 60;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: var(--portal-mtop-h);
    padding: 0 14px;
    border-bottom: 1px solid var(--line);
    background: linear-gradient(180deg, rgba(6, 15, 30, 0.92), rgba(6, 14, 28, 0.78));
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
  }
  .portal-mobile-brand {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
  }
  .portal-mobile-mark {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    color: #f9f2df;
    font-size: 0.74rem;
    font-weight: 800;
    letter-spacing: 0.04em;
    background: linear-gradient(145deg, rgba(71, 155, 244, 0.32), rgba(13, 35, 65, 0.8));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
  }
  .portal-mobile-wordmark {
    display: grid;
    line-height: 1.05;
    color: var(--text);
    font-size: 0.94rem;
    font-weight: 700;
    letter-spacing: 0.02em;
  }
  .portal-mobile-wordmark small {
    color: var(--gold);
    font-size: 0.58rem;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
  }
  .portal-mobile-bell {
    position: relative;
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border: 1px solid var(--line);
    border-radius: 12px;
    color: var(--muted-strong);
    background: rgba(255, 255, 255, 0.04);
  }
  .portal-mobile-bell svg { width: 20px; height: 20px; fill: currentColor; }
  .portal-mobile-bell-count {
    position: absolute;
    top: -5px;
    right: -5px;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    color: #04121f;
    font-size: 0.66rem;
    font-weight: 800;
    background: var(--red);
    box-shadow: 0 0 0 2px rgba(6, 14, 28, 0.9);
  }

  /* ---- Fixed bottom navigation ---- */
  .portal-body:not(.portal-secure-gated) .portal-bottom-nav {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 60;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    height: calc(var(--portal-nav-h) + env(safe-area-inset-bottom, 0px));
    padding-bottom: env(safe-area-inset-bottom, 0px);
    border-top: 1px solid var(--line);
    background: linear-gradient(0deg, rgba(5, 12, 25, 0.96), rgba(7, 16, 31, 0.86));
    box-shadow: 0 -12px 34px rgba(0, 0, 0, 0.4);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
  }
  .portal-tab {
    display: grid;
    grid-template-rows: auto auto;
    gap: 3px;
    place-items: center;
    padding: 8px 2px 6px;
    border: 0;
    background: none;
    color: rgba(168, 190, 216, 0.72);
    font-size: 0.64rem;
    font-weight: 650;
    letter-spacing: 0.01em;
    text-decoration: none;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: color 0.2s ease, transform 0.12s ease;
  }
  .portal-tab svg { width: 22px; height: 22px; fill: currentColor; opacity: 0.9; }
  .portal-tab:active { transform: scale(0.92); }
  .portal-tab.is-active {
    color: var(--cyan);
  }
  .portal-tab.is-active svg {
    opacity: 1;
    filter: drop-shadow(0 0 10px rgba(121, 223, 246, 0.5));
  }
  .portal-tab.is-active::before {
    content: "";
    position: absolute;
    top: 0;
    width: 26px;
    height: 2px;
    border-radius: 0 0 3px 3px;
    background: var(--cyan);
    box-shadow: 0 0 10px rgba(121, 223, 246, 0.7);
  }
  .portal-tab { position: relative; }

  /* ---- Scrim + sheets ---- */
  .portal-body .portal-sheet-scrim {
    position: fixed;
    inset: 0;
    z-index: 65;
    display: block;
    background: rgba(2, 7, 16, 0.6);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    animation: portalScrimIn 0.2s ease;
  }
  .portal-body .portal-sheet-scrim[hidden] { display: none; }

  .portal-body .portal-more-sheet {
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 70;
    display: block;
    padding: 10px 16px calc(16px + env(safe-area-inset-bottom, 0px));
    border-radius: 22px 22px 0 0;
    border-top: 1px solid var(--line-strong);
    background: linear-gradient(180deg, rgba(12, 27, 50, 0.98), rgba(6, 14, 28, 0.99));
    box-shadow: 0 -24px 60px rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(26px);
    -webkit-backdrop-filter: blur(26px);
    animation: portalSheetIn 0.28s cubic-bezier(0.22, 0.7, 0.2, 1);
  }
  .portal-body .portal-more-sheet[hidden] { display: none; }
  .portal-sheet-grip {
    width: 42px;
    height: 4px;
    margin: 2px auto 12px;
    border-radius: 999px;
    background: rgba(168, 190, 216, 0.35);
  }
  .portal-sheet-title {
    margin: 0 0 12px;
    color: var(--gold);
    font-size: 0.66rem;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
  }
  .portal-more-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
  }
  .portal-more-item {
    display: grid;
    grid-template-rows: auto auto;
    gap: 8px;
    place-items: center;
    min-height: 88px;
    padding: 14px 8px;
    border: 1px solid var(--line);
    border-radius: 16px;
    color: var(--muted-strong);
    background: rgba(255, 255, 255, 0.035);
    font-size: 0.72rem;
    font-weight: 620;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: transform 0.12s ease, border-color 0.2s ease, background 0.2s ease;
  }
  .portal-more-item svg { width: 24px; height: 24px; fill: var(--cyan); opacity: 0.92; }
  .portal-more-item:active { transform: scale(0.96); }
  .portal-more-item.is-active {
    border-color: rgba(121, 223, 246, 0.34);
    background: linear-gradient(160deg, rgba(70, 152, 240, 0.18), rgba(255, 255, 255, 0.03));
    color: #f6fbff;
  }

  /* ---- Notification center reused as a top sheet ---- */
  .portal-body .portal-main .portal-notification-center {
    position: fixed;
    top: var(--portal-mtop-h);
    right: 8px;
    left: 8px;
    z-index: 70;
    max-height: min(70vh, 560px);
    margin: 8px 0 0;
    overflow: auto;
    border-radius: 18px;
    border: 1px solid var(--line-strong);
    background: linear-gradient(180deg, rgba(12, 27, 50, 0.98), rgba(6, 14, 28, 0.99));
    box-shadow: 0 30px 70px rgba(0, 0, 0, 0.55);
    transform: translateY(-12px);
    opacity: 0;
    pointer-events: none;
    transition: transform 0.25s ease, opacity 0.25s ease;
  }
  .portal-body.portal-notif-open .portal-main .portal-notification-center {
    transform: none;
    opacity: 1;
    pointer-events: auto;
  }
  /* No tiny dropdown filters on mobile — keep only the clear "mark all read" action. */
  .portal-body .portal-main .portal-notification-center #portalNotificationFilter,
  .portal-body .portal-main .portal-notification-center #portalNotificationFilter + .aurex-select {
    display: none;
  }
  .portal-body .portal-main .portal-notification-center .event-control-row {
    justify-content: flex-end;
  }

  /* ---- Content: single-column, no horizontal overflow ---- */
  .portal-body .portal-main .portal-welcome-panel,
  .portal-body .portal-main .portal-chart-grid,
  .portal-body .portal-main .portal-overview-grid,
  .portal-body .portal-main .carlos-system-card-grid,
  .portal-body .portal-main .strategy-form-grid,
  .portal-body .portal-main .analysis-input-grid {
    grid-template-columns: 1fr;
  }
  .portal-body .portal-main .portal-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }
  .portal-body .portal-main .portal-welcome-panel {
    padding: 18px;
  }
  .portal-body .portal-main .portal-kpi-grid .portal-stat strong {
    font-size: clamp(1.4rem, 6vw, 1.9rem);
  }

  /* Section heads / workspaces must never force width; long copy wraps */
  .portal-body .portal-main .strategy-lab-head > *,
  .portal-body .portal-main .chart-reader-head > *,
  .portal-body .portal-main .strategy-lab-head > * > *,
  .portal-body .portal-main .chart-reader-head > * > * {
    min-width: 0;
    max-width: 100%;
  }
  .portal-body .portal-main h1,
  .portal-body .portal-main h2,
  .portal-body .portal-main h3,
  .portal-body .portal-main p {
    overflow-wrap: break-word;
  }

  /* Prevent grid/flex track blowout: let tracks shrink below content min. */
  .portal-body .portal-main .portal-route-content * {
    min-width: 0;
  }

  /* Any wide media/table scrolls inside its own box, never the page. */
  .portal-body .portal-main .admin-table-wrap,
  .portal-body .portal-main .tradingview-widget-container,
  .portal-body .portal-main .carlos-context-strip {
    max-width: 100%;
    overflow-x: auto;
  }
  .portal-body .portal-main img,
  .portal-body .portal-main svg,
  .portal-body .portal-main canvas {
    max-width: 100%;
  }

  /* ---- Carlos: full-screen companion with keyboard-safe composer ---- */
  .portal-body .portal-main .carlos-shell {
    display: block;
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
  }
  .portal-body .portal-main .carlos-history-panel { display: none; }
  .portal-body .portal-main .carlos-memory-panel { display: none; }
  .portal-body .portal-main .carlos-chat-panel {
    display: flex;
    flex-direction: column;
    min-height: 60vh;
    padding: 0;
    border: 0;
    background: none;
  }
  .portal-body .portal-main .carlos-message-list {
    flex: 1 1 auto;
    min-height: 200px;
  }
  .portal-body .portal-main .carlos-context-strip {
    grid-auto-flow: column;
    grid-auto-columns: minmax(140px, 1fr);
    grid-template-columns: none;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
  }
  .portal-body .portal-main .carlos-context-strip > article { scroll-snap-align: start; }
  .portal-body .portal-main #carlosComposer {
    position: sticky;
    bottom: calc(var(--portal-nav-h) + env(safe-area-inset-bottom, 0px) + 8px);
    z-index: 30;
    margin-top: 12px;
    padding: 12px;
    border: 1px solid var(--line-strong);
    border-radius: 18px;
    background: linear-gradient(180deg, rgba(12, 27, 50, 0.97), rgba(6, 14, 28, 0.98));
    box-shadow: 0 -14px 34px rgba(0, 0, 0, 0.4), var(--glass-highlight);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
  }
  .portal-body .portal-main #carlosInput {
    min-height: 46px;
    font-size: 16px; /* prevents iOS focus zoom */
  }
  .portal-body .portal-main .carlos-composer-actions {
    flex-wrap: wrap;
    gap: 8px;
  }
  .portal-body .portal-main .carlos-composer-actions button {
    min-height: 42px;
  }
  .portal-body .portal-main .carlos-suggested-prompts {
    display: flex;
    gap: 8px;
    overflow-x: auto;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
  }
  .portal-body .portal-main .carlos-suggested-prompts button {
    flex: 0 0 auto;
    min-height: 40px;
  }

  /* Chart Reader: stacked, evidence collapses under the chart */
  .portal-body .portal-main .chart-reader-terminal {
    display: block;
  }
  .portal-body .portal-main .chart-reader-terminal > * + * {
    margin-top: 12px;
  }
  .portal-body .portal-main .chart-mode-switch {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Inputs/selects: comfortable tap targets, no iOS zoom */
  .portal-body .portal-main input,
  .portal-body .portal-main select,
  .portal-body .portal-main textarea,
  .portal-body .portal-main .aurex-select-button {
    min-height: 44px;
    font-size: 16px;
  }

  /* CTA rows stack full-width for clear hierarchy */
  .portal-body .portal-main .portal-onboarding-actions,
  .portal-body .portal-main .locked-state-actions {
    display: grid;
    gap: 10px;
  }
  .portal-body .portal-main .portal-onboarding-actions .primary-button,
  .portal-body .portal-main .portal-onboarding-actions .secondary-button,
  .portal-body .portal-main .locked-state-actions .primary-button,
  .portal-body .portal-main .locked-state-actions .secondary-button {
    width: 100%;
    justify-content: center;
  }
}

/* Small phones: single-column KPIs, tighter labels */
@media (max-width: 400px) {
  .portal-body .portal-main .portal-kpi-grid {
    grid-template-columns: 1fr;
  }
  .portal-body .portal-more-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .portal-tab span { font-size: 0.6rem; }
}

@keyframes portalScrimIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes portalSheetIn {
  from { transform: translateY(100%); }
  to { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .portal-body .portal-more-sheet,
  .portal-body .portal-sheet-scrim,
  .portal-body .portal-main .portal-notification-center {
    animation: none !important;
    transition: none !important;
  }
}

/* ============================================================
   AUREX PORTAL — mobile service experiences (brick 2)
   Recomposes existing rendered output into purpose-built mobile
   flows. Desktop is untouched (all rules are portal-scoped and
   mobile-gated). No logic, IDs, values, or handlers change.
   ============================================================ */

/* Chart Reader evidence groups: consistent labeled sections everywhere,
   tappable accordions on phones. Desktop keeps the existing expanded look. */
.portal-body .portal-main .cr-evidence-group {
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.02);
  overflow: hidden;
}
.portal-body .portal-main .cr-evidence-group > summary {
  list-style: none;
  cursor: pointer;
  padding: 12px 16px;
  color: var(--muted-strong);
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.portal-body .portal-main .cr-evidence-group > summary::-webkit-details-marker { display: none; }
.portal-body .portal-main .cr-evidence-group > summary::after {
  content: "";
  float: right;
  width: 8px;
  height: 8px;
  margin-top: 4px;
  border-right: 2px solid var(--cyan);
  border-bottom: 2px solid var(--cyan);
  transform: rotate(45deg);
  transition: transform 0.25s ease;
}
.portal-body .portal-main .cr-evidence-group[open] > summary::after { transform: rotate(-135deg); }
.portal-body .portal-main .cr-evidence-group > *:not(summary) { padding: 0 14px 14px; }

@media (max-width: 820px) {
  /* ===================== MOBILE HOME — daily command screen ===================== */
  .portal-body .portal-main .portal-route-content[data-route-key="overview"] {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .portal-route-content[data-route-key="overview"] .portal-welcome-panel { order: 1; }
  .portal-route-content[data-route-key="overview"] .client-recommendation-panel { order: 2; }
  .portal-route-content[data-route-key="overview"] .portal-overview-grid { order: 3; }
  .portal-route-content[data-route-key="overview"] .portal-kpi-grid { order: 4; }
  .portal-route-content[data-route-key="overview"] .intelligence-timeline-panel,
  .portal-route-content[data-route-key="overview"] .client-updates-panel { order: 5; }
  /* Dominant primary recommendation */
  .portal-body .portal-main .client-recommendation-panel {
    border-color: rgba(121, 223, 246, 0.28);
    background:
      radial-gradient(130% 100% at 0% 0%, rgba(70, 152, 240, 0.14), transparent 55%),
      linear-gradient(160deg, rgba(12, 27, 50, 0.6), rgba(6, 14, 28, 0.85));
  }
  .portal-body .portal-main .recommendation-primary-card { flex-direction: column; align-items: stretch; gap: 12px; }
  .portal-body .portal-main .recommendation-actions { display: grid; gap: 8px; }
  .portal-body .portal-main .recommendation-actions .primary-button { grid-column: 1 / -1; min-height: 46px; }
  .portal-body .portal-main .recommendation-actions .compact-action { width: 100%; justify-content: center; }
  /* Overview snapshot cards: dominant numbers, not a wall of equal cards */
  .portal-route-content[data-route-key="overview"] .portal-overview-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .portal-route-content[data-route-key="overview"] .portal-overview-grid .portal-profile-card,
  .portal-route-content[data-route-key="overview"] .portal-overview-grid .client-updates-panel { grid-column: 1 / -1; }
  .portal-body .portal-main .portal-focus-number strong { font-size: clamp(1.5rem, 7vw, 2rem); }

  /* ===================== CASHBACK — one focused rewards experience ===================== */
  .portal-route-content[data-route-key="cashback"] .portal-kpi-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  /* Estimated + Available become the dominant, full-width figures */
  .portal-route-content[data-route-key="cashback"] .portal-kpi-grid .portal-stat:nth-child(5),
  .portal-route-content[data-route-key="cashback"] .portal-kpi-grid .portal-stat:nth-child(6) {
    grid-column: 1 / -1;
    background: linear-gradient(160deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.012)), rgba(4, 12, 24, 0.5);
  }
  .portal-route-content[data-route-key="cashback"] .portal-kpi-grid .portal-stat:nth-child(6) strong {
    font-size: clamp(1.9rem, 9vw, 2.6rem);
    color: var(--green);
  }
  .portal-route-content[data-route-key="cashback"] .portal-kpi-grid .portal-stat:nth-child(5) strong {
    font-size: clamp(1.5rem, 7vw, 2rem);
  }
  /* Request action is prominent; history reads as a ledger, not a table */
  .portal-route-content[data-route-key="cashback"] .portal-chart-grid { grid-template-columns: 1fr; }
  .portal-route-content[data-route-key="cashback"] #requestCashbackPayout { width: 100%; min-height: 48px; }
  .portal-body .portal-main .cashback-history-card .portal-history-list > div {
    display: grid;
    grid-template-columns: 1fr auto auto;
    align-items: center;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid var(--line);
  }

  /* ===================== PERFORMANCE — coaching, main lesson in 5s ===================== */
  .portal-route-content[data-route-key="activity"] {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .portal-route-content[data-route-key="activity"] .portal-welcome-panel { order: 1; }
  .portal-route-content[data-route-key="activity"] .performance-coach-panel { order: 2; }
  .portal-route-content[data-route-key="activity"] .portal-kpi-grid { order: 3; }
  .portal-route-content[data-route-key="activity"] .portal-chart-grid { order: 4; }
  /* Scores first and dominant */
  .portal-body .portal-main .coach-score-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .portal-body .portal-main .coach-score-grid .portal-stat:nth-child(n+4) { grid-column: span 1; }
  .portal-body .portal-main .coach-score-grid .portal-stat:nth-child(-n+3) strong {
    font-size: clamp(1.5rem, 8vw, 2.1rem);
  }
  .portal-body .portal-main .coach-score-grid .portal-stat:nth-child(1) strong { color: var(--cyan); }
  .portal-body .portal-main .coach-score-grid .portal-stat:nth-child(2) strong { color: var(--green); }
  .portal-body .portal-main .coach-score-grid .portal-stat:nth-child(3) strong { color: var(--blue); }
  .portal-body .portal-main .coach-insight-grid { grid-template-columns: 1fr; gap: 10px; }
  .portal-body .portal-main #askCarlosPerformanceBtn { width: 100%; min-height: 46px; margin-top: 4px; }
  /* Show one chart prominently; keep the rest available but secondary */
  .portal-route-content[data-route-key="activity"] .portal-chart-grid { grid-template-columns: 1fr; }

  /* ===================== CARLOS — response presentation ===================== */
  .portal-body .portal-main .carlos-structured-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    padding: 12px;
    background: rgba(255, 255, 255, 0.02);
  }
  .portal-body .portal-main .carlos-evidence-list { display: flex; flex-wrap: wrap; gap: 6px; }
  .portal-body .portal-main .carlos-evidence-list article {
    padding: 6px 10px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: rgba(121, 223, 246, 0.06);
    font-size: 0.78rem;
    color: var(--muted-strong);
  }
  .portal-body .portal-main .scenario-compare-grid { grid-template-columns: 1fr; gap: 8px; }
  .portal-body .portal-main .confidence-meter { margin: 6px 0 10px; }
  .portal-body .portal-main .carlos-message.assistant { border-left: 2px solid rgba(121, 223, 246, 0.45); }
  .portal-body .portal-main .carlos-message.user { border-left: 2px solid rgba(108, 168, 247, 0.4); }
  .portal-body .portal-main .carlos-message.is-error { border-left-color: var(--red); }
  .portal-body .portal-main .carlos-message.is-streaming p::after {
    content: "";
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-left: 4px;
    border-radius: 50%;
    background: var(--cyan);
    animation: carlosPulse 1s ease-in-out infinite;
  }

  /* ===================== NOTIFICATIONS — alerts first, large actions ===================== */
  .portal-body .portal-main .portal-notification-center .notification-list { display: flex; flex-direction: column; }
  .portal-body .portal-main .notification-item { order: 0; }
  .portal-body .portal-main .notification-item.critical { order: -3; border-left: 3px solid var(--red); }
  .portal-body .portal-main .notification-item.warning { order: -2; border-left: 3px solid var(--yellow); }
  .portal-body .portal-main .notification-item.is-unread { order: -1; }
  .portal-body .portal-main .notification-item .notification-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
  .portal-body .portal-main .notification-item .notification-actions .compact-action { min-height: 40px; flex: 1 1 auto; justify-content: center; }

  /* ===================== STRATEGY LAB — guided stepper ===================== */
  .portal-body .portal-main .strategy-builder-form.is-mstep > label[data-mstep] { display: none; }
  .portal-body .portal-main .strategy-builder-form.is-mstep > label.is-current-step { display: grid; }
  .portal-body .portal-main .strategy-mstep-nav {
    display: block;
    margin: 0 0 14px;
  }
  .portal-body .portal-main .strategy-mstep-progress {
    height: 4px;
    border-radius: 999px;
    background: rgba(150, 184, 220, 0.16);
    overflow: hidden;
    margin-bottom: 10px;
  }
  .portal-body .portal-main .strategy-mstep-progress i {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, var(--cyan), var(--blue));
    transition: width 0.3s cubic-bezier(0.22, 0.7, 0.2, 1);
  }
  .portal-body .portal-main .strategy-mstep-row {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 10px;
  }
  .portal-body .portal-main .strategy-mstep-label {
    text-align: center;
    color: var(--muted-strong);
    font-size: 0.72rem;
    font-weight: 650;
  }
  .portal-body .portal-main .strategy-mstep-row .primary-button,
  .portal-body .portal-main .strategy-mstep-row .secondary-button { min-height: 42px; }
  /* The desktop micro-stepper decoration is replaced by the guided nav on mobile */
  .portal-body .portal-main .strategy-stepper { display: none; }

  /* ===================== Shared mobile state polish ===================== */
  .portal-body .portal-main .portal-empty-module,
  .portal-body .portal-main .education-empty-state,
  .portal-body .portal-main .carlos-empty-state {
    text-align: center;
    padding: 28px 18px;
  }
  .portal-body .portal-main .portal-welcome-panel h3 { font-size: clamp(1.15rem, 5vw, 1.4rem); }
  .portal-body .portal-stat strong { letter-spacing: -0.01em; }
}

/* Strategy stepper nav is a mobile-only control */
@media (min-width: 821px) {
  .portal-body .portal-main .strategy-mstep-nav { display: none; }
}

@keyframes carlosPulse {
  0%, 100% { opacity: 0.3; transform: scale(0.8); }
  50% { opacity: 1; transform: scale(1.1); }
}

@media (prefers-reduced-motion: reduce) {
  .portal-body .portal-main .cr-evidence-group > summary::after,
  .portal-body .portal-main .strategy-mstep-progress i,
  .portal-body .portal-main .carlos-message.is-streaming p::after {
    transition: none !important;
    animation: none !important;
  }
}

/* ============================================================
   AUREX PORTAL — Brick 3: mobile UX completion + premium
   consistency. Portal-scoped, mobile-gated where structural.
   No logic, IDs, values, or handlers changed.
   ============================================================ */

/* ---------- Notification grouping (Today / This Week / Earlier) ----------
   Desktop stays a flat chronological list (groups are transparent, labels
   hidden). Mobile shows the labelled buckets. */
.portal-body .notif-group { display: contents; }
.portal-body .notif-group-label { display: none; }

/* ---------- Chart Reader: confirmation/invalidation gate (all viewports) ---------- */
.portal-body .portal-main .scenario-confirm-card .cr-gate {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 8px;
  align-items: baseline;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}
.portal-body .portal-main .scenario-confirm-card .cr-gate:first-of-type { border-top: 0; padding-top: 0; }
.portal-body .portal-main .scenario-confirm-card .cr-gate em {
  font-style: normal;
  font-weight: 750;
  font-size: 0.62rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  white-space: nowrap;
}
.portal-body .portal-main .scenario-confirm-card .cr-gate.is-confirm em { color: var(--green); }
.portal-body .portal-main .scenario-confirm-card .cr-gate.is-invalidate em { color: var(--red); }
.portal-body .portal-main .scenario-confirm-card .cr-gate p { margin: 0; color: var(--muted-strong); }

/* ---------- Carlos Memory: compact expandable (desktop keeps expanded look) ---------- */
.portal-body .portal-main .carlos-memory-panel > summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 10px;
}
.portal-body .portal-main .carlos-memory-panel > summary::-webkit-details-marker { display: none; }
.portal-body .portal-main .carlos-memory-panel > summary h3 { margin: 0; }
.portal-body .portal-main .carlos-memory-panel .carlos-memory-count {
  margin-left: auto;
  padding: 3px 9px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: 0.66rem;
  font-weight: 700;
}
.portal-body .portal-main .carlos-memory-panel > summary::after {
  content: "";
  width: 8px;
  height: 8px;
  border-right: 2px solid var(--cyan);
  border-bottom: 2px solid var(--cyan);
  transform: rotate(45deg);
  transition: transform 0.25s ease;
}
.portal-body .portal-main .carlos-memory-panel[open] > summary::after { transform: rotate(-135deg); }
.portal-body .portal-main .carlos-memory-body { margin-top: 12px; }

/* ============================================================
   MOBILE (<= 820px)
   ============================================================ */
@media (max-width: 820px) {
  /* Notification buckets become visible sections; large tap actions carry over. */
  .portal-body .portal-main .notif-group { display: block; }
  .portal-body .portal-main .notif-group + .notif-group { margin-top: 10px; }
  .portal-body .portal-main .notif-group-label {
    display: block;
    padding: 6px 2px 8px;
    color: var(--muted);
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
  }
  .portal-body .portal-main .notif-group .notification-item + .notification-item { margin-top: 8px; }

  /* Carlos memory: un-hide (brick 2 hid it) and present collapsed by default on phones. */
  .portal-body .portal-main .carlos-memory-panel { display: block; }

  /* ---------- Strategy Lab: 9-step flow phases ---------- */
  .portal-body .strategy-lab-workspace[data-mphase="form"] #strategyChecklist,
  .portal-body .strategy-lab-workspace[data-mphase="form"] .recent-strategy-panel,
  .portal-body .strategy-lab-workspace[data-mphase="form"] .strategy-plan-zone { display: none; }

  .portal-body .strategy-lab-workspace[data-mphase="checklist"] .strategy-builder-form,
  .portal-body .strategy-lab-workspace[data-mphase="checklist"] .recent-strategy-panel,
  .portal-body .strategy-lab-workspace[data-mphase="checklist"] .strategy-plan-zone { display: none; }

  .portal-body .strategy-lab-workspace[data-mphase="review"] .strategy-builder-form,
  .portal-body .strategy-lab-workspace[data-mphase="review"] #strategyChecklist,
  .portal-body .strategy-lab-workspace[data-mphase="review"] .strategy-plan-zone,
  .portal-body .strategy-lab-workspace[data-mphase="review"] #recentStrategyList,
  .portal-body .strategy-lab-workspace[data-mphase="review"] .recent-strategy-panel > span { display: none; }

  /* Checklist step reads as tappable rows */
  .portal-body .strategy-lab-workspace[data-mphase="checklist"] #strategyChecklist label {
    min-height: 46px;
    align-items: center;
  }
  /* Review step: readiness card leads */
  .portal-body .strategy-lab-workspace[data-mphase="review"] .strategy-review-card { margin-top: 4px; }

  /* ---------- Home: connected daily-command flow ---------- */
  .portal-route-content[data-route-key="overview"] { position: relative; }
  .portal-route-content[data-route-key="overview"] .client-recommendation-panel {
    position: relative;
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.4), inset 0 0 0 1px rgba(121, 223, 246, 0.14), var(--glass-highlight);
  }
  .portal-route-content[data-route-key="overview"] .client-recommendation-panel::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 3px;
    border-radius: 3px 0 0 3px;
    background: linear-gradient(180deg, var(--cyan), var(--blue));
  }
  .portal-route-content[data-route-key="overview"] .portal-welcome-panel h3 { letter-spacing: -0.01em; }

  /* ---------- Chart Reader: decision card hierarchy ---------- */
  .portal-body .portal-main .evidence-command-grid { grid-template-columns: 1fr; gap: 10px; }
  .portal-body .portal-main .scenario-summary-card {
    border-color: rgba(121, 223, 246, 0.24);
    background: radial-gradient(130% 100% at 0% 0%, rgba(70, 152, 240, 0.12), transparent 55%), rgba(255, 255, 255, 0.02);
  }
  .portal-body .portal-main .scenario-summary-card strong { font-size: clamp(1.4rem, 7vw, 1.9rem); }
  .portal-body .portal-main .scenario-risk-card strong { color: var(--yellow); }
  .portal-body .portal-main .evidence-reader-output .primary-button { width: 100%; min-height: 46px; }
}

/* ============================================================
   DESKTOP CONSISTENCY (restrained — no architecture change)
   ============================================================ */
/* Numeric emphasis across portal figures */
.portal-body .portal-stat strong,
.portal-body .portal-main .portal-focus-number strong,
.portal-body .portal-main .strategy-score-card strong,
.portal-body .portal-main .coach-score-grid .portal-stat strong,
.portal-body .portal-main .scenario-summary-card strong {
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.012em;
}
/* Consistent semantic status tones */
.portal-body .portal-status-pill.positive { color: var(--green); }
.portal-body .portal-status-pill.warning { color: var(--yellow); }
.portal-body .portal-status-pill.danger { color: var(--red); }
/* Header hierarchy consistency for section eyebrows */
.portal-body .portal-main .panel-header.compact .eyebrow { opacity: 0.92; }
/* Empty / loading / error state polish */
.portal-body .portal-main .portal-empty-module,
.portal-body .portal-main .insufficient-data-state {
  border: 1px dashed var(--line-strong);
  border-radius: var(--surface-radius);
  background: rgba(255, 255, 255, 0.015);
}
.portal-body .portal-main .insufficient-data-state {
  border-style: solid;
  border-color: rgba(231, 199, 106, 0.3);
  background: rgba(231, 199, 106, 0.06);
  padding: 14px 16px;
}
.portal-body .portal-main .carlos-message.is-error {
  background: rgba(255, 100, 116, 0.06);
}

/* Chart Reader accordion tap targets, desktop keeps summaries hidden (unchanged look) */
@media (min-width: 821px) {
  .portal-body .portal-main .cr-evidence-group { border: 0; background: none; margin-top: 14px; }
  .portal-body .portal-main .cr-evidence-group > summary { display: none; }
  .portal-body .portal-main .cr-evidence-group > *:not(summary) { padding: 0; }
  /* Carlos memory summary reads as a header on desktop (already expanded) */
  .portal-body .portal-main .carlos-memory-panel > summary::after { opacity: 0.55; }
}

@media (prefers-reduced-motion: reduce) {
  .portal-body .portal-main .carlos-memory-panel > summary::after,
  .portal-body .portal-main .scenario-confirm-card .cr-gate {
    transition: none !important;
  }
}

/* ============================================================
   AUREX PORTAL — PREMIUM PASS 1 (visual luxury layer)
   Refinement only: typography, glass materials, cards, number
   hierarchy, charts, loading/empty states, micro-interactions.
   No display/grid/position changes — nothing moves. Portal-scoped.
   ============================================================ */
.portal-body {
  --px-white: #f6f9ff;
  --px-edge: rgba(255, 255, 255, 0.10);
  --px-edge-soft: rgba(255, 255, 255, 0.06);
  --px-hair: rgba(121, 223, 246, 0.07);
  --px-ease: cubic-bezier(0.22, 0.7, 0.2, 1);
  /* Elevation scale */
  --px-e1: 0 14px 34px -18px rgba(1, 6, 16, 0.5), inset 0 1px 0 var(--px-edge-soft);
  --px-e2: 0 26px 60px -28px rgba(1, 6, 16, 0.6), inset 0 1px 0 var(--px-edge), inset 0 0 0 1px var(--px-hair);
  --px-e3: 0 40px 90px -30px rgba(1, 6, 16, 0.72), inset 0 1px 0 rgba(255, 255, 255, 0.13), inset 0 0 0 1px var(--px-hair);
}

/* ---------------- Typography: calmer, editorial, anchored numbers --------------- */
.portal-body .portal-main .portal-topbar h2 {
  font-weight: 640;
  letter-spacing: -0.02em;
}
.portal-body .portal-main h2,
.portal-body .portal-main h3 {
  letter-spacing: -0.014em;
}
.portal-body .portal-main .panel-header .eyebrow,
.portal-body .portal-main .portal-welcome-panel .eyebrow {
  font-size: 0.64rem;
  letter-spacing: 0.14em;
  opacity: 0.9;
}
.portal-body .portal-main p { line-height: 1.6; }
.portal-body .portal-main .portal-welcome-panel p,
.portal-body .portal-main .panel-header + p { color: rgba(200, 214, 234, 0.72); }

/* Numbers become the visual anchors */
.portal-body .portal-stat strong,
.portal-body .portal-main .portal-metric-value,
.portal-body .portal-main .portal-focus-number strong,
.portal-body .portal-main .strategy-score-card strong,
.portal-body .portal-main .coach-score-grid .portal-stat strong,
.portal-body .portal-main .scenario-summary-card strong,
.portal-body .portal-main .strategy-review-card h3,
.portal-body .portal-main .education-progress-card strong {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
  letter-spacing: -0.015em;
  color: var(--px-white);
}
.portal-body .portal-main .portal-focus-number strong,
.portal-body .portal-main .strategy-score-card strong,
.portal-body .portal-main .education-progress-card strong {
  text-shadow: 0 0 26px rgba(121, 223, 246, 0.16);
}
.portal-body .portal-main .portal-focus-number span,
.portal-body .portal-stat span {
  color: rgba(160, 182, 210, 0.82);
  letter-spacing: 0.02em;
}

/* ============================================================
   GLASS MATERIAL SYSTEM
   ============================================================ */
/* Command Glass — top-level command surfaces (brightest, deepest) */
.portal-body .portal-main .portal-topbar,
.portal-body .portal-main .portal-welcome-panel {
  border-color: rgba(150, 200, 244, 0.16);
  box-shadow: var(--px-e3);
}
/* Intelligence Glass — reasoning surfaces (cyan-lit) */
.portal-body .portal-main .client-recommendation-panel,
.portal-body .portal-main .carlos-structured-card,
.portal-body .portal-main .performance-coach-panel,
.portal-body .portal-main .strategy-review-card {
  border-color: rgba(121, 223, 246, 0.18);
  background:
    radial-gradient(120% 100% at 0% 0%, rgba(70, 152, 240, 0.10), transparent 55%),
    linear-gradient(160deg, rgba(12, 27, 50, 0.55), rgba(6, 14, 28, 0.8));
  box-shadow: var(--px-e2);
}
/* Data Glass — metric/chart surfaces (matte, precise) */
.portal-body .portal-main .portal-chart-card,
.portal-body .portal-main .kpi-card,
.portal-body .portal-main .strategy-summary-card,
.portal-body .portal-main .coach-list-card,
.portal-body .portal-main .portal-profile-card {
  box-shadow: var(--px-e1);
}
.portal-body .portal-main .portal-kpi-grid .portal-stat,
.portal-body .portal-main .coach-score-grid .portal-stat {
  border: 1px solid var(--line);
  border-radius: 16px;
  background:
    linear-gradient(160deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.01)),
    rgba(4, 12, 24, 0.35);
  box-shadow: inset 0 1px 0 var(--px-edge-soft);
}
/* Alert Glass — status surfaces */
.portal-body .portal-main .notification-item.critical {
  background: linear-gradient(160deg, rgba(255, 100, 116, 0.08), rgba(255, 255, 255, 0.008));
}
.portal-body .portal-main .notification-item.warning {
  background: linear-gradient(160deg, rgba(231, 199, 106, 0.07), rgba(255, 255, 255, 0.008));
}

/* ============================================================
   CARDS — engineered, consistent radius + hover depth
   ============================================================ */
.portal-body .portal-stat,
.portal-body .portal-main .portal-chart-card,
.portal-body .portal-main .glass-panel,
.portal-body .portal-main .coach-list-card,
.portal-body .portal-main .notification-item {
  transition: transform 0.4s var(--px-ease), border-color 0.4s var(--px-ease), box-shadow 0.4s var(--px-ease);
}
@media (hover: hover) and (min-width: 821px) {
  .portal-body .portal-stat:hover,
  .portal-body .portal-main .portal-chart-card:hover,
  .portal-body .portal-main .glass-panel:hover {
    transform: translateY(-2px);
    border-color: rgba(121, 223, 246, 0.24);
    box-shadow: var(--px-e2);
  }
  .portal-body .portal-main .notification-item:hover {
    border-color: rgba(121, 223, 246, 0.2);
  }
}

/* Buttons — Action Glass, refined depth (no scaling) */
.portal-body .portal-main .primary-button,
.portal-body .portal-main .secondary-button {
  transition: transform 0.28s var(--px-ease), box-shadow 0.28s var(--px-ease), border-color 0.28s var(--px-ease), background 0.28s var(--px-ease);
  will-change: transform;
}
@media (hover: hover) {
  .portal-body .portal-main .primary-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 18px 40px -14px rgba(62, 144, 236, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.2);
  }
  .portal-body .portal-main .secondary-button:hover {
    transform: translateY(-2px);
    border-color: rgba(121, 223, 246, 0.32);
  }
}
/* Inputs / selects — calm focus ring */
.portal-body .portal-main input:focus-visible,
.portal-body .portal-main select:focus-visible,
.portal-body .portal-main textarea:focus-visible,
.portal-body .portal-main .aurex-select.is-open .aurex-select-button {
  outline: none;
  border-color: rgba(121, 223, 246, 0.5);
  box-shadow: 0 0 0 3px rgba(121, 223, 246, 0.14);
}

/* ============================================================
   DATA VISUALIZATION — institutional
   ============================================================ */
.portal-body .portal-main .portal-line-chart svg line { stroke: rgba(121, 223, 246, 0.09); stroke-width: 1; }
.portal-body .portal-main .portal-line-chart .chart-line-reveal {
  stroke: var(--cyan);
  stroke-width: 2.2;
  filter: drop-shadow(0 3px 8px rgba(121, 223, 246, 0.28));
}
.portal-body .portal-main .portal-line-chart .chart-area-fill {
  fill: rgba(121, 223, 246, 0.08);
}
.portal-body .portal-main .portal-line-chart circle { fill: rgba(160, 200, 245, 0.5); }
.portal-body .portal-main .portal-line-chart circle.is-latest {
  fill: var(--px-white);
  filter: drop-shadow(0 0 6px rgba(121, 223, 246, 0.9));
}
.portal-body .portal-main .portal-chart-axis span { color: rgba(150, 172, 202, 0.6); font-variant-numeric: tabular-nums; }

/* Progress rails + meters */
.portal-body .portal-main .portal-progress,
.portal-body .portal-main .strategy-readiness-bar,
.portal-body .portal-main .lesson-progress,
.portal-body .portal-main .confidence-meter {
  background: rgba(150, 184, 220, 0.14);
  border-radius: 999px;
  overflow: hidden;
}
.portal-body .portal-main .portal-progress span,
.portal-body .portal-main .strategy-readiness-bar i,
.portal-body .portal-main .lesson-progress span {
  background: linear-gradient(90deg, var(--cyan), var(--blue));
  box-shadow: 0 0 14px rgba(121, 223, 246, 0.4);
  border-radius: 999px;
}
.portal-body .portal-main .confidence-meter i {
  background: linear-gradient(90deg, var(--cyan), var(--blue));
  box-shadow: 0 0 12px rgba(121, 223, 246, 0.35);
}
.portal-body .portal-main .confidence-meter[data-direction="bullish"] i,
.portal-body .portal-main .confidence-meter[data-direction="positive"] i { background: linear-gradient(90deg, var(--green), #8fe6c0); box-shadow: 0 0 12px rgba(89, 211, 144, 0.35); }
.portal-body .portal-main .confidence-meter[data-direction="bearish"] i,
.portal-body .portal-main .confidence-meter[data-direction="danger"] i { background: linear-gradient(90deg, var(--red), #ff9aa6); box-shadow: 0 0 12px rgba(255, 100, 116, 0.3); }

/* ============================================================
   CARLOS — alive conversation
   ============================================================ */
.portal-body .portal-main .carlos-message {
  border-radius: 16px;
  padding: 13px 15px;
}
.portal-body .portal-main .carlos-message + .carlos-message { margin-top: 12px; }
.portal-body .portal-main .carlos-message.user {
  background: linear-gradient(160deg, rgba(108, 168, 247, 0.12), rgba(255, 255, 255, 0.01));
  border: 1px solid rgba(108, 168, 247, 0.16);
}
.portal-body .portal-main .carlos-message.assistant {
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.035), rgba(255, 255, 255, 0.008));
  border: 1px solid var(--line);
}
.portal-body .portal-main .carlos-message > div span { color: var(--cyan); font-weight: 700; letter-spacing: 0.02em; }
.portal-body .portal-main .carlos-message time { color: rgba(150, 172, 202, 0.55); }
/* Thinking / typing state: three soft dots */
.portal-body .portal-main .carlos-message.is-streaming p {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: rgba(200, 214, 234, 0.75);
}
.portal-body .portal-main .carlos-message.is-streaming p::after {
  content: "";
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--cyan);
  box-shadow: 10px 0 0 rgba(121, 223, 246, 0.5), 20px 0 0 rgba(121, 223, 246, 0.25);
  animation: pxTyping 1.1s ease-in-out infinite;
}
.portal-body .portal-main .carlos-evidence-list article {
  padding: 6px 11px;
  border: 1px solid rgba(121, 223, 246, 0.16);
  border-radius: 999px;
  background: rgba(121, 223, 246, 0.05);
  color: rgba(214, 232, 245, 0.9);
  font-size: 0.78rem;
}
.portal-body .portal-main .carlos-structured-card { border-radius: 16px; }

/* ============================================================
   CHART READER — premium decision surface
   ============================================================ */
.portal-body .portal-main .scenario-summary-card strong { font-size: clamp(1.4rem, 2.4vw, 1.9rem); }
.portal-body .portal-main .scenario-plan-head h3 { letter-spacing: -0.015em; }
.portal-body .portal-main .cr-evidence-group > summary:hover { color: var(--px-white); }
.portal-body .portal-main .trade-plan-levels article strong,
.portal-body .portal-main .scenario-risk-card strong { font-variant-numeric: tabular-nums; }

/* ============================================================
   STRATEGY BUILDER — refined step + review feel
   ============================================================ */
.portal-body .portal-main .strategy-stepper article { transition: border-color 0.3s var(--px-ease), background 0.3s var(--px-ease); }
.portal-body .portal-main .strategy-stepper article.is-complete { border-color: rgba(89, 211, 144, 0.3); }
.portal-body .portal-main .strategy-review-card .strategy-review-lists article span { color: var(--gold); letter-spacing: 0.08em; }
.portal-body .portal-main .strategy-mstep-progress i { box-shadow: 0 0 12px rgba(121, 223, 246, 0.45); }

/* ============================================================
   PERFORMANCE — score emphasis
   ============================================================ */
.portal-body .portal-main .coach-score-grid .portal-stat strong { letter-spacing: -0.02em; }
.portal-body .portal-main .coach-list-card.positive span { color: var(--green); }
.portal-body .portal-main .coach-list-card.warning span { color: var(--yellow); }
.portal-body .portal-main .coach-list-card.danger span { color: var(--red); }

/* ============================================================
   NOTIFICATIONS — read/unread distinction + severity dots
   ============================================================ */
.portal-body .portal-main .notification-item { border-radius: 14px; }
.portal-body .portal-main .notification-item.is-unread { box-shadow: inset 3px 0 0 var(--cyan); }
.portal-body .portal-main .notification-item strong::before {
  content: "";
  display: inline-block;
  width: 7px; height: 7px;
  margin-right: 8px;
  border-radius: 50%;
  background: rgba(160, 182, 210, 0.4);
  vertical-align: middle;
}
.portal-body .portal-main .notification-item.critical strong::before { background: var(--red); box-shadow: 0 0 8px rgba(255, 100, 116, 0.6); }
.portal-body .portal-main .notification-item.warning strong::before { background: var(--yellow); box-shadow: 0 0 8px rgba(231, 199, 106, 0.55); }
.portal-body .portal-main .notification-item.success strong::before { background: var(--green); box-shadow: 0 0 8px rgba(89, 211, 144, 0.5); }

/* ============================================================
   LOADING + EMPTY — premium states
   ============================================================ */
.portal-body .aurex-skeleton {
  position: relative;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.04);
  border-radius: 10px;
}
.portal-body .aurex-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent, rgba(160, 200, 245, 0.12), transparent);
  transform: translateX(-100%);
  animation: pxShimmer 1.6s ease-in-out infinite;
}
.portal-body .portal-secure-loader span,
.portal-body .portal-secure-orb span {
  box-shadow: 0 0 24px rgba(121, 223, 246, 0.4);
}
.portal-body .portal-main .portal-empty-module {
  text-align: center;
}
.portal-body .portal-main .portal-empty-module .eyebrow { color: var(--cyan); opacity: 0.85; }

/* ============================================================
   MOTION — restrained, reduced-motion aware
   ============================================================ */
@keyframes pxTyping {
  0%, 100% { opacity: 0.35; }
  50% { opacity: 1; }
}
@keyframes pxShimmer {
  100% { transform: translateX(100%); }
}
@media (prefers-reduced-motion: reduce) {
  .portal-body .portal-main .carlos-message.is-streaming p::after,
  .portal-body .aurex-skeleton::after { animation: none !important; }
  .portal-body .portal-stat,
  .portal-body .portal-main .portal-chart-card,
  .portal-body .portal-main .glass-panel,
  .portal-body .portal-main .primary-button,
  .portal-body .portal-main .secondary-button { transition: none !important; }
}

/* ============================================================
   AUREX PORTAL — PREMIUM PASS 2
   Institutional data-viz, loading/empty/feedback states.
   Presentation only; no layout moves, no logic. Portal-scoped.
   ============================================================ */

/* ---------------- Empty states: calm icon + one action ---------------- */
.portal-body .portal-main .portal-empty-module {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 6px;
  padding: 34px 22px;
}
.portal-body .portal-main .portal-empty-icon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  margin-bottom: 8px;
  border: 1px solid var(--line);
  border-radius: 16px;
  background: radial-gradient(120% 120% at 50% 0%, rgba(121, 223, 246, 0.1), transparent 60%), rgba(255, 255, 255, 0.02);
  box-shadow: inset 0 1px 0 var(--px-edge-soft);
}
.portal-body .portal-main .portal-empty-icon svg {
  width: 30px;
  height: 30px;
  stroke: var(--cyan);
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.9;
}
.portal-body .portal-main .portal-empty-module h3 { margin: 2px 0 0; }
.portal-body .portal-main .portal-empty-module p { max-width: 44ch; }
.portal-body .portal-main .portal-empty-module .secondary-button,
.portal-body .portal-main .portal-empty-module .primary-button { margin-top: 10px; }

/* Carlos empty state gets the same calm treatment */
.portal-body .portal-main .carlos-empty-state { text-align: center; }

/* ---------------- Segmented readiness rail (Strategy) ---------------- */
.portal-body .portal-main .strategy-readiness-bar {
  position: relative;
  height: 10px;
}
.portal-body .portal-main .strategy-readiness-bar::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: inherit;
  background-image: repeating-linear-gradient(90deg, transparent 0 calc(10% - 2px), rgba(3, 8, 18, 0.55) calc(10% - 2px) 10%);
}
.portal-body .portal-main .strategy-review-card[data-review-status="ready"] .strategy-readiness-bar i { background: linear-gradient(90deg, var(--green), #8fe6c0); box-shadow: 0 0 14px rgba(89, 211, 144, 0.45); }
.portal-body .portal-main .strategy-review-card[data-review-status="needs_review"] .strategy-readiness-bar i { background: linear-gradient(90deg, var(--red), #ff9aa6); box-shadow: 0 0 14px rgba(255, 100, 116, 0.4); }

/* Mobile step progress uses the same segmented language */
.portal-body .portal-main .strategy-mstep-progress { position: relative; }

/* ---------------- Confidence gauge (Chart Reader + Carlos) ---------------- */
.portal-body .portal-main .confidence-meter { position: relative; height: 12px; }
.portal-body .portal-main .confidence-meter span {
  position: relative;
  z-index: 2;
  font-variant-numeric: tabular-nums;
  font-weight: 650;
}

/* ---------------- Charts: institutional line + readable axis ---------------- */
.portal-body .portal-main .portal-line-chart .chart-line-reveal {
  stroke-linecap: round;
  stroke-linejoin: round;
}
.portal-body .portal-main .portal-chart-axis span {
  font-size: 0.72rem;
  color: rgba(160, 182, 210, 0.62);
  letter-spacing: 0.01em;
}
.portal-body .portal-main .portal-chart-head strong {
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  color: var(--px-white);
}
.portal-body .portal-main .portal-chart-empty {
  display: grid;
  place-items: center;
  min-height: 120px;
  color: rgba(160, 182, 210, 0.6);
  text-align: center;
}
/* Cashback / loyalty history rows read as a compact ledger visualization */
.portal-body .portal-main .portal-history-list > div {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
}
.portal-body .portal-main .portal-history-list > div:last-child { border-bottom: 0; }
.portal-body .portal-main .portal-history-list strong { font-variant-numeric: tabular-nums; color: var(--px-white); }

.portal-body .portal-main .leaderboard-card { overflow: hidden; }
.portal-body .portal-main .leaderboard-table { display: grid; gap: 0; }
.portal-body .portal-main .leaderboard-row { display: grid; grid-template-columns: 72px minmax(0, 1.6fr) minmax(110px, 1fr) minmax(100px, .8fr); gap: 16px; align-items: center; padding: 13px 0; border-bottom: 1px solid var(--line); }
.portal-body .portal-main .leaderboard-row:last-child { border-bottom: 0; }
.portal-body .portal-main .leaderboard-row > :last-child { text-align: right; font-variant-numeric: tabular-nums; }
.portal-body .portal-main .leaderboard-head { color: rgba(160, 182, 210, .68); font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; }
.portal-body .portal-main .leaderboard-place-1 > :first-child { color: #d9b56c; }
.portal-body .portal-main .leaderboard-place-2 > :first-child { color: #b9c7d8; }
.portal-body .portal-main .leaderboard-place-3 > :first-child { color: #b98564; }
.portal-body .portal-main .leaderboard-top-card { padding: 20px; border: 1px solid var(--line); background: var(--panel); border-radius: 8px; }
.portal-body .portal-main .leaderboard-top-rankings { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.portal-body .portal-main .leaderboard-top-rank { display: grid; gap: 5px; min-height: 92px; padding: 14px; border: 1px solid var(--line); border-radius: 6px; background: rgba(255, 255, 255, .025); }
.portal-body .portal-main .leaderboard-top-rank span { font-size: .72rem; color: rgba(160, 182, 210, .72); }
.portal-body .portal-main .leaderboard-top-rank strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--px-white); }
.portal-body .portal-main .leaderboard-top-rank small { color: rgba(160, 182, 210, .72); }
.portal-body .portal-main .leaderboard-top-rank-1 span { color: #d9b56c; }
.portal-body .portal-main .leaderboard-top-rank-2 span { color: #b9c7d8; }
.portal-body .portal-main .leaderboard-top-rank-3 span { color: #b98564; }
.portal-body .portal-main .leaderboard-empty { display: grid; gap: 5px; padding: 26px 0 12px; color: rgba(160, 182, 210, .75); }
.portal-body .portal-main .leaderboard-empty strong { color: var(--px-white); }
.portal-body .portal-main .portal-ecosystem-panel {
  display: grid;
  gap: 16px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
}
.portal-body .portal-main .portal-ecosystem-header { display: flex; justify-content: space-between; gap: 16px; align-items: start; }
.portal-body .portal-main .portal-ecosystem-header h3 { margin: 3px 0 0; }
.portal-body .portal-main .portal-ecosystem-copy { max-width: 720px; margin: 0; color: rgba(160, 182, 210, .78); }
.portal-body .portal-main .portal-ecosystem-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.portal-body .portal-main .portal-ecosystem-stats .portal-stat { min-width: 0; }
.portal-body .portal-main .portal-ecosystem-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.portal-body .portal-main .leaderboard-explainer { margin-top: 8px; color: rgba(160, 182, 210, .78); }
.portal-body .portal-main .portal-leaderboard-context,
.portal-body .portal-main .leaderboard-navigation { background: rgba(255, 255, 255, .018); }
@media (max-width: 720px) {
  .portal-body .portal-main .portal-ecosystem-header { flex-direction: column; }
  .portal-body .portal-main .portal-ecosystem-stats { grid-template-columns: 1fr; }
  .portal-body .portal-main .portal-ecosystem-actions,
  .portal-body .portal-main .portal-ecosystem-actions .secondary-button { width: 100%; }
  .portal-body .portal-main .portal-ecosystem-actions .secondary-button { justify-content: center; }
}
@media (max-width: 640px) {
  .portal-body .portal-main .leaderboard-top-rankings { grid-template-columns: 1fr; }
  .portal-body .portal-main .leaderboard-row { grid-template-columns: 1fr auto; gap: 7px 14px; padding: 14px 0; }
  .portal-body .portal-main .leaderboard-row > *:nth-child(odd) { text-align: left; }
  .portal-body .portal-main .leaderboard-row > *:nth-child(even) { text-align: right; }
  .portal-body .portal-main .leaderboard-head { display: none; }
  .portal-body .portal-main .leaderboard-row > [data-label]::before { content: attr(data-label); display: block; color: rgba(160, 182, 210, .68); font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 2px; }
}

/* ---------------- Skeleton loading system ---------------- */
.portal-body .aurex-skeleton { border-radius: 10px; background: rgba(255, 255, 255, 0.045); }
.portal-body .aurex-skeleton.is-text { height: 12px; border-radius: 6px; }
.portal-body .aurex-skeleton.is-title { height: 20px; width: 60%; border-radius: 7px; }
.portal-body .aurex-skeleton.is-number { height: 30px; width: 40%; border-radius: 8px; }
.portal-body .aurex-skeleton.is-block { height: 96px; }
.portal-body .aurex-skeleton + .aurex-skeleton { margin-top: 10px; }
.portal-body .portal-skeleton-card {
  border: 1px solid var(--line);
  border-radius: var(--surface-radius);
  padding: 18px;
  background: var(--panel);
  display: grid;
  gap: 12px;
}
/* Carlos "thinking" bubble reads as a premium loading state */
.portal-body .portal-main .carlos-message.is-streaming {
  border-color: rgba(121, 223, 246, 0.2);
  background: linear-gradient(160deg, rgba(121, 223, 246, 0.05), rgba(255, 255, 255, 0.008));
}

/* ---------------- Service feedback states ---------------- */
.portal-body .portal-main .portal-service-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: color 0.3s var(--px-ease);
}
.portal-body .portal-main .portal-service-status::before {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(160, 182, 210, 0.5);
  transition: background 0.3s var(--px-ease), box-shadow 0.3s var(--px-ease);
}
.portal-body .portal-main .portal-service-status[data-tone="processing"] { color: var(--cyan); }
.portal-body .portal-main .portal-service-status[data-tone="processing"]::before { background: var(--cyan); animation: pxPulseDot 1.1s ease-in-out infinite; }
.portal-body .portal-main .portal-service-status[data-tone="success"] { color: var(--green); }
.portal-body .portal-main .portal-service-status[data-tone="success"]::before { background: var(--green); box-shadow: 0 0 8px rgba(89, 211, 144, 0.55); }
.portal-body .portal-main .portal-service-status[data-tone="warning"] { color: var(--yellow); }
.portal-body .portal-main .portal-service-status[data-tone="warning"]::before { background: var(--yellow); box-shadow: 0 0 8px rgba(231, 199, 106, 0.5); }
.portal-body .portal-main .portal-service-status[data-tone="error"] { color: var(--red); }
.portal-body .portal-main .portal-service-status[data-tone="error"]::before { background: var(--red); box-shadow: 0 0 8px rgba(255, 100, 116, 0.5); }

/* Status pill semantic tones already exist; ensure processing shimmer for pending pills */
.portal-body .portal-status-pill.pending,
.portal-body .portal-status-pill.Requested { color: var(--yellow); }
.portal-body .portal-status-pill.Approved { color: var(--green); }

/* ---------------- Motion: one-time chart draw, count feel ---------------- */
.portal-body .portal-main .portal-line-chart .chart-line-reveal {
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  animation: pxDraw 1.1s var(--px-ease) forwards;
}
.portal-body .portal-main .portal-line-chart .chart-area-fill {
  opacity: 0;
  animation: pxFadeIn 0.9s ease 0.5s forwards;
}

@keyframes pxDraw { to { stroke-dashoffset: 0; } }
@keyframes pxFadeIn { to { opacity: 1; } }
@keyframes pxPulseDot { 0%, 100% { opacity: 0.4; } 50% { opacity: 1; } }

@media (prefers-reduced-motion: reduce) {
  .portal-body .portal-main .portal-line-chart .chart-line-reveal { animation: none !important; stroke-dashoffset: 0 !important; }
  .portal-body .portal-main .portal-line-chart .chart-area-fill { animation: none !important; opacity: 1 !important; }
  .portal-body .portal-main .portal-service-status[data-tone="processing"]::before { animation: none !important; }
}

/* ---------------- Mobile chart readability ---------------- */
@media (max-width: 820px) {
  .portal-body .portal-main .portal-line-chart svg { min-height: 130px; }
  .portal-body .portal-main .portal-chart-axis span { font-size: 0.7rem; }
  .portal-body .portal-main .portal-empty-module { padding: 28px 16px; }
  .portal-body .portal-main .portal-service-status { font-size: 0.82rem; }
}

/* ============================================================
   AUREX ADMIN OS — Brick 1: premium shell + Command Center.
   Scoped to the admin body. Visual only — no routes, handlers,
   data, or security logic changed. Desktop-first.
   ============================================================ */
.admin-intelligence-body {
  --ax-navy: #030814;
  --ax-white: #f4f8ff;
  --ax-cyan: #79dff6;
  --ax-blue: #6ca8f7;
  --ax-violet: #a78bff;
  --ax-green: #59d390;
  --ax-amber: #e7c76a;
  --ax-red: #ff6474;
  --ax-line: rgba(150, 184, 220, 0.12);
  --ax-line-strong: rgba(106, 184, 235, 0.22);
  --ax-edge: rgba(255, 255, 255, 0.10);
  --ax-edge-soft: rgba(255, 255, 255, 0.055);
  --ax-hair: rgba(121, 223, 246, 0.07);
  --ax-ease: cubic-bezier(0.22, 0.7, 0.2, 1);
  /* Admin material shadows */
  --axm-command: 0 40px 90px -32px rgba(1, 6, 16, 0.72), inset 0 1px 0 var(--ax-edge), inset 0 0 0 1px var(--ax-hair);
  --axm-ops: 0 26px 60px -30px rgba(1, 6, 16, 0.58), inset 0 1px 0 var(--ax-edge-soft);
  --axm-data: 0 16px 40px -22px rgba(1, 6, 16, 0.5), inset 0 1px 0 var(--ax-edge-soft);
}

/* ---------------- Shell ---------------- */
.admin-intelligence-body .admin-intelligence-shell { background: transparent; }
.admin-intelligence-body .admin-main {
  padding: clamp(16px, 1.8vw, 26px);
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.admin-intelligence-body .admin-route-content {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* ---------------- Sidebar (premium, fixed) ---------------- */
.admin-intelligence-body .admin-sidebar {
  width: 264px;
  padding: 16px 12px;
  background:
    linear-gradient(180deg, rgba(9, 20, 39, 0.9), rgba(4, 10, 22, 0.96)),
    radial-gradient(circle at 20% 0%, rgba(72, 157, 247, 0.12), transparent 44%);
  border-right: 1px solid var(--ax-line);
  box-shadow: 22px 0 70px rgba(0, 0, 0, 0.28);
}
.admin-intelligence-body .admin-brand-lockup {
  align-items: center;
  gap: 12px;
  padding: 12px;
  margin-bottom: 16px;
  border: 1px solid var(--ax-line);
  border-radius: 16px;
  background: linear-gradient(150deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.01));
  box-shadow: inset 0 1px 0 var(--ax-edge-soft);
}
.admin-intelligence-body .admin-brand-lockup .brand-mark {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 12px 26px rgba(52, 138, 225, 0.18);
}
.admin-intelligence-body .admin-brand-lockup h1 { font-size: 0.98rem; font-weight: 700; letter-spacing: -0.01em; }
.admin-intelligence-body .admin-brand-signal { color: rgba(150, 200, 244, 0.6); font-size: 0.66rem; letter-spacing: 0.08em; text-transform: uppercase; }
.admin-intelligence-body .nav-list { gap: 16px; }
.admin-intelligence-body .nav-group { gap: 3px; }
.admin-intelligence-body .nav-group > span {
  padding: 6px 10px 4px;
  color: rgba(150, 176, 208, 0.5);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.admin-intelligence-body .admin-sidebar .nav-item {
  min-height: 38px;
  padding: 9px 11px;
  gap: 11px;
  border-radius: 11px;
  color: rgba(206, 219, 237, 0.74);
  font-size: 0.845rem;
  font-weight: 560;
  border: 1px solid transparent;
  transition: color 0.22s var(--ax-ease), background 0.22s var(--ax-ease), border-color 0.22s var(--ax-ease), transform 0.16s var(--ax-ease);
}
.admin-intelligence-body .admin-sidebar .nav-item svg { width: 18px; height: 18px; fill: currentColor; opacity: 0.72; flex: 0 0 auto; }
.admin-intelligence-body .admin-sidebar .nav-item:hover {
  color: var(--ax-white);
  background: rgba(255, 255, 255, 0.035);
  border-color: rgba(123, 190, 245, 0.12);
  transform: translateX(2px);
}
.admin-intelligence-body .admin-sidebar .nav-item.is-active {
  color: #f6fbff;
  background: linear-gradient(90deg, rgba(70, 152, 240, 0.2), rgba(255, 255, 255, 0.02));
  border-color: rgba(111, 191, 245, 0.24);
  box-shadow: inset 2px 0 0 var(--ax-cyan), 0 12px 30px rgba(38, 115, 210, 0.14);
}
.admin-intelligence-body .admin-sidebar .nav-item.is-active svg { opacity: 1; filter: drop-shadow(0 0 6px rgba(121, 223, 246, 0.5)); }
.admin-intelligence-body .admin-sidebar-card {
  border: 1px solid var(--ax-line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.02);
  color: rgba(200, 214, 234, 0.66);
}

/* ---------------- Topbar (Command Glass, compact) ---------------- */
.admin-intelligence-body .admin-topbar {
  align-items: flex-start;
  gap: 20px;
  padding: clamp(14px, 1.4vw, 20px) clamp(16px, 1.6vw, 24px);
  border: 1px solid var(--ax-line);
  border-radius: 18px;
  background:
    radial-gradient(120% 100% at 88% -10%, rgba(121, 223, 246, 0.1), transparent 46%),
    linear-gradient(158deg, rgba(14, 30, 54, 0.72), rgba(6, 14, 28, 0.9));
  box-shadow: var(--axm-command);
  backdrop-filter: blur(24px);
}
.admin-intelligence-body .admin-topbar .eyebrow { color: var(--ax-cyan); font-size: 0.62rem; letter-spacing: 0.14em; }
.admin-intelligence-body .admin-topbar h2 {
  font-size: clamp(1.25rem, 1.6vw, 1.6rem);
  font-weight: 680;
  letter-spacing: -0.018em;
  line-height: 1.1;
  margin: 3px 0 4px;
}
.admin-intelligence-body .admin-topbar .topbar-subtitle { color: rgba(198, 212, 232, 0.66); font-size: 0.86rem; max-width: 68ch; }
.admin-intelligence-body .admin-header-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: 10px;
  color: rgba(150, 176, 208, 0.66);
  font-size: 0.72rem;
  font-variant-numeric: tabular-nums;
}
.admin-intelligence-body .admin-header-meta span { display: inline-flex; align-items: center; gap: 6px; }
.admin-intelligence-body .admin-header-meta span + span::before {
  content: "";
  width: 3px; height: 3px; border-radius: 50%;
  background: rgba(150, 176, 208, 0.4);
  margin-right: 8px;
}
.admin-intelligence-body .admin-header-meta .date-line { color: var(--ax-white); }
.admin-intelligence-body .topbar-actions { margin-left: auto; display: flex; gap: 10px; flex: 0 0 auto; }

/* ---------------- Cloud control panel (compact strip) ---------------- */
.admin-intelligence-body .cloud-control-panel {
  border: 1px solid var(--ax-line);
  border-radius: 16px;
  background: linear-gradient(160deg, rgba(10, 24, 45, 0.6), rgba(5, 12, 25, 0.82));
  box-shadow: var(--axm-ops);
}
.admin-intelligence-body .cloud-status-pills { display: flex; flex-wrap: wrap; gap: 8px; }

/* ============================================================
   GLASS MATERIALS
   ============================================================ */
/* Operations Glass — queues, feeds, timeline */
.admin-intelligence-body .operations-center,
.admin-intelligence-body .import-readiness-panel {
  border: 1px solid var(--ax-line);
  border-radius: 18px;
  background: linear-gradient(162deg, rgba(11, 25, 47, 0.55), rgba(5, 13, 26, 0.8));
  box-shadow: var(--axm-ops);
}
/* Review Glass — the Needs Attention action queue */
.admin-intelligence-body .admin-action-queue {
  border-color: rgba(167, 139, 255, 0.2);
  background:
    radial-gradient(120% 90% at 0% 0%, rgba(167, 139, 255, 0.1), transparent 52%),
    linear-gradient(162deg, rgba(13, 26, 50, 0.6), rgba(6, 14, 28, 0.84));
}
/* Risk Glass — notification center and alerts */
.admin-intelligence-body .admin-notification-center {
  border-color: rgba(255, 100, 116, 0.14);
}
/* Data Glass — analytics + revenue */
.admin-intelligence-body .admin-analytics-grid,
.admin-intelligence-body .revenue-center,
.admin-intelligence-body .chart-panel {
  border: 1px solid var(--ax-line);
  border-radius: 18px;
  background: linear-gradient(165deg, rgba(10, 24, 45, 0.5), rgba(5, 13, 26, 0.78));
  box-shadow: var(--axm-data);
}

/* ============================================================
   KPI BAND — connected, weighted (not six identical cards)
   ============================================================ */
.admin-intelligence-body .control-room-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 0;
  border: 1px solid var(--ax-line);
  border-radius: 18px;
  overflow: hidden;
  background: linear-gradient(162deg, rgba(12, 27, 50, 0.55), rgba(5, 13, 26, 0.82));
  box-shadow: var(--axm-command);
}
.admin-intelligence-body .control-room-grid .kpi-card {
  border: 0;
  border-radius: 0;
  border-right: 1px solid var(--ax-line);
  border-bottom: 1px solid var(--ax-line);
  background: transparent;
  box-shadow: none;
  padding: 16px 18px;
  transition: background 0.3s var(--ax-ease);
}
.admin-intelligence-body .control-room-grid .kpi-card:hover { background: rgba(121, 223, 246, 0.03); }
.admin-intelligence-body .control-room-grid .kpi-card:first-child {
  background: radial-gradient(130% 120% at 0% 0%, rgba(70, 152, 240, 0.12), transparent 60%);
}
.admin-intelligence-body .control-room-grid .kpi-card .metric-number { font-size: clamp(1.35rem, 1.7vw, 1.6rem) !important; }
.admin-intelligence-body .control-room-grid .kpi-card:first-child .metric-number { font-size: clamp(1.7rem, 2.3vw, 2.05rem) !important; }
.admin-intelligence-body .kpi-topline { display: flex; align-items: center; gap: 8px; }
.admin-intelligence-body .kpi-topline p { color: rgba(160, 182, 210, 0.8); font-size: 0.72rem; font-weight: 600; letter-spacing: 0.02em; }
.admin-intelligence-body .kpi-icon { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 8px; border: 1px solid var(--ax-line); background: rgba(255, 255, 255, 0.03); }
.admin-intelligence-body .kpi-icon svg { width: 15px; height: 15px; fill: var(--ax-cyan); opacity: 0.85; }
.admin-intelligence-body .kpi-indicator { margin-left: auto; font-size: 0.66rem; font-weight: 700; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--ax-line); }
.admin-intelligence-body .kpi-indicator.positive { color: var(--ax-green); }
.admin-intelligence-body .kpi-indicator.warning { color: var(--ax-amber); }
.admin-intelligence-body .kpi-indicator.danger { color: var(--ax-red); }
.admin-intelligence-body .metric-number,
.admin-intelligence-body .kpi-card .metric-number {
  display: block;
  margin: 10px 0 4px;
  font-size: clamp(1.4rem, 1.9vw, 1.75rem);
  font-weight: 660;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  color: var(--ax-white);
}
.admin-intelligence-body .kpi-caption { color: rgba(150, 172, 202, 0.66); font-size: 0.72rem; }

/* ============================================================
   PANELS / HEADERS / TYPOGRAPHY
   ============================================================ */
.admin-intelligence-body .panel-header.compact .eyebrow { color: var(--ax-cyan); font-size: 0.62rem; letter-spacing: 0.14em; opacity: 0.92; }
.admin-intelligence-body .panel-header.compact h3 { font-size: 1.02rem; font-weight: 660; letter-spacing: -0.01em; }
.admin-intelligence-body .import-readiness-panel h3 { font-size: 1.05rem; font-weight: 660; letter-spacing: -0.012em; }
.admin-intelligence-body .next-action-callout {
  border: 1px solid var(--ax-line-strong);
  border-radius: 12px;
  background: rgba(121, 223, 246, 0.05);
  padding: 12px 14px;
}
.admin-intelligence-body .next-action-callout span { color: var(--ax-cyan); font-size: 0.66rem; letter-spacing: 0.1em; text-transform: uppercase; }
.admin-intelligence-body .import-readiness-metrics article .metric-number { font-size: 1.3rem; }

/* ============================================================
   TABLES — Bloomberg-grade
   ============================================================ */
.admin-intelligence-body .admin-table-panel {
  border: 1px solid var(--ax-line);
  border-radius: 18px;
  background: linear-gradient(165deg, rgba(10, 24, 45, 0.5), rgba(5, 13, 26, 0.78));
  box-shadow: var(--axm-data);
  overflow: hidden;
}
.admin-intelligence-body .admin-table-wrap { overflow-x: auto; max-width: 100%; }
.admin-intelligence-body .admin-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.admin-intelligence-body .admin-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  padding: 11px 14px;
  text-align: left;
  color: rgba(160, 182, 210, 0.7);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  background: rgba(6, 15, 30, 0.92);
  border-bottom: 1px solid var(--ax-line-strong);
  backdrop-filter: blur(8px);
}
.admin-intelligence-body .admin-table tbody td {
  padding: 11px 14px;
  font-size: 0.84rem;
  font-variant-numeric: tabular-nums;
  border-bottom: 1px solid var(--ax-line);
  color: rgba(214, 226, 242, 0.9);
}
.admin-intelligence-body .admin-table tbody tr { transition: background 0.2s var(--ax-ease); }
.admin-intelligence-body .admin-table tbody tr:hover { background: rgba(121, 223, 246, 0.04); }
.admin-intelligence-body .admin-table tbody tr:last-child td { border-bottom: 0; }
.admin-intelligence-body .admin-table .empty-state { text-align: center; color: rgba(150, 172, 202, 0.6); padding: 22px; }

/* ============================================================
   STATUS BADGES — semantic
   ============================================================ */
.admin-intelligence-body .status-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid var(--ax-line);
  background: rgba(255, 255, 255, 0.035);
  font-size: 0.72rem;
  font-weight: 650;
  letter-spacing: 0.01em;
}
.admin-intelligence-body .status-badge::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: rgba(160, 182, 210, 0.5); }
.admin-intelligence-body .status-badge.positive { color: var(--ax-green); border-color: rgba(89, 211, 144, 0.28); }
.admin-intelligence-body .status-badge.positive::before { background: var(--ax-green); box-shadow: 0 0 7px rgba(89, 211, 144, 0.5); }
.admin-intelligence-body .status-badge.warning { color: var(--ax-amber); border-color: rgba(231, 199, 106, 0.28); }
.admin-intelligence-body .status-badge.warning::before { background: var(--ax-amber); }
.admin-intelligence-body .status-badge.danger { color: var(--ax-red); border-color: rgba(255, 100, 116, 0.3); }
.admin-intelligence-body .status-badge.danger::before { background: var(--ax-red); box-shadow: 0 0 7px rgba(255, 100, 116, 0.5); }

/* ============================================================
   OPERATIONS FEEDS / TIMELINE / QUEUE / EMPTY STATES
   ============================================================ */
.admin-intelligence-body .operations-center .panel-header.compact h3,
.admin-intelligence-body .admin-intelligence-timeline h3 { letter-spacing: -0.01em; }
.admin-intelligence-body .admin-empty-state {
  border: 1px dashed var(--ax-line-strong);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.015);
}
.admin-intelligence-body .admin-empty-state h3 { font-weight: 660; letter-spacing: -0.01em; }
.admin-intelligence-body .admin-empty-state .eyebrow { color: var(--ax-cyan); }

/* Buttons — Action Glass depth (no scaling) */
.admin-intelligence-body .admin-main .primary-button,
.admin-intelligence-body .admin-main .secondary-button {
  transition: transform 0.26s var(--ax-ease), box-shadow 0.26s var(--ax-ease), border-color 0.26s var(--ax-ease);
}
@media (hover: hover) {
  .admin-intelligence-body .admin-main .primary-button:hover { transform: translateY(-1px); box-shadow: 0 16px 34px -14px rgba(62, 144, 236, 0.5); }
  .admin-intelligence-body .admin-main .secondary-button:hover { transform: translateY(-1px); border-color: var(--ax-line-strong); }
}

/* ============================================================
   MOTION — route fade, one-time chart draw (reduced-motion safe)
   ============================================================ */
.admin-intelligence-body .route-content-enter { animation: axRouteFade 0.24s var(--ax-ease); }
.admin-intelligence-body .admin-analytics-grid svg polyline,
.admin-intelligence-body .admin-analytics-grid svg .chart-line-reveal { stroke-linecap: round; stroke-linejoin: round; }
@keyframes axRouteFade { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .route-content-enter { animation: none !important; }
  .admin-intelligence-body .admin-sidebar .nav-item,
  .admin-intelligence-body .admin-main .primary-button,
  .admin-intelligence-body .admin-main .secondary-button { transition: none !important; }
}

/* ============================================================
   RESPONSIVE — desktop-first, safe sidebar collapse (no bottom nav)
   ============================================================ */
@media (max-width: 1180px) {
  .admin-intelligence-body .admin-sidebar { width: 76px; padding: 14px 8px; }
  .admin-intelligence-body .admin-sidebar .brand-lockup > div:last-child,
  .admin-intelligence-body .admin-sidebar .nav-group > span,
  .admin-intelligence-body .admin-sidebar .nav-item span,
  .admin-intelligence-body .admin-sidebar .admin-sidebar-card { display: none; }
  .admin-intelligence-body .admin-sidebar .nav-item { justify-content: center; padding: 10px; }
  .admin-intelligence-body .admin-sidebar .nav-item svg { opacity: 0.85; }
  .admin-intelligence-body .admin-brand-lockup { justify-content: center; padding: 10px; }
}
@media (max-width: 900px) {
  .admin-intelligence-body .admin-intelligence-shell { display: flex; flex-direction: column; }
  .admin-intelligence-body .admin-sidebar {
    width: 100%;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    overflow-x: auto;
    padding: 8px 10px;
    border-right: 0;
    border-bottom: 1px solid var(--ax-line);
    box-shadow: none;
    position: sticky;
    top: 0;
    z-index: 30;
  }
  .admin-intelligence-body .admin-sidebar .nav-list { display: flex; flex-direction: row; gap: 6px; }
  .admin-intelligence-body .admin-sidebar .nav-group { flex-direction: row; gap: 6px; }
  .admin-intelligence-body .admin-brand-lockup { margin: 0 8px 0 0; flex: 0 0 auto; }
  .admin-intelligence-body .admin-sidebar .nav-item { white-space: nowrap; padding: 8px 12px; }
  .admin-intelligence-body .admin-sidebar .nav-item span { display: inline; }
  .admin-intelligence-body .admin-topbar { flex-direction: column; }
  .admin-intelligence-body .admin-topbar .topbar-actions { margin-left: 0; }
  .admin-intelligence-body .control-room-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .admin-intelligence-body .control-room-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   AUREX ADMIN OS — Brick 2: Overview information architecture.
   Presentation only; builds on Brick 1 tokens. Scoped to admin.
   ============================================================ */

/* ---------------- Operations Snapshot strip (Command Glass band) ---------------- */
.admin-intelligence-body .operations-snapshot {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 0;
  border: 1px solid var(--ax-line);
  border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(160deg, rgba(11, 25, 47, 0.55), rgba(5, 13, 26, 0.8));
  box-shadow: var(--axm-ops);
}
.admin-intelligence-body .operations-snapshot article {
  padding: 11px 14px;
  border-right: 1px solid var(--ax-line);
  border-bottom: 1px solid var(--ax-line);
  min-width: 0;
}
.admin-intelligence-body .operations-snapshot article span {
  display: block;
  color: rgba(150, 176, 208, 0.7);
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 5px;
}
.admin-intelligence-body .operations-snapshot article strong {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 0.86rem;
  font-weight: 640;
  color: var(--ax-white);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.admin-intelligence-body .operations-snapshot article strong::before {
  content: "";
  flex: 0 0 auto;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(160, 182, 210, 0.5);
}
.admin-intelligence-body .operations-snapshot article[data-tone="positive"] strong::before { background: var(--ax-green); box-shadow: 0 0 7px rgba(89, 211, 144, 0.5); }
.admin-intelligence-body .operations-snapshot article[data-tone="warning"] strong::before { background: var(--ax-amber); }
.admin-intelligence-body .operations-snapshot article[data-tone="danger"] strong::before { background: var(--ax-red); box-shadow: 0 0 7px rgba(255, 100, 116, 0.5); }

/* ---------------- KPI band: clearer estimated/verified/review labels ---------------- */
.admin-intelligence-body .control-room-grid .kpi-indicator { text-transform: none; letter-spacing: 0.01em; }
.admin-intelligence-body .control-room-grid .kpi-card:first-child .kpi-topline p { color: var(--ax-cyan); }

/* ---------------- Needs Attention: ranked queue emphasis ---------------- */
.admin-intelligence-body .admin-action-queue .admin-table tbody tr:first-child { background: rgba(167, 139, 255, 0.05); }
.admin-intelligence-body .admin-action-queue .admin-table td .mono-chip {
  font-family: "Inter", ui-monospace, monospace;
  font-size: 0.72rem;
  padding: 2px 7px;
  border: 1px solid var(--ax-line);
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.03);
  color: rgba(206, 219, 237, 0.85);
}
.admin-intelligence-body .admin-action-queue .table-action-row { display: flex; gap: 6px; }
.admin-intelligence-body .table-action {
  border: 1px solid var(--ax-line-strong);
  border-radius: 9px;
  padding: 5px 10px;
  font-size: 0.74rem;
  font-weight: 620;
  color: rgba(230, 238, 249, 0.9);
  background: rgba(255, 255, 255, 0.04);
  cursor: pointer;
  transition: border-color 0.2s var(--ax-ease), background 0.2s var(--ax-ease);
}
.admin-intelligence-body .table-action:hover { border-color: var(--ax-cyan); background: rgba(121, 223, 246, 0.08); }

/* Cell strong/small stacking for dense operational rows */
.admin-intelligence-body .admin-table td strong { display: block; color: var(--ax-white); font-weight: 620; }
.admin-intelligence-body .admin-table td small { display: block; color: rgba(150, 172, 202, 0.62); font-size: 0.72rem; margin-top: 2px; }

/* ---------------- Timeline groups (Today / This Week / Earlier) ---------------- */
.admin-intelligence-body .admin-timeline-groups { display: flex; flex-direction: column; gap: 12px; }
.admin-intelligence-body .admin-timeline-groups .admin-table-panel { border-radius: 14px; }
.admin-intelligence-body .admin-timeline-groups .panel-header.compact .eyebrow { color: var(--ax-cyan); }
.admin-intelligence-body .admin-timeline-groups .panel-header.compact h3 {
  font-size: 0.82rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(200, 214, 234, 0.82);
}

/* ---------------- Client Health rail (segmented) ---------------- */
.admin-intelligence-body .import-readiness-metrics {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0;
  border: 1px solid var(--ax-line);
  border-radius: 12px;
  overflow: hidden;
}
.admin-intelligence-body .import-readiness-metrics article {
  padding: 12px 14px;
  border-right: 1px solid var(--ax-line);
  border-bottom: 1px solid var(--ax-line);
}
.admin-intelligence-body .import-readiness-metrics article span {
  display: block;
  color: rgba(150, 176, 208, 0.72);
  font-size: 0.68rem;
  margin-bottom: 6px;
}
.admin-intelligence-body .import-readiness-metrics article .metric-number { font-size: 1.35rem !important; margin: 0; }

/* ---------------- Financial / analytics: state distinction ---------------- */
.admin-intelligence-body .revenue-center .status-badge,
.admin-intelligence-body .admin-analytics-grid .status-badge { font-weight: 700; }
.admin-intelligence-body .revenue-center .kpi-indicator.warning,
.admin-intelligence-body .revenue-center .status-badge.warning { color: var(--ax-amber); }

/* ---------------- Scale readiness: internal scroll + sticky headers ---------------- */
.admin-intelligence-body .admin-action-queue .admin-table-wrap,
.admin-intelligence-body .admin-timeline-groups .admin-table-wrap {
  max-height: 460px;
  overflow-y: auto;
  overflow-x: auto;
}
.admin-intelligence-body .admin-action-queue .admin-table thead th,
.admin-intelligence-body .admin-timeline-groups .admin-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
}
/* Long values / names truncate safely inside cells */
.admin-intelligence-body .admin-table td { max-width: 340px; }
.admin-intelligence-body .admin-table td strong,
.admin-intelligence-body .admin-table td .mono-chip { overflow: hidden; text-overflow: ellipsis; }

/* ---------------- Loading / empty premium states ---------------- */
.admin-intelligence-body .admin-skeleton {
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.045);
  position: relative;
  overflow: hidden;
}
.admin-intelligence-body .admin-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent, rgba(160, 200, 245, 0.12), transparent);
  transform: translateX(-100%);
  animation: axShimmer 1.6s ease-in-out infinite;
}
.admin-intelligence-body .admin-table .empty-state {
  color: rgba(150, 172, 202, 0.66);
  font-size: 0.86rem;
}

/* ---------------- Motion ---------------- */
@keyframes axShimmer { 100% { transform: translateX(100%); } }
.admin-intelligence-body .admin-action-queue .admin-table tbody tr:first-child td:first-child strong::after {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-left: 6px;
  border-radius: 50%;
  background: var(--ax-violet);
  box-shadow: 0 0 8px rgba(167, 139, 255, 0.6);
  vertical-align: middle;
}

@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .admin-skeleton::after { animation: none !important; }
}

/* ---------------- Responsive (inherits Brick 1 sidebar behavior) ---------------- */
@media (max-width: 900px) {
  .admin-intelligence-body .operations-snapshot { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-intelligence-body .import-readiness-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .admin-intelligence-body .operations-snapshot { grid-template-columns: 1fr; }
}

/* ============================================================
   AUREX ADMIN OS — Brick 3: Clients, Data Quality, Broker
   Import, Reports. Visual only; builds on Brick 1 tokens.
   Scoped to .admin-intelligence-body. No logic/handlers/markup
   dependencies beyond existing class names.
   ============================================================ */

/* ---------------- Shared table language (extends Brick 1) ---------------- */
.admin-intelligence-body .admin-table tbody tr.is-selected,
.admin-intelligence-body .admin-table tbody tr[aria-selected="true"] {
  background: linear-gradient(90deg, rgba(70, 152, 240, 0.16), rgba(121, 223, 246, 0.04));
  box-shadow: inset 2px 0 0 var(--ax-cyan);
}
.admin-intelligence-body .admin-table td .table-action-group,
.admin-intelligence-body .admin-table td .table-action-row {
  display: inline-flex;
  gap: 6px;
  flex-wrap: wrap;
}
.admin-intelligence-body .admin-table td .table-icon-button {
  display: inline-grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border: 1px solid var(--ax-line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.04);
  color: var(--ax-muted-strong, #c3cde0);
  cursor: pointer;
  transition: border-color 0.2s var(--ax-ease), background 0.2s var(--ax-ease), transform 0.12s var(--ax-ease);
}
.admin-intelligence-body .admin-table td .table-icon-button:hover { border-color: var(--ax-cyan); background: rgba(121, 223, 246, 0.08); }
.admin-intelligence-body .admin-table td .table-icon-button svg { width: 15px; height: 15px; fill: currentColor; }
.admin-intelligence-body .admin-table .private-field-cell,
.admin-intelligence-body .admin-table .primary-account-cell {
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
}
.admin-intelligence-body .admin-table .primary-account-cell strong { color: var(--ax-white); font-weight: 620; }
.admin-intelligence-body .admin-table .muted-cell { color: rgba(150, 172, 202, 0.55); }
.admin-intelligence-body .admin-table .account-chip-list { display: flex; flex-wrap: wrap; gap: 4px; }
.admin-intelligence-body .admin-table .account-chip-list span {
  padding: 1px 7px;
  border: 1px solid var(--ax-line);
  border-radius: 6px;
  font-size: 0.72rem;
  color: rgba(206, 219, 237, 0.82);
}
/* Long values / names never break the layout */
.admin-intelligence-body .admin-table td { max-width: 320px; }
.admin-intelligence-body .admin-table td.wrap-cell { white-space: normal; }
/* Registry-scale tables scroll internally with sticky headers */
.admin-intelligence-body .table-client-ledger .admin-table-wrap,
.admin-intelligence-body .table-registry-issues .admin-table-wrap,
.admin-intelligence-body .quality-card-grid + .admin-table-panel .admin-table-wrap {
  max-height: 520px;
  overflow: auto;
}

/* ---------------- Client registry ---------------- */
.admin-intelligence-body .registry-view-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 18px;
  border: 1px solid var(--ax-line);
  border-radius: 16px;
  background:
    radial-gradient(120% 100% at 100% -10%, rgba(121, 223, 246, 0.08), transparent 46%),
    linear-gradient(158deg, rgba(14, 30, 54, 0.62), rgba(6, 14, 28, 0.86));
  box-shadow: var(--axm-command);
}
.admin-intelligence-body .registry-view-toggle strong { display: block; color: var(--ax-white); font-size: 1rem; font-weight: 660; letter-spacing: -0.01em; }
.admin-intelligence-body .registry-view-toggle span { color: rgba(160, 182, 210, 0.72); font-size: 0.8rem; font-variant-numeric: tabular-nums; }
.admin-intelligence-body .segmented-control {
  display: inline-flex;
  padding: 3px;
  border: 1px solid var(--ax-line);
  border-radius: 11px;
  background: rgba(4, 12, 24, 0.5);
  gap: 2px;
}
.admin-intelligence-body .segmented-control button {
  padding: 7px 14px;
  border: 0;
  border-radius: 9px;
  background: transparent;
  color: rgba(206, 219, 237, 0.74);
  font-size: 0.8rem;
  font-weight: 640;
  cursor: pointer;
  transition: background 0.2s var(--ax-ease), color 0.2s var(--ax-ease);
}
.admin-intelligence-body .segmented-control button.active {
  background: linear-gradient(160deg, rgba(70, 152, 240, 0.28), rgba(121, 223, 246, 0.1));
  color: #f6fbff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}
.admin-intelligence-body .segmented-control button:disabled { opacity: 0.4; cursor: not-allowed; }
/* Search + filter toolbar (generic controls above tables) */
.admin-intelligence-body .registry-toolbar,
.admin-intelligence-body .registry-filter-panel {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.admin-intelligence-body .registry-toolbar input[type="search"],
.admin-intelligence-body .registry-toolbar input[type="text"] { min-width: 220px; }
/* Pagination */
.admin-intelligence-body .registry-pagination,
.admin-intelligence-body .client-registry-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 4px 2px;
  color: rgba(160, 182, 210, 0.72);
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
}

/* ---------------- Client detail / edit modal (focused workspace) ---------------- */
.admin-intelligence-body .admin-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 80;
  background: rgba(2, 7, 16, 0.62);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  animation: axFade 0.2s ease;
}
.admin-intelligence-body .admin-edit-modal {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 85;
  display: flex;
  flex-direction: column;
  width: min(560px, 94vw);
  height: 100%;
  padding: 22px;
  gap: 16px;
  border-left: 1px solid var(--ax-line-strong);
  background: linear-gradient(168deg, rgba(12, 27, 50, 0.98), rgba(6, 14, 28, 0.99));
  box-shadow: -40px 0 90px rgba(0, 0, 0, 0.55);
  overflow-y: auto;
  animation: axPanelIn 0.28s cubic-bezier(0.22, 0.7, 0.2, 1);
}
.admin-intelligence-body .admin-edit-modal .modal-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--ax-line);
}
.admin-intelligence-body .admin-edit-modal .modal-header h3 { font-size: 1.1rem; font-weight: 680; letter-spacing: -0.014em; margin: 3px 0 0; }
.admin-intelligence-body .admin-edit-modal .modal-close-button {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  border: 1px solid var(--ax-line);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.04);
  color: var(--ax-muted-strong, #c3cde0);
  cursor: pointer;
  transition: border-color 0.2s var(--ax-ease), background 0.2s var(--ax-ease);
}
.admin-intelligence-body .admin-edit-modal .modal-close-button:hover { border-color: var(--ax-red); color: var(--ax-red); }
.admin-intelligence-body .admin-edit-modal .edit-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.admin-intelligence-body .admin-edit-modal .edit-form-grid label { display: grid; gap: 6px; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.04em; color: rgba(198, 213, 233, 0.74); }
.admin-intelligence-body .admin-edit-modal .edit-notes-field,
.admin-intelligence-body .admin-edit-modal .edit-form-grid label.full-width { grid-column: 1 / -1; }
.admin-intelligence-body .admin-edit-modal .modal-action-row {
  position: sticky;
  bottom: 0;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: auto;
  padding-top: 14px;
  border-top: 1px solid var(--ax-line);
  background: linear-gradient(180deg, transparent, rgba(6, 14, 28, 0.9) 40%);
}
.admin-intelligence-body .admin-edit-modal .modal-helper { color: rgba(150, 172, 202, 0.62); font-size: 0.78rem; }
/* Detail read-out lists inside the panel */
.admin-intelligence-body .admin-edit-modal .request-detail-list,
.admin-intelligence-body .admin-edit-modal .status-timeline { display: grid; gap: 8px; }

/* ---------------- Data Quality — issue center (Review / Risk Glass) ---------------- */
.admin-intelligence-body .quality-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 0;
  border: 1px solid var(--ax-line);
  border-radius: 16px;
  overflow: hidden;
  background: linear-gradient(162deg, rgba(11, 25, 47, 0.55), rgba(5, 13, 26, 0.8));
  box-shadow: var(--axm-ops);
}
.admin-intelligence-body .quality-summary-card {
  padding: 14px 16px;
  border-right: 1px solid var(--ax-line);
  border-bottom: 1px solid var(--ax-line);
  min-width: 0;
}
.admin-intelligence-body .quality-summary-card > div { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.admin-intelligence-body .quality-summary-card p { color: rgba(160, 182, 210, 0.78); font-size: 0.72rem; font-weight: 600; }
.admin-intelligence-body .quality-summary-card .kpi-indicator { margin-left: auto; }
.admin-intelligence-body .quality-summary-card .quality-number {
  display: block;
  font-size: clamp(1.3rem, 1.7vw, 1.6rem);
  font-weight: 660;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.02em;
  color: var(--ax-white);
}
.admin-intelligence-body .quality-summary-card small { color: rgba(150, 172, 202, 0.6); font-size: 0.7rem; }
/* Risk Glass emphasis for blocked/duplicate summary cards */
.admin-intelligence-body .quality-summary-card:has(.kpi-indicator.danger) { background: linear-gradient(160deg, rgba(255, 100, 116, 0.07), transparent 60%); }
.admin-intelligence-body .quality-summary-card:has(.kpi-indicator.warning) { background: linear-gradient(160deg, rgba(231, 199, 106, 0.06), transparent 60%); }
.admin-intelligence-body .issue-reason-cell { color: rgba(206, 219, 237, 0.82); }
.admin-intelligence-body .issue-reason-cell small { display: block; color: rgba(150, 172, 202, 0.6); margin-top: 2px; }
/* The registry-issues table reads as a Risk surface */
.admin-intelligence-body .table-registry-issues { border-color: rgba(255, 100, 116, 0.16); }

/* ---------------- Broker Import — institutional workflow ---------------- */
.admin-intelligence-body .import-stepper {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 14px 16px;
  border: 1px solid var(--ax-line);
  border-radius: 16px;
  background: linear-gradient(160deg, rgba(11, 25, 47, 0.55), rgba(5, 13, 26, 0.8));
  box-shadow: var(--axm-ops);
  counter-reset: importstep;
}
.admin-intelligence-body .import-stepper > * {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border: 1px solid var(--ax-line);
  border-radius: 999px;
  color: rgba(160, 182, 210, 0.7);
  font-size: 0.78rem;
  font-weight: 620;
  white-space: nowrap;
}
.admin-intelligence-body .import-stepper > *::before {
  counter-increment: importstep;
  content: counter(importstep);
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.05);
  color: rgba(206, 219, 237, 0.7);
  font-size: 0.68rem;
  font-weight: 800;
}
.admin-intelligence-body .import-stepper > .is-active,
.admin-intelligence-body .import-stepper > .active {
  color: #f6fbff;
  border-color: rgba(121, 223, 246, 0.34);
  background: linear-gradient(160deg, rgba(70, 152, 240, 0.2), rgba(121, 223, 246, 0.06));
}
.admin-intelligence-body .import-stepper > .is-active::before,
.admin-intelligence-body .import-stepper > .active::before { background: var(--ax-cyan); color: #04121f; }
.admin-intelligence-body .import-stepper > .is-complete::before { background: var(--ax-green); color: #04121f; content: "\2713"; }

.admin-intelligence-body .import-panel {
  border: 1px solid var(--ax-line);
  border-radius: 18px;
  background: linear-gradient(162deg, rgba(11, 25, 47, 0.55), rgba(5, 13, 26, 0.8));
  box-shadow: var(--axm-ops);
}
/* Drop zone (file field) */
.admin-intelligence-body .import-file-field {
  display: grid;
  place-items: center;
  gap: 8px;
  padding: 26px;
  border: 1.5px dashed var(--ax-line-strong);
  border-radius: 14px;
  background: rgba(121, 223, 246, 0.03);
  text-align: center;
  transition: border-color 0.25s var(--ax-ease), background 0.25s var(--ax-ease);
}
.admin-intelligence-body .import-file-field:hover { border-color: var(--ax-cyan); background: rgba(121, 223, 246, 0.06); }
.admin-intelligence-body .import-file-summary {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border: 1px solid var(--ax-line);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.025);
  font-variant-numeric: tabular-nums;
}
.admin-intelligence-body .import-form-grid,
.admin-intelligence-body .mapping-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
}
/* Matched / unmatched / invalid summary band (Data Glass) */
.admin-intelligence-body .import-summary-grid { box-shadow: var(--axm-data); }
.admin-intelligence-body .import-summary-grid .kpi-card:nth-child(1) .kpi-topline p { color: var(--ax-green); }
.admin-intelligence-body .import-summary-grid .kpi-card:nth-child(2) .kpi-topline p { color: var(--ax-amber); }
.admin-intelligence-body .import-summary-grid .kpi-card:nth-child(3) .kpi-topline p { color: var(--ax-red); }
/* Alerts — semantic states */
.admin-intelligence-body .import-alert {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 16px;
  border: 1px solid var(--ax-line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.02);
}
.admin-intelligence-body .import-alert strong { color: var(--ax-white); }
.admin-intelligence-body .import-alert.success { border-color: rgba(89, 211, 144, 0.3); background: linear-gradient(160deg, rgba(89, 211, 144, 0.08), transparent 60%); }
.admin-intelligence-body .import-alert.success strong { color: var(--ax-green); }
.admin-intelligence-body .import-alert.warning { border-color: rgba(231, 199, 106, 0.3); background: linear-gradient(160deg, rgba(231, 199, 106, 0.08), transparent 60%); }
.admin-intelligence-body .import-alert.warning strong { color: var(--ax-amber); }
.admin-intelligence-body .import-report { box-shadow: var(--axm-data); }
/* Sticky confirm bar */
.admin-intelligence-body .sticky-import-actions {
  position: sticky;
  bottom: 12px;
  z-index: 10;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  padding: 12px 16px;
  border: 1px solid var(--ax-line-strong);
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(12, 27, 50, 0.96), rgba(6, 14, 28, 0.98));
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.45), var(--ax-glass-highlight, inset 0 1px 0 rgba(255,255,255,0.06));
  backdrop-filter: blur(18px);
}

/* ---------------- Reports — command area ---------------- */
.admin-intelligence-body .reports-control-room,
.admin-intelligence-body .report-action-panel,
.admin-intelligence-body .public-publish-panel,
.admin-intelligence-body .revenue-center {
  border: 1px solid var(--ax-line);
  border-radius: 18px;
  background: linear-gradient(165deg, rgba(10, 24, 45, 0.5), rgba(5, 13, 26, 0.78));
  box-shadow: var(--axm-data);
}
.admin-intelligence-body .revenue-metric-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 0;
  border: 1px solid var(--ax-line);
  border-radius: 14px;
  overflow: hidden;
}
.admin-intelligence-body .revenue-metric-grid > article {
  padding: 13px 15px;
  border-right: 1px solid var(--ax-line);
  border-bottom: 1px solid var(--ax-line);
}
.admin-intelligence-body .revenue-metric-grid > article span { display: block; color: rgba(160, 182, 210, 0.72); font-size: 0.68rem; margin-bottom: 6px; }
.admin-intelligence-body .revenue-metric-grid > article strong,
.admin-intelligence-body .revenue-metric-grid .metric-number { font-variant-numeric: tabular-nums; letter-spacing: -0.015em; color: var(--ax-white); }
.admin-intelligence-body .revenue-chart-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
}
.admin-intelligence-body .revenue-chart-card {
  border: 1px solid var(--ax-line);
  border-radius: 14px;
  padding: 14px;
  background: rgba(255, 255, 255, 0.015);
  box-shadow: var(--axm-data);
}
.admin-intelligence-body .mini-bar-chart { display: flex; align-items: flex-end; gap: 4px; height: 90px; }
.admin-intelligence-body .mini-bar-chart > span {
  flex: 1 1 0;
  min-width: 4px;
  border-radius: 4px 4px 0 0;
  background: linear-gradient(180deg, var(--ax-cyan), rgba(108, 168, 247, 0.35));
  box-shadow: 0 0 10px rgba(121, 223, 246, 0.25);
}
.admin-intelligence-body .public-publish-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.admin-intelligence-body .panel-pill,
.admin-intelligence-body .manager-note {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border: 1px solid var(--ax-line);
  border-radius: 999px;
  font-size: 0.72rem;
  color: rgba(206, 219, 237, 0.82);
}

/* ---------------- Micro-interactions ---------------- */
@keyframes axFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes axPanelIn { from { transform: translateX(24px); opacity: 0.4; } to { transform: none; opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .admin-edit-modal,
  .admin-intelligence-body .admin-modal-backdrop { animation: none !important; }
}

/* ---------------- Breakpoints (inherit Brick 1 sidebar behavior) ---------------- */
@media (max-width: 1180px) {
  .admin-intelligence-body .edit-form-grid { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .admin-intelligence-body .registry-view-toggle { flex-direction: column; align-items: flex-start; }
  .admin-intelligence-body .admin-edit-modal { width: 100vw; }
  .admin-intelligence-body .quality-card-grid,
  .admin-intelligence-body .revenue-metric-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-intelligence-body .admin-edit-modal .edit-form-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .admin-intelligence-body .quality-card-grid,
  .admin-intelligence-body .revenue-metric-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   AUREX ADMIN OS — Brick 4: Guided Operations & Workflow Polish.
   Visual only; builds on Brick 1/3 tokens. Scoped to admin body.
   Targets existing shared components (PageHeader / StepFlow /
   ContextStrip / AdminTable) + the six operational workspaces.
   ============================================================ */

/* Slightly brighter institutional edge-light on the core surfaces */
.admin-intelligence-body .admin-main .glass-panel,
.admin-intelligence-body .admin-main .operations-center,
.admin-intelligence-body .admin-main .admin-table-panel,
.admin-intelligence-body .admin-main .control-room-grid,
.admin-intelligence-body .admin-main .cashback-engine-panel,
.admin-intelligence-body .admin-main .education-editor-panel {
  box-shadow: var(--axm-ops), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

/* ---------------- Page purpose header (compact, dominant action) ---------------- */
.admin-intelligence-body .admin-main .unified-page-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 16px 20px;
  border: 1px solid var(--ax-line);
  border-radius: 16px;
  background:
    radial-gradient(120% 100% at 100% -10%, rgba(121, 223, 246, 0.09), transparent 46%),
    linear-gradient(158deg, rgba(14, 30, 54, 0.64), rgba(6, 14, 28, 0.86));
  box-shadow: var(--axm-command), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
.admin-intelligence-body .admin-main .unified-page-header .eyebrow { color: var(--ax-cyan); font-size: 0.62rem; letter-spacing: 0.14em; }
.admin-intelligence-body .admin-main .unified-page-header h3 { font-size: 1.1rem; font-weight: 680; letter-spacing: -0.014em; margin: 3px 0 3px; }
.admin-intelligence-body .admin-main .unified-page-header p:not(.eyebrow) { color: rgba(198, 212, 232, 0.68); font-size: 0.84rem; max-width: 64ch; }
.admin-intelligence-body .admin-main .unified-page-header .primary-button { flex: 0 0 auto; }

/* ---------------- Guided workflow rail (StepFlow) ---------------- */
.admin-intelligence-body .admin-main .step-flow {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 14px 16px;
  border: 1px solid var(--ax-line);
  border-radius: 16px;
  background: linear-gradient(160deg, rgba(11, 25, 47, 0.55), rgba(5, 13, 26, 0.8));
  box-shadow: var(--axm-ops), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
.admin-intelligence-body .admin-main .step-flow article {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 8px 13px;
  border: 1px solid var(--ax-line);
  border-radius: 999px;
  color: rgba(160, 182, 210, 0.72);
  font-size: 0.78rem;
  font-weight: 620;
  white-space: nowrap;
}
.admin-intelligence-body .admin-main .step-flow article > span {
  display: grid;
  place-items: center;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.05);
  color: rgba(206, 219, 237, 0.72);
  font-size: 0.68rem;
  font-weight: 800;
}
.admin-intelligence-body .admin-main .step-flow article strong { color: inherit; font-weight: 640; }
.admin-intelligence-body .admin-main .step-flow article small { color: rgba(150, 172, 202, 0.55); font-size: 0.68rem; }
.admin-intelligence-body .admin-main .step-flow article.is-active {
  color: #f6fbff;
  border-color: rgba(121, 223, 246, 0.34);
  background: linear-gradient(160deg, rgba(70, 152, 240, 0.2), rgba(121, 223, 246, 0.06));
}
.admin-intelligence-body .admin-main .step-flow article.is-active > span { background: var(--ax-cyan); color: #04121f; }
.admin-intelligence-body .admin-main .step-flow article.is-complete > span { background: var(--ax-green); color: #04121f; }
.admin-intelligence-body .admin-main .step-flow article.is-blocked { border-color: rgba(255, 100, 116, 0.3); color: #ffd7dc; }
.admin-intelligence-body .admin-main .step-flow article.is-blocked > span { background: var(--ax-red); color: #04121f; }

/* ---------------- Summary band (ContextStrip) ---------------- */
.admin-intelligence-body .admin-main .context-strip {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 0;
  border: 1px solid var(--ax-line);
  border-radius: 16px;
  overflow: hidden;
  background: linear-gradient(160deg, rgba(11, 25, 47, 0.55), rgba(5, 13, 26, 0.8));
  box-shadow: var(--axm-ops), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
.admin-intelligence-body .admin-main .context-strip article {
  padding: 12px 15px;
  border-right: 1px solid var(--ax-line);
  border-bottom: 1px solid var(--ax-line);
  min-width: 0;
}
.admin-intelligence-body .admin-main .context-strip span {
  display: block;
  color: rgba(150, 176, 208, 0.72);
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 5px;
}
.admin-intelligence-body .admin-main .context-strip strong {
  display: block;
  color: var(--ax-white);
  font-size: 1.2rem;
  font-weight: 660;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.015em;
}
.admin-intelligence-body .admin-main .context-strip small { color: rgba(150, 172, 202, 0.6); font-size: 0.7rem; }

/* ---------------- Account Requests — review workspace ---------------- */
.admin-intelligence-body .admin-main .filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  padding: 12px 14px;
  border: 1px solid var(--ax-line);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.02);
}
.admin-intelligence-body .admin-main .account-request-detail,
.admin-intelligence-body .admin-main .account-request-detail-grid {
  border-color: rgba(167, 139, 255, 0.2);
  background:
    radial-gradient(120% 90% at 0% 0%, rgba(167, 139, 255, 0.08), transparent 52%),
    linear-gradient(162deg, rgba(13, 26, 50, 0.6), rgba(6, 14, 28, 0.84));
}
.admin-intelligence-body .admin-main .account-request-timeline,
.admin-intelligence-body .admin-main .status-timeline {
  display: grid;
  gap: 0;
  position: relative;
  padding-left: 6px;
}
.admin-intelligence-body .admin-main .account-request-timeline > *,
.admin-intelligence-body .admin-main .status-timeline > * {
  position: relative;
  padding: 8px 0 8px 20px;
  border-left: 2px solid var(--ax-line);
}
.admin-intelligence-body .admin-main .account-request-timeline > *::before,
.admin-intelligence-body .admin-main .status-timeline > *::before {
  content: "";
  position: absolute;
  left: -5px;
  top: 12px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ax-cyan);
  box-shadow: 0 0 8px rgba(121, 223, 246, 0.5);
}
/* Private internal notes read as clearly protected */
.admin-intelligence-body .admin-main .request-detail-list {
  display: grid;
  gap: 8px;
}
.admin-intelligence-body .admin-main .registry-issue-details,
.admin-intelligence-body .admin-main .cloud-account-request-review-form textarea {
  border-left: 3px solid rgba(167, 139, 255, 0.5);
  background: rgba(167, 139, 255, 0.05);
  border-radius: 0 10px 10px 0;
}
/* Approve / Reject / Request Information — distinct but calm */
.admin-intelligence-body .admin-main .cloud-account-request-review-form .primary-button {
  border-color: rgba(89, 211, 144, 0.4);
  background: linear-gradient(135deg, rgba(48, 178, 120, 0.9), rgba(19, 92, 62, 0.85));
}
.admin-intelligence-body .admin-main .cloud-account-request-review-form .secondary-button.danger-action {
  border-color: rgba(255, 100, 116, 0.34);
  color: #ffd7dc;
}
.admin-intelligence-body .admin-main .cloud-account-request-review-form .secondary-button.danger-action:hover { background: rgba(255, 100, 116, 0.1); }

/* ---------------- Performance — review & publish center ---------------- */
.admin-intelligence-body .admin-main .performance-import-panel { border-color: rgba(121, 223, 246, 0.16); }
.admin-intelligence-body .admin-main .issue-badge-list { display: flex; flex-wrap: wrap; gap: 6px; }
.admin-intelligence-body .admin-main .issue-badge-list > * {
  padding: 3px 10px;
  border: 1px solid var(--ax-line);
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 640;
}
/* score-first weighting on the performance summary band */
.admin-intelligence-body .admin-main .performance-operations-page .control-room-grid .kpi-card:first-child .metric-number { color: var(--ax-cyan); }

/* ---------------- Cashback — financial operations scene ---------------- */
.admin-intelligence-body .admin-main .import-summary-grid { box-shadow: var(--axm-data), inset 0 1px 0 rgba(255, 255, 255, 0.06); }
/* State colour language across the verified -> paid flow (card order) */
.admin-intelligence-body .admin-main .import-summary-grid .kpi-card:nth-child(3) .metric-number { color: var(--ax-amber); }   /* Estimated */
.admin-intelligence-body .admin-main .import-summary-grid .kpi-card:nth-child(4) .metric-number { color: var(--ax-cyan); }    /* Available */
.admin-intelligence-body .admin-main .import-summary-grid .kpi-card:nth-child(5) .metric-number { color: var(--ax-amber); }   /* Requested */
.admin-intelligence-body .admin-main .import-summary-grid .kpi-card:nth-child(6) .metric-number { color: var(--ax-blue); }    /* Approved */
.admin-intelligence-body .admin-main .import-summary-grid .kpi-card:nth-child(7) .metric-number { color: var(--ax-green); }   /* Paid */
.admin-intelligence-body .admin-main .setting-meter {
  height: 8px;
  border-radius: 999px;
  background: rgba(150, 184, 220, 0.14);
  overflow: hidden;
}
.admin-intelligence-body .admin-main .setting-meter > * { height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--ax-cyan), var(--ax-blue)); }
.admin-intelligence-body .admin-main .cashback-warning-list { display: grid; gap: 6px; }
.admin-intelligence-body .admin-main .cashback-warning-list > * {
  padding: 8px 12px;
  border: 1px solid rgba(231, 199, 106, 0.28);
  border-radius: 10px;
  background: rgba(231, 199, 106, 0.06);
  color: #f2e2b6;
  font-size: 0.8rem;
}

/* ---------------- Team Access — role clarity ---------------- */
.admin-intelligence-body .admin-main .status-badge.role-admin,
.admin-intelligence-body .admin-main .status-badge.administrator {
  color: var(--ax-violet);
  border-color: rgba(167, 139, 255, 0.34);
  background: rgba(167, 139, 255, 0.08);
}
.admin-intelligence-body .admin-main .status-badge.role-admin::before { background: var(--ax-violet); box-shadow: 0 0 8px rgba(167, 139, 255, 0.6); }
.admin-intelligence-body .admin-main .status-badge.role-team { color: var(--ax-blue); border-color: rgba(108, 168, 247, 0.3); }
.admin-intelligence-body .admin-main .status-badge.role-client { color: rgba(160, 182, 210, 0.85); }
.admin-intelligence-body .admin-main .team-permission-form,
.admin-intelligence-body .admin-main .team-access-panel {
  border: 1px solid var(--ax-line);
  border-radius: 16px;
  background: linear-gradient(162deg, rgba(12, 27, 50, 0.55), rgba(5, 13, 26, 0.82));
  box-shadow: var(--axm-ops);
}
/* Admin-only permissions read as protected */
.admin-intelligence-body .admin-main .permission-admin-only,
.admin-intelligence-body .admin-main [data-admin-only="true"] {
  border-left: 3px solid var(--ax-violet);
  background: rgba(167, 139, 255, 0.05);
}

/* ---------------- Education & Community — service management ---------------- */
.admin-intelligence-body .admin-main .education-admin-grid,
.admin-intelligence-body .admin-main .education-editor-grid,
.admin-intelligence-body .admin-main .loyalty-editor-grid {
  display: grid;
  gap: 14px;
}
.admin-intelligence-body .admin-main .education-library-controls,
.admin-intelligence-body .admin-main .cashback-import-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.admin-intelligence-body .admin-main .education-action-row,
.admin-intelligence-body .admin-main .public-publish-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.admin-intelligence-body .admin-main .lesson-progress,
.admin-intelligence-body .admin-main .quiz-progress {
  height: 6px;
  border-radius: 999px;
  background: rgba(150, 184, 220, 0.14);
  overflow: hidden;
}
.admin-intelligence-body .admin-main .lesson-progress > * { height: 100%; background: linear-gradient(90deg, var(--ax-cyan), var(--ax-blue)); }

/* ---------------- Guided empty / completed states ---------------- */
.admin-intelligence-body .admin-main .admin-empty-state,
.admin-intelligence-body .admin-main .activity-feed article:only-child {
  border: 1px dashed var(--ax-line-strong);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.015);
}
.admin-intelligence-body .admin-main .admin-empty-state.is-complete,
.admin-intelligence-body .admin-main .admin-empty-state.completed {
  border-style: solid;
  border-color: rgba(89, 211, 144, 0.28);
  background: rgba(89, 211, 144, 0.05);
}
.admin-intelligence-body .admin-main .admin-empty-state .eyebrow { color: var(--ax-cyan); }

/* ---------------- Focus states & tap targets ---------------- */
.admin-intelligence-body .admin-main .primary-button:focus-visible,
.admin-intelligence-body .admin-main .secondary-button:focus-visible,
.admin-intelligence-body .admin-main .table-action:focus-visible,
.admin-intelligence-body .admin-main .segmented-control button:focus-visible {
  outline: 2px solid var(--ax-cyan);
  outline-offset: 2px;
}

/* ---------------- Micro-interactions (restrained) ---------------- */
.admin-intelligence-body .admin-main .step-flow article,
.admin-intelligence-body .admin-main .context-strip article { transition: background 0.3s var(--ax-ease), border-color 0.3s var(--ax-ease); }

/* ---------------- Breakpoints (inherit Brick 1 sidebar behavior) ---------------- */
@media (max-width: 900px) {
  .admin-intelligence-body .admin-main .unified-page-header { flex-direction: column; align-items: flex-start; }
  .admin-intelligence-body .admin-main .context-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-intelligence-body .admin-main .step-flow { gap: 6px; }
}
@media (max-width: 560px) {
  .admin-intelligence-body .admin-main .context-strip { grid-template-columns: 1fr; }
}

/* Brick 4 — cashback financial state colours on the cashback route summary band */
.admin-intelligence-body .admin-route-content[data-route-key="cashback"] .control-room-grid .kpi-card:nth-child(3) .metric-number { color: var(--ax-amber); }
.admin-intelligence-body .admin-route-content[data-route-key="cashback"] .control-room-grid .kpi-card:nth-child(4) .metric-number { color: var(--ax-cyan); }
.admin-intelligence-body .admin-route-content[data-route-key="cashback"] .control-room-grid .kpi-card:nth-child(5) .metric-number { color: var(--ax-amber); }
.admin-intelligence-body .admin-route-content[data-route-key="cashback"] .control-room-grid .kpi-card:nth-child(6) .metric-number { color: var(--ax-blue); }
.admin-intelligence-body .admin-route-content[data-route-key="cashback"] .control-room-grid .kpi-card:nth-child(7) .metric-number { color: var(--ax-green); }

/* ============================================================
   AUREX ADMIN OS — Brick 5: Operational Clarity, Cloud Review
   Sign-off & Premium Ease-of-Use. Visual only; extends Brick
   1/3/4 tokens. Scoped to .admin-intelligence-body.
   ============================================================ */

/* ---------------- First-action guidance band ---------------- */
.admin-intelligence-body .admin-main .first-action-guide {
  position: relative;
  display: grid;
  gap: 10px;
  padding: 15px 18px 16px;
  margin: 2px 0 4px;
  border: 1px solid var(--ax-line);
  border-left: 3px solid var(--ax-cyan);
  border-radius: 14px;
  background:
    radial-gradient(130% 120% at 0% 0%, rgba(121, 223, 246, 0.1), transparent 44%),
    linear-gradient(158deg, rgba(13, 28, 51, 0.62), rgba(6, 14, 28, 0.84));
  box-shadow: var(--axm-ops), inset 0 1px 0 rgba(255, 255, 255, 0.07);
}
.admin-intelligence-body .admin-main .first-action-guide .fa-eyebrow {
  color: var(--ax-cyan);
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.admin-intelligence-body .admin-main .first-action-guide .fa-track {
  display: grid;
  grid-template-columns: 1fr auto 1.35fr auto 1fr;
  align-items: stretch;
  gap: 12px;
}
.admin-intelligence-body .admin-main .first-action-guide .fa-step {
  display: grid;
  gap: 4px;
  align-content: start;
  min-width: 0;
}
.admin-intelligence-body .admin-main .first-action-guide .fa-step > span {
  color: rgba(150, 176, 208, 0.72);
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}
.admin-intelligence-body .admin-main .first-action-guide .fa-step > strong {
  color: rgba(226, 236, 250, 0.94);
  font-size: 0.9rem;
  font-weight: 620;
  line-height: 1.32;
  letter-spacing: -0.006em;
}
.admin-intelligence-body .admin-main .first-action-guide .fa-do > strong { color: #f4f9ff; font-weight: 680; }
.admin-intelligence-body .admin-main .first-action-guide .fa-arrow {
  align-self: center;
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  background: no-repeat center / 16px 16px
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2379b0d6' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");
  opacity: 0.6;
}
/* tone accents — attention (amber), steady (blue), clear (emerald) */
.admin-intelligence-body .admin-main .first-action-guide.tone-attention {
  border-left-color: var(--ax-amber);
  background:
    radial-gradient(130% 120% at 0% 0%, rgba(231, 199, 106, 0.13), transparent 46%),
    linear-gradient(158deg, rgba(30, 25, 12, 0.5), rgba(8, 14, 26, 0.85));
}
.admin-intelligence-body .admin-main .first-action-guide.tone-attention .fa-eyebrow { color: var(--ax-amber); }
.admin-intelligence-body .admin-main .first-action-guide.tone-attention .fa-do > strong { color: #fff2d2; }
.admin-intelligence-body .admin-main .first-action-guide.tone-steady { border-left-color: var(--ax-blue); }
.admin-intelligence-body .admin-main .first-action-guide.tone-steady .fa-eyebrow { color: #8fbdf6; }
.admin-intelligence-body .admin-main .first-action-guide.tone-clear {
  border-left-color: var(--ax-green);
  background:
    radial-gradient(130% 120% at 0% 0%, rgba(89, 211, 144, 0.1), transparent 46%),
    linear-gradient(158deg, rgba(11, 30, 22, 0.5), rgba(6, 14, 26, 0.85));
}
.admin-intelligence-body .admin-main .first-action-guide.tone-clear .fa-eyebrow { color: var(--ax-green); }

/* ---------------- Premium light + material lift ---------------- */
.admin-intelligence-body .admin-main .glass-panel,
.admin-intelligence-body .admin-main .admin-table-panel,
.admin-intelligence-body .admin-main .cashback-engine-panel,
.admin-intelligence-body .admin-main .operations-center {
  position: relative;
}
.admin-intelligence-body .admin-main .glass-panel::before,
.admin-intelligence-body .admin-main .admin-table-panel::before,
.admin-intelligence-body .admin-main .cashback-engine-panel::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;
  border-radius: inherit;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.16) 22%, rgba(121, 223, 246, 0.22) 50%, rgba(255, 255, 255, 0.16) 78%, transparent);
  opacity: 0.55;
  pointer-events: none;
}
.admin-intelligence-body .admin-main .kpi-card .metric-number,
.admin-intelligence-body .admin-main .context-strip strong {
  color: #f5faff;
  text-shadow: 0 0 22px rgba(121, 223, 246, 0.12);
  font-variant-numeric: tabular-nums;
}

/* ---------------- Account Requests — cloud review sign-off ---------------- */
.admin-intelligence-body .admin-main .account-request-detail-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 16px;
}
.admin-intelligence-body .admin-main .account-request-detail {
  border: 1px solid var(--ax-line);
  border-top: 2px solid rgba(139, 129, 246, 0.5);
  border-radius: 16px;
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(139, 129, 246, 0.08), transparent 50%),
    linear-gradient(160deg, rgba(15, 26, 50, 0.6), rgba(6, 13, 27, 0.85));
}
.admin-intelligence-body .admin-main .account-request-detail .panel-header h3 { font-size: 1.02rem; font-weight: 660; letter-spacing: -0.01em; }
.admin-intelligence-body .admin-main .account-request-detail .request-detail-list {
  display: grid;
  gap: 1px;
  margin: 4px 0 10px;
  border-radius: 12px;
  overflow: hidden;
}
.admin-intelligence-body .admin-main .request-detail-list > div {
  display: grid;
  grid-template-columns: 130px 1fr;
  gap: 12px;
  padding: 9px 12px;
  background: rgba(255, 255, 255, 0.018);
}
.admin-intelligence-body .admin-main .request-detail-list dt { color: rgba(150, 176, 208, 0.72); font-size: 0.7rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; align-self: center; }
.admin-intelligence-body .admin-main .request-detail-list dd { color: rgba(224, 234, 248, 0.92); font-size: 0.85rem; margin: 0; overflow-wrap: anywhere; }

/* Timeline reads as an auditable vertical rail */
.admin-intelligence-body .admin-main .account-request-timeline {
  position: relative;
  list-style: none;
  margin: 6px 0 2px;
  padding: 0 0 0 20px;
}
.admin-intelligence-body .admin-main .account-request-timeline::before {
  content: "";
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 5px;
  width: 2px;
  background: linear-gradient(180deg, rgba(121, 223, 246, 0.4), rgba(121, 223, 246, 0.06));
}
.admin-intelligence-body .admin-main .account-request-timeline li { position: relative; padding: 0 0 12px 4px; }
.admin-intelligence-body .admin-main .account-request-timeline li::before {
  content: "";
  position: absolute;
  left: -19px;
  top: 4px;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--ax-cyan);
  box-shadow: 0 0 0 3px rgba(121, 223, 246, 0.14);
}
.admin-intelligence-body .admin-main .account-request-timeline li span { display: block; color: rgba(150, 176, 208, 0.7); font-size: 0.66rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.admin-intelligence-body .admin-main .account-request-timeline li strong { display: block; color: #eef4fd; font-size: 0.86rem; font-weight: 630; margin: 1px 0; }
.admin-intelligence-body .admin-main .account-request-timeline li p { color: rgba(196, 210, 230, 0.72); font-size: 0.8rem; margin: 0; }

/* Internal notes are visibly private (protected violet) */
.admin-intelligence-body .admin-main .registry-issue-details {
  margin-top: 8px;
  border: 1px dashed rgba(139, 129, 246, 0.4);
  border-radius: 12px;
  background: linear-gradient(160deg, rgba(31, 24, 58, 0.42), rgba(12, 12, 28, 0.5));
  padding: 4px 12px;
}
.admin-intelligence-body .admin-main .registry-issue-details summary {
  cursor: pointer;
  color: #c7bff9;
  font-size: 0.74rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  padding: 7px 0;
  list-style: none;
}
.admin-intelligence-body .admin-main .registry-issue-details summary::before { content: "\1F512  "; opacity: 0.8; }
.admin-intelligence-body .admin-main .registry-issue-details[open] { padding-bottom: 8px; }
.admin-intelligence-body .admin-main .registry-issue-details .account-request-timeline li::before { background: var(--ax-violet, #8b81f6); box-shadow: 0 0 0 3px rgba(139, 129, 246, 0.16); }
.admin-intelligence-body .admin-main .registry-issue-details .account-request-timeline::before { background: linear-gradient(180deg, rgba(139, 129, 246, 0.42), rgba(139, 129, 246, 0.06)); }

/* Review form — calm, clearly-separated decision controls */
.admin-intelligence-body .admin-main .cloud-account-request-review-form {
  display: grid;
  gap: 10px;
  min-width: 240px;
}
.admin-intelligence-body .admin-main .cloud-account-request-review-form label {
  display: grid;
  gap: 4px;
  color: rgba(150, 176, 208, 0.78);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.admin-intelligence-body .admin-main .cloud-account-request-review-form select,
.admin-intelligence-body .admin-main .cloud-account-request-review-form input,
.admin-intelligence-body .admin-main .cloud-account-request-review-form textarea {
  width: 100%;
  padding: 8px 11px;
  border: 1px solid var(--ax-line-strong, rgba(255,255,255,0.14));
  border-radius: 10px;
  background: rgba(4, 11, 24, 0.6);
  color: #eaf1fb;
  font: inherit;
  font-size: 0.82rem;
  text-transform: none;
  letter-spacing: normal;
}
.admin-intelligence-body .admin-main .cloud-account-request-review-form textarea { min-height: 60px; resize: vertical; }
.admin-intelligence-body .admin-main .cloud-account-request-review-form label:has(textarea[name="internalNote"]) { color: #c7bff9; }
.admin-intelligence-body .admin-main .cloud-account-request-review-form textarea[name="internalNote"] {
  border-color: rgba(139, 129, 246, 0.45);
  background: rgba(24, 18, 46, 0.55);
}
.admin-intelligence-body .admin-main .cloud-account-request-review-form .primary-button { margin-top: 2px; }

/* ---------------- Client Registry — faster scanning ---------------- */
.admin-intelligence-body .admin-main .table-client-ledger .admin-table tbody tr { transition: background 140ms var(--ax-ease, ease), box-shadow 140ms; }
.admin-intelligence-body .admin-main .table-client-ledger .admin-table tbody tr:hover {
  background: linear-gradient(90deg, rgba(121, 223, 246, 0.07), transparent 60%);
  box-shadow: inset 3px 0 0 var(--ax-cyan);
}
.admin-intelligence-body .admin-main .client-name-cell { font-weight: 660; color: #f1f6fd; letter-spacing: -0.006em; }
.admin-intelligence-body .admin-main .client-name-cell,
.admin-intelligence-body .admin-main .private-field-cell {
  display: block;
  max-width: 26ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.admin-intelligence-body .admin-main .private-field-cell { color: rgba(198, 212, 232, 0.72); font-variant-numeric: tabular-nums; }
.admin-intelligence-body .admin-main .issue-reason-cell { color: rgba(226, 189, 120, 0.9); font-size: 0.78rem; }
.admin-intelligence-body .admin-main .table-action-row {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 5px;
  align-items: center;
}
.admin-intelligence-body .admin-main .table-action-row .compact-action { padding: 5px 9px; font-size: 0.72rem; }
.admin-intelligence-body .admin-main .table-icon-button {
  padding: 5px 11px;
  border: 1px solid var(--ax-line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.03);
  color: rgba(220, 232, 248, 0.86);
  font-size: 0.74rem;
  font-weight: 620;
  cursor: pointer;
  transition: border-color 140ms, background 140ms;
}
.admin-intelligence-body .admin-main .table-icon-button:hover { border-color: rgba(121, 223, 246, 0.4); background: rgba(121, 223, 246, 0.08); }

/* ---------------- Cashback — money clarity ---------------- */
.admin-intelligence-body .admin-route-content[data-route-key="cashback"] .control-room-grid .kpi-card:nth-child(4) {
  border-color: rgba(121, 223, 246, 0.34);
  background:
    radial-gradient(120% 100% at 100% 0%, rgba(121, 223, 246, 0.12), transparent 52%),
    linear-gradient(160deg, rgba(12, 30, 48, 0.66), rgba(6, 14, 28, 0.86));
}
.admin-intelligence-body .admin-route-content[data-route-key="cashback"] .control-room-grid .kpi-card:nth-child(4) .metric-number {
  font-size: 1.85rem;
  text-shadow: 0 0 26px rgba(121, 223, 246, 0.28);
}
.admin-intelligence-body .admin-main .table-claim-queue .status-badge.warning { color: #f0d089; }
.admin-intelligence-body .admin-main .table-claim-queue .status-badge.positive { color: #7fe0b0; }
.admin-intelligence-body .admin-main .table-claim-queue .status-badge.danger { color: #ff9ba6; }
.admin-intelligence-body .admin-main .table-claim-queue .admin-table tbody tr:hover { background: linear-gradient(90deg, rgba(89, 211, 144, 0.06), transparent 60%); }
.admin-intelligence-body .admin-main .table-action-group { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.admin-intelligence-body .admin-main .table-action-group button {
  padding: 5px 11px;
  border-radius: 8px;
  border: 1px solid var(--ax-line);
  background: rgba(255, 255, 255, 0.03);
  color: rgba(224, 234, 248, 0.88);
  font-size: 0.73rem;
  font-weight: 640;
  cursor: pointer;
  transition: border-color 140ms, background 140ms, color 140ms;
}
.admin-intelligence-body .admin-main .table-action-group button:nth-child(1):hover { border-color: rgba(89, 211, 144, 0.5); color: #b9f2d4; background: rgba(89, 211, 144, 0.09); }
.admin-intelligence-body .admin-main .table-action-group button:nth-child(2):hover { border-color: rgba(255, 118, 132, 0.5); color: #ffc4cb; background: rgba(255, 118, 132, 0.08); }
.admin-intelligence-body .admin-main .table-action-group button:nth-child(3):hover { border-color: rgba(108, 168, 247, 0.5); color: #cfe0fb; background: rgba(108, 168, 247, 0.09); }

/* ---------------- Performance — review first ---------------- */
.admin-intelligence-body .admin-route-content[data-route-key="performance"] .control-room-grid .kpi-card:nth-child(3) {
  border-color: rgba(231, 199, 106, 0.3);
}
.admin-intelligence-body .admin-route-content[data-route-key="performance"] .control-room-grid .kpi-card:nth-child(3) .metric-number { color: var(--ax-amber); }
.admin-intelligence-body .admin-route-content[data-route-key="performance"] .control-room-grid .kpi-card:nth-child(2) .metric-number { color: var(--ax-green); }
.admin-intelligence-body .admin-main .table-performance-records .admin-table tbody tr:hover { background: linear-gradient(90deg, rgba(108, 168, 247, 0.06), transparent 60%); box-shadow: inset 3px 0 0 var(--ax-blue); }

/* ---------------- State design (empty / waiting / completed) ---------------- */
.admin-intelligence-body .admin-main .admin-empty-state {
  display: grid;
  gap: 12px;
  justify-items: start;
  padding: 26px 24px;
  border: 1px dashed var(--ax-line-strong, rgba(255,255,255,0.14));
  border-radius: 16px;
  background: linear-gradient(160deg, rgba(11, 24, 45, 0.5), rgba(6, 13, 26, 0.7));
}
.admin-intelligence-body .admin-main .admin-empty-state .eyebrow { color: var(--ax-cyan); }
.admin-intelligence-body .admin-main .admin-empty-state h3 { font-size: 1.02rem; font-weight: 660; }
.admin-intelligence-body .admin-main .admin-empty-state p { color: rgba(190, 206, 228, 0.7); max-width: 56ch; }

/* ---------------- Micro-interactions (restrained, reduced-motion safe) ---------------- */
.admin-intelligence-body .admin-main .primary-button,
.admin-intelligence-body .admin-main .secondary-button,
.admin-intelligence-body .admin-main .table-icon-button,
.admin-intelligence-body .admin-main .table-action-group button { transition: transform 90ms var(--ax-ease, ease), border-color 140ms, background 140ms, color 140ms, box-shadow 140ms; }
.admin-intelligence-body .admin-main .primary-button:active,
.admin-intelligence-body .admin-main .secondary-button:active,
.admin-intelligence-body .admin-main .table-icon-button:active,
.admin-intelligence-body .admin-main .table-action-group button:active { transform: translateY(1px) scale(0.985); }
.admin-intelligence-body .admin-main :is(button, a, select, input, textarea, summary):focus-visible {
  outline: 2px solid rgba(121, 223, 246, 0.6);
  outline-offset: 2px;
  border-radius: 8px;
}
@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .admin-main * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
}

/* ---------------- Breakpoints ---------------- */
@media (max-width: 1120px) {
  .admin-intelligence-body .admin-main .first-action-guide .fa-track { grid-template-columns: 1fr; gap: 10px; }
  .admin-intelligence-body .admin-main .first-action-guide .fa-arrow { transform: rotate(90deg); justify-self: start; margin-left: 6px; }
}
@media (max-width: 900px) {
  .admin-intelligence-body .admin-main .account-request-detail-grid { grid-template-columns: 1fr; }
  .admin-intelligence-body .admin-main .request-detail-list > div { grid-template-columns: 108px 1fr; }
  .admin-intelligence-body .admin-main .client-name-cell,
  .admin-intelligence-body .admin-main .private-field-cell { max-width: 20ch; }
}

/* ============================================================
   AUREX CLIENT EXPERIENCE — Brick 1: Premium Entry, Feature
   Discovery & Carlos Welcome. Presentation only. Extends the
   existing portal-entry / carlos tokens.
   ============================================================ */

/* ---------------- Two-column secure entry layout ---------------- */
.portal-secure-entry .portal-entry-layout {
  width: min(1120px, 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
  gap: clamp(18px, 3vw, 34px);
  align-items: stretch;
}
.portal-secure-entry .portal-entry-layout--state { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); }
.portal-secure-entry .portal-client-entry-card { width: 100%; }

/* Feature-preview panel: one connected rail + one dominant stage */
.portal-entry-preview {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: clamp(18px, 2.4vw, 26px);
  border-radius: 20px;
  border: 1px solid rgba(122, 214, 255, 0.14);
  background:
    radial-gradient(120% 90% at 100% 0%, rgba(103, 232, 249, 0.1), transparent 52%),
    linear-gradient(158deg, rgba(12, 28, 52, 0.66), rgba(5, 13, 27, 0.82));
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
.portal-preview-eyebrow {
  color: #6fd7e6;
  font-size: 0.66rem;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.portal-preview-rail {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
.portal-preview-node {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 44px;
  padding: 8px 11px;
  border: 1px solid rgba(132, 204, 255, 0.14);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.028);
  color: rgba(214, 232, 255, 0.82);
  font-size: 0.78rem;
  font-weight: 640;
  text-align: left;
  cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease, color 160ms ease, transform 90ms ease;
}
.portal-preview-node-icon {
  display: grid;
  place-items: center;
  width: 26px;
  height: 26px;
  flex: 0 0 auto;
  border-radius: 8px;
  background: rgba(103, 232, 249, 0.1);
}
.portal-preview-node-icon svg { width: 15px; height: 15px; fill: #8fe3ff; }
.portal-preview-node-label { min-width: 0; }
.portal-preview-node:hover { border-color: rgba(137, 232, 255, 0.32); background: rgba(103, 232, 249, 0.07); color: #f4fbff; }
.portal-preview-node.is-active {
  border-color: rgba(137, 232, 255, 0.42);
  background: linear-gradient(150deg, rgba(67, 150, 255, 0.22), rgba(103, 232, 249, 0.08));
  color: #f7fdff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
}
.portal-preview-node.is-active .portal-preview-node-icon { background: rgba(103, 232, 249, 0.24); }

.portal-preview-stage {
  position: relative;
  min-height: 190px;
  border: 1px solid rgba(122, 214, 255, 0.14);
  border-radius: 16px;
  background: linear-gradient(160deg, rgba(9, 22, 43, 0.72), rgba(5, 12, 25, 0.88));
  overflow: hidden;
}
.portal-preview-stage-card {
  display: grid;
  gap: 10px;
  padding: 18px 18px 16px;
  animation: portalPreviewFade 260ms ease;
}
.portal-preview-tag {
  color: #7fd7f0;
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.portal-preview-stage-card h3 { font-size: 1.06rem; font-weight: 680; letter-spacing: -0.01em; color: #f4f9ff; }
.portal-preview-stage-card p { color: rgba(200, 218, 240, 0.76); font-size: 0.86rem; line-height: 1.45; }
.portal-preview-metric {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-top: 2px;
  padding-top: 12px;
  border-top: 1px solid rgba(130, 198, 255, 0.12);
}
.portal-preview-metric span { color: rgba(160, 186, 216, 0.72); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.portal-preview-metric strong { color: #8fe3ff; font-size: 1rem; font-weight: 720; }
.portal-preview-foot { color: rgba(150, 176, 208, 0.6); font-size: 0.68rem; line-height: 1.4; }
@keyframes portalPreviewFade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* Trust strip icons */
.portal-login-trust-strip span {
  display: flex;
  align-items: center;
  gap: 7px;
}
.portal-login-trust-strip span svg { width: 15px; height: 15px; flex: 0 0 auto; fill: #7fe0b0; }
.portal-password-toggle { min-width: 52px; font-size: 0.76rem; font-weight: 640; }
.portal-entry-status.is-error span { color: #ffb4bd; }
.portal-login-submit[aria-busy="true"] { opacity: 0.82; }

/* ---------------- Access-state gates ---------------- */
.portal-access-state-card .portal-entry-copy h1 { font-size: clamp(1.5rem, 3.4vw, 2rem); }
.portal-access-state-list {
  display: grid;
  gap: 10px;
  margin: 18px 0 4px;
  padding: 0;
  list-style: none;
}
.portal-access-state-list li {
  display: grid;
  gap: 3px;
  padding: 12px 14px;
  border: 1px solid rgba(132, 204, 255, 0.12);
  border-left: 3px solid rgba(132, 204, 255, 0.4);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.022);
}
.portal-access-state-list li span {
  color: rgba(160, 186, 216, 0.74);
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.portal-access-state-list li p { color: rgba(216, 230, 248, 0.9); font-size: 0.9rem; line-height: 1.44; margin: 0; }
.portal-access-state-card.tone-amber .pas-do { border-left-color: rgba(231, 199, 106, 0.6); }
.portal-access-state-card.tone-amber .pas-do span { color: #e7c76a; }
.portal-access-state-list .pas-next { border-left-color: rgba(89, 211, 144, 0.5); }
.portal-access-state-list .pas-next span { color: #7fe0b0; }
.portal-access-state-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}
.portal-access-state-actions .primary-button,
.portal-access-state-actions .secondary-button { flex: 1 1 160px; justify-content: center; min-height: 46px; }
.portal-access-state-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(130, 198, 255, 0.1);
}
.portal-text-action {
  border: 0;
  background: none;
  padding: 6px 2px;
  color: rgba(205, 228, 255, 0.72);
  font: inherit;
  font-size: 0.82rem;
  text-decoration: none;
  cursor: pointer;
}
.portal-text-action:hover { color: #f7fbff; }

/* ---------------- Carlos welcome + first-session journey ---------------- */
.portal-main .carlos-welcome-rail {
  display: grid;
  gap: 16px;
  padding: clamp(16px, 2.2vw, 22px);
  border-radius: 20px;
  border: 1px solid rgba(122, 214, 255, 0.16);
  background:
    radial-gradient(120% 100% at 0% 0%, rgba(103, 232, 249, 0.09), transparent 46%),
    linear-gradient(158deg, rgba(12, 28, 52, 0.6), rgba(6, 14, 28, 0.82));
  box-shadow: 0 26px 80px rgba(0, 0, 0, 0.36), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
.carlos-welcome-lead { display: grid; gap: 8px; }
.carlos-welcome-headline { font-size: clamp(1.16rem, 2.4vw, 1.4rem); font-weight: 700; letter-spacing: -0.012em; color: #f4f9ff; }
.carlos-welcome-sub { color: rgba(200, 218, 240, 0.76); font-size: 0.9rem; line-height: 1.5; max-width: 62ch; }
.carlos-welcome-warning {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 10px 13px;
  border: 1px solid rgba(231, 199, 106, 0.34);
  border-radius: 12px;
  background: rgba(231, 199, 106, 0.08);
  color: #f4dfa6;
  font-size: 0.84rem;
  line-height: 1.4;
}
.carlos-welcome-warning span {
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: rgba(231, 199, 106, 0.24);
  color: #1a1405;
  font-weight: 900;
  font-size: 0.72rem;
}
.carlos-welcome-cta { justify-self: start; min-height: 46px; }

.carlos-journey { display: grid; gap: 10px; }
.carlos-journey-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.carlos-journey-head span { color: rgba(160, 186, 216, 0.78); font-size: 0.66rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.carlos-journey-head small { color: rgba(143, 227, 255, 0.86); font-size: 0.74rem; font-weight: 700; }
.carlos-journey-rail {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: journey;
}
.carlos-journey-step a {
  position: relative;
  display: grid;
  gap: 6px;
  height: 100%;
  padding: 12px 12px 12px;
  border: 1px solid rgba(132, 204, 255, 0.12);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.022);
  text-decoration: none;
  color: inherit;
  transition: border-color 160ms ease, background 160ms ease, transform 90ms ease;
}
.carlos-journey-step a:hover { border-color: rgba(137, 232, 255, 0.3); background: rgba(103, 232, 249, 0.06); }
.carlos-journey-step .cj-dot {
  width: 11px; height: 11px; border-radius: 50%;
  border: 2px solid rgba(150, 176, 208, 0.5);
  background: transparent;
}
.carlos-journey-step .cj-body { display: grid; gap: 2px; min-width: 0; }
.carlos-journey-step .cj-body strong { font-size: 0.82rem; font-weight: 660; color: #eaf2fd; line-height: 1.2; }
.carlos-journey-step .cj-body small { color: rgba(178, 198, 222, 0.66); font-size: 0.7rem; }
.carlos-journey-step .cj-state { font-size: 0.62rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(160, 186, 216, 0.6); }
.carlos-journey-step.is-complete .cj-dot { border-color: rgba(89, 211, 144, 0.9); background: var(--ax-green, #59d390); box-shadow: 0 0 0 3px rgba(89, 211, 144, 0.14); }
.carlos-journey-step.is-complete .cj-state { color: #7fe0b0; }
.carlos-journey-step.is-recommended a { border-color: rgba(137, 232, 255, 0.4); background: linear-gradient(150deg, rgba(67, 150, 255, 0.16), rgba(103, 232, 249, 0.05)); }
.carlos-journey-step.is-recommended .cj-dot { border-color: #8fe3ff; background: #8fe3ff; box-shadow: 0 0 0 3px rgba(103, 232, 249, 0.18); }
.carlos-journey-step.is-recommended .cj-state { color: #8fe3ff; }
.carlos-journey-step.is-next { opacity: 0.9; }

/* ---------------- Motion / reduced motion ---------------- */
.portal-preview-node:active,
.carlos-journey-step a:active,
.portal-preview-stage-card :active { transform: translateY(1px); }
@media (prefers-reduced-motion: reduce) {
  .portal-preview-stage-card { animation: none; }
  .portal-preview-node,
  .carlos-journey-step a { transition: none; }
}

/* ---------------- Focus states ---------------- */
.portal-secure-entry :is(button, a, input, [role="tab"]):focus-visible,
.portal-main .carlos-welcome-rail :is(button, a):focus-visible {
  outline: 2px solid rgba(137, 232, 255, 0.62);
  outline-offset: 2px;
  border-radius: 10px;
}

/* ---------------- Breakpoints ---------------- */
@media (max-width: 900px) {
  .portal-secure-entry .portal-entry-layout,
  .portal-secure-entry .portal-entry-layout--state {
    grid-template-columns: minmax(0, 1fr);
    max-width: 560px;
  }
  /* Login card first, feature preview beneath (section 9). */
  .portal-entry-preview { order: 2; }
  .portal-client-entry-card { order: 1; }
  .carlos-journey-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .portal-secure-entry .portal-entry-layout { padding: 4px 0 8px; gap: 14px; }
  .portal-preview-rail { grid-template-columns: 1fr; }
  .portal-access-state-actions .primary-button,
  .portal-access-state-actions .secondary-button { flex: 1 1 100%; }
  .carlos-journey-rail { grid-template-columns: 1fr; }
  .carlos-journey-step a { grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; }
  .carlos-journey-step .cj-state { justify-self: end; }
}

/* ============================================================
   Client Experience Brick 1 — Pro Rewards enrichment (restrained).
   No structure/length change; richer glass, feature discovery,
   Carlos presence, mobile depth, and a cleaner sign-in transition.
   ============================================================ */

/* Richer professional glass: inner top reflection on the command console */
.pro-cinema .ax-console::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2) 24%, rgba(127, 216, 247, 0.34) 50%, rgba(255, 255, 255, 0.2) 76%, transparent);
  opacity: 0.7;
}

/* Stronger Carlos preview: a calm presence indicator on the insight label */
.pro-cinema .ax-console-insight { position: relative; }
.pro-cinema .ax-console-insight .ax-label {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.pro-cinema .ax-console-insight .ax-label::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--ax-cyan, #7fd8f7);
  box-shadow: 0 0 0 0 rgba(127, 216, 247, 0.5);
  animation: axCarlosPulse 2.6s ease-out infinite;
}
@keyframes axCarlosPulse {
  0% { box-shadow: 0 0 0 0 rgba(127, 216, 247, 0.45); }
  70% { box-shadow: 0 0 0 7px rgba(127, 216, 247, 0); }
  100% { box-shadow: 0 0 0 0 rgba(127, 216, 247, 0); }
}

/* Stronger feature discovery: system-rail nodes respond to hover/focus */
.pro-cinema .ax-systemrail .ax-rail li {
  transition: transform 160ms ease, border-color 160ms ease, background 160ms ease;
}
.pro-cinema .ax-systemrail .ax-rail li:hover {
  transform: translateY(-3px);
  border-color: rgba(127, 216, 247, 0.34);
  background: rgba(127, 216, 247, 0.06);
}
.pro-cinema .ax-systemrail .ax-rail li:hover i { filter: brightness(1.25); }

/* Clearer number motion emphasis on the financial figure */
.pro-cinema #cashbackEstimate,
.pro-cinema .ax-console-metrics strong {
  font-variant-numeric: tabular-nums;
  transition: text-shadow 400ms ease;
}
.pro-cinema #cashbackEstimate { text-shadow: 0 0 30px rgba(127, 216, 247, 0.22); }

/* Cleaner transition from Pro page into client sign-in */
.pro-cinema .premium-nav-link[href="/portal/"],
.pro-cinema .pro-cta-row .quiet {
  position: relative;
  transition: color 160ms ease, border-color 160ms ease, background 160ms ease;
}
.pro-cinema .premium-nav-link[href="/portal/"]:hover { color: #eafaff; }
.pro-cinema .pro-cta-row .quiet:hover {
  border-color: rgba(127, 216, 247, 0.4);
  background: rgba(127, 216, 247, 0.08);
}

/* Improved mobile visual depth for the cinematic surfaces */
@media (max-width: 720px) {
  .pro-cinema .ax-console {
    box-shadow: 0 26px 70px rgba(1, 5, 12, 0.62), inset 0 1px 0 rgba(255, 255, 255, 0.1);
  }
  .pro-cinema .ax-console-insight { background: rgba(127, 216, 247, 0.07); }
}

@media (prefers-reduced-motion: reduce) {
  .pro-cinema .ax-console-insight .ax-label::before { animation: none; }
  .pro-cinema .ax-systemrail .ax-rail li { transition: none; }
}

/* CE1 — enforce 44px minimum action targets on the entry form */
.portal-client-login-form .portal-login-submit { min-height: 50px; border-radius: 13px; font-size: 0.95rem; letter-spacing: 0.01em; }
.portal-password-field .portal-password-toggle { min-height: 44px; }

/* ============================================================
   AUREX CLIENT PORTAL — Brick 2: Daily Command Center, Carlos
   Intelligence Hub & Premium Service Presentation. Presentation
   only. Scoped to the authenticated portal (.portal-main).
   ============================================================ */

/* ---------------- Daily Command Center (Home hero) ---------------- */
.portal-main .portal-command-center {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
  gap: clamp(16px, 2.4vw, 30px);
  padding: clamp(18px, 2.6vw, 28px);
  border-radius: 22px;
  border: 1px solid rgba(122, 214, 255, 0.16);
  border-left: 3px solid var(--ax-cyan, #7fd8f7);
  background:
    radial-gradient(130% 120% at 0% 0%, rgba(103, 232, 249, 0.1), transparent 44%),
    linear-gradient(158deg, rgba(13, 30, 55, 0.72), rgba(6, 14, 28, 0.86));
  box-shadow: 0 32px 96px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  overflow: hidden;
}
.portal-main .portal-command-center::before {
  content: "";
  position: absolute; inset: 0 0 auto 0; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.18) 26%, rgba(127,216,247,0.3) 50%, rgba(255,255,255,0.18) 74%, transparent);
  opacity: 0.6;
}
.portal-main .portal-command-center.tone-amber { border-left-color: var(--ax-amber, #e7c76a); }
.pcc-eyebrow { color: #6fd7e6; font-size: 0.64rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; }
.pcc-greeting { font-size: clamp(1.5rem, 3.4vw, 2.05rem); font-weight: 720; letter-spacing: -0.018em; margin: 6px 0 4px; color: #f6fbff; }
.pcc-state { color: rgba(196, 214, 238, 0.74); font-size: 0.88rem; }
.pcc-signal { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.pcc-label { display: block; color: rgba(150, 176, 208, 0.72); font-size: 0.6rem; font-weight: 800; letter-spacing: 0.11em; text-transform: uppercase; margin-bottom: 4px; }
.pcc-reco {
  display: grid; gap: 6px; padding: 14px 16px;
  border: 1px solid rgba(122, 214, 255, 0.14); border-radius: 14px;
  background: linear-gradient(155deg, rgba(67, 150, 255, 0.14), rgba(103, 232, 249, 0.04));
}
.pcc-reco strong { font-size: 1.04rem; font-weight: 700; letter-spacing: -0.01em; color: #f4f9ff; line-height: 1.25; }
.pcc-reco p { color: rgba(198, 214, 236, 0.76); font-size: 0.84rem; line-height: 1.4; }
.pcc-cta { justify-self: start; margin-top: 6px; min-height: 46px; }
.pcc-aside { display: grid; gap: 10px; align-content: start; }
.pcc-change p { color: rgba(214, 228, 246, 0.86); font-size: 0.86rem; line-height: 1.4; }
.pcc-warning {
  display: flex; align-items: flex-start; gap: 9px;
  padding: 10px 12px; border: 1px solid rgba(231, 199, 106, 0.34); border-radius: 12px;
  background: rgba(231, 199, 106, 0.08); color: #f4dfa6; font-size: 0.82rem; line-height: 1.4;
}
.pcc-warning span { display: grid; place-items: center; width: 18px; height: 18px; flex: 0 0 auto; border-radius: 50%; background: rgba(231,199,106,0.24); color: #1a1405; font-weight: 900; font-size: 0.7rem; }

/* ---------------- Connected daily intelligence strip ---------------- */
.portal-main .portal-daily-strip {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px;
  padding: 4px 0 2px;
}
.portal-main .pds-node {
  position: relative; display: grid; gap: 5px; padding: 12px 12px;
  border: 1px solid rgba(132, 204, 255, 0.12); border-radius: 14px;
  background: linear-gradient(160deg, rgba(11, 25, 47, 0.5), rgba(6, 13, 26, 0.72));
  text-decoration: none; color: inherit;
  transition: border-color 160ms ease, background 160ms ease, transform 90ms ease;
}
.portal-main .pds-node::after {
  content: ""; position: absolute; top: 50%; right: -5px; width: 8px; height: 2px;
  background: rgba(132, 204, 255, 0.28); transform: translateY(-50%);
}
.portal-main .pds-node:last-child::after { display: none; }
.portal-main .pds-node:hover { border-color: rgba(137, 232, 255, 0.3); background: rgba(103, 232, 249, 0.06); transform: translateY(-2px); }
.pds-dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(150, 176, 208, 0.5); }
.pds-body { display: grid; gap: 1px; min-width: 0; }
.pds-body strong { font-size: 0.82rem; font-weight: 660; color: #eaf2fd; }
.pds-body small { font-size: 0.68rem; color: rgba(178, 198, 222, 0.66); }
.pds-node.is-ready .pds-dot { background: var(--ax-cyan, #7fd8f7); box-shadow: 0 0 0 3px rgba(103, 232, 249, 0.14); }
.pds-node.is-active .pds-dot { background: var(--ax-green, #59d390); box-shadow: 0 0 0 3px rgba(89, 211, 144, 0.16); }
.pds-node.is-active { border-color: rgba(89, 211, 144, 0.3); }
.pds-node.is-wait .pds-dot { background: var(--ax-amber, #e7c76a); }
.pds-node.is-data .pds-dot { background: transparent; border: 2px solid rgba(150, 176, 208, 0.5); }

/* ---------------- Today panel ---------------- */
.portal-main .portal-today-panel { display: grid; gap: 12px; }
.portal-main .pt-head .eyebrow { color: #6fd7e6; }
.portal-main .pt-head h3 { font-size: 1.06rem; font-weight: 680; letter-spacing: -0.01em; }
.portal-main .pt-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.portal-main .pt-item {
  display: grid; gap: 3px; padding: 15px 16px;
  border: 1px solid rgba(132, 204, 255, 0.12); border-left: 3px solid rgba(132, 204, 255, 0.5);
  border-radius: 14px; background: linear-gradient(160deg, rgba(11, 25, 47, 0.5), rgba(6, 13, 26, 0.72));
}
.portal-main .pt-item.tone-emerald { border-left-color: rgba(89, 211, 144, 0.7); }
.portal-main .pt-item.tone-amber { border-left-color: rgba(231, 199, 106, 0.7); }
.portal-main .pt-item.tone-violet { border-left-color: rgba(139, 129, 246, 0.7); }
.portal-main .pt-item.tone-cyan { border-left-color: rgba(127, 216, 247, 0.7); }
.pt-label { color: rgba(150, 176, 208, 0.7); font-size: 0.58rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; margin-top: 4px; }
.pt-item > strong { font-size: 0.98rem; font-weight: 680; color: #f2f8ff; letter-spacing: -0.008em; }
.pt-item > p { color: rgba(198, 214, 236, 0.76); font-size: 0.82rem; line-height: 1.4; }
.pt-item .compact-action { justify-self: start; margin-top: 8px; min-height: 40px; }
.portal-main .portal-overview-monthhead { margin-top: 2px; }

/* ---------------- Carlos intelligence hub header ---------------- */
.portal-main .carlos-hub-header {
  display: grid;
  grid-template-columns: minmax(0, auto) minmax(0, 1fr) minmax(0, auto);
  align-items: center; gap: clamp(12px, 2vw, 22px);
  padding: 14px 18px; border-radius: 18px;
  border: 1px solid rgba(122, 214, 255, 0.16);
  background:
    radial-gradient(120% 120% at 0% 0%, rgba(103, 232, 249, 0.09), transparent 46%),
    linear-gradient(158deg, rgba(13, 30, 55, 0.66), rgba(6, 14, 28, 0.84));
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
.chh-presence { display: flex; align-items: center; gap: 10px; }
.chh-presence strong { display: block; font-size: 0.98rem; font-weight: 700; color: #f4f9ff; }
.chh-presence small { color: rgba(178, 198, 222, 0.66); font-size: 0.72rem; }
.chh-dot { width: 11px; height: 11px; border-radius: 50%; background: var(--ax-green, #59d390); box-shadow: 0 0 0 0 rgba(89, 211, 144, 0.5); animation: chhPulse 2.6s ease-out infinite; }
@keyframes chhPulse { 0% { box-shadow: 0 0 0 0 rgba(89,211,144,0.45); } 70% { box-shadow: 0 0 0 8px rgba(89,211,144,0); } 100% { box-shadow: 0 0 0 0 rgba(89,211,144,0); } }
.chh-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0; }
.chh-meta div { min-width: 0; }
.chh-meta dt { color: rgba(150, 176, 208, 0.72); font-size: 0.58rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.chh-meta dd { margin: 2px 0 0; color: #e7f0fb; font-size: 0.82rem; font-weight: 620; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chh-sources { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.chh-sources-label { color: rgba(150, 176, 208, 0.7); font-size: 0.6rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; margin-right: 2px; }
.chh-chip { padding: 4px 9px; border: 1px solid rgba(127, 216, 247, 0.28); border-radius: 999px; background: rgba(127, 216, 247, 0.08); color: #bfeaff; font-size: 0.7rem; font-weight: 640; }
.chh-chip.is-empty { border-color: rgba(150,176,208,0.24); background: rgba(255,255,255,0.03); color: rgba(190,206,228,0.7); }
.chh-route { grid-column: 1 / -1; justify-self: start; }

/* ---------------- Carlos structured card (market answer) ---------------- */
.portal-main .carlos-structured-card .intelligence-card-head strong.is-grounded { color: #7fe0b0; }
.portal-main .carlos-structured-card .intelligence-card-head strong.is-fresh-tag { color: #f0d089; }
.portal-main .carlos-market-state,
.portal-main .carlos-next-review {
  display: grid; gap: 3px; padding: 10px 12px; margin-top: 8px;
  border: 1px solid rgba(132, 204, 255, 0.14); border-radius: 12px; background: rgba(255, 255, 255, 0.022);
}
.portal-main .carlos-market-state span,
.portal-main .carlos-next-review span { color: rgba(150,176,208,0.72); font-size: 0.6rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.portal-main .carlos-market-state p,
.portal-main .carlos-next-review p { color: #e7f0fb; font-size: 0.86rem; line-height: 1.4; margin: 0; }
.portal-main .carlos-next-review .compact-action { justify-self: start; margin-top: 6px; }
.portal-main .carlos-structured-card.is-fresh { border-left: 3px solid rgba(231, 199, 106, 0.6); }

/* ---------------- Cashback formula + flow ---------------- */
.portal-main .cashback-formula-strip {
  display: grid; grid-template-columns: 1fr auto 1fr auto 1.15fr; align-items: center; gap: clamp(8px, 1.6vw, 18px);
  padding: clamp(16px, 2.2vw, 22px); border-radius: 18px;
  border: 1px solid rgba(122, 214, 255, 0.16);
  background: linear-gradient(158deg, rgba(12, 30, 50, 0.68), rgba(6, 14, 28, 0.86));
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
.cfs-term { display: grid; gap: 3px; min-width: 0; }
.cfs-term span { color: rgba(150,176,208,0.74); font-size: 0.62rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.cfs-term strong { font-size: clamp(1.2rem, 2.6vw, 1.7rem); font-weight: 720; color: #f2f8ff; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.cfs-term small { color: rgba(178,198,222,0.62); font-size: 0.7rem; }
.cfs-result strong { color: #8fe3ff; text-shadow: 0 0 26px rgba(127, 216, 247, 0.24); }
.cfs-op { font-size: 1.3rem; font-weight: 700; color: rgba(160,186,216,0.6); text-align: center; }
.portal-main .cashback-flow-rail {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none;
}
.portal-main .cashback-flow-rail li {
  position: relative;
  display: grid; gap: 4px; padding: 13px 14px; border: 1px solid rgba(132,204,255,0.12); border-top: 2px solid rgba(132,204,255,0.4);
  border-radius: 12px; background: rgba(255,255,255,0.022);
}
/* Chevron connectors so the row reads as a lifecycle (earned → paid). */
.portal-main .cashback-flow-rail li:not(:last-child)::after {
  content: ""; position: absolute; right: -7px; top: 50%; width: 8px; height: 8px; z-index: 1;
  transform: translateY(-50%) rotate(45deg); border-top: 2px solid rgba(150,176,208,0.4); border-right: 2px solid rgba(150,176,208,0.4);
}
.portal-main .cashback-flow-rail li span { color: rgba(150,176,208,0.78); font-size: 0.6rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.portal-main .cashback-flow-rail li strong { font-size: 1.08rem; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
/* Per-state selectors include .cashback-flow-rail so they beat the base
   `.portal-main .cashback-flow-rail li` (0,2,1) — without this the stages all
   render the same base colour and the lifecycle reads as one flat row. */
/* Estimated: a pre-review projection (calm, not a claim of earnings). */
.portal-main .cashback-flow-rail .cbf-estimated { border-top-color: rgba(150, 176, 208, 0.55); background: rgba(150,176,208,0.05); }
.portal-main .cashback-flow-rail .cbf-estimated strong { color: #cfdbec; }
/* Available: the actionable amount — the brightest stage. */
.portal-main .cashback-flow-rail .cbf-available { border-top-color: rgba(127, 216, 247, 0.85); background: rgba(127,216,247,0.08); }
.portal-main .cashback-flow-rail .cbf-available strong { color: #8fe3ff; }
/* Requested: pending admin review (amber = waiting). */
.portal-main .cashback-flow-rail .cbf-requested { border-top-color: rgba(231, 199, 106, 0.75); background: rgba(231,199,106,0.06); }
.portal-main .cashback-flow-rail .cbf-requested strong { color: #f0d089; }
/* Approved: verified, not yet paid (blue). */
.portal-main .cashback-flow-rail .cbf-approved { border-top-color: rgba(108, 168, 247, 0.85); background: rgba(108,168,247,0.06); }
.portal-main .cashback-flow-rail .cbf-approved strong { color: #a9c9fb; }
/* Paid: settled (green). */
.portal-main .cashback-flow-rail .cbf-paid { border-top-color: rgba(89, 211, 144, 0.85); background: rgba(89,211,144,0.07); }
.portal-main .cashback-flow-rail .cbf-paid strong { color: #7fe0b0; }
@media (max-width: 640px) {
  .portal-main .cashback-flow-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal-main .cashback-flow-rail li:not(:last-child)::after { display: none; }
}

/* ---------------- Premium number glow + glass edge on existing surfaces ---------------- */
.portal-main .portal-stat strong,
.portal-main .portal-focus-number strong,
.portal-main .coach-score-grid .portal-stat strong {
  font-variant-numeric: tabular-nums;
  text-shadow: 0 0 22px rgba(127, 216, 247, 0.1);
}
.portal-main .portal-kpi-grid .portal-stat { position: relative; }
.portal-main .portal-kpi-grid .portal-stat::before {
  content: ""; position: absolute; inset: 0 0 auto 0; height: 1px; border-radius: inherit; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(127,216,247,0.2) 50%, transparent); opacity: 0.5;
}

/* ---------------- Chart Reader semantic light (elevate existing) ---------------- */
.portal-main .confidence-meter[data-direction="bullish"] i { background: linear-gradient(90deg, rgba(89,211,144,0.6), var(--ax-green, #59d390)); }
.portal-main .confidence-meter[data-direction="bearish"] i { background: linear-gradient(90deg, rgba(255,118,132,0.55), #ff7684); }
.portal-main .confidence-meter[data-direction="neutral"] i { background: linear-gradient(90deg, rgba(127,216,247,0.55), var(--ax-cyan, #7fd8f7)); }
.portal-main .coach-list-card.positive { border-left: 3px solid rgba(89,211,144,0.6); }
.portal-main .coach-list-card.warning { border-left: 3px solid rgba(231,199,106,0.6); }
.portal-main .coach-list-card.danger { border-left: 3px solid rgba(255,118,132,0.55); }

/* ---------------- Motion / reduced motion ---------------- */
.portal-main .pds-node:active,
.portal-main .pt-item .compact-action:active,
.portal-main .pcc-cta:active { transform: translateY(1px); }
@media (prefers-reduced-motion: reduce) {
  .chh-dot { animation: none; }
  .portal-main .pds-node { transition: none; }
}

/* ---------------- Focus states ---------------- */
.portal-main :is(.pds-node, .pt-item a, .pcc-cta, .chh-route, .cashback-flow-rail a):focus-visible {
  outline: 2px solid rgba(137, 232, 255, 0.62); outline-offset: 2px; border-radius: 12px;
}

/* ---------------- Breakpoints: desktop ---------------- */
@media (max-width: 1100px) {
  .portal-main .portal-command-center { grid-template-columns: minmax(0, 1fr); }
  .portal-main .carlos-hub-header { grid-template-columns: minmax(0, 1fr); }
  .chh-meta { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* ---------------- Breakpoints: mobile ---------------- */
@media (max-width: 760px) {
  .portal-main .pcc-signal { grid-template-columns: minmax(0, 1fr); }
  .portal-main .portal-daily-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .portal-main .pds-node::after { display: none; }
  .portal-main .cashback-formula-strip { grid-template-columns: 1fr; text-align: left; }
  .portal-main .cashback-formula-strip .cfs-op { justify-self: start; }
  .portal-main .cashback-flow-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .chh-meta { grid-template-columns: 1fr; }
}
@media (max-width: 460px) {
  .portal-main .portal-daily-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal-main .cashback-flow-rail { grid-template-columns: 1fr; }
  .pcc-greeting { font-size: 1.5rem; }
}

/* ============================================================
   AUREX CLIENT PORTAL — Brick 3: Deep Service Workspaces.
   Presentation only; scoped to .portal-main. Service identities:
   Chart=cyan, Strategy=violet, Performance=blue/emerald,
   Cashback=cyan/emerald, Education=blue, risk=red, review=amber.
   ============================================================ */

/* ---------------- Chart Reader — decision terminal ---------------- */
.portal-main .cr-decision-terminal {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 1px;
  margin: 12px 0 4px;
  border: 1px solid rgba(127, 216, 247, 0.18);
  border-radius: 14px;
  overflow: hidden;
  background: rgba(127, 216, 247, 0.06);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
.portal-main .cr-decision-terminal .crt-cell {
  display: grid; gap: 3px; padding: 10px 12px; min-width: 0;
  background: linear-gradient(160deg, rgba(10, 24, 45, 0.82), rgba(6, 13, 26, 0.9));
}
.portal-main .crt-cell span { color: rgba(150, 176, 208, 0.72); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.portal-main .crt-cell strong { color: #eef6ff; font-size: 0.86rem; font-weight: 680; font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-main .crt-confidence strong { color: #8fe3ff; text-shadow: 0 0 20px rgba(127, 216, 247, 0.28); }
.portal-main .cr-decision-terminal[data-direction="bullish"] .crt-bias strong { color: #7fe0b0; }
.portal-main .cr-decision-terminal[data-direction="bearish"] .crt-bias strong { color: #ff9ba6; }
.portal-main .cr-decision-terminal[data-direction="neutral"] .crt-bias strong { color: #8fe3ff; }

/* Chart Reader service identity + evidence accordions */
.portal-main .scenario-plan-workspace { border-left: 3px solid rgba(127, 216, 247, 0.55); }
.portal-main .cr-evidence-group,
.portal-main .advanced-analysis-details {
  border: 1px solid rgba(132, 204, 255, 0.12); border-radius: 14px; margin-top: 10px;
  background: linear-gradient(160deg, rgba(11, 25, 47, 0.5), rgba(6, 13, 26, 0.72));
  overflow: hidden;
}
.portal-main .cr-evidence-group > summary,
.portal-main .advanced-analysis-details > summary {
  cursor: pointer; padding: 12px 15px; list-style: none;
  color: #cfe6ff; font-size: 0.8rem; font-weight: 700; letter-spacing: 0.02em;
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
}
.portal-main .cr-evidence-group > summary::-webkit-details-marker,
.portal-main .advanced-analysis-details > summary::-webkit-details-marker { display: none; }
.portal-main .cr-evidence-group > summary::after,
.portal-main .advanced-analysis-details > summary::after {
  content: ""; width: 9px; height: 9px; border-right: 2px solid rgba(160,186,216,0.7); border-bottom: 2px solid rgba(160,186,216,0.7);
  transform: rotate(45deg); transition: transform 180ms ease; flex: 0 0 auto;
}
.portal-main .cr-evidence-group[open] > summary::after,
.portal-main .advanced-analysis-details[open] > summary::after { transform: rotate(-135deg); }
.portal-main .cr-evidence-group > summary + *,
.portal-main .advanced-analysis-details > summary + * { padding: 0 15px 14px; }

/* Import experience: workflow steps, validation, drop zone */
.portal-main .analysis-workflow-steps {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-bottom: 14px;
}
.portal-main .analysis-workflow-steps article {
  display: flex; align-items: center; gap: 9px; padding: 10px 12px;
  border: 1px solid rgba(132, 204, 255, 0.12); border-radius: 12px; background: rgba(255,255,255,0.022);
  color: rgba(200, 218, 240, 0.7); font-size: 0.78rem; font-weight: 640;
}
.portal-main .analysis-workflow-steps article span {
  display: grid; place-items: center; width: 22px; height: 22px; flex: 0 0 auto; border-radius: 50%;
  background: rgba(255,255,255,0.05); color: rgba(206,219,237,0.7); font-size: 0.7rem; font-weight: 800;
}
.portal-main .analysis-workflow-steps article.is-active { border-color: rgba(127,216,247,0.4); color: #f4fbff; background: linear-gradient(150deg, rgba(67,150,255,0.18), rgba(103,232,249,0.06)); }
.portal-main .analysis-workflow-steps article.is-active span { background: var(--ax-cyan, #7fd8f7); color: #04121f; }
.portal-main .candle-import-zone textarea {
  min-height: 120px; border: 1px dashed rgba(127, 216, 247, 0.28); border-radius: 12px;
  background: rgba(4, 11, 24, 0.55); transition: border-color 160ms ease, background 160ms ease;
}
.portal-main .candle-import-zone textarea:focus { border-style: solid; border-color: rgba(137,232,255,0.5); background: rgba(4,11,24,0.7); }
.portal-main .candle-validation-state {
  display: grid; gap: 3px; padding: 12px 14px; border-radius: 12px;
  border: 1px solid rgba(231, 199, 106, 0.3); border-left: 3px solid rgba(231, 199, 106, 0.7);
  background: rgba(231, 199, 106, 0.07);
}
.portal-main .candle-validation-state strong { color: #f4dfa6; font-size: 0.86rem; }
.portal-main .candle-validation-state.is-valid { border-color: rgba(89,211,144,0.34); border-left-color: rgba(89,211,144,0.7); background: rgba(89,211,144,0.07); }
.portal-main .candle-validation-state.is-valid strong { color: #7fe0b0; }
.portal-main .candle-validation-state.is-error { border-color: rgba(255,118,132,0.34); border-left-color: rgba(255,118,132,0.7); background: rgba(255,118,132,0.06); }
.portal-main #generateMockAnalysisBtn { min-height: 48px; }
.portal-main .insufficient-data-state {
  display: grid; gap: 4px; padding: 14px 16px; margin: 10px 0;
  border: 1px solid rgba(231,199,106,0.3); border-left: 3px solid rgba(231,199,106,0.7); border-radius: 12px; background: rgba(231,199,106,0.06);
}

/* ---------------- Strategy Builder — mission identity (violet) ---------------- */
.portal-main .strategy-lab-workspace { border-left: 3px solid rgba(139, 129, 246, 0.55); }
.portal-main .strategy-score-card {
  border: 1px solid rgba(139, 129, 246, 0.28); border-radius: 14px; padding: 14px 16px;
  background: linear-gradient(155deg, rgba(139,129,246,0.14), rgba(103,232,249,0.03));
}
.portal-main .strategy-score-card strong { color: #cdc6fb; font-size: 1.6rem; font-weight: 720; text-shadow: 0 0 24px rgba(139,129,246,0.28); }
.portal-main .strategy-stepper article.is-active,
.portal-main .strategy-stepper .is-active { border-color: rgba(139,129,246,0.4); }
.portal-main .strategy-checklist li[data-complete="true"],
.portal-main .strategy-checklist .is-complete { color: #b9f2d4; }
.portal-main #saveStrategyBtn { min-height: 46px; }

/* ---------------- Performance Coach — blue/emerald, one lesson ---------------- */
.portal-main .performance-coach-panel { border-left: 3px solid rgba(108, 168, 247, 0.5); }
.portal-main .coach-score-grid .portal-stat strong { text-shadow: 0 0 20px rgba(108,168,247,0.16); }
.portal-main .coach-list-card.positive span { color: #7fe0b0; }
.portal-main .coach-list-card.warning span { color: #f0d089; }
.portal-main .coach-list-card.danger span { color: #ff9ba6; }
.portal-main #askCarlosPerformanceBtn { min-height: 44px; }

/* ---------------- Rewards journey ---------------- */
.portal-main .portal-rewards-journey {
  display: grid; gap: 12px; padding: clamp(16px, 2.2vw, 22px); border-radius: 18px;
  border: 1px solid rgba(122, 214, 255, 0.16);
  background: linear-gradient(158deg, rgba(12, 30, 50, 0.6), rgba(6, 14, 28, 0.84));
  box-shadow: 0 22px 66px rgba(0,0,0,0.32), inset 0 1px 0 rgba(255,255,255,0.07);
}
.portal-main .prj-head .eyebrow { color: #6fd7e6; }
.portal-main .prj-head h3 { font-size: 1.02rem; font-weight: 680; }
.portal-main .prj-rail { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.portal-main .prj-step {
  position: relative; display: grid; gap: 6px; padding: 12px 12px;
  border: 1px solid rgba(132,204,255,0.12); border-radius: 12px; background: rgba(255,255,255,0.022);
}
.portal-main .prj-step::after { content: ""; position: absolute; top: 22px; right: -5px; width: 8px; height: 2px; background: rgba(132,204,255,0.28); }
.portal-main .prj-step:last-child::after { display: none; }
.portal-main .prj-dot { width: 11px; height: 11px; border-radius: 50%; border: 2px solid rgba(150,176,208,0.5); }
.portal-main .prj-body strong { display: block; font-size: 0.82rem; font-weight: 660; color: #eaf2fd; }
.portal-main .prj-body small { color: rgba(178,198,222,0.66); font-size: 0.7rem; }
.portal-main .prj-state { font-size: 0.6rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(160,186,216,0.6); }
.portal-main .prj-step.is-complete .prj-dot { border-color: rgba(89,211,144,0.9); background: var(--ax-green, #59d390); box-shadow: 0 0 0 3px rgba(89,211,144,0.14); }
.portal-main .prj-step.is-complete .prj-state { color: #7fe0b0; }
.portal-main .prj-step.is-current { border-color: rgba(127,216,247,0.4); background: linear-gradient(150deg, rgba(67,150,255,0.14), rgba(103,232,249,0.04)); }
.portal-main .prj-step.is-current .prj-dot { border-color: #8fe3ff; background: #8fe3ff; box-shadow: 0 0 0 3px rgba(103,232,249,0.18); }
.portal-main .prj-step.is-current .prj-state { color: #8fe3ff; }

/* ---------------- Education roadmap (blue + warm-white) ---------------- */
.portal-main .portal-education-roadmap {
  display: grid; gap: 12px; padding: clamp(16px, 2.2vw, 22px); border-radius: 18px;
  border: 1px solid rgba(108, 168, 247, 0.18);
  background: linear-gradient(158deg, rgba(12, 26, 52, 0.62), rgba(6, 14, 28, 0.84));
  box-shadow: 0 22px 66px rgba(0,0,0,0.32), inset 0 1px 0 rgba(255,255,255,0.07);
}
.portal-main .per-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.portal-main .per-head .eyebrow { color: #8fbdf6; }
.portal-main .per-head h3 { font-size: 1.02rem; font-weight: 680; }
.portal-main .per-head small { color: rgba(143, 189, 246, 0.86); font-size: 0.74rem; font-weight: 700; margin-left: auto; }
.portal-main .per-rail { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.portal-main .per-node {
  width: 100%; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px;
  padding: 11px 14px; border: 1px solid rgba(132,204,255,0.12); border-radius: 12px;
  background: rgba(255,255,255,0.022); color: inherit; text-align: left; cursor: pointer;
  transition: border-color 160ms ease, background 160ms ease;
}
.portal-main .per-node:hover:not([disabled]) { border-color: rgba(108,168,247,0.34); background: rgba(108,168,247,0.06); }
.portal-main .per-node[disabled] { cursor: default; opacity: 0.6; }
.portal-main .per-dot { width: 12px; height: 12px; border-radius: 50%; border: 2px solid rgba(150,176,208,0.5); }
.portal-main .per-body strong { display: block; font-size: 0.86rem; font-weight: 640; color: #eaf2fd; }
.portal-main .per-body small { color: rgba(178,198,222,0.64); font-size: 0.7rem; }
.portal-main .per-state { font-size: 0.62rem; font-weight: 800; letter-spacing: 0.05em; text-transform: uppercase; color: rgba(160,186,216,0.6); }
.portal-main .per-step.is-complete .per-dot { border-color: rgba(89,211,144,0.9); background: var(--ax-green, #59d390); }
.portal-main .per-step.is-complete .per-state { color: #7fe0b0; }
.portal-main .per-step.is-recommended .per-node { border-color: rgba(108,168,247,0.42); background: linear-gradient(150deg, rgba(67,150,255,0.14), rgba(103,232,249,0.04)); }
.portal-main .per-step.is-recommended .per-dot { border-color: #8fbdf6; background: #8fbdf6; box-shadow: 0 0 0 3px rgba(108,168,247,0.18); }
.portal-main .per-step.is-recommended .per-state { color: #8fbdf6; }
.portal-main .per-step.is-in-progress .per-dot { border-color: #8fe3ff; background: conic-gradient(#8fe3ff 60%, transparent 0); }
.portal-main .per-step.is-locked .per-dot { border-style: dashed; }

/* ---------------- Notifications + timeline grouping ---------------- */
.portal-main .notification-item { border-left: 3px solid rgba(132,204,255,0.4); }
.portal-main .notification-item.is-critical,
.portal-main .notification-item[data-severity="critical"] { border-left-color: rgba(255,118,132,0.7); }
.portal-main .notification-item.is-warning,
.portal-main .notification-item[data-severity="warning"] { border-left-color: rgba(231,199,106,0.7); }
.portal-main .notification-item.is-success,
.portal-main .notification-item[data-severity="success"] { border-left-color: rgba(89,211,144,0.7); }
.portal-main .notification-item.is-unread { background: rgba(127,216,247,0.05); }

/* ---------------- Motion / reduced motion ---------------- */
.portal-main .per-node:active,
.portal-main .prj-step:active { transform: translateY(1px); }
@media (prefers-reduced-motion: reduce) {
  .portal-main .cr-evidence-group > summary::after,
  .portal-main .advanced-analysis-details > summary::after,
  .portal-main .per-node { transition: none; }
}

/* ---------------- Focus ---------------- */
.portal-main :is(.per-node, .cr-evidence-group > summary, .advanced-analysis-details > summary, .prj-step a):focus-visible {
  outline: 2px solid rgba(137, 232, 255, 0.62); outline-offset: 2px; border-radius: 10px;
}

/* ---------------- Breakpoints ---------------- */
@media (max-width: 1000px) {
  .portal-main .cr-decision-terminal { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .portal-main .analysis-workflow-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .portal-main .cr-decision-terminal { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal-main .prj-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal-main .prj-step::after { display: none; }
  .portal-main .analysis-workflow-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal-main .cr-evidence-group > summary,
  .portal-main .advanced-analysis-details > summary { min-height: 44px; }
}
@media (max-width: 440px) {
  .portal-main .cr-decision-terminal { grid-template-columns: 1fr 1fr; }
  .portal-main .prj-rail { grid-template-columns: 1fr; }
}

/* ============================================================
   AUREX CLIENT PORTAL — Brick 4: Chart Reader intelligence desk
   + live market strategy presentation. Presentation only; scoped
   to .portal-main. cyan=intelligence, emerald=bullish/verified,
   red=bearish/risk, amber=review, violet=advanced, blue=workflow.
   ============================================================ */

.portal-main .cr-section-eyebrow {
  color: #6fd7e6; font-size: 0.62rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase;
}

/* ---------------- Command header — enhanced ---------------- */
.portal-main .cr-decision-terminal { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.portal-main .crt-cell { position: relative; }
.portal-main .crt-conf-state {
  display: inline-block; margin-top: 3px; padding: 1px 7px; border-radius: 999px;
  font-size: 0.6rem; font-weight: 800; letter-spacing: 0.04em; font-style: normal;
  border: 1px solid rgba(160,186,216,0.24); color: rgba(206,219,237,0.82); background: rgba(255,255,255,0.03);
}
.portal-main .crt-conf-state.tone-bull { color: #7fe0b0; border-color: rgba(89,211,144,0.4); background: rgba(89,211,144,0.08); }
.portal-main .crt-conf-state.tone-review { color: #f0d089; border-color: rgba(231,199,106,0.4); background: rgba(231,199,106,0.08); }
.portal-main .crt-conf-state.tone-neutral { color: #8fe3ff; border-color: rgba(127,216,247,0.4); background: rgba(127,216,247,0.08); }

/* ---------------- Market map ---------------- */
.portal-main .cr-market-map {
  margin-top: 12px; padding: clamp(14px, 2vw, 20px); border-radius: 16px;
  border: 1px solid rgba(127, 216, 247, 0.18); border-left: 3px solid rgba(127,216,247,0.55);
  background: linear-gradient(160deg, rgba(11, 25, 47, 0.55), rgba(6, 13, 26, 0.78));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06);
}
.portal-main .crmm-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.portal-main .crmm-head small { color: rgba(178,198,222,0.62); font-size: 0.72rem; }
.portal-main .crmm-body { display: grid; grid-template-columns: 150px 1fr 150px; gap: 16px; align-items: stretch; }
.portal-main .crmm-rail { display: grid; grid-template-rows: 1fr 0.7fr 1fr; border-radius: 12px; overflow: hidden; border: 1px solid rgba(132,204,255,0.14); min-height: 200px; }
.portal-main .crmm-zone { display: grid; align-content: center; gap: 2px; padding: 10px 12px; text-align: center; }
.portal-main .crmm-zone span { font-size: 0.64rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(206,219,237,0.72); }
.portal-main .crmm-zone em { font-style: normal; font-variant-numeric: tabular-nums; font-weight: 700; color: #eef6ff; font-size: 0.9rem; }
.portal-main .crmm-zone.is-premium { background: linear-gradient(180deg, rgba(255,118,132,0.14), rgba(255,118,132,0.04)); }
.portal-main .crmm-zone.is-eq { background: linear-gradient(180deg, rgba(127,216,247,0.12), rgba(127,216,247,0.03)); border-top: 1px dashed rgba(127,216,247,0.3); border-bottom: 1px dashed rgba(127,216,247,0.3); }
.portal-main .crmm-zone.is-discount { background: linear-gradient(180deg, rgba(89,211,144,0.04), rgba(89,211,144,0.14)); }
.portal-main .crmm-zone.is-current { box-shadow: inset 0 0 0 2px rgba(255,255,255,0.28); }
.portal-main .crmm-levels { display: grid; gap: 6px; align-content: start; }
.portal-main .crmm-levels > div { display: grid; grid-template-columns: 130px 1fr; gap: 10px; padding: 8px 10px; border: 1px solid rgba(132,204,255,0.1); border-radius: 10px; background: rgba(255,255,255,0.02); }
.portal-main .crmm-levels dt { color: rgba(150,176,208,0.74); font-size: 0.66rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; align-self: center; }
.portal-main .crmm-levels dd { margin: 0; color: rgba(224,234,248,0.9); font-size: 0.8rem; overflow-wrap: anywhere; }
.portal-main .crmm-targets { display: grid; gap: 6px; align-content: start; margin: 0; padding: 0; list-style: none; }
.portal-main .crmm-targets li { display: grid; gap: 2px; padding: 8px 10px; border: 1px solid rgba(139,129,246,0.24); border-radius: 10px; background: rgba(139,129,246,0.06); text-align: center; }
.portal-main .crmm-targets li span { font-size: 0.6rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(201,196,251,0.8); }
.portal-main .crmm-targets li strong { font-variant-numeric: tabular-nums; color: #e7f0fb; font-size: 0.86rem; }
.portal-main .crmm-unavailable { display: grid; gap: 4px; padding: 18px; border: 1px dashed rgba(231,199,106,0.34); border-radius: 12px; background: rgba(231,199,106,0.06); }
.portal-main .crmm-unavailable strong { color: #f4dfa6; }
.portal-main .crmm-unavailable p { color: rgba(198,214,236,0.72); font-size: 0.84rem; }

/* ---------------- Live strategy workspace ---------------- */
.portal-main .cr-live-strategy {
  margin-top: 12px; padding: clamp(14px, 2vw, 20px); border-radius: 16px;
  border: 1px solid rgba(108, 168, 247, 0.2); border-left: 3px solid rgba(108,168,247,0.6);
  background: linear-gradient(160deg, rgba(12, 26, 52, 0.6), rgba(6, 13, 26, 0.82));
}
.portal-main .cr-live-strategy[data-verified="false"] { border-left-color: rgba(160,186,216,0.4); }
.portal-main .cls-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 12px; }
.portal-main .cls-head small { display: block; color: rgba(178,198,222,0.62); font-size: 0.72rem; margin-top: 2px; }
.portal-main .cls-setup-state { padding: 5px 12px; border-radius: 999px; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.04em; border: 1px solid rgba(160,186,216,0.24); color: rgba(206,219,237,0.85); background: rgba(255,255,255,0.03); }
.portal-main .cls-setup-state.tone-bull { color: #7fe0b0; border-color: rgba(89,211,144,0.44); background: rgba(89,211,144,0.09); }
.portal-main .cls-setup-state.tone-review { color: #f0d089; border-color: rgba(231,199,106,0.44); background: rgba(231,199,106,0.09); }
.portal-main .cls-setup-state.tone-risk { color: #ff9ba6; border-color: rgba(255,118,132,0.44); background: rgba(255,118,132,0.08); }
.portal-main .cls-setup-state.tone-muted { color: rgba(190,206,228,0.72); }
.portal-main .cls-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px; }
.portal-main .cls-cell { display: grid; gap: 2px; padding: 9px 12px; border: 1px solid rgba(132,204,255,0.1); border-radius: 10px; background: rgba(255,255,255,0.02); min-width: 0; }
.portal-main .cls-cell span { color: rgba(150,176,208,0.72); font-size: 0.58rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.portal-main .cls-cell strong { color: #e7f0fb; font-size: 0.82rem; font-weight: 640; overflow-wrap: anywhere; }
.portal-main .cls-targets { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 10px; }
.portal-main .cls-targets article { display: grid; gap: 2px; padding: 10px 12px; border: 1px solid rgba(139,129,246,0.24); border-radius: 10px; background: rgba(139,129,246,0.06); text-align: center; }
.portal-main .cls-targets span { font-size: 0.6rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(201,196,251,0.8); }
.portal-main .cls-targets strong { font-variant-numeric: tabular-nums; color: #e7f0fb; font-size: 0.9rem; }
.portal-main .cls-guard { margin-top: 10px; color: rgba(178,198,222,0.6); font-size: 0.72rem; line-height: 1.4; }

/* ---------------- Strategy timeline ---------------- */
.portal-main .cr-strategy-timeline {
  margin-top: 12px; padding: clamp(14px, 2vw, 20px); border-radius: 16px;
  border: 1px solid rgba(122, 214, 255, 0.16);
  background: linear-gradient(160deg, rgba(11, 25, 47, 0.5), rgba(6, 13, 26, 0.72));
}
.portal-main .cst-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.portal-main .cst-head small { color: rgba(178,198,222,0.62); font-size: 0.72rem; }
.portal-main .cst-rail { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.portal-main .cst-step { position: relative; display: grid; gap: 6px; justify-items: center; padding: 12px 8px; border: 1px solid rgba(132,204,255,0.1); border-radius: 12px; background: rgba(255,255,255,0.02); text-align: center; }
.portal-main .cst-step::after { content: ""; position: absolute; top: 22px; right: -5px; width: 8px; height: 2px; background: rgba(132,204,255,0.24); }
.portal-main .cst-step:last-child::after { display: none; }
.portal-main .cst-dot { width: 11px; height: 11px; border-radius: 50%; border: 2px solid rgba(150,176,208,0.5); }
.portal-main .cst-label { font-size: 0.72rem; font-weight: 640; color: #dce8f8; line-height: 1.2; }
.portal-main .cst-state { font-size: 0.58rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(160,186,216,0.56); }
.portal-main .cst-step.is-reached .cst-dot { border-color: rgba(89,211,144,0.9); background: var(--ax-green, #59d390); box-shadow: 0 0 0 3px rgba(89,211,144,0.14); }
.portal-main .cst-step.is-reached .cst-state { color: #7fe0b0; }

/* ---------------- Carlos live brief ---------------- */
.portal-main .carlos-live-brief { display: grid; gap: 8px; margin-top: 8px; }
.portal-main .clb-status { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 12px; border: 1px solid rgba(132,204,255,0.12); border-radius: 10px; background: rgba(255,255,255,0.022); }
.portal-main .clb-status span { color: rgba(150,176,208,0.72); font-size: 0.62rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.portal-main .clb-status strong { font-size: 0.84rem; font-weight: 700; }
.portal-main .clb-status strong.tone-bull { color: #7fe0b0; }
.portal-main .clb-status strong.tone-review { color: #f0d089; }
.portal-main .clb-status strong.tone-neutral { color: #8fe3ff; }
.portal-main .clb-mtf { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.portal-main .clb-mtf article { display: grid; gap: 2px; padding: 8px 10px; border: 1px solid rgba(132,204,255,0.1); border-radius: 10px; background: rgba(255,255,255,0.02); }
.portal-main .clb-mtf span { color: rgba(150,176,208,0.72); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.portal-main .clb-mtf strong { color: #e7f0fb; font-size: 0.78rem; font-weight: 620; }
.portal-main .carlos-risk-strip { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 8px; }
.portal-main .carlos-risk-strip > div { display: grid; gap: 2px; padding: 8px 10px; border: 1px solid rgba(132,204,255,0.1); border-radius: 10px; background: rgba(255,255,255,0.02); }
.portal-main .carlos-risk-strip span { color: rgba(150,176,208,0.72); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.portal-main .carlos-risk-strip strong { color: #e7f0fb; font-size: 0.78rem; font-weight: 640; }
.portal-main .carlos-risk-strip strong.tone-muted { color: rgba(190,206,228,0.7); }
.portal-main .carlos-news-note { margin-top: 6px; color: rgba(178,198,222,0.6); font-size: 0.72rem; line-height: 1.4; }

/* ---------------- Focus / reduced motion ---------------- */
.portal-main :is(.cr-market-map, .cr-live-strategy, .cr-strategy-timeline) :focus-visible {
  outline: 2px solid rgba(137, 232, 255, 0.62); outline-offset: 2px; border-radius: 10px;
}

/* ---------------- Breakpoints ---------------- */
@media (max-width: 1100px) {
  .portal-main .cr-decision-terminal { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .portal-main .crmm-body { grid-template-columns: 130px 1fr; }
  .portal-main .crmm-targets { grid-column: 1 / -1; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-flow: column; }
  .portal-main .cst-rail { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .portal-main .cst-step::after { display: none; }
}
@media (max-width: 760px) {
  .portal-main .cr-decision-terminal { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal-main .crmm-body { grid-template-columns: 1fr; }
  .portal-main .crmm-rail { grid-template-rows: repeat(3, 1fr); min-height: 150px; }
  .portal-main .crmm-targets { grid-template-columns: 1fr 1fr 1fr; }
  .portal-main .cls-targets { grid-template-columns: 1fr; }
  .portal-main .clb-mtf, .portal-main .carlos-risk-strip { grid-template-columns: 1fr; }
  .portal-main .cst-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 440px) {
  .portal-main .cr-decision-terminal { grid-template-columns: 1fr 1fr; }
  .portal-main .crmm-targets { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  .portal-main .cr-market-map, .portal-main .cr-live-strategy { transition: none; }
}

/* ============================================================
   AUREX CLIENT PORTAL — Brick 5: Membership Access Center &
   Rewards. Presentation only; scoped to .portal-main.
   cyan=trial/active, blue=paid, violet=complimentary/manual,
   emerald=verified/permanent, amber=review, red=expired/suspended.
   ============================================================ */

/* ---------------- Access grid (desktop left/right) ---------------- */
.portal-main .portal-access-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: clamp(14px, 2vw, 22px); align-items: start; }
.portal-main .pag-left, .portal-main .pag-right { display: grid; gap: clamp(12px, 1.8vw, 18px); align-content: start; }

/* ---------------- Access Center ---------------- */
.portal-main .portal-access-center {
  position: relative; display: grid; gap: 14px; padding: clamp(18px, 2.4vw, 26px);
  border-radius: 20px; border: 1px solid rgba(122, 214, 255, 0.16); border-left: 4px solid rgba(127,216,247,0.6);
  background: linear-gradient(158deg, rgba(13, 30, 55, 0.7), rgba(6, 14, 28, 0.86));
  box-shadow: 0 30px 90px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.08);
}
.portal-main .portal-access-center.access-blue { border-left-color: rgba(108,168,247,0.75); }
.portal-main .portal-access-center.access-violet { border-left-color: rgba(139,129,246,0.75); }
.portal-main .portal-access-center.access-emerald { border-left-color: rgba(89,211,144,0.8); }
.portal-main .portal-access-center.access-amber { border-left-color: rgba(231,199,106,0.8); }
.portal-main .portal-access-center.access-risk { border-left-color: rgba(255,118,132,0.75); }
.portal-main .portal-access-center.access-muted { border-left-color: rgba(150,176,208,0.5); }
.pac-eyebrow { color: #6fd7e6; font-size: 0.62rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; }
.pac-type-row { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin: 6px 0 2px; }
.pac-type { font-size: clamp(1.3rem, 3vw, 1.75rem); font-weight: 720; letter-spacing: -0.016em; color: #f6fbff; }
.access-blue .pac-type { color: #bcd7ff; } .access-violet .pac-type { color: #cdc6fb; }
.access-emerald .pac-type { color: #b9f2d4; } .access-amber .pac-type { color: #f4dfa6; }
.access-risk .pac-type { color: #ffc4cb; }
.pac-plan { padding: 3px 10px; border-radius: 999px; border: 1px solid rgba(132,204,255,0.2); background: rgba(255,255,255,0.03); color: rgba(214,232,255,0.82); font-size: 0.72rem; font-weight: 700; }
.pac-status { color: rgba(198,214,236,0.78); font-size: 0.88rem; line-height: 1.4; }
.pac-demo { color: rgba(201,196,251,0.8); font-size: 0.76rem; font-style: italic; }
.pac-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; margin: 0; }
.pac-facts > div { display: grid; gap: 2px; padding: 10px 12px; border: 1px solid rgba(132,204,255,0.1); border-radius: 12px; background: rgba(255,255,255,0.02); min-width: 0; }
.pac-facts dt { color: rgba(150,176,208,0.72); font-size: 0.58rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.pac-facts dd { margin: 0; color: #eef6ff; font-size: 0.86rem; font-weight: 640; font-variant-numeric: tabular-nums; }
.pac-renewal { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: 0.7rem; font-weight: 800; border: 1px solid rgba(160,186,216,0.24); }
.pac-renewal.tone-emerald { color: #7fe0b0; border-color: rgba(89,211,144,0.4); background: rgba(89,211,144,0.08); }
.pac-renewal.tone-amber { color: #f0d089; border-color: rgba(231,199,106,0.4); background: rgba(231,199,106,0.08); }
.pac-renewal.tone-cyan { color: #8fe3ff; border-color: rgba(127,216,247,0.4); background: rgba(127,216,247,0.08); }
.pac-renewal.tone-risk { color: #ff9ba6; border-color: rgba(255,118,132,0.4); background: rgba(255,118,132,0.08); }
.pac-renewal.tone-muted { color: rgba(190,206,228,0.7); }
.pac-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.pac-actions .primary-button, .pac-actions .secondary-button { min-height: 46px; flex: 1 1 160px; justify-content: center; }

/* ---------------- Trial rail ---------------- */
.portal-main .portal-trial-rail { display: grid; gap: 12px; padding: clamp(16px, 2vw, 20px); border-radius: 18px; border: 1px solid rgba(127,216,247,0.16); border-left: 3px solid rgba(127,216,247,0.55); background: linear-gradient(158deg, rgba(12,28,52,0.6), rgba(6,14,28,0.82)); }
.portal-main .ptr-head .eyebrow { color: #6fd7e6; } .portal-main .ptr-head h3 { font-size: 1.02rem; font-weight: 680; }
.portal-main .ptr-head small { color: rgba(178,198,222,0.64); font-size: 0.74rem; }
.portal-main .ptr-rail { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.portal-main .ptr-step a { position: relative; display: grid; gap: 4px; padding: 12px 10px; border: 1px solid rgba(132,204,255,0.12); border-radius: 12px; background: rgba(255,255,255,0.022); text-decoration: none; color: inherit; height: 100%; transition: border-color 160ms ease, background 160ms ease; }
.portal-main .ptr-step a:hover { border-color: rgba(137,232,255,0.32); background: rgba(103,232,249,0.06); }
.portal-main .ptr-day { color: #8fe3ff; font-size: 0.62rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.portal-main .ptr-step strong { color: #eaf2fd; font-size: 0.8rem; font-weight: 640; line-height: 1.2; }
.portal-main .ptr-foot { display: flex; gap: 10px; flex-wrap: wrap; }
.portal-main .ptr-foot .primary-button, .portal-main .ptr-foot .secondary-button { min-height: 44px; }

/* ---------------- Service access map ---------------- */
.portal-main .portal-service-map { display: grid; gap: 12px; padding: clamp(16px, 2vw, 20px); border-radius: 18px; border: 1px solid rgba(122,214,255,0.16); background: linear-gradient(158deg, rgba(11,25,47,0.55), rgba(6,13,26,0.8)); }
.portal-main .psm-head .eyebrow { color: #6fd7e6; } .portal-main .psm-head h3 { font-size: 1.02rem; font-weight: 680; }
.portal-main .psm-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.portal-main .psm-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid rgba(132,204,255,0.1); border-radius: 12px; background: rgba(255,255,255,0.02); }
.portal-main .psm-icon { display: grid; place-items: center; width: 30px; height: 30px; flex: 0 0 auto; border-radius: 9px; background: rgba(127,216,247,0.1); }
.portal-main .psm-icon svg { width: 16px; height: 16px; fill: #8fe3ff; }
.portal-main .psm-body { display: grid; gap: 1px; min-width: 0; }
.portal-main .psm-body strong { color: #eaf2fd; font-size: 0.82rem; font-weight: 640; }
.portal-main .psm-state { font-size: 0.66rem; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; color: rgba(160,186,216,0.7); }
.portal-main .psm-item.tone-emerald .psm-state { color: #7fe0b0; } .portal-main .psm-item.tone-emerald .psm-icon { background: rgba(89,211,144,0.14); } .portal-main .psm-item.tone-emerald .psm-icon svg { fill: #7fe0b0; }
.portal-main .psm-item.tone-cyan .psm-state { color: #8fe3ff; }
.portal-main .psm-item.tone-amber .psm-state { color: #f0d089; } .portal-main .psm-item.tone-amber .psm-icon { background: rgba(231,199,106,0.14); } .portal-main .psm-item.tone-amber .psm-icon svg { fill: #f0d089; }
.portal-main .psm-item.tone-muted { opacity: 0.72; } .portal-main .psm-item.tone-muted .psm-icon { background: rgba(150,176,208,0.1); } .portal-main .psm-item.tone-muted .psm-icon svg { fill: rgba(190,206,228,0.7); } .portal-main .psm-item.tone-muted .psm-state { color: rgba(190,206,228,0.7); }

/* ---------------- Upgrade scene ---------------- */
.portal-main .portal-upgrade-scene { display: grid; gap: 12px; padding: clamp(16px, 2vw, 20px); border-radius: 18px; border: 1px solid rgba(108,168,247,0.18); border-left: 3px solid rgba(108,168,247,0.6); background: linear-gradient(158deg, rgba(12,26,52,0.6), rgba(6,14,28,0.82)); }
.portal-main .pus-head .eyebrow { color: #8fbdf6; } .portal-main .pus-head h3 { font-size: 1.02rem; font-weight: 680; }
.portal-main .pus-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.portal-main .pus-flow li { display: grid; gap: 3px; padding: 10px 12px; border: 1px solid rgba(132,204,255,0.1); border-radius: 12px; background: rgba(255,255,255,0.02); }
.portal-main .pus-flow span { color: rgba(150,176,208,0.72); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.portal-main .pus-flow strong { color: #eaf2fd; font-size: 0.82rem; font-weight: 640; }
.portal-main .pus-benefits { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; }
.portal-main .pus-benefits li { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border: 1px solid rgba(132,204,255,0.08); border-radius: 10px; color: rgba(214,228,246,0.86); font-size: 0.8rem; }
.portal-main .pus-benefits li::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #8fe3ff; flex: 0 0 auto; }
.portal-main .pus-note { color: rgba(178,198,222,0.62); font-size: 0.74rem; line-height: 1.4; }
.portal-main .portal-upgrade-scene .primary-button { min-height: 46px; justify-self: start; }

/* ---------------- Rewards overview (separated sources) ---------------- */
.portal-main .portal-rewards-overview { display: grid; gap: 12px; padding: clamp(16px, 2vw, 20px); border-radius: 18px; border: 1px solid rgba(122,214,255,0.16); background: linear-gradient(158deg, rgba(11,25,47,0.55), rgba(6,13,26,0.8)); }
.portal-main .pro-head .eyebrow { color: #6fd7e6; } .portal-main .pro-head h3 { font-size: 1.02rem; font-weight: 680; }
.portal-main .pro-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.portal-main .pro-source { display: grid; gap: 2px; padding: 12px 13px; border: 1px solid rgba(132,204,255,0.1); border-top: 2px solid rgba(132,204,255,0.4); border-radius: 12px; background: rgba(255,255,255,0.02); }
.portal-main .pro-source.tone-cyan { border-top-color: rgba(127,216,247,0.7); }
.portal-main .pro-source.tone-emerald { border-top-color: rgba(89,211,144,0.7); }
.portal-main .pro-source.tone-violet { border-top-color: rgba(139,129,246,0.7); }
.portal-main .pro-source.tone-blue { border-top-color: rgba(108,168,247,0.7); }
.portal-main .pro-label { color: rgba(150,176,208,0.74); font-size: 0.6rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.portal-main .pro-source strong { color: #eef6ff; font-size: 0.95rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.portal-main .pro-source small { color: rgba(178,198,222,0.62); font-size: 0.7rem; }

/* ---------------- Referral + prize journeys ---------------- */
.portal-main .portal-referral-journey, .portal-main .portal-prize-journey {
  display: grid; gap: 12px; padding: clamp(16px, 2.2vw, 22px); border-radius: 18px;
  border: 1px solid rgba(139,129,246,0.2); border-left: 3px solid rgba(139,129,246,0.6);
  background: linear-gradient(158deg, rgba(20,18,44,0.6), rgba(8,12,26,0.84)); margin-top: clamp(12px,1.8vw,18px);
}
.portal-main .prf-head, .portal-main .ppj-head { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.portal-main .prf-head .eyebrow, .portal-main .ppj-head .eyebrow { color: #c7bff9; }
.portal-main .prf-head h3, .portal-main .ppj-head h3 { font-size: 1.02rem; font-weight: 680; }
.portal-main .prf-demo-tag { margin-left: auto; padding: 3px 10px; border-radius: 999px; border: 1px dashed rgba(139,129,246,0.5); background: rgba(139,129,246,0.1); color: #cdc6fb; font-size: 0.62rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.portal-main .prf-note, .portal-main .ppj-note { color: rgba(178,198,222,0.66); font-size: 0.76rem; line-height: 1.4; }
.portal-main .prf-rail { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; }
.portal-main .prf-step { position: relative; display: grid; gap: 6px; justify-items: center; text-align: center; padding: 10px 6px; border: 1px solid rgba(132,204,255,0.1); border-radius: 10px; background: rgba(255,255,255,0.02); }
.portal-main .prf-dot { width: 10px; height: 10px; border-radius: 50%; border: 2px solid rgba(150,176,208,0.5); }
.portal-main .prf-step.is-current .prf-dot { border-color: #c7bff9; background: #8b81f6; box-shadow: 0 0 0 3px rgba(139,129,246,0.18); }
.portal-main .prf-label { font-size: 0.66rem; font-weight: 620; color: #dce8f8; line-height: 1.2; }
.portal-main .prf-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 6px; margin: 0; }
.portal-main .prf-fields > div { display: grid; gap: 2px; padding: 9px 11px; border: 1px solid rgba(132,204,255,0.1); border-radius: 10px; background: rgba(255,255,255,0.02); }
.portal-main .prf-fields dt { color: rgba(150,176,208,0.72); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.portal-main .prf-fields dd { margin: 0; color: #e7f0fb; font-size: 0.82rem; font-weight: 640; font-variant-numeric: tabular-nums; }
.portal-main .ppj-rail { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.portal-main .ppj-step { display: grid; gap: 6px; padding: 12px; border: 1px solid rgba(132,204,255,0.1); border-radius: 12px; background: rgba(255,255,255,0.02); }
.portal-main .ppj-dot { width: 11px; height: 11px; border-radius: 50%; border: 2px solid rgba(150,176,208,0.5); }
.portal-main .ppj-step.is-next .ppj-dot { border-color: #c7bff9; background: #8b81f6; }
.portal-main .ppj-body strong { display: block; font-size: 0.84rem; font-weight: 660; color: #eaf2fd; }
.portal-main .ppj-body small { color: rgba(178,198,222,0.66); font-size: 0.7rem; }

/* ---------------- Membership timeline ---------------- */
.portal-main .portal-membership-timeline { display: grid; gap: 12px; padding: clamp(16px, 2vw, 20px); border-radius: 18px; border: 1px solid rgba(122,214,255,0.16); background: linear-gradient(158deg, rgba(11,25,47,0.55), rgba(6,13,26,0.8)); }
.portal-main .pmt-head .eyebrow { color: #6fd7e6; } .portal-main .pmt-head h3 { font-size: 1.02rem; font-weight: 680; }
.portal-main .pmt-empty { display: grid; gap: 4px; padding: 18px; border: 1px dashed rgba(132,204,255,0.2); border-radius: 12px; background: rgba(255,255,255,0.015); }
.portal-main .pmt-empty strong { color: #eaf2fd; font-size: 0.9rem; } .portal-main .pmt-empty p { color: rgba(190,206,228,0.7); font-size: 0.82rem; }
.portal-main .pmt-rail { display: grid; gap: 8px; margin: 0; padding: 0 0 0 18px; list-style: none; position: relative; }
.portal-main .pmt-rail::before { content: ""; position: absolute; left: 4px; top: 6px; bottom: 6px; width: 2px; background: linear-gradient(180deg, rgba(127,216,247,0.4), rgba(127,216,247,0.06)); }
.portal-main .pmt-step { position: relative; }
.portal-main .pmt-dot { position: absolute; left: -18px; top: 4px; width: 9px; height: 9px; border-radius: 50%; background: var(--ax-cyan, #7fd8f7); box-shadow: 0 0 0 3px rgba(127,216,247,0.14); }
.portal-main .pmt-body strong { color: #eef4fd; font-size: 0.86rem; font-weight: 640; } .portal-main .pmt-body small { color: rgba(178,198,222,0.66); font-size: 0.72rem; margin-left: 8px; } .portal-main .pmt-body p { color: rgba(196,210,230,0.72); font-size: 0.8rem; margin: 2px 0 0; }

/* ---------------- Carlos access foot ---------------- */
.portal-main .carlos-access-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 8px; padding: 8px 12px; border: 1px solid rgba(132,204,255,0.12); border-radius: 10px; background: rgba(255,255,255,0.022); }
.portal-main .caf-source { color: rgba(178,198,222,0.72); font-size: 0.72rem; }
.portal-main .caf-actions { display: flex; gap: 6px; flex-wrap: wrap; }

/* ---------------- Focus / reduced motion ---------------- */
.portal-main :is(.pac-actions a, .ptr-step a, .psm-item, .pro-source, .pus-benefits li, .caf-actions a):focus-visible { outline: 2px solid rgba(137,232,255,0.62); outline-offset: 2px; border-radius: 10px; }
@media (prefers-reduced-motion: reduce) { .portal-main .ptr-step a { transition: none; } }

/* ---------------- Breakpoints ---------------- */
@media (max-width: 1000px) {
  .portal-main .portal-access-grid { grid-template-columns: minmax(0, 1fr); }
  .portal-main .prf-rail { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .portal-main .ppj-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .portal-main .ptr-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal-main .pus-flow { grid-template-columns: 1fr; }
  .portal-main .prf-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portal-main .pac-actions .primary-button, .portal-main .pac-actions .secondary-button { flex: 1 1 100%; }
}
@media (max-width: 440px) {
  .portal-main .ptr-rail, .portal-main .prf-rail, .portal-main .ppj-rail, .portal-main .psm-grid, .portal-main .pro-grid { grid-template-columns: 1fr; }
}

/* Final Membership polish: current access is the hero; benefits remain data-led. */
.portal-main .membership-experience {
  display: grid;
  gap: 16px;
}
.portal-main .membership-page-intro {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  padding: 4px 2px 2px;
}
.portal-main .membership-page-intro h1 {
  margin: 5px 0 8px;
  color: #f2f8fd;
  font-size: clamp(1.65rem, 3vw, 2.35rem);
  font-weight: 720;
  letter-spacing: -0.024em;
  line-height: 1.05;
}
.portal-main .membership-page-intro p:not(.pfx-eyebrow) {
  max-width: 58ch;
  margin: 0;
  color: rgba(190, 206, 228, 0.68);
  font-size: 0.82rem;
  line-height: 1.55;
}
.portal-main .membership-intro-state {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 0 0 auto;
  padding: 10px 13px;
  border: 1px solid rgba(140, 178, 214, 0.15);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.018);
  color: rgba(190, 206, 228, 0.62);
  font-size: 0.68rem;
}
.portal-main .membership-intro-state strong {
  color: #dff6ec;
  font-size: 0.7rem;
  font-weight: 740;
}
.portal-main .membership-state-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: rgba(150, 176, 208, 0.72);
}
.portal-main .membership-state-dot.tone-emerald { background: #83d8ae; box-shadow: 0 0 0 3px rgba(131, 216, 174, 0.13); }
.portal-main .membership-state-dot.tone-cyan { background: #8fe3ff; box-shadow: 0 0 0 3px rgba(143, 227, 255, 0.13); }
.portal-main .membership-state-dot.tone-amber { background: #e7c76a; box-shadow: 0 0 0 3px rgba(231, 199, 106, 0.13); }
.portal-main .membership-state-dot.tone-risk { background: #ff8a96; box-shadow: 0 0 0 3px rgba(255, 138, 150, 0.13); }
.portal-main .membership-focus-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, 0.92fr);
  gap: clamp(14px, 2vw, 22px);
  align-items: start;
}
.portal-main .membership-focus-primary,
.portal-main .membership-focus-secondary {
  display: grid;
  gap: 14px;
  align-content: start;
  min-width: 0;
}
.portal-main .membership-focus-primary .portal-access-center {
  min-height: 330px;
  align-content: start;
  padding: clamp(22px, 3vw, 32px);
  border-left-width: 5px;
  background:
    radial-gradient(90% 80% at 100% 0%, rgba(127, 216, 247, 0.1), transparent 65%),
    linear-gradient(158deg, rgba(13, 30, 55, 0.82), rgba(5, 12, 23, 0.98));
}
.portal-main .membership-focus-primary .pac-type { font-size: clamp(1.65rem, 3.6vw, 2.45rem); }
.portal-main .membership-focus-primary .pac-status { max-width: 46ch; margin: 0; }
.portal-main .membership-benefits-panel {
  display: grid;
  gap: 12px;
  padding: clamp(16px, 2vw, 20px);
  border: 1px solid rgba(140, 178, 214, 0.14);
  border-radius: 18px;
  background: linear-gradient(158deg, rgba(13, 25, 43, 0.7), rgba(5, 12, 23, 0.9));
}
.portal-main .membership-benefits-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
}
.portal-main .membership-benefits-head .eyebrow { margin: 0; color: #b8c8f5; }
.portal-main .membership-benefits-head > span { color: rgba(190, 206, 228, 0.54); font-size: 0.66rem; }
.portal-main .membership-benefits-list {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.portal-main .membership-benefits-list li {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  padding: 9px 10px;
  border: 1px solid rgba(140, 178, 214, 0.1);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.018);
}
.portal-main .membership-benefits-list i {
  width: 6px;
  height: 6px;
  margin-top: 5px;
  border-radius: 50%;
  flex: 0 0 auto;
  background: #83d8ae;
  box-shadow: 0 0 0 3px rgba(131, 216, 174, 0.12);
}
.portal-main .membership-benefits-list span { display: grid; gap: 2px; min-width: 0; }
.portal-main .membership-benefits-list strong { color: #eaf2fd; font-size: 0.78rem; font-weight: 680; }
.portal-main .membership-benefits-list small { color: rgba(178, 198, 222, 0.62); font-size: 0.69rem; line-height: 1.4; }
.portal-main .membership-benefits-empty { margin: 0; color: rgba(178, 198, 222, 0.62); font-size: 0.78rem; line-height: 1.5; }
@media (max-width: 900px) {
  .portal-main .membership-focus-grid { grid-template-columns: 1fr; }
  .portal-main .membership-focus-primary .portal-access-center { min-height: 0; }
}
@media (max-width: 620px) {
  .portal-main .membership-page-intro { align-items: flex-start; flex-direction: column; gap: 12px; }
  .portal-main .membership-intro-state { width: 100%; box-sizing: border-box; }
  .portal-main .membership-focus-primary .portal-access-center { padding: 20px 17px; }
  .portal-main .membership-benefits-head { align-items: flex-start; flex-direction: column; }
}

/* Final Education + Support polish: institutional tools, not generic dashboards. */
.portal-main .education-hub {
  border-color: rgba(224, 163, 92, 0.16);
  border-radius: 18px;
  background:
    linear-gradient(180deg, rgba(12, 22, 35, 0.98), rgba(5, 11, 20, 0.99));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 24px 64px rgba(0, 0, 0, 0.24);
}
.portal-main .education-hub::before {
  background:
    linear-gradient(115deg, transparent 8%, rgba(255, 255, 255, 0.025) 48%, transparent 68%),
    linear-gradient(rgba(224, 163, 92, 0.018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(224, 163, 92, 0.014) 1px, transparent 1px);
  opacity: 0.36;
}
.portal-main .education-head { align-items: end; padding-bottom: 4px; border-bottom: 1px solid rgba(140, 178, 214, 0.12); }
.portal-main .education-head h2 { letter-spacing: -0.025em; }
.portal-main .education-progress-card {
  min-width: 172px;
  border-color: rgba(224, 163, 92, 0.18);
  background: rgba(224, 163, 92, 0.045);
}
.portal-main .education-progress-card span,
.portal-main .lesson-label { color: #e7b56e; }
.portal-main .education-progress-card strong { color: #f7e1bb; }
.portal-main .education-feature-grid { grid-template-columns: minmax(0, 1.35fr) minmax(220px, 0.85fr) minmax(190px, 0.72fr); }
.portal-main .featured-lesson-card,
.portal-main .continue-lesson-card,
.portal-main .learning-path-card,
.portal-main .lesson-card,
.portal-main .education-controls,
.portal-main .education-quiz-panel,
.portal-main .education-empty-state {
  border-color: rgba(140, 178, 214, 0.14);
  border-radius: 12px;
  background: rgba(7, 15, 26, 0.78);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}
.portal-main .featured-lesson-card { border-top: 2px solid rgba(224, 163, 92, 0.7); }
.portal-main .featured-lesson-card h3,
.portal-main .continue-lesson-card h3,
.portal-main .lesson-card h3 { letter-spacing: -0.014em; }
.portal-main .lesson-card { transition: border-color 160ms ease, transform 160ms ease, background 160ms ease; }
.portal-main .lesson-card:hover { transform: translateY(-2px); border-color: rgba(224, 163, 92, 0.34); background: rgba(10, 21, 35, 0.92); }
.portal-main .lesson-progress span { background: linear-gradient(90deg, #d89a52, #eecb8c); box-shadow: 0 0 16px rgba(224, 163, 92, 0.16); }
.portal-main .education-controls input:focus-visible,
.portal-main .education-controls select:focus-visible { border-color: rgba(224, 163, 92, 0.54); box-shadow: 0 0 0 3px rgba(224, 163, 92, 0.12); outline: none; }
.portal-main .education-category-tabs button.is-active { border-color: rgba(224, 163, 92, 0.4); color: #f3d7a8; background: rgba(224, 163, 92, 0.1); }

.portal-main .support-experience { display: grid; gap: 16px; }
.portal-main .support-experience > .portal-welcome-panel {
  border-left: 4px solid rgba(130, 198, 255, 0.72);
  background: linear-gradient(158deg, rgba(12, 28, 50, 0.88), rgba(5, 12, 23, 0.96));
}
.portal-main .support-experience .account-opening-workspace,
.portal-main .support-experience #tradingAccountsWorkspace {
  border-color: rgba(130, 198, 255, 0.16);
  background: linear-gradient(158deg, rgba(10, 23, 41, 0.86), rgba(5, 12, 23, 0.96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 20px 54px rgba(0, 0, 0, 0.2);
}
.portal-main .support-experience .account-opening-status-panel,
.portal-main .support-experience .account-opening-review-card {
  border-color: rgba(130, 198, 255, 0.14);
  background: rgba(255, 255, 255, 0.018);
}
.portal-main .support-experience .account-opening-form input:focus-visible,
.portal-main .support-experience #tradingAccountsWorkspace input:focus-visible {
  border-color: rgba(130, 198, 255, 0.56);
  box-shadow: 0 0 0 3px rgba(130, 198, 255, 0.12);
  outline: none;
}
.portal-main .support-experience .portal-support-grid { gap: 12px; }
.portal-main .support-experience .portal-support-card {
  display: grid;
  align-content: start;
  gap: 10px;
  min-height: 148px;
  padding: 18px 19px;
  border-color: rgba(130, 198, 255, 0.15);
  border-top: 2px solid rgba(130, 198, 255, 0.52);
  background: linear-gradient(158deg, rgba(11, 26, 46, 0.8), rgba(5, 12, 23, 0.94));
}
.portal-main .support-experience .portal-support-card h3 { margin: 0; color: #eaf4ff; font-size: 0.98rem; }
.portal-main .support-experience .portal-support-card p { margin: 0; color: rgba(190, 206, 228, 0.68); font-size: 0.78rem; line-height: 1.5; }
.portal-main .support-experience .portal-support-card .primary-button { align-self: end; justify-self: start; min-height: 40px; }
.portal-main .portal-support-contact,
.portal-main .tac-service-panel { display: grid; gap: 16px; border-color: rgba(130, 198, 255, 0.18); background: linear-gradient(145deg, rgba(11, 29, 49, 0.88), rgba(5, 12, 23, 0.96)); }
.portal-main .portal-support-contact { grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
.portal-main .portal-support-contact-copy,
.portal-main .tac-service-block { display: flex; align-items: flex-start; gap: 13px; min-width: 0; }
.portal-main .portal-service-icon { display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 38px; border: 1px solid rgba(130, 198, 255, 0.25); border-radius: 10px; color: #91d7ef; background: rgba(130, 198, 255, 0.08); }
.portal-main .portal-service-icon svg { width: 20px; height: 20px; }
.portal-main .portal-support-contact h3,
.portal-main .tac-service-block h3 { margin: 0; color: #eaf4ff; font-size: 1rem; }
.portal-main .portal-support-contact p,
.portal-main .tac-service-block p { margin: 4px 0 0; color: rgba(190, 206, 228, 0.7); font-size: 0.78rem; line-height: 1.5; }
.portal-main .portal-support-contact p strong { color: #eaf4ff; font-weight: 700; }
.portal-main .portal-support-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.portal-main .portal-support-actions a,
.portal-main .tac-service-block > a { min-height: 48px; }
.portal-main .portal-support-change { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-top: 13px; border-top: 1px solid rgba(130, 198, 255, 0.12); }
.portal-main .portal-support-change span { color: #eaf4ff; font-size: 0.8rem; font-weight: 700; }
.portal-main .portal-support-change p { margin: 2px 0 0; }
.portal-main .portal-support-change a { color: #91d7ef; font-size: 0.78rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.portal-main .portal-support-change a:hover { color: #d9f5ff; }
.portal-main .tac-service-panel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.portal-main .tac-service-block { align-items: center; }
.portal-main .tac-service-block > div { flex: 1 1 auto; min-width: 0; }
.portal-main .tac-service-support { padding-left: 16px; border-left: 1px solid rgba(130, 198, 255, 0.13); }
@media (max-width: 760px) {
  .portal-main .education-head { align-items: start; grid-template-columns: 1fr; }
  .portal-main .education-progress-card { min-width: 0; }
  .portal-main .education-feature-grid { grid-template-columns: 1fr; }
  .portal-main .support-experience .portal-support-grid { grid-template-columns: 1fr; }
  .portal-main .portal-support-contact,
  .portal-main .tac-service-panel { grid-template-columns: 1fr; }
  .portal-main .portal-support-change { align-items: flex-start; flex-direction: column; }
  .portal-main .portal-support-actions { width: 100%; }
  .portal-main .portal-support-actions a { flex: 1 1 180px; justify-content: center; }
  .portal-main .tac-service-support { padding-left: 0; padding-top: 16px; border-left: 0; border-top: 1px solid rgba(130, 198, 255, 0.13); }
}
@media (prefers-reduced-motion: reduce) {
  .portal-main .lesson-card { transition: none; }
  .portal-main .lesson-card:hover { transform: none; }
}

/* ============================================================
   AUREX CLIENT PORTAL — Brick 6: Final Experience Cohesion.
   One journey language (Understand -> Analyze -> Plan -> Review
   -> Earn -> Progress) + consistent service transitions.
   Presentation only; scoped to .portal-main.

   FIRST-CLIENT ACCEPTANCE CHECKLIST (documentation only — no
   fake client data is created in source; verify with a real
   mapped client):
     [ ] Login + every access gate (signed-out, session-expired,
         profile/mapping required, disabled, wrong-role)
     [ ] Home Daily Command Center — one primary item, journey strip
     [ ] Carlos hub — welcome, sources, market card, transitions
     [ ] Chart Reader — command header, market map, evidence, live strategy
     [ ] Strategy Builder — mission flow, review, transitions
     [ ] Performance — scores, one lesson, transitions
     [ ] Cashback — formula, flow, rewards journey, transitions
     [ ] Education — roadmap states
     [ ] Membership — access type states, service map, referral demo
     [ ] Account Opening — request states
     [ ] Notifications + Timeline — grouping, read/route
     [ ] Logout returns to signed-out gate cleanly
     [ ] Desktop 1024 / 1280 / 1440 — shell, no overflow, no blink
     [ ] Phone 360 / 390 / 430 / 768 — 44px targets, no overflow
   ============================================================ */

/* ---------------- Global journey strip ---------------- */
.portal-main .portal-journey-strip {
  display: grid; gap: 12px; margin-top: clamp(14px, 2vw, 20px);
  padding: clamp(14px, 2vw, 18px); border-radius: 18px;
  border: 1px solid rgba(122, 214, 255, 0.14);
  background: linear-gradient(158deg, rgba(11, 25, 47, 0.5), rgba(6, 13, 26, 0.74));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
.portal-main .pjs-rail { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; margin: 0; padding: 0; list-style: none; }
.portal-main .pjs-phase a {
  position: relative; display: grid; gap: 5px; justify-items: center; text-align: center;
  padding: 10px 6px; border: 1px solid rgba(132, 204, 255, 0.1); border-radius: 12px;
  background: rgba(255, 255, 255, 0.02); text-decoration: none; color: inherit; height: 100%;
  transition: border-color 160ms ease, background 160ms ease;
}
.portal-main .pjs-phase a:hover { border-color: rgba(137, 232, 255, 0.3); background: rgba(103, 232, 249, 0.06); }
.portal-main .pjs-phase::after { content: ""; position: absolute; top: 24px; right: -4px; width: 6px; height: 2px; background: rgba(132, 204, 255, 0.24); z-index: 1; }
.portal-main .pjs-phase:last-child::after { display: none; }
.portal-main .pjs-dot { width: 10px; height: 10px; border-radius: 50%; border: 2px solid rgba(150, 176, 208, 0.5); }
.portal-main .pjs-body strong { display: block; font-size: 0.76rem; font-weight: 660; color: #dce8f8; line-height: 1.15; }
.portal-main .pjs-body small { color: rgba(178, 198, 222, 0.62); font-size: 0.64rem; }
.portal-main .pjs-phase.is-done .pjs-dot { border-color: rgba(89, 211, 144, 0.8); background: var(--ax-green, #59d390); }
.portal-main .pjs-phase.is-current a { border-color: rgba(137, 232, 255, 0.42); background: linear-gradient(150deg, rgba(67, 150, 255, 0.16), rgba(103, 232, 249, 0.05)); }
.portal-main .pjs-phase.is-current .pjs-dot { border-color: #8fe3ff; background: #8fe3ff; box-shadow: 0 0 0 3px rgba(103, 232, 249, 0.18); }
.portal-main .pjs-phase.is-current .pjs-body strong { color: #f4fbff; }

.portal-main .pjs-continue { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding-top: 10px; border-top: 1px solid rgba(130, 198, 255, 0.1); }
.portal-main .pjs-continue-label { color: rgba(150, 176, 208, 0.72); font-size: 0.62rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; margin-right: 4px; }
.portal-main .pjs-continue .compact-action { min-height: 44px; display: inline-flex; align-items: center; }

/* ---------------- Consistency pass (light, additive) ---------------- */
/* One numeric scale feel: tabular alignment on key metric surfaces */
.portal-main .portal-stat strong,
.portal-main .kpi-card .metric-number,
.portal-main .pac-facts dd,
.portal-main .cfs-term strong { font-variant-numeric: tabular-nums; }
/* Consistent focus ring across all portal interactive surfaces */
.portal-main a:focus-visible,
.portal-main button:focus-visible,
.portal-main [role="tab"]:focus-visible,
.portal-main summary:focus-visible { outline: 2px solid rgba(137, 232, 255, 0.55); outline-offset: 2px; }

/* ---------------- Motion / reduced motion ---------------- */
.portal-main .pjs-phase a:active { transform: translateY(1px); }
@media (prefers-reduced-motion: reduce) { .portal-main .pjs-phase a { transition: none; } }

/* ---------------- Breakpoints ---------------- */
@media (max-width: 760px) {
  .portal-main .pjs-rail { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .portal-main .pjs-phase::after { display: none; }
  .portal-main .pjs-continue .compact-action { flex: 1 1 100%; justify-content: center; }
}
@media (max-width: 400px) {
  .portal-main .pjs-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ============================================================
   AUREX PRODUCT REFINEMENT — Brick 1 (Admin service identities).
   Each admin service becomes a distinct premium "department" via a
   per-route accent over the shared palette + a compact cinematic
   page-opening. Presentation only; scoped to .admin-intelligence-body.
   Route accent is carried by [data-route-key] already on #adminRouteContent.
   ============================================================ */

/* ---------- Per-service accent variables (shared palette only) ---------- */
.admin-intelligence-body .admin-route-content { --svc: 121, 223, 246; --svc2: 108, 168, 247; }
.admin-intelligence-body .admin-route-content[data-route-key="overview"]         { --svc: 121, 223, 246; --svc2: 108, 168, 247; }
.admin-intelligence-body .admin-route-content[data-route-key="clients"]          { --svc: 121, 223, 246; --svc2: 143, 189, 246; }
.admin-intelligence-body .admin-route-content[data-route-key="data-quality"]     { --svc: 231, 199, 106; --svc2: 255, 118, 132; }
.admin-intelligence-body .admin-route-content[data-route-key="import"]           { --svc: 108, 168, 247; --svc2: 121, 223, 246; }
.admin-intelligence-body .admin-route-content[data-route-key="reports"]          { --svc: 108, 168, 247; --svc2: 89, 211, 144; }
.admin-intelligence-body .admin-route-content[data-route-key="activity"]         { --svc: 121, 223, 246; --svc2: 139, 129, 246; }
.admin-intelligence-body .admin-route-content[data-route-key="performance"]      { --svc: 108, 168, 247; --svc2: 89, 211, 144; }
.admin-intelligence-body .admin-route-content[data-route-key="cashback"]         { --svc: 121, 223, 246; --svc2: 89, 211, 144; }
.admin-intelligence-body .admin-route-content[data-route-key="subscriptions"]    { --svc: 139, 129, 246; --svc2: 108, 168, 247; }
.admin-intelligence-body .admin-route-content[data-route-key="community"]        { --svc: 121, 223, 246; --svc2: 139, 129, 246; }
.admin-intelligence-body .admin-route-content[data-route-key="account-requests"] { --svc: 139, 129, 246; --svc2: 231, 199, 106; }
.admin-intelligence-body .admin-route-content[data-route-key="leaderboard"]      { --svc: 217, 180, 90;  --svc2: 121, 223, 246; }
.admin-intelligence-body .admin-route-content[data-route-key="education"]        { --svc: 108, 168, 247; --svc2: 231, 231, 240; }
.admin-intelligence-body .admin-route-content[data-route-key="settings"]         { --svc: 139, 129, 246; --svc2: 231, 199, 106; }

/* ---------- Cinematic page opening: compact identity scene ---------- */
.admin-intelligence-body .admin-main .admin-route-content .unified-page-header {
  position: relative;
  overflow: hidden;
  border-left: 3px solid rgba(var(--svc), 0.55);
  background:
    radial-gradient(120% 130% at 0% -20%, rgba(var(--svc), 0.14), transparent 46%),
    linear-gradient(158deg, rgba(14, 30, 54, 0.66), rgba(6, 14, 28, 0.88));
}
/* one-time light sweep on route enter — no infinite motion */
.admin-intelligence-body .admin-main .admin-route-content .unified-page-header::after {
  content: "";
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(110deg, transparent 30%, rgba(var(--svc), 0.12) 46%, transparent 62%);
  transform: translateX(-120%);
  animation: axSvcSweep 1.5s cubic-bezier(0.22, 1, 0.36, 1) 0.15s 1 both;
}
.admin-intelligence-body .admin-main .admin-route-content .unified-page-header .eyebrow { color: rgb(var(--svc)); }
@keyframes axSvcSweep { to { transform: translateX(120%); } }

/* Brighter service edge-light hairline on primary panels of the active service */
.admin-intelligence-body .admin-main .admin-route-content .glass-panel::before,
.admin-intelligence-body .admin-main .admin-route-content .admin-table-panel::before {
  background: linear-gradient(90deg, transparent, rgba(var(--svc), 0.28) 50%, transparent);
}

/* ---------- Guided workflow rail: active step takes the service accent ---------- */
.admin-intelligence-body .admin-main .admin-route-content .step-flow article.is-active {
  border-color: rgba(var(--svc), 0.4);
  background: linear-gradient(160deg, rgba(var(--svc2), 0.2), rgba(var(--svc), 0.06));
  color: #f6fbff;
}
.admin-intelligence-body .admin-main .admin-route-content .step-flow article.is-active > span { background: rgb(var(--svc)); color: #04121f; }

/* ---------- Numeric identity: service-tinted glow on key numbers ---------- */
.admin-intelligence-body .admin-main .admin-route-content .kpi-card .metric-number,
.admin-intelligence-body .admin-main .admin-route-content .context-strip strong {
  text-shadow: 0 0 22px rgba(var(--svc), 0.16);
}

/* ---------- Reduce equal-card repetition: lift the first KPI as dominant ---------- */
.admin-intelligence-body .admin-main .admin-route-content .control-room-grid > .kpi-card:first-child,
.admin-intelligence-body .admin-main .admin-route-content .portal-kpi-grid > .kpi-card:first-child {
  border-color: rgba(var(--svc), 0.3);
  background:
    radial-gradient(120% 100% at 100% 0%, rgba(var(--svc), 0.12), transparent 52%),
    linear-gradient(160deg, rgba(12, 28, 50, 0.7), rgba(6, 14, 28, 0.86));
}

/* ---------- Context strip: service-tinted top hairline ---------- */
.admin-intelligence-body .admin-main .admin-route-content .context-strip {
  border-top: 2px solid rgba(var(--svc), 0.34);
}

/* ---------- Selected/active table row uses service accent ---------- */
.admin-intelligence-body .admin-main .admin-route-content .admin-table tbody tr:hover {
  box-shadow: inset 3px 0 0 rgb(var(--svc));
  background: linear-gradient(90deg, rgba(var(--svc), 0.06), transparent 60%);
}

/* ---------- Guidance structure emphasis (Current -> Action -> Next) ---------- */
.admin-intelligence-body .admin-main .admin-route-content .first-action-guide { border-left-color: rgb(var(--svc)); }
.admin-intelligence-body .admin-main .admin-route-content .first-action-guide .fa-eyebrow { color: rgb(var(--svc)); }

/* ---------- Reduced motion: no route-enter sweep ---------- */
@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .admin-main .admin-route-content .unified-page-header::after { animation: none; opacity: 0; }
}

/* ============================================================
   AUREX PRODUCT REFINEMENT — Brick 1 (Login cinematic + Pro motion).
   Presentation only. Builds on the existing two-column login scene
   and the Pro Rewards cinematic page. Performance-safe: slow, single,
   reduced-motion-aware effects only.
   ============================================================ */

/* ---------------- Cinematic login environment ---------------- */
/* Flowing intelligence field behind the integrated login scene */
.portal-secure-entry { isolation: isolate; }
.portal-secure-entry .portal-entry-layout::before {
  content: "";
  position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(46rem 30rem at 12% 8%, rgba(92, 181, 255, 0.14), transparent 60%),
    radial-gradient(40rem 30rem at 88% 20%, rgba(103, 232, 249, 0.1), transparent 60%),
    radial-gradient(38rem 34rem at 70% 96%, rgba(139, 129, 246, 0.08), transparent 60%);
  animation: axEntryDrift 22s ease-in-out infinite alternate;
}
@keyframes axEntryDrift { from { transform: translate3d(-1.2%, -0.8%, 0) scale(1.02); } to { transform: translate3d(1.2%, 0.8%, 0) scale(1.05); } }
/* Subtle neural data-paths — slow-moving light lines, single soft layer */
.portal-secure-entry .portal-entry-preview { position: relative; overflow: hidden; }
.portal-secure-entry .portal-entry-preview::after {
  content: "";
  position: absolute; inset: 0; pointer-events: none; opacity: 0.5;
  background:
    linear-gradient(115deg, transparent 48%, rgba(127, 216, 247, 0.16) 50%, transparent 52%),
    linear-gradient(65deg, transparent 62%, rgba(103, 232, 249, 0.1) 64%, transparent 66%);
  background-size: 220% 220%; background-position: 0% 0%;
  animation: axEntryPaths 16s linear infinite;
}
@keyframes axEntryPaths { to { background-position: 120% 60%; } }
/* Carlos presence in the login scene */
.portal-secure-entry .portal-preview-node[data-preview-node="carlos"] .portal-preview-node-icon::after {
  content: ""; position: absolute; margin: -3px 0 0 18px; width: 7px; height: 7px; border-radius: 50%;
  background: var(--ax-green, #59d390); box-shadow: 0 0 0 0 rgba(89, 211, 144, 0.5);
  animation: axLoginPresence 2.8s ease-out infinite;
}
.portal-secure-entry .portal-preview-node { position: relative; }
@keyframes axLoginPresence { 0% { box-shadow: 0 0 0 0 rgba(89,211,144,0.45); } 70% { box-shadow: 0 0 0 7px rgba(89,211,144,0); } 100% { box-shadow: 0 0 0 0 rgba(89,211,144,0); } }
/* Elegant one-time reveal of the login card + preview */
.portal-secure-entry .portal-client-entry-card { animation: axEntryRise 620ms cubic-bezier(0.22, 1, 0.36, 1) both; }
.portal-secure-entry .portal-entry-preview { animation: axEntryRise 620ms cubic-bezier(0.22, 1, 0.36, 1) 120ms both; }
@keyframes axEntryRise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

/* Access-state gate shares the cinematic field + focal reveal */
.portal-secure-entry .portal-access-state-card { animation: axEntryRise 560ms cubic-bezier(0.22, 1, 0.36, 1) both; }

@media (prefers-reduced-motion: reduce) {
  .portal-secure-entry .portal-entry-layout::before,
  .portal-secure-entry .portal-entry-preview::after,
  .portal-secure-entry .portal-preview-node[data-preview-node="carlos"] .portal-preview-node-icon::after,
  .portal-secure-entry .portal-client-entry-card,
  .portal-secure-entry .portal-entry-preview,
  .portal-secure-entry .portal-access-state-card { animation: none; }
}

/* ---------------- Pro Rewards cinematic motion ---------------- */
/* Slow data-light drift across the hero console (single soft layer) */
.pro-cinema .ax-console { position: relative; }
.pro-cinema .ax-console-chart { position: relative; overflow: hidden; }
.pro-cinema .ax-console-chart::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0.6;
  background: linear-gradient(100deg, transparent 44%, rgba(127, 216, 247, 0.14) 50%, transparent 56%);
  background-size: 240% 100%; animation: axProScan 9s linear infinite;
}
@keyframes axProScan { to { background-position: -240% 0; } }
/* Connected service flow along the system rail (Understand -> Progress) */
.pro-cinema .ax-systemrail .ax-rail { position: relative; }
.pro-cinema .ax-systemrail .ax-rail::before {
  content: ""; position: absolute; left: 0; right: 0; top: 12px; height: 2px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(127, 216, 247, 0.4), rgba(103, 232, 249, 0.2), transparent);
  background-size: 220% 100%; animation: axRailFlow 7s linear infinite; opacity: 0.7;
}
@keyframes axRailFlow { to { background-position: 220% 0; } }
/* Loyalty / cashback progress subtle fill motion (once, on reveal) */
.pro-cinema .ax-rails b { position: relative; overflow: hidden; }
.pro-cinema .ax-rails b::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.22), transparent);
  transform: translateX(-100%); animation: axProGleam 2.6s ease-out 0.4s 1 both;
}
@keyframes axProGleam { to { transform: translateX(100%); } }
/* Premium hover response on pillar/section cards */
.pro-cinema .ax-pillar-card, .pro-cinema .ax-scene .pro-pillar-card {
  transition: transform 220ms cubic-bezier(0.22, 1, 0.36, 1), border-color 220ms ease, box-shadow 220ms ease;
}
.pro-cinema .ax-pillar-card:hover, .pro-cinema .ax-scene .pro-pillar-card:hover {
  transform: translateY(-4px);
  border-color: rgba(127, 216, 247, 0.34);
  box-shadow: 0 30px 80px rgba(1, 5, 12, 0.5), inset 0 1px 0 rgba(255, 255, 255, 0.12);
}

@media (prefers-reduced-motion: reduce) {
  .pro-cinema .ax-console-chart::after,
  .pro-cinema .ax-systemrail .ax-rail::before,
  .pro-cinema .ax-rails b::after { animation: none; }
  .pro-cinema .ax-pillar-card, .pro-cinema .ax-scene .pro-pillar-card { transition: none; }
}

/* ============================================================
   AUREX PRODUCT REFINEMENT — Brick 2 (Department primary scenes).
   One dominant scene per department: workflow rail + dominant
   number + status + recommended action, ~180-320px tall.
   Inherits the per-service --svc accent from Refinement Brick 1.
   Presentation only; scoped to .admin-intelligence-body.
   ============================================================ */

.admin-intelligence-body .admin-main .department-scene {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  gap: clamp(16px, 2.4vw, 28px);
  align-items: stretch;
  padding: clamp(16px, 2vw, 22px) clamp(18px, 2.2vw, 26px);
  margin-bottom: 14px;
  border-radius: 18px;
  border: 1px solid var(--ax-line, rgba(255,255,255,0.08));
  border-left: 3px solid rgba(var(--svc, 121, 223, 246), 0.6);
  background:
    radial-gradient(120% 140% at 0% -20%, rgba(var(--svc, 121, 223, 246), 0.13), transparent 46%),
    linear-gradient(158deg, rgba(14, 30, 54, 0.7), rgba(6, 14, 28, 0.9));
  box-shadow: var(--axm-command, 0 30px 90px rgba(0,0,0,0.4)), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  overflow: hidden;
}
.admin-intelligence-body .admin-main .department-scene::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(110deg, transparent 32%, rgba(var(--svc, 121, 223, 246), 0.1) 47%, transparent 62%);
  transform: translateX(-120%);
  animation: axDeptSweep 1.5s cubic-bezier(0.22, 1, 0.36, 1) 0.15s 1 both;
}
@keyframes axDeptSweep { to { transform: translateX(120%); } }

.admin-intelligence-body .dept-lead { display: grid; gap: 10px; align-content: start; min-width: 0; }
.admin-intelligence-body .dept-eyebrow { color: rgb(var(--svc, 121, 223, 246)); font-size: 0.62rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; }
.admin-intelligence-body .dept-title { font-size: clamp(1.25rem, 2.6vw, 1.62rem); font-weight: 720; letter-spacing: -0.016em; color: #f6fbff; margin: 2px 0 0; }
.admin-intelligence-body .dept-purpose { color: rgba(198, 214, 236, 0.72); font-size: 0.85rem; line-height: 1.4; max-width: 56ch; }

/* Compact workflow rail with one-time light travel */
.admin-intelligence-body .dept-flow { position: relative; display: flex; flex-wrap: wrap; gap: 7px; margin: 2px 0 4px; }
.admin-intelligence-body .dept-step {
  display: inline-flex; align-items: center; gap: 7px; padding: 6px 11px 6px 7px;
  border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-radius: 999px;
  color: rgba(160, 182, 210, 0.72); font-size: 0.74rem; font-weight: 640; white-space: nowrap;
}
.admin-intelligence-body .dept-step i {
  display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; font-style: normal;
  background: rgba(255, 255, 255, 0.05); color: rgba(206, 219, 237, 0.72); font-size: 0.64rem; font-weight: 800;
}
.admin-intelligence-body .dept-step.is-active { color: #f6fbff; border-color: rgba(var(--svc, 121, 223, 246), 0.4); background: linear-gradient(160deg, rgba(var(--svc, 121, 223, 246), 0.18), rgba(var(--svc, 121, 223, 246), 0.05)); }
.admin-intelligence-body .dept-step.is-active i { background: rgb(var(--svc, 121, 223, 246)); color: #04121f; }
.admin-intelligence-body .dept-step.is-complete { color: #cfeede; border-color: rgba(89, 211, 144, 0.3); }
.admin-intelligence-body .dept-step.is-complete i { background: var(--ax-green, #59d390); color: #04121f; }
.admin-intelligence-body .dept-step.is-blocked { color: #ffd7dc; border-color: rgba(255, 118, 132, 0.34); }
.admin-intelligence-body .dept-step.is-blocked i { background: var(--ax-red, #ff7684); color: #04121f; }

.admin-intelligence-body .dept-action { justify-self: start; min-height: 44px; margin-top: 4px; }

/* Focus column: dominant number + status */
.admin-intelligence-body .dept-focus {
  display: grid; gap: 10px; align-content: center; justify-items: start;
  padding-left: clamp(14px, 1.6vw, 20px); border-left: 1px solid var(--ax-line, rgba(255,255,255,0.08));
}
.admin-intelligence-body .dept-primary { display: grid; gap: 3px; }
.admin-intelligence-body .dept-primary span { color: rgba(150, 176, 208, 0.74); font-size: 0.62rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.admin-intelligence-body .dept-primary .metric-number { font-size: clamp(2rem, 4vw, 2.9rem); font-weight: 760; letter-spacing: -0.02em; color: #f5faff; font-variant-numeric: tabular-nums; line-height: 1; }
.admin-intelligence-body .department-scene.tone-cyan .dept-primary .metric-number { color: #8fe3ff; text-shadow: 0 0 30px rgba(127, 216, 247, 0.3); }
.admin-intelligence-body .department-scene.tone-amber .dept-primary .metric-number { color: #f0d089; text-shadow: 0 0 30px rgba(231, 199, 106, 0.28); }
.admin-intelligence-body .department-scene.tone-red .dept-primary .metric-number { color: #ff9ba6; text-shadow: 0 0 30px rgba(255, 118, 132, 0.26); }
.admin-intelligence-body .department-scene.tone-green .dept-primary .metric-number { color: #7fe0b0; text-shadow: 0 0 30px rgba(89, 211, 144, 0.28); }
.admin-intelligence-body .department-scene.tone-blue .dept-primary .metric-number { color: #a9c9fb; text-shadow: 0 0 30px rgba(108, 168, 247, 0.26); }
.admin-intelligence-body .department-scene.tone-violet .dept-primary .metric-number { color: #cdc6fb; text-shadow: 0 0 30px rgba(139, 129, 246, 0.26); }
.admin-intelligence-body .dept-note { color: rgba(178, 198, 222, 0.66); font-size: 0.76rem; line-height: 1.35; }

/* Guided launch state for empty departments */
.admin-intelligence-body .admin-main .department-launch {
  display: grid; gap: 14px; padding: clamp(20px, 2.6vw, 28px);
  border-radius: 18px; margin-bottom: 14px;
  border: 1px dashed rgba(var(--svc, 121, 223, 246), 0.3);
  background: linear-gradient(158deg, rgba(12, 28, 50, 0.6), rgba(6, 14, 28, 0.82));
}
.admin-intelligence-body .dl-copy .dept-eyebrow { color: rgb(var(--svc, 121, 223, 246)); }
.admin-intelligence-body .dl-copy h3 { font-size: 1.2rem; font-weight: 700; letter-spacing: -0.012em; margin: 4px 0 2px; }
.admin-intelligence-body .dl-copy p { color: rgba(198, 214, 236, 0.72); font-size: 0.86rem; max-width: 60ch; }
.admin-intelligence-body .dl-steps { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; counter-reset: dl; }
.admin-intelligence-body .dl-steps li { display: flex; }
.admin-intelligence-body .dl-steps a, .admin-intelligence-body .dl-steps span { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; }
.admin-intelligence-body .dl-steps i { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; font-style: normal; background: rgba(var(--svc, 121, 223, 246), 0.16); color: rgb(var(--svc, 121, 223, 246)); font-size: 0.68rem; font-weight: 800; }

/* Reduced motion + performance safety */
@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .admin-main .department-scene::after { animation: none; opacity: 0; }
}

/* Breakpoints */
@media (max-width: 900px) {
  .admin-intelligence-body .admin-main .department-scene { grid-template-columns: minmax(0, 1fr); }
  .admin-intelligence-body .dept-focus { padding-left: 0; border-left: 0; border-top: 1px solid var(--ax-line, rgba(255,255,255,0.08)); padding-top: 12px; }
}

/* Brick 3 — leaderboard gold dominant number + clearer nav group separation */
.admin-intelligence-body .department-scene.tone-gold .dept-primary .metric-number { color: #e7cf8f; text-shadow: 0 0 30px rgba(217, 180, 90, 0.28); }
.admin-intelligence-body .admin-sidebar .nav-group { padding-top: 8px; }
.admin-intelligence-body .admin-sidebar .nav-group > span {
  display: block; padding: 2px 12px 6px; color: rgba(150, 176, 208, 0.6);
  font-size: 0.58rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase;
}
.admin-intelligence-body .admin-sidebar .nav-group + .nav-group { border-top: 1px solid var(--ax-line, rgba(255,255,255,0.06)); margin-top: 4px; }

/* ============================================================
   AUREX PRODUCT REFINEMENT — Brick 4: institutional charts,
   analytics scenes, cashback money flow, cinematic access states.
   Presentation only.
   ============================================================ */

/* ---------------- Institutional trend chart ---------------- */
.trend-chart { position: relative; display: block; margin: 0; }
.trend-chart svg { display: block; width: 100%; height: auto; }
.trend-chart .trend-grid { stroke: rgba(255, 255, 255, 0.06); stroke-width: 1; }
.trend-chart .trend-zero { stroke: rgba(255, 255, 255, 0.18); stroke-width: 1; stroke-dasharray: 3 4; }
.trend-chart .trend-line { fill: none; stroke: rgb(var(--tc-accent, 121, 223, 246)); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.trend-chart .trend-point { fill: rgb(var(--tc-accent, 121, 223, 246)); stroke: #04121f; stroke-width: 1.5; }
.trend-chart .trend-axis { display: flex; justify-content: space-between; margin-top: 4px; color: rgba(150, 176, 208, 0.6); font-size: 0.66rem; font-weight: 600; letter-spacing: 0.02em; }
.trend-chart .trend-caption { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-top: 6px; }
.trend-chart .trend-latest { font-size: 1.4rem; font-weight: 760; letter-spacing: -0.02em; color: #f5faff; font-variant-numeric: tabular-nums; }
.trend-chart .trend-delta { font-size: 0.72rem; font-weight: 700; color: rgba(178, 198, 222, 0.7); }
.trend-chart .trend-delta.is-up { color: #7fe0b0; }
.trend-chart .trend-delta.is-down { color: #ff9ba6; }
.trend-chart.is-empty { display: grid; place-items: center; min-height: 150px; border: 1px dashed rgba(132, 204, 255, 0.2); border-radius: 14px; background: linear-gradient(160deg, rgba(11, 25, 47, 0.4), rgba(6, 13, 26, 0.6)); }
.trend-chart.is-empty svg { position: absolute; inset: 0; height: 100%; opacity: 0.4; }
.trend-chart .trend-empty-line { fill: none; stroke: rgba(127, 216, 247, 0.3); stroke-width: 2; stroke-dasharray: 4 6; }
.trend-chart .trend-empty-copy { position: relative; display: grid; gap: 3px; justify-items: center; text-align: center; padding: 10px 16px; }
.trend-chart .trend-empty-copy strong { color: #eaf2fd; font-size: 0.92rem; }
.trend-chart .trend-empty-copy span { color: rgba(190, 206, 228, 0.7); font-size: 0.8rem; max-width: 40ch; }
@media (prefers-reduced-motion: no-preference) {
  .trend-chart:not(.is-empty) .trend-line { stroke-dasharray: 1; stroke-dashoffset: 1; animation: trendDraw 1.25s cubic-bezier(0.22, 1, 0.36, 1) 0.1s forwards; }
  .trend-chart:not(.is-empty) .trend-point { animation: trendPoint 0.4s ease 1.2s both; }
  .trend-chart:not(.is-empty) .trend-area { animation: trendFade 0.9s ease 0.4s both; }
}
@keyframes trendDraw { to { stroke-dashoffset: 0; } }
@keyframes trendPoint { from { opacity: 0; r: 0; } to { opacity: 1; } }
@keyframes trendFade { from { opacity: 0; } to { opacity: 1; } }

/* ---------------- Analytics scene (Performance) ---------------- */
.admin-intelligence-body .admin-main .analytics-scene {
  display: grid; grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.5fr) minmax(0, 0.78fr);
  gap: clamp(14px, 2vw, 24px); align-items: stretch; margin-bottom: 14px;
  padding: clamp(16px, 2vw, 22px); border-radius: 18px;
  border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-left: 3px solid rgba(var(--svc, 108, 168, 247), 0.6);
  background: radial-gradient(120% 140% at 0% -20%, rgba(var(--svc, 108, 168, 247), 0.12), transparent 46%), linear-gradient(158deg, rgba(14, 30, 54, 0.7), rgba(6, 14, 28, 0.9));
  box-shadow: var(--axm-command, 0 30px 90px rgba(0,0,0,0.4)), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
.admin-intelligence-body .analytics-scene.analytics-solo { grid-template-columns: 1fr; }
.admin-intelligence-body .as-insight { display: grid; gap: 8px; align-content: start; min-width: 0; }
.admin-intelligence-body .as-insight .dept-title { font-size: clamp(1.15rem, 2.4vw, 1.5rem); }
.admin-intelligence-body .as-signals { display: grid; gap: 7px; margin: 4px 0 0; padding: 0; list-style: none; }
.admin-intelligence-body .as-signals li { display: grid; gap: 1px; padding: 8px 11px; border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-left: 2px solid rgba(150,176,208,0.4); border-radius: 10px; background: rgba(255,255,255,0.02); }
.admin-intelligence-body .as-signals li span { color: rgba(150, 176, 208, 0.7); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.admin-intelligence-body .as-signals li strong { color: #e7f0fb; font-size: 0.82rem; font-weight: 600; line-height: 1.3; }
.admin-intelligence-body .as-signals li.is-positive { border-left-color: rgba(89, 211, 144, 0.7); }
.admin-intelligence-body .as-signals li.is-warning { border-left-color: rgba(231, 199, 106, 0.7); }
.admin-intelligence-body .as-signals li.is-coach { border-left-color: rgba(127, 216, 247, 0.7); }
.admin-intelligence-body .as-chart { display: grid; align-content: start; gap: 6px; min-width: 0; }
.admin-intelligence-body .as-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.admin-intelligence-body .as-head span, .admin-intelligence-body .as-head .dept-eyebrow { color: rgb(var(--svc, 108, 168, 247)); font-size: 0.64rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
.admin-intelligence-body .as-head small { color: rgba(178, 198, 222, 0.6); font-size: 0.7rem; }
.admin-intelligence-body .as-scores { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; align-content: start; padding-left: clamp(12px, 1.4vw, 18px); border-left: 1px solid var(--ax-line, rgba(255,255,255,0.08)); }
.admin-intelligence-body .as-score { display: grid; gap: 2px; padding: 9px 11px; border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-radius: 10px; background: rgba(255,255,255,0.02); }
.admin-intelligence-body .as-score span { color: rgba(150, 176, 208, 0.72); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.admin-intelligence-body .as-score .metric-number { font-size: 1.4rem; font-weight: 740; color: #f5faff; font-variant-numeric: tabular-nums; }
.admin-intelligence-body .as-verify { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 11px; border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-radius: 10px; }
.admin-intelligence-body .as-verify span:first-child { color: rgba(150, 176, 208, 0.72); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }

/* Reports / generic analytics band */
.admin-intelligence-body .admin-main .analytics-band {
  display: grid; gap: 6px; margin-bottom: 14px; padding: clamp(16px, 2vw, 20px); border-radius: 16px;
  border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-left: 3px solid rgba(89, 211, 144, 0.55);
  background: linear-gradient(158deg, rgba(11, 25, 47, 0.55), rgba(6, 13, 26, 0.8));
}

/* ---------------- Cashback money-flow scene ---------------- */
.admin-intelligence-body .admin-main .cashback-money-scene {
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(14px, 2vw, 22px);
  margin-bottom: 14px; padding: clamp(16px, 2vw, 22px); border-radius: 18px;
  border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-left: 3px solid rgba(121, 223, 246, 0.6);
  background: linear-gradient(158deg, rgba(12, 30, 50, 0.68), rgba(6, 14, 28, 0.88));
  box-shadow: var(--axm-command, 0 30px 90px rgba(0,0,0,0.4)), inset 0 1px 0 rgba(255,255,255,0.08);
}
.admin-intelligence-body .cfs-flow { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; align-content: start; }
.admin-intelligence-body .cfs-node { position: relative; display: grid; gap: 3px; padding: 11px 13px; border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-top: 2px solid rgba(132,204,255,0.4); border-radius: 12px; background: rgba(255,255,255,0.02); }
.admin-intelligence-body .cfs-node span { color: rgba(150, 176, 208, 0.74); font-size: 0.58rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.admin-intelligence-body .cfs-node strong { color: #eef6ff; font-size: 1.02rem; font-weight: 720; font-variant-numeric: tabular-nums; }
.admin-intelligence-body .cfs-lots { border-top-color: rgba(121, 223, 246, 0.7); } .admin-intelligence-body .cfs-lots strong { color: #8fe3ff; }
.admin-intelligence-body .cfs-estimated { border-top-color: rgba(231, 199, 106, 0.7); } .admin-intelligence-body .cfs-estimated strong { color: #f0d089; }
.admin-intelligence-body .cfs-available { border-top-color: rgba(127, 216, 247, 0.8); } .admin-intelligence-body .cfs-available strong { color: #8fe3ff; }
.admin-intelligence-body .cfs-requested { border-top-color: rgba(231, 199, 106, 0.7); } .admin-intelligence-body .cfs-requested strong { color: #f0d089; }
.admin-intelligence-body .cfs-approved { border-top-color: rgba(108, 168, 247, 0.8); } .admin-intelligence-body .cfs-approved strong { color: #a9c9fb; }
.admin-intelligence-body .cfs-paid { border-top-color: rgba(89, 211, 144, 0.8); } .admin-intelligence-body .cfs-paid strong { color: #7fe0b0; }
.admin-intelligence-body .cfs-chart { display: grid; align-content: start; gap: 6px; min-width: 0; }

/* ---------------- Cinematic access state (single guided state) ---------------- */
.portal-body .portal-access-state-card { display: grid; gap: 14px; justify-items: start; text-align: left; }
.portal-body .pas-sysviz { position: relative; width: 62px; height: 62px; display: grid; place-items: center; }
.portal-body .pas-core { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; color: #f7fbff; font-weight: 760; letter-spacing: 0.04em; background: linear-gradient(145deg, rgba(67, 150, 255, 0.3), rgba(255, 255, 255, 0.05)); border: 1px solid rgba(130, 211, 255, 0.3); box-shadow: 0 14px 40px rgba(32, 128, 255, 0.24), inset 0 1px 0 rgba(255,255,255,0.16); }
.portal-body .pas-orbit { position: absolute; inset: 0; border-radius: 50%; border: 1px dashed rgba(127, 216, 247, 0.4); animation: pasOrbit 14s linear infinite; }
.portal-body .pas-seal { position: absolute; right: -2px; bottom: -2px; width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; font-size: 0.72rem; font-weight: 900; color: #04121f; background: var(--ax-green, #59d390); box-shadow: 0 0 0 3px rgba(4,18,31,0.9); }
.portal-body .portal-access-state-card.tone-amber .pas-seal { background: var(--ax-amber, #e7c76a); }
@keyframes pasOrbit { to { transform: rotate(360deg); } }
.portal-body .pas-explain { color: rgba(200, 216, 238, 0.78); font-size: 0.94rem; line-height: 1.45; max-width: 46ch; margin-top: 2px; }
.portal-body .pas-reassure { color: rgba(150, 176, 208, 0.66); font-size: 0.78rem; line-height: 1.4; padding: 9px 12px; border-radius: 10px; border: 1px solid rgba(89, 211, 144, 0.2); background: rgba(89, 211, 144, 0.05); }
.portal-body .portal-access-state-card.tone-amber .pas-reassure { border-color: rgba(231, 199, 106, 0.2); background: rgba(231, 199, 106, 0.05); }
.portal-body .portal-access-state-list { display: none; }
@media (prefers-reduced-motion: reduce) { .portal-body .pas-orbit { animation: none; } }

/* ---------------- Breakpoints ---------------- */
@media (max-width: 1000px) {
  .admin-intelligence-body .admin-main .analytics-scene { grid-template-columns: 1fr; }
  .admin-intelligence-body .as-scores { grid-template-columns: repeat(4, 1fr); padding-left: 0; border-left: 0; border-top: 1px solid var(--ax-line, rgba(255,255,255,0.08)); padding-top: 12px; }
  .admin-intelligence-body .admin-main .cashback-money-scene { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .admin-intelligence-body .as-scores { grid-template-columns: 1fr 1fr; }
  .admin-intelligence-body .cfs-flow { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 460px) {
  .admin-intelligence-body .cfs-flow { grid-template-columns: 1fr; }
}

/* ============================================================
   CARLOS ADMIN — operational intelligence command center.
   Distinct material identity (cyan + violet). Presentation only.
   Scoped to .admin-intelligence-body.
   ============================================================ */
.admin-intelligence-body .admin-route-content[data-route-key="carlos"] { --svc: 121, 223, 246; --svc2: 139, 129, 246; }

/* Shared Carlos label + presence */
.admin-intelligence-body .cb-eyebrow { color: #6fd7e6; font-size: 0.6rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase; }
.admin-intelligence-body .cb-pulse, .admin-intelligence-body .cb-presence .cb-pulse {
  position: absolute; inset: -4px; border-radius: 50%; border: 1px solid rgba(121, 223, 246, 0.45);
  animation: carlosBreathe 3.4s ease-in-out infinite;
}
@keyframes carlosBreathe { 0%,100% { transform: scale(1); opacity: 0.55; } 50% { transform: scale(1.12); opacity: 0.15; } }

/* ---------------- Command briefing scene (Intelligence Glass) ---------------- */
.admin-intelligence-body .admin-main .carlos-brief {
  display: grid; gap: 14px; margin-bottom: 14px; padding: clamp(18px, 2.2vw, 26px); border-radius: 20px;
  border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-left: 3px solid rgba(121, 223, 246, 0.6);
  background: radial-gradient(120% 130% at 0% -10%, rgba(139, 129, 246, 0.12), transparent 44%), radial-gradient(120% 120% at 100% -10%, rgba(121, 223, 246, 0.1), transparent 42%), linear-gradient(158deg, rgba(14, 30, 54, 0.72), rgba(6, 14, 28, 0.9));
  box-shadow: var(--axm-command, 0 30px 90px rgba(0,0,0,0.4)), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
.admin-intelligence-body .cb-lead { display: flex; align-items: center; gap: 14px; }
.admin-intelligence-body .cb-presence { position: relative; width: 46px; height: 46px; flex: 0 0 auto; display: grid; place-items: center; }
.admin-intelligence-body .cb-core { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 13px; background: linear-gradient(145deg, rgba(121, 223, 246, 0.3), rgba(139, 129, 246, 0.14)); border: 1px solid rgba(127, 216, 247, 0.34); color: #f6fbff; font-weight: 800; box-shadow: inset 0 1px 0 rgba(255,255,255,0.16); }
.admin-intelligence-body .cb-copy { flex: 1 1 auto; min-width: 0; }
.admin-intelligence-body .cb-greeting { font-size: clamp(1.3rem, 2.8vw, 1.7rem); font-weight: 720; letter-spacing: -0.018em; color: #f6fbff; margin: 3px 0; }
.admin-intelligence-body .cb-line { color: rgba(198, 214, 236, 0.78); font-size: 0.9rem; }
.admin-intelligence-body .cb-system { flex: 0 0 auto; align-self: flex-start; }
.admin-intelligence-body .cb-focus { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.admin-intelligence-body .cb-top { display: grid; gap: 5px; padding: 14px 16px; border-radius: 14px; border: 1px solid rgba(121, 223, 246, 0.2); border-left: 3px solid rgba(121, 223, 246, 0.7); background: linear-gradient(155deg, rgba(121, 223, 246, 0.1), rgba(139, 129, 246, 0.04)); }
.admin-intelligence-body .cb-top.tone-risk { border-left-color: rgba(255, 118, 132, 0.8); background: linear-gradient(155deg, rgba(255, 118, 132, 0.1), transparent); }
.admin-intelligence-body .cb-top.tone-amber { border-left-color: rgba(231, 199, 106, 0.8); background: linear-gradient(155deg, rgba(231, 199, 106, 0.1), transparent); }
.admin-intelligence-body .cb-top-label { color: rgba(150, 176, 208, 0.8); font-size: 0.6rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; }
.admin-intelligence-body .cb-top strong { font-size: 1.05rem; font-weight: 700; color: #f4f9ff; }
.admin-intelligence-body .cb-top p { color: rgba(198, 214, 236, 0.76); font-size: 0.84rem; }
.admin-intelligence-body .cb-top-meta { display: flex; gap: 12px; color: rgba(150, 176, 208, 0.7); font-size: 0.7rem; font-variant-numeric: tabular-nums; }
.admin-intelligence-body .cb-action { justify-self: start; margin-top: 6px; min-height: 44px; }
.admin-intelligence-body .cb-facts { display: grid; gap: 6px; margin: 0; }
.admin-intelligence-body .cb-facts > div { display: grid; grid-template-columns: 120px 1fr; gap: 10px; padding: 7px 10px; border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-radius: 10px; background: rgba(255,255,255,0.02); }
.admin-intelligence-body .cb-facts dt { color: rgba(150, 176, 208, 0.72); font-size: 0.58rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; align-self: center; }
.admin-intelligence-body .cb-facts dd { margin: 0; color: #e7f0fb; font-size: 0.8rem; }
.admin-intelligence-body .cb-sources { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.admin-intelligence-body .cb-sources > span:first-child { color: rgba(150, 176, 208, 0.7); font-size: 0.6rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; margin-right: 2px; }
.admin-intelligence-body .cb-chip { padding: 3px 9px; border: 1px solid rgba(127, 216, 247, 0.28); border-radius: 999px; background: rgba(127, 216, 247, 0.08); color: #bfeaff; font-size: 0.68rem; font-weight: 640; animation: carlosReveal 0.5s ease both; }
@keyframes carlosReveal { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* ---------------- Workspace grid ---------------- */
.admin-intelligence-body .admin-main .carlos-workspace-grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.admin-intelligence-body .cwg-main, .admin-intelligence-body .cwg-context { display: grid; gap: 12px; align-content: start; }

/* ---------------- Priority stack (Priority Glass) ---------------- */
.admin-intelligence-body .admin-main .carlos-priority-stack { padding: clamp(14px, 1.8vw, 20px); border-radius: 16px; border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); background: linear-gradient(158deg, rgba(11, 25, 47, 0.55), rgba(6, 13, 26, 0.8)); }
.admin-intelligence-body .cps-head h3 { font-size: 1rem; font-weight: 680; margin-top: 2px; }
.admin-intelligence-body .cps-list { display: grid; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }
.admin-intelligence-body .cps-item { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding: 11px 13px; border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-left: 3px solid rgba(150, 176, 208, 0.4); border-radius: 12px; background: rgba(255,255,255,0.02); animation: carlosReveal 0.45s ease both; }
.admin-intelligence-body .cps-item.tone-risk { border-left-color: rgba(255, 118, 132, 0.75); }
.admin-intelligence-body .cps-item.tone-amber { border-left-color: rgba(231, 199, 106, 0.75); }
.admin-intelligence-body .cps-item.tone-cyan { border-left-color: rgba(121, 223, 246, 0.7); }
.admin-intelligence-body .cps-rank { padding: 3px 9px; border-radius: 999px; font-size: 0.62rem; font-weight: 800; letter-spacing: 0.04em; border: 1px solid rgba(160,186,216,0.24); color: rgba(206,219,237,0.85); background: rgba(255,255,255,0.03); white-space: nowrap; }
.admin-intelligence-body .cps-item.tone-risk .cps-rank { color: #ff9ba6; border-color: rgba(255,118,132,0.4); background: rgba(255,118,132,0.08); }
.admin-intelligence-body .cps-item.tone-amber .cps-rank { color: #f0d089; border-color: rgba(231,199,106,0.4); background: rgba(231,199,106,0.08); }
.admin-intelligence-body .cps-item.tone-cyan .cps-rank { color: #8fe3ff; border-color: rgba(127,216,247,0.4); background: rgba(127,216,247,0.08); }
.admin-intelligence-body .cps-body { display: grid; gap: 1px; min-width: 0; }
.admin-intelligence-body .cps-body strong { color: #eaf2fd; font-size: 0.88rem; font-weight: 660; }
.admin-intelligence-body .cps-count { color: rgba(178, 198, 222, 0.7); font-size: 0.72rem; font-variant-numeric: tabular-nums; }
.admin-intelligence-body .cps-why { color: rgba(198, 214, 236, 0.68); font-size: 0.78rem; }
.admin-intelligence-body .cps-route { white-space: nowrap; }
.admin-intelligence-body .cps-empty, .admin-intelligence-body .cch-empty { display: grid; gap: 6px; justify-items: start; padding: 20px; }
.admin-intelligence-body .cps-empty strong, .admin-intelligence-body .cch-empty strong { color: #eaf2fd; font-size: 1rem; }
.admin-intelligence-body .cps-empty p, .admin-intelligence-body .cch-empty p { color: rgba(190, 206, 228, 0.7); font-size: 0.84rem; }

/* ---------------- Command launcher ---------------- */
.admin-intelligence-body .admin-main .carlos-commands { padding: 14px 16px; border-radius: 16px; border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); background: linear-gradient(158deg, rgba(12, 28, 52, 0.5), rgba(6, 14, 28, 0.76)); }
.admin-intelligence-body .cc-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 6px; margin-top: 10px; }
.admin-intelligence-body .cc-cmd { display: inline-flex; align-items: center; min-height: 40px; padding: 8px 12px; border: 1px solid rgba(132, 204, 255, 0.14); border-radius: 10px; background: rgba(255,255,255,0.022); color: rgba(220, 232, 248, 0.86); font-size: 0.8rem; font-weight: 600; text-decoration: none; transition: border-color 150ms ease, background 150ms ease, color 150ms ease; }
.admin-intelligence-body .cc-cmd:hover { border-color: rgba(137, 232, 255, 0.34); background: rgba(103, 232, 249, 0.07); color: #f4fbff; }

/* ---------------- Client health (Client Preview Glass) ---------------- */
.admin-intelligence-body .admin-main .carlos-client-health, .admin-intelligence-body .admin-main .carlos-portal-preview {
  padding: 14px 16px; border-radius: 16px; border: 1px solid rgba(139, 129, 246, 0.2); border-left: 3px solid rgba(139, 129, 246, 0.55);
  background: linear-gradient(158deg, rgba(18, 20, 44, 0.6), rgba(8, 12, 26, 0.82));
}
.admin-intelligence-body .cch-head h3, .admin-intelligence-body .cpp-head { margin-top: 2px; }
.admin-intelligence-body .cch-head h3 { font-size: 0.98rem; font-weight: 680; }
.admin-intelligence-body .cch-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin: 10px 0; }
.admin-intelligence-body .cch-grid > div { display: grid; gap: 3px; padding: 8px 10px; border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-radius: 10px; background: rgba(255,255,255,0.02); }
.admin-intelligence-body .cch-grid dt { color: rgba(150, 176, 208, 0.72); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.admin-intelligence-body .cch-grid dd { margin: 0; }
.admin-intelligence-body .cch-next { display: grid; gap: 2px; padding: 9px 11px; border-radius: 10px; background: rgba(127, 216, 247, 0.06); color: #e7f0fb; font-size: 0.82rem; }
.admin-intelligence-body .cch-next span { color: rgba(150, 176, 208, 0.72); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }

/* ---------------- Portal preview ---------------- */
.admin-intelligence-body .cpp-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.admin-intelligence-body .cpp-badge, .admin-intelligence-body .ci-preview-tag { padding: 3px 9px; border-radius: 999px; border: 1px dashed rgba(139, 129, 246, 0.5); background: rgba(139, 129, 246, 0.1); color: #cdc6fb; font-size: 0.6rem; font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; white-space: nowrap; }
.admin-intelligence-body .cpp-line { color: rgba(198, 214, 236, 0.78); font-size: 0.84rem; margin: 8px 0; }
.admin-intelligence-body .cpp-body { display: grid; gap: 5px; margin-bottom: 10px; }
.admin-intelligence-body .cpp-row { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 6px 10px; border-radius: 9px; background: rgba(255,255,255,0.02); }
.admin-intelligence-body .cpp-row span { color: rgba(150, 176, 208, 0.72); font-size: 0.66rem; }
.admin-intelligence-body .cpp-row strong { color: #e7f0fb; font-size: 0.8rem; font-weight: 620; }
.admin-intelligence-body .cpp-services { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; margin: 0; padding: 0; list-style: none; }
.admin-intelligence-body .cpp-services li { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 6px 9px; border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-radius: 9px; font-size: 0.76rem; color: #dce8f8; }
.admin-intelligence-body .cpp-services li span { font-size: 0.6rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; }
.admin-intelligence-body .cpp-services li.is-on span { color: #7fe0b0; }
.admin-intelligence-body .cpp-services li.is-locked { opacity: 0.62; }
.admin-intelligence-body .cpp-services li.is-locked span { color: rgba(190, 206, 228, 0.7); }

/* ---------------- Impact preview (Impact Glass) ---------------- */
.admin-intelligence-body .admin-main .carlos-impact { padding: 14px 16px; border-radius: 16px; border: 1px solid rgba(108, 168, 247, 0.2); border-left: 3px solid rgba(108, 168, 247, 0.55); background: linear-gradient(158deg, rgba(12, 24, 50, 0.6), rgba(6, 13, 26, 0.82)); display: grid; gap: 10px; }
.admin-intelligence-body .carlos-impact.locked { border-left-color: rgba(150, 176, 208, 0.4); }
.admin-intelligence-body .ci-lockcopy { display: grid; gap: 4px; } .admin-intelligence-body .ci-lockcopy strong { color: #eaf2fd; font-size: 0.92rem; } .admin-intelligence-body .ci-lockcopy p { color: rgba(190, 206, 228, 0.72); font-size: 0.82rem; }
.admin-intelligence-body .ci-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.admin-intelligence-body .ci-compare { display: grid; grid-template-columns: 1fr auto 1fr; gap: 8px; align-items: stretch; }
.admin-intelligence-body .ci-col { display: grid; gap: 2px; padding: 9px 11px; border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-radius: 11px; background: rgba(255,255,255,0.02); min-width: 0; }
.admin-intelligence-body .ci-col .ci-side { color: rgba(150, 176, 208, 0.72); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.admin-intelligence-body .ci-col strong { color: #e7f0fb; font-size: 0.84rem; font-weight: 660; }
.admin-intelligence-body .ci-col p { color: rgba(190, 206, 228, 0.68); font-size: 0.74rem; }
.admin-intelligence-body .ci-col.ci-proposed { border-color: rgba(89, 211, 144, 0.34); background: rgba(89, 211, 144, 0.06); }
.admin-intelligence-body .ci-col.ci-proposed strong { color: #b9f2d4; }
.admin-intelligence-body .ci-arrow { align-self: center; width: 18px; height: 14px; background: no-repeat center / 16px 12px url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2379b0d6' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E"); }
.admin-intelligence-body .ci-req, .admin-intelligence-body .cpa-req { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 6px; margin: 2px 0 0; }
.admin-intelligence-body .ci-req > div, .admin-intelligence-body .cpa-req > div { display: grid; gap: 1px; padding: 7px 10px; border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-radius: 9px; background: rgba(255,255,255,0.02); }
.admin-intelligence-body .ci-req dt, .admin-intelligence-body .cpa-req dt { color: rgba(150, 176, 208, 0.72); font-size: 0.54rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.admin-intelligence-body .ci-req dd, .admin-intelligence-body .cpa-req dd { margin: 0; color: #e7f0fb; font-size: 0.78rem; font-weight: 600; }

/* ---------------- Protected action (Protected Glass) ---------------- */
.admin-intelligence-body .admin-main .carlos-protected { padding: 14px 16px; border-radius: 16px; border: 1px solid rgba(139, 129, 246, 0.24); border-left: 3px solid rgba(139, 129, 246, 0.65); background: linear-gradient(158deg, rgba(22, 18, 46, 0.62), rgba(8, 12, 26, 0.84)); display: grid; gap: 10px; }
.admin-intelligence-body .cpa-head { display: flex; align-items: center; gap: 10px; }
.admin-intelligence-body .cpa-lock { display: grid; place-items: center; width: 32px; height: 32px; flex: 0 0 auto; border-radius: 10px; background: rgba(139, 129, 246, 0.16); font-size: 0.9rem; }
.admin-intelligence-body .cpa-head strong { color: #f4f9ff; font-size: 0.92rem; font-weight: 700; }
.admin-intelligence-body .cpa-line { color: rgba(198, 214, 236, 0.76); font-size: 0.84rem; }
.admin-intelligence-body .cpa-denied { color: #f0d089; font-size: 0.8rem; font-weight: 600; }

/* ---------------- Action plan ---------------- */
.admin-intelligence-body .admin-main .carlos-action-plan { padding: 14px 16px; border-radius: 16px; border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); background: linear-gradient(158deg, rgba(11, 25, 47, 0.5), rgba(6, 13, 26, 0.76)); display: grid; gap: 8px; }
.admin-intelligence-body .cap-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.admin-intelligence-body .cap-goal { display: grid; gap: 2px; color: #e7f0fb; font-size: 0.86rem; font-weight: 620; }
.admin-intelligence-body .cap-goal span { color: rgba(150, 176, 208, 0.72); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; }
.admin-intelligence-body .cap-steps { display: grid; gap: 5px; margin: 4px 0; padding: 0; list-style: none; counter-reset: cap; }
.admin-intelligence-body .cap-steps li { display: flex; align-items: center; gap: 10px; padding: 8px 11px; border: 1px solid var(--ax-line, rgba(255,255,255,0.08)); border-radius: 10px; background: rgba(255,255,255,0.02); color: rgba(200, 216, 238, 0.78); font-size: 0.82rem; animation: carlosReveal 0.4s ease both; }
.admin-intelligence-body .cap-steps li span { display: grid; place-items: center; width: 20px; height: 20px; flex: 0 0 auto; border-radius: 50%; background: rgba(255,255,255,0.05); color: rgba(206,219,237,0.72); font-size: 0.66rem; font-weight: 800; }
.admin-intelligence-body .cap-steps li.is-done { color: #cfeede; } .admin-intelligence-body .cap-steps li.is-done span { background: var(--ax-green, #59d390); color: #04121f; }
.admin-intelligence-body .cap-steps li.is-active span { background: var(--ax-cyan, #7fd8f7); color: #04121f; }
.admin-intelligence-body .cap-steps li.is-blocked { color: #ffd7dc; } .admin-intelligence-body .cap-steps li.is-blocked span { background: var(--ax-amber, #e7c76a); color: #04121f; }
.admin-intelligence-body .cap-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* ---------------- Overview presence ---------------- */
.admin-intelligence-body .admin-main .overview-carlos-presence { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; padding: 14px 18px; border-radius: 16px; border: 1px solid rgba(121, 223, 246, 0.18); border-left: 3px solid rgba(121, 223, 246, 0.6); background: radial-gradient(120% 130% at 0% 0%, rgba(139, 129, 246, 0.1), transparent 46%), linear-gradient(158deg, rgba(13, 28, 51, 0.62), rgba(6, 14, 28, 0.84)); }
.admin-intelligence-body .ocp-mark { position: relative; display: grid; place-items: center; width: 38px; height: 38px; flex: 0 0 auto; border-radius: 12px; background: linear-gradient(145deg, rgba(121, 223, 246, 0.28), rgba(139, 129, 246, 0.12)); border: 1px solid rgba(127, 216, 247, 0.3); color: #f6fbff; font-weight: 800; }
.admin-intelligence-body .ocp-body { flex: 1 1 auto; min-width: 0; display: grid; gap: 1px; }
.admin-intelligence-body .ocp-body strong { color: #f2f8ff; font-size: 0.9rem; font-weight: 660; }
.admin-intelligence-body .ocp-body span { color: rgba(190, 206, 228, 0.72); font-size: 0.78rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-intelligence-body .overview-carlos-presence .compact-action { flex: 0 0 auto; min-height: 40px; }

/* ---------------- Focus / reduced motion ---------------- */
.admin-intelligence-body .admin-route-content[data-route-key="carlos"] :is(a, button):focus-visible,
.admin-intelligence-body .overview-carlos-presence a:focus-visible { outline: 2px solid rgba(137, 232, 255, 0.6); outline-offset: 2px; border-radius: 10px; }
@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .cb-pulse, .admin-intelligence-body .cb-chip, .admin-intelligence-body .cps-item, .admin-intelligence-body .cap-steps li { animation: none; }
}

/* ---------------- Breakpoints ---------------- */
@media (max-width: 1000px) {
  .admin-intelligence-body .admin-main .carlos-workspace-grid { grid-template-columns: 1fr; }
  .admin-intelligence-body .cb-focus { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .admin-intelligence-body .cch-grid, .admin-intelligence-body .cpp-services { grid-template-columns: 1fr; }
  .admin-intelligence-body .ci-compare { grid-template-columns: 1fr; }
  .admin-intelligence-body .ci-arrow { transform: rotate(90deg); justify-self: start; }
  .admin-intelligence-body .cps-item { grid-template-columns: auto 1fr; }
  .admin-intelligence-body .cps-route { grid-column: 1 / -1; justify-self: start; }
  .admin-intelligence-body .overview-carlos-presence { flex-wrap: wrap; }
}

/* ============================================================
   AUREX — Premium authentication environment + executive Overview.
   Presentation only. Three controlled depth levels:
   1 page base · 2 operational surface · 3 elevated focus.
   ============================================================ */

/* ---------------- Admin authentication environment ---------------- */
.admin-intelligence-body .admin-secure-gate { display: block; min-height: 100vh; padding: 0; background: none; }
.admin-intelligence-body .ax-auth {
  display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(0, 0.94fr);
  min-height: 100vh; background: linear-gradient(180deg, #050d1b 0%, #061426 54%, #04101f 100%);
}

/* Left: brand + restrained atmosphere */
.admin-intelligence-body .ax-auth-brand {
  position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between;
  padding: clamp(32px, 4vw, 64px);
  border-right: 1px solid rgba(122, 214, 255, 0.1);
}
.admin-intelligence-body .ax-auth-field {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(44rem 30rem at 18% 12%, rgba(46, 118, 220, 0.2), transparent 62%),
    radial-gradient(38rem 28rem at 78% 78%, rgba(103, 232, 249, 0.08), transparent 62%),
    linear-gradient(115deg, transparent 46%, rgba(127, 216, 247, 0.05) 50%, transparent 54%);
  animation: axAuthDrift 26s ease-in-out infinite alternate;
}
.admin-intelligence-body .ax-auth-brand::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0.5;
  background-image: linear-gradient(rgba(255, 255, 255, 0.028) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, 0.028) 1px, transparent 1px);
  background-size: 68px 68px;
  mask-image: radial-gradient(60% 60% at 30% 40%, #000 20%, transparent 78%);
  -webkit-mask-image: radial-gradient(60% 60% at 30% 40%, #000 20%, transparent 78%);
}
@keyframes axAuthDrift { from { transform: translate3d(-1%, -1%, 0); } to { transform: translate3d(1.4%, 1%, 0); } }
.admin-intelligence-body .ax-auth-brandinner { position: relative; max-width: 34rem; }
.admin-intelligence-body .ax-auth-mark {
  display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: 30px;
  border-radius: 13px; border: 1px solid rgba(130, 211, 255, 0.26);
  background: linear-gradient(145deg, rgba(60, 140, 250, 0.28), rgba(255, 255, 255, 0.04));
  box-shadow: 0 16px 44px rgba(28, 110, 230, 0.24), inset 0 1px 0 rgba(255, 255, 255, 0.16);
  color: #f7fbff; font-weight: 760; letter-spacing: 0.04em; font-size: 0.92rem;
}
.admin-intelligence-body .ax-auth-kicker { color: rgba(160, 196, 240, 0.72); font-size: 0.68rem; font-weight: 700; letter-spacing: 0.34em; text-transform: uppercase; }
.admin-intelligence-body .ax-auth-statement {
  margin: 12px 0 10px; color: #f4f9ff; font-weight: 640; letter-spacing: -0.028em; line-height: 1.08;
  font-size: clamp(2rem, 3.4vw, 3.05rem);
}
.admin-intelligence-body .ax-auth-sub { color: rgba(186, 208, 236, 0.72); font-size: 1.02rem; letter-spacing: -0.006em; }
.admin-intelligence-body .ax-auth-caps { display: grid; gap: 9px; margin: 30px 0 0; padding: 0; list-style: none; }
.admin-intelligence-body .ax-auth-caps li {
  display: flex; align-items: center; gap: 11px;
  color: rgba(198, 216, 240, 0.74); font-size: 0.88rem; letter-spacing: -0.004em;
}
.admin-intelligence-body .ax-auth-caps li::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%; flex: 0 0 auto;
  background: rgba(103, 232, 249, 0.85); box-shadow: 0 0 10px rgba(103, 232, 249, 0.5);
}
.admin-intelligence-body .ax-auth-foot { position: relative; color: rgba(150, 176, 208, 0.5); font-size: 0.74rem; max-width: 30rem; }

/* Right: authentication panel (depth level 3) */
.admin-intelligence-body .ax-auth-panel {
  display: flex; flex-direction: column; justify-content: center; gap: 18px;
  padding: clamp(28px, 3.4vw, 56px) clamp(24px, 3.6vw, 64px);
  background: linear-gradient(180deg, rgba(9, 20, 38, 0.72), rgba(5, 12, 24, 0.9));
  box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.05);
}
.admin-intelligence-body .ax-auth-panelhead { max-width: 26rem; }
.admin-intelligence-body .ax-auth-eyebrow { color: #6fa9ea; font-size: 0.62rem; font-weight: 800; letter-spacing: 0.2em; text-transform: uppercase; }
.admin-intelligence-body .ax-auth-panelhead h2 { margin: 8px 0 6px; color: #f4f9ff; font-size: clamp(1.5rem, 2.2vw, 1.9rem); font-weight: 680; letter-spacing: -0.022em; }
.admin-intelligence-body .ax-auth-lead { color: rgba(186, 206, 232, 0.68); font-size: 0.88rem; line-height: 1.5; }
.admin-intelligence-body .ax-auth-form { display: grid; gap: 14px; max-width: 26rem; margin: 0; }
.admin-intelligence-body .ax-field { display: grid; gap: 7px; }
.admin-intelligence-body .ax-field-label { color: rgba(196, 216, 242, 0.8); font-size: 0.76rem; font-weight: 620; letter-spacing: 0.01em; }
.admin-intelligence-body .ax-field input {
  width: 100%; min-height: 50px; padding: 0 14px;
  border: 1px solid rgba(122, 168, 224, 0.2); border-radius: 12px;
  background: rgba(4, 11, 24, 0.62); color: #f4f9ff; font: inherit; font-size: 0.92rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  transition: border-color 160ms ease, box-shadow 160ms ease, background 160ms ease;
}
.admin-intelligence-body .ax-field input::placeholder { color: rgba(150, 176, 208, 0.42); }
.admin-intelligence-body .ax-field input:hover { border-color: rgba(122, 168, 224, 0.34); }
.admin-intelligence-body .ax-field input:focus {
  outline: none; border-color: rgba(96, 170, 255, 0.6);
  box-shadow: 0 0 0 3px rgba(52, 130, 246, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  background: rgba(5, 14, 30, 0.8);
}
/* autofill / password-manager compatibility */
.admin-intelligence-body .ax-field input:-webkit-autofill,
.admin-intelligence-body .ax-field input:-webkit-autofill:focus {
  -webkit-text-fill-color: #f4f9ff;
  -webkit-box-shadow: 0 0 0 1000px rgba(6, 16, 32, 0.98) inset;
  caret-color: #f4f9ff;
  transition: background-color 9999s ease-out 0s;
}
.admin-intelligence-body .ax-field-wrap { position: relative; display: block; }
.admin-intelligence-body .ax-field-wrap input { padding-right: 74px; }
.admin-intelligence-body .ax-reveal {
  position: absolute; top: 50%; right: 7px; transform: translateY(-50%);
  min-height: 36px; padding: 0 11px; border-radius: 9px;
  border: 1px solid rgba(122, 168, 224, 0.18); background: rgba(255, 255, 255, 0.04);
  color: rgba(206, 226, 250, 0.84); font-size: 0.74rem; font-weight: 620; cursor: pointer;
  transition: border-color 150ms ease, background 150ms ease, color 150ms ease;
}
.admin-intelligence-body .ax-reveal:hover { border-color: rgba(96, 170, 255, 0.4); background: rgba(52, 130, 246, 0.12); color: #f4f9ff; }
.admin-intelligence-body .ax-auth-submit {
  min-height: 50px; margin-top: 2px; border-radius: 12px; font-weight: 660; letter-spacing: 0.004em;
  transition: transform 90ms ease, filter 160ms ease, box-shadow 160ms ease;
}
.admin-intelligence-body .ax-auth-submit:hover { filter: brightness(1.06); box-shadow: 0 14px 40px rgba(38, 118, 240, 0.3); }
.admin-intelligence-body .ax-auth-submit:active { transform: translateY(1px); }
.admin-intelligence-body .ax-auth-submit[aria-busy="true"] { opacity: 0.76; pointer-events: none; }
.admin-intelligence-body .ax-auth-status {
  max-width: 26rem; margin: 0; padding: 10px 13px; border-radius: 11px;
  border: 1px solid rgba(122, 168, 224, 0.14); background: rgba(255, 255, 255, 0.022);
  color: rgba(178, 202, 232, 0.76); font-size: 0.82rem; flex-direction: column; align-items: flex-start; gap: 3px;
}
.admin-intelligence-body .ax-auth-status.is-invalid { border-color: rgba(255, 118, 132, 0.34); background: rgba(255, 118, 132, 0.07); }
.admin-intelligence-body .ax-auth-status.is-invalid span { color: #ffb4bd; }
.admin-intelligence-body .ax-auth-reassure { max-width: 26rem; color: rgba(150, 176, 208, 0.54); font-size: 0.74rem; line-height: 1.45; }
.admin-intelligence-body .ax-auth-panel .security-stepper { max-width: 26rem; }

@media (prefers-reduced-motion: reduce) { .admin-intelligence-body .ax-auth-field { animation: none; } }

/* ---------------- Overview: executive header ---------------- */
.admin-intelligence-body .admin-main .ov-exec {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  padding: 0 2px 16px; margin-bottom: 16px; border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}
.admin-intelligence-body .ove-eyebrow { color: #6fa9ea; font-size: 0.6rem; font-weight: 800; letter-spacing: 0.2em; text-transform: uppercase; }
.admin-intelligence-body .ove-title { margin: 5px 0 0; color: #f4f9ff; font-size: clamp(1.3rem, 2vw, 1.6rem); font-weight: 660; letter-spacing: -0.022em; }
.admin-intelligence-body .ove-context { display: flex; gap: 26px; flex-wrap: wrap; margin: 0; }
.admin-intelligence-body .ove-context > div { display: grid; gap: 3px; }
.admin-intelligence-body .ove-context dt { color: rgba(150, 176, 208, 0.6); font-size: 0.58rem; font-weight: 700; letter-spacing: 0.11em; text-transform: uppercase; }
.admin-intelligence-body .ove-context dd { margin: 0; color: #e7f0fb; font-size: 0.84rem; font-weight: 600; font-variant-numeric: tabular-nums; }

/* ---------------- Overview: Carlos command brief ---------------- */
.admin-intelligence-body .admin-main .ov-brief {
  display: flex; align-items: center; gap: 18px; margin-bottom: 16px;
  padding: 18px 20px; border-radius: 16px;
  border: 1px solid rgba(122, 214, 255, 0.14); border-left: 2px solid rgba(96, 170, 255, 0.7);
  background: radial-gradient(120% 150% at 0% 0%, rgba(52, 130, 246, 0.12), transparent 52%), linear-gradient(160deg, rgba(11, 24, 44, 0.7), rgba(6, 14, 28, 0.86));
  box-shadow: 0 22px 60px rgba(2, 8, 20, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
.admin-intelligence-body .ovb-mark { position: relative; display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 auto; border-radius: 12px; border: 1px solid rgba(127, 216, 247, 0.28); background: linear-gradient(145deg, rgba(96, 170, 255, 0.26), rgba(139, 129, 246, 0.1)); color: #f6fbff; font-weight: 800; }
.admin-intelligence-body .ovb-main { flex: 1 1 auto; min-width: 0; display: grid; gap: 3px; }
.admin-intelligence-body .ovb-head { display: flex; align-items: center; gap: 10px; }
.admin-intelligence-body .ovb-lead { color: #f2f8ff; font-size: 0.98rem; font-weight: 640; letter-spacing: -0.008em; }
.admin-intelligence-body .ovb-why { color: rgba(186, 206, 232, 0.7); font-size: 0.82rem; }
.admin-intelligence-body .ovb-meta { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 3px; color: rgba(150, 176, 208, 0.58); font-size: 0.72rem; }
.admin-intelligence-body .ovb-actions { display: flex; gap: 8px; flex: 0 0 auto; flex-wrap: wrap; }
.admin-intelligence-body .ovb-actions .compact-action { min-height: 40px; }

/* ---------------- Overview: operating health band ---------------- */
.admin-intelligence-body .admin-main .ov-health {
  display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1.05fr);
  gap: 18px; align-items: stretch; margin-bottom: 16px;
  padding: 20px; border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: linear-gradient(160deg, rgba(10, 22, 42, 0.6), rgba(6, 13, 26, 0.78));
}
.admin-intelligence-body .ovh-label { display: block; color: rgba(150, 176, 208, 0.62); font-size: 0.58rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.admin-intelligence-body .ovh-lead { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.admin-intelligence-body .ovh-primary { display: grid; gap: 4px; align-content: start; }
.admin-intelligence-body .ovh-primary .metric-number { font-size: clamp(1.7rem, 2.6vw, 2.3rem); font-weight: 700; letter-spacing: -0.026em; color: #f5faff; font-variant-numeric: tabular-nums; line-height: 1.05; }
.admin-intelligence-body .ovh-primary small { color: rgba(150, 176, 208, 0.55); font-size: 0.7rem; line-height: 1.35; }
.admin-intelligence-body .ovh-attention { display: grid; gap: 10px; align-content: start; padding-left: 18px; border-left: 1px solid rgba(255, 255, 255, 0.06); }
.admin-intelligence-body .ovh-alert { display: grid; gap: 2px; padding: 9px 12px; border-radius: 10px; border-left: 2px solid rgba(150, 176, 208, 0.4); background: rgba(255, 255, 255, 0.022); }
.admin-intelligence-body .ovh-alert strong { color: #eef6ff; font-size: 1.05rem; font-weight: 680; font-variant-numeric: tabular-nums; }
.admin-intelligence-body .ovh-alert small { color: rgba(150, 176, 208, 0.55); font-size: 0.66rem; text-transform: uppercase; letter-spacing: 0.08em; }
.admin-intelligence-body .ovh-alert.tone-danger { border-left-color: rgba(255, 118, 132, 0.8); } .admin-intelligence-body .ovh-alert.tone-danger strong { color: #ff9ba6; }
.admin-intelligence-body .ovh-alert.tone-warning { border-left-color: rgba(231, 199, 106, 0.8); } .admin-intelligence-body .ovh-alert.tone-warning strong { color: #f0d089; }
.admin-intelligence-body .ovh-alert.tone-positive { border-left-color: rgba(89, 211, 144, 0.7); }
.admin-intelligence-body .ovh-context { display: grid; gap: 0; align-content: start; margin: 0; padding-left: 18px; border-left: 1px solid rgba(255, 255, 255, 0.06); }
.admin-intelligence-body .ovh-context > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 7px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.04); }
.admin-intelligence-body .ovh-context > div:last-child { border-bottom: 0; }
.admin-intelligence-body .ovh-context dt { color: rgba(150, 176, 208, 0.62); font-size: 0.74rem; }
.admin-intelligence-body .ovh-context dd { margin: 0; color: #e7f0fb; font-size: 0.82rem; font-weight: 620; font-variant-numeric: tabular-nums; }

/* ---------------- Overview: priority workspace ---------------- */
.admin-intelligence-body .admin-main .ov-priorities { margin-bottom: 16px; padding: 18px 20px; border-radius: 16px; border: 1px solid rgba(255, 255, 255, 0.06); background: linear-gradient(160deg, rgba(10, 22, 42, 0.55), rgba(6, 13, 26, 0.74)); }
.admin-intelligence-body .ovp-head h3 { margin: 3px 0 0; font-size: 1rem; font-weight: 660; letter-spacing: -0.012em; }
.admin-intelligence-body .ovp-group { margin-top: 14px; }
.admin-intelligence-body .ovp-grouplabel { color: rgba(150, 176, 208, 0.62); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 6px; }
.admin-intelligence-body .ovp-grouplabel.tone-critical { color: #ff9ba6; }
.admin-intelligence-body .ovp-grouplabel.tone-high { color: #f0d089; }
.admin-intelligence-body .ovp-grouplabel.tone-medium { color: #8fbdf6; }
.admin-intelligence-body .ovp-list { display: grid; gap: 1px; margin: 0; padding: 0; list-style: none; border-radius: 10px; overflow: hidden; }
.admin-intelligence-body .ovp-item {
  display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 16px;
  padding: 12px 14px; background: rgba(255, 255, 255, 0.022);
  border-left: 2px solid rgba(150, 176, 208, 0.3);
  transition: background 150ms ease;
}
.admin-intelligence-body .ovp-item:hover { background: rgba(255, 255, 255, 0.04); }
.admin-intelligence-body .ovp-item.tone-critical { border-left-color: rgba(255, 118, 132, 0.75); }
.admin-intelligence-body .ovp-item.tone-high { border-left-color: rgba(231, 199, 106, 0.75); }
.admin-intelligence-body .ovp-item.tone-medium { border-left-color: rgba(108, 168, 247, 0.7); }
.admin-intelligence-body .ovp-body { display: grid; gap: 1px; min-width: 0; }
.admin-intelligence-body .ovp-body strong { color: #eaf2fd; font-size: 0.86rem; font-weight: 640; }
.admin-intelligence-body .ovp-reason { color: rgba(178, 198, 222, 0.62); font-size: 0.76rem; }
.admin-intelligence-body .ovp-count { color: #f5faff; font-size: 1.05rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.admin-intelligence-body .ovp-empty { display: grid; gap: 5px; padding: 22px 2px 6px; }
.admin-intelligence-body .ovp-empty strong { color: #eaf2fd; font-size: 0.94rem; }
.admin-intelligence-body .ovp-empty p { color: rgba(190, 206, 228, 0.62); font-size: 0.82rem; }

/* ---------------- Overview: secondary detail ---------------- */
.admin-intelligence-body .admin-main .overview-secondary { margin-top: 18px; border-top: 1px solid rgba(255, 255, 255, 0.07); }
.admin-intelligence-body .overview-secondary > summary {
  display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; cursor: pointer; list-style: none;
  padding: 16px 2px; color: #cfe0f5;
}
.admin-intelligence-body .overview-secondary > summary::-webkit-details-marker { display: none; }
.admin-intelligence-body .overview-secondary > summary span { font-size: 0.88rem; font-weight: 660; }
.admin-intelligence-body .overview-secondary > summary small { color: rgba(150, 176, 208, 0.55); font-size: 0.74rem; }
.admin-intelligence-body .overview-secondary > summary::after {
  content: ""; margin-left: auto; width: 8px; height: 8px; flex: 0 0 auto;
  border-right: 2px solid rgba(160, 186, 216, 0.6); border-bottom: 2px solid rgba(160, 186, 216, 0.6);
  transform: rotate(45deg); transition: transform 180ms ease;
}
.admin-intelligence-body .overview-secondary[open] > summary::after { transform: rotate(-135deg); }
.admin-intelligence-body .ovs-body { display: grid; gap: 14px; padding-top: 4px; }

/* ---------------- Focus / motion ---------------- */
.admin-intelligence-body .ax-auth :is(a, button, input):focus-visible,
.admin-intelligence-body .admin-main :is(.ovp-item a, .ovb-actions a, .overview-secondary > summary):focus-visible {
  outline: 2px solid rgba(96, 170, 255, 0.62); outline-offset: 2px; border-radius: 10px;
}
@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .ovp-item, .admin-intelligence-body .ax-field input, .admin-intelligence-body .ax-auth-submit { transition: none; }
}

/* ---------------- Responsive ---------------- */
@media (max-width: 1180px) {
  .admin-intelligence-body .admin-main .ov-health { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .admin-intelligence-body .ovh-context { grid-column: 1 / -1; padding-left: 0; border-left: 0; border-top: 1px solid rgba(255,255,255,0.06); padding-top: 10px; }
}
@media (max-width: 980px) {
  .admin-intelligence-body .ax-auth { grid-template-columns: 1fr; min-height: 0; }
  .admin-intelligence-body .ax-auth-brand { order: 2; border-right: 0; border-top: 1px solid rgba(122, 214, 255, 0.1); padding: 28px clamp(20px, 5vw, 32px) 34px; }
  .admin-intelligence-body .ax-auth-brand::after { display: none; }
  .admin-intelligence-body .ax-auth-statement { font-size: clamp(1.5rem, 6vw, 2rem); }
  .admin-intelligence-body .ax-auth-caps { grid-template-columns: 1fr 1fr; display: grid; }
  .admin-intelligence-body .ax-auth-panel { order: 1; justify-content: flex-start; padding: clamp(28px, 7vw, 40px) clamp(20px, 5vw, 32px) 26px; padding-top: max(28px, env(safe-area-inset-top)); }
  .admin-intelligence-body .ax-auth-panel .security-stepper { display: none; }
}
@media (max-width: 900px) {
  .admin-intelligence-body .admin-main .ov-health { grid-template-columns: 1fr; }
  .admin-intelligence-body .ovh-attention { padding-left: 0; border-left: 0; border-top: 1px solid rgba(255,255,255,0.06); padding-top: 12px; }
  .admin-intelligence-body .ov-brief { flex-wrap: wrap; }
  .admin-intelligence-body .ovb-actions { width: 100%; }
}
@media (max-width: 640px) {
  .admin-intelligence-body .ovh-lead { grid-template-columns: 1fr; gap: 14px; }
  .admin-intelligence-body .ovp-item { grid-template-columns: 1fr auto; }
  .admin-intelligence-body .ovp-item a { grid-column: 1 / -1; justify-self: start; }
  .admin-intelligence-body .ove-context { gap: 16px; }
  .admin-intelligence-body .ax-auth-caps { grid-template-columns: 1fr; }
}

/* ============================================================
   AUREX ADMIN — shared foundations: skeletons, table language,
   status system, navigation groups. Presentation only.
   ============================================================ */

/* ---------------- Screen-reader utility ---------------- */
.admin-intelligence-body .sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ---------------- Skeleton system (§27) ---------------- */
.admin-intelligence-body .admin-skeleton { display: grid; gap: 10px; width: 100%; }
.admin-intelligence-body .admin-skeleton .sk-row { display: flex; align-items: center; gap: 12px; }
.admin-intelligence-body .admin-skeleton .sk-col { display: grid; gap: 7px; min-width: 0; flex: 1 1 auto; }
.admin-intelligence-body .admin-skeleton .sk-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 18px; }
.admin-intelligence-body .admin-skeleton .sk-line { padding: 11px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.04); justify-content: space-between; }
.admin-intelligence-body .admin-skeleton .sk-head { border-bottom-color: rgba(255, 255, 255, 0.08); }
.admin-intelligence-body .admin-skeleton .sk-bar,
.admin-intelligence-body .admin-skeleton .sk-dot,
.admin-intelligence-body .admin-skeleton .sk-pill {
  display: block; border-radius: 6px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.045) 25%, rgba(255, 255, 255, 0.09) 37%, rgba(255, 255, 255, 0.045) 63%);
  background-size: 400% 100%;
  animation: axSkeleton 1.5s ease-in-out infinite;
}
.admin-intelligence-body .admin-skeleton .sk-bar { width: var(--sk-w, 60%); height: var(--sk-h, 12px); }
.admin-intelligence-body .admin-skeleton .sk-dot { width: 40px; height: 40px; border-radius: 12px; flex: 0 0 auto; }
.admin-intelligence-body .admin-skeleton .sk-pill { width: 96px; height: 22px; border-radius: 999px; flex: 0 0 auto; }
@keyframes axSkeleton { from { background-position: 100% 50%; } to { background-position: 0 50%; } }
@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .admin-skeleton .sk-bar,
  .admin-intelligence-body .admin-skeleton .sk-dot,
  .admin-intelligence-body .admin-skeleton .sk-pill { animation: none; background: rgba(255, 255, 255, 0.06); }
}
/* Skeleton hosts keep the final surface geometry */
.admin-intelligence-body .admin-main .ov-brief-loading { display: block; padding: 18px 20px; }

/* ---------------- Table language (§22) ---------------- */
.admin-intelligence-body .admin-main .admin-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.admin-intelligence-body .admin-main .admin-table { width: 100%; border-collapse: collapse; }
.admin-intelligence-body .admin-main .admin-table thead th {
  position: sticky; top: 0; z-index: 2;
  padding: 10px 14px; text-align: left; white-space: nowrap;
  background: linear-gradient(180deg, rgba(10, 22, 42, 0.98), rgba(8, 18, 34, 0.94));
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
  color: rgba(160, 186, 216, 0.72); font-size: 0.62rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
}
.admin-intelligence-body .admin-main .admin-table tbody td {
  padding: 11px 14px; vertical-align: middle;
  border-bottom: 1px solid rgba(255, 255, 255, 0.045);
  color: rgba(214, 228, 246, 0.88); font-size: 0.82rem;
}
/* numeric alignment: tabular figures on numeric-looking cells */
.admin-intelligence-body .admin-main .admin-table td { font-variant-numeric: tabular-nums; }
.admin-intelligence-body .admin-main .admin-table tbody tr:last-child td { border-bottom: 0; }
.admin-intelligence-body .admin-main .admin-table tbody tr.is-selected { background: rgba(52, 130, 246, 0.1); box-shadow: inset 2px 0 0 rgba(96, 170, 255, 0.9); }
.admin-intelligence-body .admin-main .admin-table td.empty-state { padding: 26px 14px; color: rgba(178, 198, 222, 0.62); text-align: center; }

/* ---------------- Status system (§26) — text-first, never colour-only ---------------- */
.admin-intelligence-body .admin-main .status-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 9px; border-radius: 6px; white-space: nowrap;
  border: 1px solid rgba(160, 186, 216, 0.2); background: rgba(255, 255, 255, 0.03);
  color: rgba(214, 228, 246, 0.86); font-size: 0.7rem; font-weight: 640; letter-spacing: 0.01em;
}
.admin-intelligence-body .admin-main .status-badge::before {
  content: ""; width: 5px; height: 5px; border-radius: 50%; flex: 0 0 auto;
  background: currentColor; opacity: 0.85;
}
.admin-intelligence-body .admin-main .status-badge.positive { color: #7fe0b0; border-color: rgba(89, 211, 144, 0.32); background: rgba(89, 211, 144, 0.08); }
.admin-intelligence-body .admin-main .status-badge.warning { color: #f0d089; border-color: rgba(231, 199, 106, 0.32); background: rgba(231, 199, 106, 0.08); }
.admin-intelligence-body .admin-main .status-badge.danger { color: #ff9ba6; border-color: rgba(255, 118, 132, 0.32); background: rgba(255, 118, 132, 0.08); }
.admin-intelligence-body .admin-main .status-badge.neutral { color: rgba(198, 216, 240, 0.78); }

/* ---------------- Navigation groups (§3) ---------------- */
.admin-intelligence-body .admin-sidebar .nav-list { display: grid; gap: 2px; }
.admin-intelligence-body .admin-sidebar .nav-group > span {
  display: block; padding: 14px 12px 6px;
  color: rgba(150, 176, 208, 0.5); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.16em; text-transform: uppercase;
}
.admin-intelligence-body .admin-sidebar .nav-item {
  display: flex; align-items: center; gap: 10px;
  min-height: 38px; padding: 7px 12px; border-radius: 8px;
  color: rgba(198, 216, 240, 0.72); font-size: 0.82rem; font-weight: 560; text-decoration: none;
  border-left: 2px solid transparent;
  transition: background 140ms ease, color 140ms ease, border-color 140ms ease;
}
.admin-intelligence-body .admin-sidebar .nav-item svg { width: 16px; height: 16px; flex: 0 0 auto; fill: currentColor; opacity: 0.72; }
.admin-intelligence-body .admin-sidebar .nav-item:hover { background: rgba(255, 255, 255, 0.035); color: #eaf2fd; }
.admin-intelligence-body .admin-sidebar .nav-item.is-active {
  background: linear-gradient(90deg, rgba(52, 130, 246, 0.16), rgba(52, 130, 246, 0.03));
  border-left-color: rgba(96, 170, 255, 0.9);
  color: #f4f9ff; font-weight: 640;
}
.admin-intelligence-body .admin-sidebar .nav-item.is-active svg { opacity: 1; }
.admin-intelligence-body .admin-sidebar .nav-item:focus-visible { outline: 2px solid rgba(96, 170, 255, 0.6); outline-offset: -2px; }

/* ---------------- Filters / search normalisation (§23) ---------------- */
.admin-intelligence-body .admin-main .filter-bar {
  display: flex; align-items: flex-end; gap: 12px; flex-wrap: wrap;
  padding: 12px 14px; border-radius: 12px; margin-bottom: 12px;
  border: 1px solid rgba(255, 255, 255, 0.06); background: rgba(255, 255, 255, 0.018);
}
.admin-intelligence-body .admin-main .filter-bar label { display: grid; gap: 5px; color: rgba(160, 186, 216, 0.72); font-size: 0.66rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.admin-intelligence-body .admin-main .filter-bar select,
.admin-intelligence-body .admin-main .filter-bar input {
  min-height: 38px; padding: 0 11px; border-radius: 9px;
  border: 1px solid rgba(122, 168, 224, 0.2); background: rgba(4, 11, 24, 0.55);
  color: #eaf2fd; font: inherit; font-size: 0.82rem; text-transform: none; letter-spacing: normal;
}
.admin-intelligence-body .admin-main .filter-bar select:focus,
.admin-intelligence-body .admin-main .filter-bar input:focus {
  outline: none; border-color: rgba(96, 170, 255, 0.55); box-shadow: 0 0 0 3px rgba(52, 130, 246, 0.14);
}

/* ---------------- Responsive ---------------- */
@media (max-width: 760px) {
  .admin-intelligence-body .admin-main .filter-bar { flex-direction: column; align-items: stretch; }
  .admin-intelligence-body .admin-main .filter-bar select,
  .admin-intelligence-body .admin-main .filter-bar input { width: 100%; }
  .admin-intelligence-body .admin-main .admin-table thead th { position: static; }
}

/* ============================================================
   AUREX ADMIN — Client Operations: sectioned drawer + form system.
   Presentation only. Preserves existing form ids/names/handlers.
   ============================================================ */

/* ---------------- Sectioned client drawer (§4–§6) ---------------- */
.admin-intelligence-body .admin-edit-modal.client-drawer {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  max-height: 100vh;
  padding: 0;
  overflow: hidden;
}
.admin-intelligence-body .client-drawer-head {
  position: sticky; top: 0; z-index: 3;
  display: flex; align-items: flex-start; justify-content: space-between; gap: 16px;
  padding: 18px 22px 14px; margin: 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  background: linear-gradient(180deg, rgba(10, 22, 42, 0.98), rgba(8, 18, 34, 0.94));
}
.admin-intelligence-body .client-drawer-head h3 { margin: 4px 0 3px; font-size: 1.12rem; font-weight: 680; letter-spacing: -0.014em; color: #f4f9ff; }
.admin-intelligence-body .client-drawer-head .modal-helper { color: rgba(150, 176, 208, 0.6); font-size: 0.74rem; }
.admin-intelligence-body .client-drawer .modal-close-button {
  flex: 0 0 auto; min-height: 36px; padding: 0 12px; border-radius: 9px;
  border: 1px solid rgba(122, 168, 224, 0.2); background: rgba(255, 255, 255, 0.04);
  color: rgba(214, 228, 246, 0.86); font-size: 0.78rem; font-weight: 620; cursor: pointer;
}
.admin-intelligence-body .client-drawer .modal-close-button:hover { border-color: rgba(96, 170, 255, 0.42); background: rgba(52, 130, 246, 0.12); color: #f4f9ff; }
.admin-intelligence-body .client-drawer-body {
  overflow-y: auto; overscroll-behavior: contain;
  padding: 16px 22px 20px; display: grid; gap: 16px; align-content: start;
}

/* Read-only operational summary */
.admin-intelligence-body .cd-summary {
  padding: 13px 15px; border-radius: 12px;
  border: 1px solid rgba(122, 214, 255, 0.14); border-left: 2px solid rgba(96, 170, 255, 0.7);
  background: linear-gradient(160deg, rgba(11, 24, 44, 0.6), rgba(6, 14, 28, 0.76));
}
.admin-intelligence-body .cd-summary-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.admin-intelligence-body .cd-summary-label { color: rgba(150, 176, 208, 0.66); font-size: 0.56rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; }
.admin-intelligence-body .cd-summary-src { color: rgba(150, 176, 208, 0.5); font-size: 0.68rem; }
.admin-intelligence-body .cd-summary-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap: 9px; margin: 0; }
.admin-intelligence-body .cd-summary-grid > div { display: grid; gap: 4px; min-width: 0; }
.admin-intelligence-body .cd-summary-grid dt { color: rgba(150, 176, 208, 0.62); font-size: 0.56rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.admin-intelligence-body .cd-summary-grid dd { margin: 0; min-width: 0; }
.admin-intelligence-body .cd-summary-grid .status-badge { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }

/* Drawer sections */
.admin-intelligence-body .cd-section { display: grid; gap: 9px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, 0.06); }
.admin-intelligence-body .cd-section:first-of-type { border-top: 0; padding-top: 0; }
.admin-intelligence-body .cd-section-title { margin: 0; color: #cfe0f5; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.03em; }
.admin-intelligence-body .cd-section-note { color: rgba(150, 176, 208, 0.6); font-size: 0.74rem; line-height: 1.45; max-width: 62ch; }

/* ---------------- Form system (§18) ---------------- */
.admin-intelligence-body .client-drawer .edit-form-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px;
}
.admin-intelligence-body .client-drawer .edit-form-grid label {
  display: grid; gap: 6px; align-content: start; min-width: 0;
  color: rgba(196, 216, 242, 0.78); font-size: 0.74rem; font-weight: 620;
}
.admin-intelligence-body .client-drawer .edit-form-grid label small {
  color: rgba(150, 176, 208, 0.52); font-size: 0.68rem; font-weight: 500;
}
.admin-intelligence-body .client-drawer .edit-form-grid input,
.admin-intelligence-body .client-drawer .edit-form-grid select,
.admin-intelligence-body .client-drawer .edit-form-grid textarea {
  width: 100%; min-height: 42px; padding: 9px 12px;
  border: 1px solid rgba(122, 168, 224, 0.2); border-radius: 10px;
  background: rgba(4, 11, 24, 0.6); color: #f4f9ff;
  font: inherit; font-size: 0.85rem; font-weight: 500;
  transition: border-color 150ms ease, box-shadow 150ms ease, background 150ms ease;
}
.admin-intelligence-body .client-drawer .edit-form-grid textarea { min-height: 84px; resize: vertical; line-height: 1.5; }
.admin-intelligence-body .client-drawer .edit-form-grid input:hover:not(:disabled),
.admin-intelligence-body .client-drawer .edit-form-grid select:hover,
.admin-intelligence-body .client-drawer .edit-form-grid textarea:hover { border-color: rgba(122, 168, 224, 0.34); }
.admin-intelligence-body .client-drawer .edit-form-grid input:focus,
.admin-intelligence-body .client-drawer .edit-form-grid select:focus,
.admin-intelligence-body .client-drawer .edit-form-grid textarea:focus {
  outline: none; border-color: rgba(96, 170, 255, 0.6);
  box-shadow: 0 0 0 3px rgba(52, 130, 246, 0.16); background: rgba(5, 14, 30, 0.8);
}
/* read-only / disabled */
.admin-intelligence-body .client-drawer .edit-form-grid input:disabled {
  background: rgba(255, 255, 255, 0.028); color: rgba(190, 206, 228, 0.55);
  border-color: rgba(122, 168, 224, 0.12); cursor: not-allowed;
}
.admin-intelligence-body .client-drawer .edit-form-grid label.is-readonly small { color: rgba(150, 176, 208, 0.66); }
.admin-intelligence-body .client-drawer .edit-notes-field { grid-column: 1 / -1; }
/* autofill parity with the auth panel */
.admin-intelligence-body .client-drawer .edit-form-grid input:-webkit-autofill {
  -webkit-text-fill-color: #f4f9ff;
  -webkit-box-shadow: 0 0 0 1000px rgba(6, 16, 32, 0.98) inset;
  caret-color: #f4f9ff;
}

/* ---------------- Action footer (§19) ---------------- */
.admin-intelligence-body .client-drawer-foot {
  position: sticky; bottom: 0; z-index: 3;
  display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap;
  padding: 13px 22px; margin: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  background: linear-gradient(0deg, rgba(8, 18, 34, 0.98), rgba(10, 22, 42, 0.94));
}
.admin-intelligence-body .cd-foot-state { color: rgba(150, 176, 208, 0.6); font-size: 0.74rem; }
.admin-intelligence-body .cd-foot-actions { display: flex; gap: 9px; flex-wrap: wrap; }
.admin-intelligence-body .cd-foot-actions .primary-button,
.admin-intelligence-body .cd-foot-actions .secondary-button { min-height: 42px; }

/* ---------------- Focus / reduced motion ---------------- */
.admin-intelligence-body .client-drawer :is(input, select, textarea, button):focus-visible {
  outline: 2px solid rgba(96, 170, 255, 0.62); outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .client-drawer .edit-form-grid input,
  .admin-intelligence-body .client-drawer .edit-form-grid select,
  .admin-intelligence-body .client-drawer .edit-form-grid textarea { transition: none; }
}

/* ---------------- Mobile: full-screen drawer (§22) ---------------- */
@media (max-width: 760px) {
  .admin-intelligence-body .admin-edit-modal.client-drawer {
    width: 100vw; max-width: 100vw; height: 100vh; max-height: 100vh; border-radius: 0;
  }
  .admin-intelligence-body .client-drawer-head { padding: 16px; }
  .admin-intelligence-body .client-drawer-body { padding: 14px 16px 18px; }
  .admin-intelligence-body .client-drawer-foot { padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); }
  .admin-intelligence-body .cd-foot-actions { width: 100%; }
  .admin-intelligence-body .cd-foot-actions .primary-button,
  .admin-intelligence-body .cd-foot-actions .secondary-button { flex: 1 1 auto; justify-content: center; }
  .admin-intelligence-body .client-drawer .edit-form-grid { grid-template-columns: 1fr; }
}

/* ============================================================
   CARLOS ADMIN — Chief Operating Intelligence desk.
   Presentation only. Styles the verified server-rendered blocks
   (carlos-briefing / command launcher / reference / drafts).
   ============================================================ */
.admin-intelligence-body .carlos-desk { display: grid; gap: 14px; }

/* ---------------- Executive header (§2) ---------------- */
.admin-intelligence-body .carlos-exec {
  display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  padding: 0 2px 16px; border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}
.admin-intelligence-body .cx-id { display: flex; align-items: center; gap: 13px; }
.admin-intelligence-body .cx-mark {
  position: relative; display: grid; place-items: center; width: 42px; height: 42px; flex: 0 0 auto;
  border-radius: 13px; border: 1px solid rgba(127, 216, 247, 0.28);
  background: linear-gradient(145deg, rgba(96, 170, 255, 0.26), rgba(139, 129, 246, 0.1));
  color: #f6fbff; font-weight: 800; font-size: 0.95rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14);
}
.admin-intelligence-body .cx-name { margin: 0; color: #f4f9ff; font-size: 1.24rem; font-weight: 700; letter-spacing: -0.02em; }
.admin-intelligence-body .cx-role { color: rgba(150, 176, 208, 0.62); font-size: 0.72rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; }
.admin-intelligence-body .cx-meta { display: flex; gap: 26px; flex-wrap: wrap; margin: 0; }
.admin-intelligence-body .cx-meta > div { display: grid; gap: 4px; }
.admin-intelligence-body .cx-meta dt { color: rgba(150, 176, 208, 0.55); font-size: 0.55rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.admin-intelligence-body .cx-meta dd { margin: 0; color: #e7f0fb; font-size: 0.8rem; font-weight: 600; }

/* ---------------- Verified brief / response report blocks (§3, §5, §6) ---------------- */
.admin-intelligence-body .carlos-briefing {
  display: grid; gap: 12px; padding: clamp(18px, 2.2vw, 26px); border-radius: 18px;
  border: 1px solid rgba(122, 214, 255, 0.14); border-left: 2px solid rgba(96, 170, 255, 0.75);
  background:
    radial-gradient(120% 140% at 0% -10%, rgba(52, 130, 246, 0.13), transparent 48%),
    linear-gradient(158deg, rgba(12, 26, 48, 0.72), rgba(6, 14, 28, 0.9));
  box-shadow: 0 26px 70px rgba(2, 8, 20, 0.42), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
.admin-intelligence-body .carlos-briefing .cb-content { display: grid; gap: 7px; }
.admin-intelligence-body .carlos-briefing .cb-eyebrow { color: #6fa9ea; font-size: 0.58rem; font-weight: 800; letter-spacing: 0.2em; text-transform: uppercase; }
.admin-intelligence-body .carlos-briefing h2 {
  margin: 2px 0 0; color: #f4f9ff; font-weight: 660; letter-spacing: -0.024em; line-height: 1.2;
  font-size: clamp(1.3rem, 2.4vw, 1.85rem); max-width: 46ch;
}
.admin-intelligence-body .carlos-briefing .cb-content p { color: rgba(190, 210, 238, 0.74); font-size: 0.9rem; line-height: 1.55; max-width: 68ch; }

/* Findings / sources — report list, never chat */
.admin-intelligence-body .carlos-briefing .cb-sources,
.admin-intelligence-body .carlos-client-health .cb-sources {
  display: grid; gap: 6px; margin: 0; padding: 0; list-style: none;
}
.admin-intelligence-body .carlos-briefing .cb-sources li,
.admin-intelligence-body .carlos-client-health .cb-sources li {
  position: relative; padding: 7px 12px 7px 26px; border-radius: 9px;
  background: rgba(255, 255, 255, 0.022); border: 1px solid rgba(255, 255, 255, 0.05);
  color: rgba(206, 224, 246, 0.82); font-size: 0.82rem; line-height: 1.45;
}
.admin-intelligence-body .carlos-briefing .cb-sources li::before,
.admin-intelligence-body .carlos-client-health .cb-sources li::before {
  content: ""; position: absolute; left: 11px; top: 14px;
  width: 5px; height: 5px; border-radius: 50%; background: rgba(103, 232, 249, 0.7);
}

/* Recommendation block */
.admin-intelligence-body .carlos-briefing .cb-rec {
  display: grid; gap: 5px; padding: 13px 15px; border-radius: 12px;
  border: 1px solid rgba(89, 211, 144, 0.24); border-left: 2px solid rgba(89, 211, 144, 0.8);
  background: rgba(89, 211, 144, 0.06);
}
.admin-intelligence-body .carlos-briefing .cb-rec > span {
  color: rgba(150, 176, 208, 0.66); font-size: 0.55rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase;
}
.admin-intelligence-body .carlos-briefing .cb-rec > strong { color: #cfeede; font-size: 0.95rem; font-weight: 640; }
.admin-intelligence-body .carlos-briefing .cb-rec .compact-action { justify-self: start; margin-top: 5px; min-height: 38px; }

/* ---------------- Conversation / ask launcher (§5) ---------------- */
.admin-intelligence-body .carlos-command-launcher {
  display: grid; gap: 12px; padding: clamp(16px, 2vw, 20px); border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: linear-gradient(160deg, rgba(10, 22, 42, 0.55), rgba(6, 13, 26, 0.76));
}
.admin-intelligence-body .ccl-head h3 { margin: 3px 0 0; font-size: 0.98rem; font-weight: 660; letter-spacing: -0.012em; color: #e7f0fb; }
.admin-intelligence-body .ccl-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 6px; }
.admin-intelligence-body .ccl-grid .compact-action {
  justify-content: flex-start; text-align: left; min-height: 40px; padding: 8px 12px;
  font-size: 0.8rem; font-weight: 560; border-radius: 9px;
}
.admin-intelligence-body .carlos-command-form {
  display: grid; gap: 10px; padding-top: 12px; border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.admin-intelligence-body .carlos-command-form .field { display: grid; gap: 6px; }
.admin-intelligence-body .carlos-command-form .field > span {
  color: rgba(196, 216, 242, 0.76); font-size: 0.7rem; font-weight: 640; letter-spacing: 0.02em;
}
.admin-intelligence-body .carlos-command-form input,
.admin-intelligence-body .carlos-command-form select {
  width: 100%; min-height: 44px; padding: 0 13px; border-radius: 10px;
  border: 1px solid rgba(122, 168, 224, 0.2); background: rgba(4, 11, 24, 0.6);
  color: #f4f9ff; font: inherit; font-size: 0.86rem;
  transition: border-color 150ms ease, box-shadow 150ms ease;
}
.admin-intelligence-body .carlos-command-form input:focus,
.admin-intelligence-body .carlos-command-form select:focus {
  outline: none; border-color: rgba(96, 170, 255, 0.6); box-shadow: 0 0 0 3px rgba(52, 130, 246, 0.16);
}
.admin-intelligence-body .carlos-command-form .cap-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.admin-intelligence-body .carlos-command-form .cap-actions .compact-action { min-height: 42px; }

/* Confirmation phrase — deliberate, never casual */
.admin-intelligence-body [data-carlos-command-review] code {
  display: block; padding: 10px 13px; border-radius: 9px;
  border: 1px dashed rgba(231, 199, 106, 0.42); background: rgba(231, 199, 106, 0.07);
  color: #f4dfa6; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.85rem;
  user-select: all; word-break: break-word;
}
.admin-intelligence-body [data-carlos-command-confirm]:disabled { opacity: 0.5; cursor: not-allowed; }

/* ---------------- Reference panel (§10) ---------------- */
.admin-intelligence-body .carlos-reference {
  display: grid; gap: 14px; padding: 16px; border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: linear-gradient(160deg, rgba(10, 22, 42, 0.55), rgba(6, 13, 26, 0.76));
}
.admin-intelligence-body .cr-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.admin-intelligence-body .cr-label { color: rgba(150, 176, 208, 0.55); font-size: 0.55rem; font-weight: 800; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 7px; }
.admin-intelligence-body .cr-list { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.admin-intelligence-body .cr-list li {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 8px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}
.admin-intelligence-body .cr-list li:last-child { border-bottom: 0; }
.admin-intelligence-body .cr-list li span { color: rgba(190, 210, 238, 0.72); font-size: 0.78rem; }
.admin-intelligence-body .cr-list li strong { color: #f5faff; font-size: 0.88rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.admin-intelligence-body .cr-list li.is-unavailable strong { color: rgba(190, 206, 228, 0.55); font-size: 0.72rem; font-weight: 600; }
.admin-intelligence-body .cr-list li.is-empty span { color: rgba(150, 176, 208, 0.55); font-size: 0.76rem; }
.admin-intelligence-body .cr-routes { display: grid; gap: 5px; }
.admin-intelligence-body .cr-route {
  display: flex; align-items: center; min-height: 36px; padding: 7px 11px; border-radius: 8px;
  border: 1px solid rgba(132, 204, 255, 0.12); background: rgba(255, 255, 255, 0.02);
  color: rgba(214, 232, 248, 0.84); font-size: 0.78rem; font-weight: 560; text-decoration: none;
  transition: border-color 150ms ease, background 150ms ease, color 150ms ease;
}
.admin-intelligence-body .cr-route:hover { border-color: rgba(96, 170, 255, 0.34); background: rgba(52, 130, 246, 0.1); color: #f4f9ff; }
.admin-intelligence-body .cr-empty { color: rgba(190, 206, 228, 0.62); font-size: 0.8rem; line-height: 1.5; }

/* ---------------- Loading (§13) ---------------- */
.admin-intelligence-body .carlos-loading .admin-skeleton { margin-top: 10px; }

/* ---------------- Focus / motion (§16, §17) ---------------- */
.admin-intelligence-body .carlos-desk :is(a, button, input, select):focus-visible {
  outline: 2px solid rgba(96, 170, 255, 0.62); outline-offset: 2px; border-radius: 9px;
}
@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .cx-mark .cb-pulse { animation: none; }
  .admin-intelligence-body .cr-route,
  .admin-intelligence-body .carlos-command-form input,
  .admin-intelligence-body .carlos-command-form select { transition: none; }
}

/* ---------------- Responsive (§15) ---------------- */
@media (max-width: 1000px) {
  .admin-intelligence-body .carlos-exec { gap: 14px; }
  .admin-intelligence-body .cx-meta { gap: 18px; }
}
@media (max-width: 760px) {
  .admin-intelligence-body .carlos-exec { align-items: flex-start; flex-direction: column; }
  .admin-intelligence-body .cx-meta { gap: 14px; }
  .admin-intelligence-body .ccl-grid { grid-template-columns: 1fr; }
  .admin-intelligence-body .carlos-command-form .cap-actions .compact-action { flex: 1 1 100%; justify-content: center; }
  .admin-intelligence-body .carlos-briefing h2 { font-size: 1.24rem; }
}

/* ============================================================
   AUREX ADMIN — Financial Operations presentation.
   Performance / Cashback / Subscriptions / Leaderboard.
   Presentation only: no handler, gate, or amount logic touched.
   Financial actions are permission-gated and server re-verified;
   this layer makes them read as deliberate, never casual.
   ============================================================ */

/* ---------------- Amount & metric system (§20) ---------------- */
/* Every figure aligns on a tabular grid; emphasis is restrained. */
.admin-intelligence-body .admin-main .admin-table td,
.admin-intelligence-body .admin-main .kpi-card .metric-number,
.admin-intelligence-body .admin-main .portal-stat strong,
.admin-intelligence-body .admin-main .cfs-term strong,
.admin-intelligence-body .admin-main .cashback-flow-rail strong {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
}
/* Money-ish cells align right so decimals stack under pressure. */
.admin-intelligence-body .admin-main .table-claim-queue .admin-table td:nth-child(3),
.admin-intelligence-body .admin-main .table-client-cashback-totals .admin-table td:nth-child(n+2):nth-child(-n+9) {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.admin-intelligence-body .admin-main .table-claim-queue .admin-table th:nth-child(3),
.admin-intelligence-body .admin-main .table-client-cashback-totals .admin-table th:nth-child(n+2):nth-child(-n+9) { text-align: right; }

/* Non-values must never read like a real figure (§20). */
.admin-intelligence-body .admin-main .muted-cell,
.admin-intelligence-body .admin-main .admin-table td:empty::after {
  color: rgba(150, 176, 208, 0.42);
  font-variant-numeric: normal;
  font-style: normal;
}
.admin-intelligence-body .admin-main .admin-table td:empty::after { content: "—"; }

/* ---------------- Deliberate financial actions (§22) ---------------- */
/* Claim actions: readable, spaced, never a casual chip row. */
.admin-intelligence-body .admin-main .table-action-group {
  display: inline-flex; gap: 6px; flex-wrap: wrap; align-items: center;
}
.admin-intelligence-body .admin-main .table-action-group button {
  min-height: 34px; padding: 6px 12px; border-radius: 8px;
  border: 1px solid rgba(122, 168, 224, 0.22);
  background: rgba(255, 255, 255, 0.03);
  color: rgba(214, 232, 248, 0.88);
  font-size: 0.74rem; font-weight: 640; letter-spacing: 0.01em; cursor: pointer;
  transition: border-color 150ms ease, background 150ms ease, color 150ms ease;
}
/* Approve — considered, not celebratory. */
.admin-intelligence-body .admin-main .table-action-group button[data-cashback-claim="approve"]:hover {
  border-color: rgba(89, 211, 144, 0.5); background: rgba(89, 211, 144, 0.1); color: #b9f2d4;
}
/* Reject — destructive, must look distinct and intentional. */
.admin-intelligence-body .admin-main .table-action-group button[data-cashback-claim="reject"] {
  border-color: rgba(255, 118, 132, 0.24);
}
.admin-intelligence-body .admin-main .table-action-group button[data-cashback-claim="reject"]:hover {
  border-color: rgba(255, 118, 132, 0.6); background: rgba(255, 118, 132, 0.1); color: #ffc4cb;
}
/* Mark paid — treasury action, strongest deliberation. */
.admin-intelligence-body .admin-main .table-action-group button[data-cashback-claim="paid"] {
  border-color: rgba(108, 168, 247, 0.3); border-left-width: 2px;
}
.admin-intelligence-body .admin-main .table-action-group button[data-cashback-claim="paid"]:hover {
  border-color: rgba(108, 168, 247, 0.62); background: rgba(52, 130, 246, 0.12); color: #cfe0fb;
}
.admin-intelligence-body .admin-main .table-action-group button:active { transform: translateY(1px); }
.admin-intelligence-body .admin-main .table-action-group button:disabled { opacity: 0.45; cursor: not-allowed; }
.admin-intelligence-body .admin-main .table-action-group button:focus-visible {
  outline: 2px solid rgba(96, 170, 255, 0.62); outline-offset: 2px;
}

/* Publication actions read as a decision, not a chip. */
.admin-intelligence-body .admin-main [data-status="published"],
.admin-intelligence-body .admin-main #leaderboardPublishPublic {
  min-height: 36px; letter-spacing: 0.012em;
}
.admin-intelligence-body .admin-main #leaderboardPublishPublic:disabled,
.admin-intelligence-body .admin-main [data-status="published"]:disabled { opacity: 0.45; cursor: not-allowed; }

/* Row action groups keep breathing room in dense financial tables. */
.admin-intelligence-body .admin-main .table-performance-records .table-action-row { gap: 6px; }
.admin-intelligence-body .admin-main .table-performance-records .table-action-row .compact-action { min-height: 34px; }

/* ---------------- Period hierarchy (§: strong period context) ---------------- */
.admin-intelligence-body .admin-main .admin-table-panel .panel-header .eyebrow {
  color: rgba(150, 176, 208, 0.66); letter-spacing: 0.12em;
}

/* ---------------- Leaderboard: institutional, not gaming (§16) ---------------- */
.admin-intelligence-body .admin-main .leaderboard-summary-strip {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px;
  padding: 14px 16px; border-radius: 14px; margin-bottom: 12px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: linear-gradient(160deg, rgba(10, 22, 42, 0.55), rgba(6, 13, 26, 0.76));
}
.admin-intelligence-body .admin-main .leaderboard-summary-strip article { display: grid; gap: 3px; min-width: 0; }
.admin-intelligence-body .admin-main .leaderboard-summary-strip span {
  color: rgba(150, 176, 208, 0.62); font-size: 0.56rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
}
.admin-intelligence-body .admin-main .leaderboard-summary-strip strong {
  color: #f5faff; font-size: 1.2rem; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -0.014em;
}
/* Restrained prestige: gold reserved for published/public state only. */
.admin-intelligence-body .admin-main .leaderboard-command-panel {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; flex-wrap: wrap;
  padding: 16px; border-radius: 14px; margin-bottom: 12px;
  border: 1px solid rgba(217, 180, 90, 0.16); border-left: 2px solid rgba(217, 180, 90, 0.6);
  background: linear-gradient(160deg, rgba(24, 20, 10, 0.42), rgba(6, 13, 26, 0.8));
}
.admin-intelligence-body .admin-main .leaderboard-command-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* ---------------- Focus / reduced motion ---------------- */
@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .admin-main .table-action-group button { transition: none; }
}

/* ---------------- Responsive (§26) ---------------- */
@media (max-width: 900px) {
  .admin-intelligence-body .admin-main .leaderboard-command-panel { flex-direction: column; align-items: stretch; }
  .admin-intelligence-body .admin-main .leaderboard-command-actions .primary-button,
  .admin-intelligence-body .admin-main .leaderboard-command-actions .secondary-button { flex: 1 1 auto; justify-content: center; }
}
@media (max-width: 760px) {
  /* Financial actions stay reachable and thumb-sized on mobile. */
  .admin-intelligence-body .admin-main .table-action-group { width: 100%; }
  .admin-intelligence-body .admin-main .table-action-group button { flex: 1 1 auto; min-height: 40px; justify-content: center; }
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table td:nth-child(3) { text-align: left; }
}

/* ============================================================
   AUREX ADMIN — Cashback claims & treasury desk.
   Presentation only. No handler, gate, or amount logic touched.
   ============================================================ */

/* ---------------- Claim operations summary (§4) ---------------- */
.admin-intelligence-body .admin-main .cb-summary {
  display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 20px; align-items: center; margin-bottom: 14px;
  padding: 18px 20px; border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: linear-gradient(160deg, rgba(10, 22, 42, 0.6), rgba(6, 13, 26, 0.78));
}
.admin-intelligence-body .cbsum-lead { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.admin-intelligence-body .cbsum-primary { display: grid; gap: 3px; align-content: start; }
.admin-intelligence-body .cbsum-label {
  color: rgba(150, 176, 208, 0.62); font-size: 0.56rem; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase;
}
.admin-intelligence-body .cbsum-primary strong {
  color: #f5faff; font-size: clamp(1.6rem, 2.4vw, 2.05rem); font-weight: 700;
  letter-spacing: -0.026em; line-height: 1.05; font-variant-numeric: tabular-nums;
}
/* Attention is amber, never celebratory green. */
.admin-intelligence-body .cbsum-primary.is-attention strong { color: #f0d089; }
.admin-intelligence-body .cbsum-money { font-size: clamp(1.35rem, 2vw, 1.7rem) !important; color: #e7f0fb !important; }
.admin-intelligence-body .cbsum-primary small { color: rgba(150, 176, 208, 0.55); font-size: 0.7rem; line-height: 1.35; }
.admin-intelligence-body .cbsum-context {
  display: grid; gap: 0; margin: 0; align-content: center;
  padding-left: 20px; border-left: 1px solid rgba(255, 255, 255, 0.06);
}
.admin-intelligence-body .cbsum-context > div {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 7px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}
.admin-intelligence-body .cbsum-context > div:last-child { border-bottom: 0; }
.admin-intelligence-body .cbsum-context dt { color: rgba(150, 176, 208, 0.62); font-size: 0.76rem; }
.admin-intelligence-body .cbsum-context dd { margin: 0; color: #e7f0fb; font-size: 0.84rem; font-weight: 640; font-variant-numeric: tabular-nums; }
.admin-intelligence-body .cbsum-empty { display: grid; gap: 5px; padding: 4px 2px; }
.admin-intelligence-body .cbsum-empty strong { color: #eaf2fd; font-size: 1rem; }
.admin-intelligence-body .cbsum-empty p { color: rgba(190, 206, 228, 0.64); font-size: 0.84rem; max-width: 62ch; }

/* ---------------- Claim queue emphasis ---------------- */
.admin-intelligence-body .admin-main .table-claim-queue { border-left: 2px solid rgba(127, 216, 247, 0.5); }
/* Client identity leads; amount is the decisive figure. */
.admin-intelligence-body .admin-main .table-claim-queue .admin-table td:first-child { color: #f1f6fd; font-weight: 640; }
.admin-intelligence-body .admin-main .table-claim-queue .admin-table td:nth-child(3) { color: #eef6ff; font-weight: 660; }

/* ---------------- Supporting operations (§15) ---------------- */
.admin-intelligence-body .admin-main .cashback-supporting {
  margin-top: 18px; border-top: 1px solid rgba(255, 255, 255, 0.07);
}
.admin-intelligence-body .cashback-supporting > summary {
  display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; cursor: pointer; list-style: none;
  padding: 16px 2px; color: #cfe0f5;
}
.admin-intelligence-body .cashback-supporting > summary::-webkit-details-marker { display: none; }
.admin-intelligence-body .cashback-supporting > summary span { font-size: 0.88rem; font-weight: 660; }
.admin-intelligence-body .cashback-supporting > summary small { color: rgba(150, 176, 208, 0.55); font-size: 0.74rem; }
.admin-intelligence-body .cashback-supporting > summary::after {
  content: ""; margin-left: auto; width: 8px; height: 8px; flex: 0 0 auto;
  border-right: 2px solid rgba(160, 186, 216, 0.6); border-bottom: 2px solid rgba(160, 186, 216, 0.6);
  transform: rotate(45deg); transition: transform 180ms ease;
}
.admin-intelligence-body .cashback-supporting[open] > summary::after { transform: rotate(-135deg); }
.admin-intelligence-body .cashback-supporting > summary:focus-visible { outline: 2px solid rgba(96, 170, 255, 0.6); outline-offset: 2px; border-radius: 8px; }
.admin-intelligence-body .cbs-body { display: grid; gap: 14px; padding-top: 4px; }

/* ---------------- Mobile claim cards (§6) ---------------- */
@media (max-width: 760px) {
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table,
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table tbody,
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table tr,
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table td { display: block; width: 100%; }
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table thead { display: none; }
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table tr {
    display: grid; gap: 2px; margin-bottom: 10px; padding: 12px 14px;
    border: 1px solid rgba(255, 255, 255, 0.07); border-left: 2px solid rgba(127, 216, 247, 0.5);
    border-radius: 12px; background: rgba(255, 255, 255, 0.022);
  }
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table td {
    display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
    padding: 5px 0; border-bottom: 0; text-align: right;
  }
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table td::before {
    content: attr(data-label);
    flex: 0 0 auto; text-align: left;
    color: rgba(150, 176, 208, 0.6); font-size: 0.62rem; font-weight: 700;
    letter-spacing: 0.08em; text-transform: uppercase;
  }
  /* 1 client safe name -> 2 verified amount -> 3 state -> then context */
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table td:first-child {
    order: 1; padding-bottom: 8px; margin-bottom: 4px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 0.95rem; font-weight: 680;
  }
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table td:first-child::before { content: ""; }
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table td:nth-child(3) { order: 2; font-size: 1.05rem; font-weight: 700; }
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table td:nth-child(4) { order: 3; }
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table td:nth-child(2) { order: 4; }
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table td:nth-child(5) { order: 5; }
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table td:nth-child(6) { order: 6; }
  /* financial actions last, full width, thumb sized */
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table td:last-child {
    order: 7; display: block; text-align: left;
    padding-top: 10px; margin-top: 6px; border-top: 1px solid rgba(255, 255, 255, 0.06);
  }
  .admin-intelligence-body .admin-main .table-claim-queue .admin-table td:last-child::before { content: ""; }
  .admin-intelligence-body .admin-main .cb-summary { grid-template-columns: 1fr; gap: 14px; }
  .admin-intelligence-body .cbsum-context { padding-left: 0; border-left: 0; border-top: 1px solid rgba(255, 255, 255, 0.06); padding-top: 8px; }
}
@media (max-width: 420px) {
  .admin-intelligence-body .cbsum-lead { grid-template-columns: 1fr; gap: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .cashback-supporting > summary::after { transition: none; }
}

/* ============================================================
   AUREX ADMIN — Cashback claim review drawer.
   Presentation only. No handler, gate, or amount logic touched.
   ============================================================ */

.cb-review-backdrop {
  position: fixed; inset: 0; z-index: 60;
  display: flex; justify-content: flex-end;
  background: rgba(4, 8, 16, 0.6);
  backdrop-filter: blur(2px);
  animation: cbReviewFade 160ms ease;
}
@keyframes cbReviewFade { from { opacity: 0; } to { opacity: 1; } }

.cb-review-drawer {
  width: min(480px, 100%);
  height: 100%;
  display: flex; flex-direction: column;
  background: linear-gradient(160deg, rgba(10, 16, 30, 0.98), rgba(6, 10, 20, 0.99));
  border-left: 1px solid rgba(255, 255, 255, 0.08);
  box-shadow: -24px 0 60px rgba(0, 0, 0, 0.45);
  animation: cbReviewSlide 200ms cubic-bezier(0.2, 0.7, 0.3, 1);
}
@keyframes cbReviewSlide { from { transform: translateX(24px); opacity: 0; } to { transform: translateX(0); opacity: 1; } }

.cb-review-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  padding: 18px 20px; border-bottom: 1px solid rgba(255, 255, 255, 0.07); flex: 0 0 auto;
}
.cb-review-head h3 { margin: 2px 0 4px; color: #f5faff; font-size: 1.05rem; font-weight: 680; }
.cb-review-head .eyebrow { color: rgba(150, 176, 208, 0.62); font-size: 0.62rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.cb-review-head .modal-helper { color: rgba(150, 176, 208, 0.6); font-size: 0.76rem; }

.cb-review-body {
  flex: 1 1 auto; overflow-y: auto; min-height: 0;
  padding: 4px 20px 12px;
  display: grid; gap: 4px;
}

.cb-review-section {
  padding: 14px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.055);
}
.cb-review-section:last-child { border-bottom: 0; }
.cb-review-section-title {
  margin: 0 0 10px; color: #cfe0f5; font-size: 0.82rem; font-weight: 680;
  letter-spacing: 0.01em;
}
.cb-review-note {
  margin: 8px 0 0; color: rgba(190, 206, 228, 0.68); font-size: 0.78rem; line-height: 1.5;
}

.cb-kv-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; }
.cb-kv-grid > div { display: grid; gap: 2px; }
.cb-kv-grid dt { color: rgba(150, 176, 208, 0.6); font-size: 0.62rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.cb-kv-grid dd { margin: 0; color: #eaf2fd; font-size: 0.88rem; font-weight: 620; }
.cb-kv-grid dd small { display: block; color: rgba(150, 176, 208, 0.55); font-size: 0.7rem; font-weight: 500; margin-top: 1px; }
.cb-kv-money { font-variant-numeric: tabular-nums; font-size: 1.05rem !important; color: #f5faff !important; }

.cb-verified-rows { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 6px; }
.cb-verified-rows li {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 6px 10px; border-radius: 8px; background: rgba(255, 255, 255, 0.025);
  border: 1px solid rgba(255, 255, 255, 0.05);
}
.cb-verified-rows li span { color: rgba(190, 206, 228, 0.7); font-size: 0.78rem; }
.cb-verified-rows li strong { color: #eaf2fd; font-size: 0.82rem; font-variant-numeric: tabular-nums; }

/* Lifecycle trail */
.cb-lifecycle-trail { list-style: none; margin: 0; padding: 0; display: flex; gap: 0; }
.cb-lifecycle-step {
  flex: 1 1 0; position: relative; padding: 0 0 0 0; display: grid; gap: 4px; text-align: center;
}
.cb-lifecycle-step::before {
  content: ""; display: block; margin: 0 auto 8px; width: 12px; height: 12px; border-radius: 50%;
  background: rgba(255, 255, 255, 0.08); border: 2px solid rgba(150, 176, 208, 0.35);
}
.cb-lifecycle-step::after {
  content: ""; position: absolute; top: 5px; left: 50%; width: 100%; height: 2px;
  background: rgba(150, 176, 208, 0.2); z-index: -1;
}
.cb-lifecycle-step:last-child::after { display: none; }
.cb-lifecycle-step.is-done::before { background: #59d390; border-color: #59d390; }
.cb-lifecycle-step.is-done.cb-tone-danger::before { background: #ff7684; border-color: #ff7684; }
.cb-lifecycle-label { color: #dfeaf9; font-size: 0.72rem; font-weight: 640; }
.cb-lifecycle-step.is-pending .cb-lifecycle-label { color: rgba(150, 176, 208, 0.55); }
.cb-lifecycle-step small { color: rgba(150, 176, 208, 0.55); font-size: 0.64rem; }

/* Financial action footer */
.cb-review-foot {
  flex: 0 0 auto; padding: 16px 20px; border-top: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.015);
  display: grid; gap: 12px;
}
.cb-foot-state { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.cb-foot-state small { color: rgba(150, 176, 208, 0.55); font-size: 0.72rem; }

.cb-action-group { display: grid; gap: 10px; }
.cb-action-card {
  padding: 12px 14px; border-radius: 12px;
  border: 1px solid rgba(89, 211, 144, 0.22); border-left: 2px solid rgba(89, 211, 144, 0.55);
  background: rgba(89, 211, 144, 0.05);
}
.cb-action-card.cb-action-reject { border-color: rgba(255, 118, 132, 0.24); border-left-color: rgba(255, 118, 132, 0.6); background: rgba(255, 118, 132, 0.05); }
.cb-action-card.cb-action-paid { border-color: rgba(108, 168, 247, 0.28); border-left-color: rgba(108, 168, 247, 0.6); background: rgba(108, 168, 247, 0.05); }
.cb-action-next { margin: 0; color: #eaf2fd; font-size: 0.82rem; font-weight: 680; }
.cb-action-card .cb-review-note { margin-top: 6px; margin-bottom: 10px; }
.cb-action-card button {
  width: 100%; min-height: 40px; padding: 8px 14px; border-radius: 9px;
  border: 1px solid rgba(122, 168, 224, 0.3); background: rgba(255, 255, 255, 0.04);
  color: #eaf2fd; font-size: 0.82rem; font-weight: 660; cursor: pointer;
  transition: border-color 150ms ease, background 150ms ease;
}
.cb-action-card button:hover { border-color: rgba(122, 168, 224, 0.55); }
.cb-action-card.cb-action-reject button:hover { border-color: rgba(255, 118, 132, 0.6); background: rgba(255, 118, 132, 0.1); }
.cb-action-card.cb-action-paid button:hover { border-color: rgba(108, 168, 247, 0.62); background: rgba(52, 130, 246, 0.12); }
.cb-action-card button:focus-visible { outline: 2px solid rgba(96, 170, 255, 0.62); outline-offset: 2px; }

/* Review trigger in the queue table: neutral, never mistaken for a financial action */
.table-action-group button.cb-review-trigger {
  border-color: rgba(150, 176, 208, 0.3); color: rgba(207, 224, 245, 0.85);
}
.table-action-group button.cb-review-trigger:hover {
  border-color: rgba(150, 176, 208, 0.6); background: rgba(150, 176, 208, 0.1);
}

.cb-review-drawer .modal-close-button:focus-visible,
.cb-review-drawer *:focus-visible { outline: 2px solid rgba(96, 170, 255, 0.62); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  .cb-review-backdrop, .cb-review-drawer { animation: none; }
  .cb-action-card button, .table-action-group button.cb-review-trigger { transition: none; }
}

/* ---------------- Responsive (§14) ---------------- */
@media (max-width: 760px) {
  .cb-review-backdrop { align-items: flex-end; }
  .cb-review-drawer { width: 100%; height: 100%; border-left: 0; }
  .cb-kv-grid { grid-template-columns: 1fr; }
  .cb-lifecycle-trail { flex-wrap: nowrap; }
}

/* ============================================================
   AUREX ADMIN — Performance verification & review workspace.
   Presentation only. No handler, gate, calculation, or store change.
   The review panel is in-flow (position: sticky, never fixed), so it
   does not hit the contain:layout-paint containing-block defect.
   ============================================================ */

/* ---------------- Review summary band ---------------- */
.admin-intelligence-body .admin-main .perf-summary {
  display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 20px; align-items: center; margin-bottom: 14px;
  padding: 18px 20px; border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: linear-gradient(160deg, rgba(10, 22, 42, 0.6), rgba(6, 13, 26, 0.78));
}
.admin-intelligence-body .perfsum-lead { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.admin-intelligence-body .perfsum-primary { display: grid; gap: 3px; align-content: start; }
.admin-intelligence-body .perfsum-label {
  color: rgba(150, 176, 208, 0.62); font-size: 0.56rem; font-weight: 700;
  letter-spacing: 0.12em; text-transform: uppercase;
}
.admin-intelligence-body .perfsum-primary strong {
  color: #f5faff; font-size: clamp(1.6rem, 2.4vw, 2.05rem); font-weight: 700;
  letter-spacing: -0.026em; line-height: 1.05; font-variant-numeric: tabular-nums;
}
.admin-intelligence-body .perfsum-primary.is-attention strong { color: #f0d089; }
.admin-intelligence-body .perfsum-ready { color: #a9d3bd !important; }
.admin-intelligence-body .perfsum-primary small { color: rgba(150, 176, 208, 0.55); font-size: 0.7rem; line-height: 1.35; }
.admin-intelligence-body .perfsum-context {
  display: grid; gap: 0; margin: 0; align-content: center;
  padding-left: 20px; border-left: 1px solid rgba(255, 255, 255, 0.06);
}
.admin-intelligence-body .perfsum-context > div {
  display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
  padding: 7px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.04);
}
.admin-intelligence-body .perfsum-context > div:last-child { border-bottom: 0; }
.admin-intelligence-body .perfsum-context dt { color: rgba(150, 176, 208, 0.62); font-size: 0.76rem; }
.admin-intelligence-body .perfsum-context dd { margin: 0; color: #e7f0fb; font-size: 0.84rem; font-weight: 640; font-variant-numeric: tabular-nums; }
.admin-intelligence-body .perfsum-empty { display: grid; gap: 5px; padding: 4px 2px; }
.admin-intelligence-body .perfsum-empty strong { color: #eaf2fd; font-size: 1rem; }
.admin-intelligence-body .perfsum-empty p { color: rgba(190, 206, 228, 0.64); font-size: 0.84rem; max-width: 62ch; }

/* ---------------- Workspace grid (registry + docked review) ---------------- */
.admin-intelligence-body .admin-main .perf-workspace {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, 420px);
  gap: 16px; align-items: start; margin-top: 4px;
}
.admin-intelligence-body .perf-registry { min-width: 0; }

/* Restrained numerics + tones (positive is never bright green). */
.admin-intelligence-body .admin-main .perf-registry .admin-table td,
.admin-intelligence-body .perf-num { font-variant-numeric: tabular-nums; }
.admin-intelligence-body .perf-pos { color: #a9d3bd; }
.admin-intelligence-body .perf-neg { color: #e6a6ad; }
.admin-intelligence-body .perf-flat { color: rgba(190, 206, 228, 0.72); }
.admin-intelligence-body .perf-acct { color: rgba(150, 176, 208, 0.5); font-variant-numeric: tabular-nums; }
.admin-intelligence-body .perf-pub { font-size: 0.78rem; font-weight: 600; }
.admin-intelligence-body .perf-pub-live { color: #a9d3bd; }
.admin-intelligence-body .perf-pub-blocked { color: #f0c078; }
.admin-intelligence-body .perf-pub-internal { color: rgba(190, 206, 228, 0.6); }

/* Selected registry row */
.admin-intelligence-body .perf-registry .admin-table tr:has(.perf-review-btn.is-active) {
  background: rgba(108, 168, 247, 0.08);
  box-shadow: inset 2px 0 0 rgba(127, 216, 247, 0.6);
}
.admin-intelligence-body .perf-review-btn.is-active { border-color: rgba(127, 216, 247, 0.5); color: #cfe6f6; }

/* ---------------- Review panel (in-flow, sticky) ---------------- */
.admin-intelligence-body .perf-review-dock { min-width: 0; }
.admin-intelligence-body .perf-review {
  position: sticky; top: 16px;
  display: flex; flex-direction: column;
  max-height: calc(100dvh - 32px);
  border-radius: 16px; overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-left: 2px solid rgba(127, 216, 247, 0.5);
  background: linear-gradient(160deg, rgba(10, 16, 30, 0.96), rgba(6, 10, 20, 0.98));
}
.admin-intelligence-body .perf-review.empty { border-left-color: rgba(255, 255, 255, 0.08); }
.admin-intelligence-body .perf-review:focus-visible { outline: 2px solid rgba(96, 170, 255, 0.6); outline-offset: 2px; }
.admin-intelligence-body .perf-review-empty { display: grid; gap: 6px; padding: 28px 22px; align-content: center; }
.admin-intelligence-body .perf-review-empty .eyebrow { color: rgba(150, 176, 208, 0.62); font-size: 0.6rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.admin-intelligence-body .perf-review-empty strong { color: #eaf2fd; font-size: 1.02rem; }
.admin-intelligence-body .perf-review-empty p { color: rgba(190, 206, 228, 0.64); font-size: 0.82rem; line-height: 1.5; }

.admin-intelligence-body .perf-review-head {
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  padding: 16px 20px; border-bottom: 1px solid rgba(255, 255, 255, 0.07); flex: 0 0 auto;
}
.admin-intelligence-body .perf-review-head .eyebrow { color: rgba(150, 176, 208, 0.62); font-size: 0.6rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.admin-intelligence-body .perf-review-head h3 { margin: 2px 0 4px; color: #f5faff; font-size: 1.02rem; font-weight: 680; }
.admin-intelligence-body .perf-review-sub { color: rgba(150, 176, 208, 0.6); font-size: 0.76rem; }

.admin-intelligence-body .perf-review-body {
  flex: 1 1 auto; overflow-y: auto; min-height: 0; padding: 2px 20px 10px;
}
.admin-intelligence-body .perf-rsec { padding: 14px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.055); }
.admin-intelligence-body .perf-rsec:last-child { border-bottom: 0; }
.admin-intelligence-body .perf-rsec-title { margin: 0 0 10px; color: #cfe0f5; font-size: 0.82rem; font-weight: 680; }
.admin-intelligence-body .perf-rnote { margin: 8px 0 0; color: rgba(190, 206, 228, 0.66); font-size: 0.76rem; line-height: 1.5; }

.admin-intelligence-body .perf-kv { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; }
.admin-intelligence-body .perf-kv > div { display: grid; gap: 2px; }
.admin-intelligence-body .perf-kv dt { color: rgba(150, 176, 208, 0.6); font-size: 0.6rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.admin-intelligence-body .perf-kv dd { margin: 0; color: #eaf2fd; font-size: 0.85rem; font-weight: 620; }

/* Verified metric grid */
.admin-intelligence-body .perf-metric-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.admin-intelligence-body .perf-metric {
  display: grid; gap: 2px; padding: 10px 12px; border-radius: 10px;
  background: rgba(255, 255, 255, 0.022); border: 1px solid rgba(255, 255, 255, 0.05);
}
.admin-intelligence-body .perf-metric-label { color: rgba(150, 176, 208, 0.6); font-size: 0.58rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.admin-intelligence-body .perf-metric-value { color: #f1f6fd; font-size: 1.02rem; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.admin-intelligence-body .perf-metric small { color: rgba(150, 176, 208, 0.5); font-size: 0.62rem; }
.admin-intelligence-body .perf-score-row { display: flex; gap: 8px; margin-top: 10px; }
.admin-intelligence-body .perf-score {
  flex: 1 1 0; display: grid; gap: 2px; padding: 8px 10px; text-align: center;
  border-radius: 10px; background: rgba(108, 168, 247, 0.06); border: 1px solid rgba(108, 168, 247, 0.16);
}
.admin-intelligence-body .perf-score span { color: rgba(150, 176, 208, 0.62); font-size: 0.58rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.admin-intelligence-body .perf-score strong { color: #eaf2fd; font-size: 1.1rem; font-weight: 700; font-variant-numeric: tabular-nums; }

/* Findings */
.admin-intelligence-body .perf-flag { margin: 0 0 10px; padding: 8px 12px; border-radius: 8px; color: #f2cf8f; font-size: 0.78rem; background: rgba(240, 192, 120, 0.08); border: 1px solid rgba(240, 192, 120, 0.22); }
.admin-intelligence-body .perf-find { display: grid; gap: 4px; margin-bottom: 10px; }
.admin-intelligence-body .perf-find > span { color: rgba(150, 176, 208, 0.6); font-size: 0.6rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.admin-intelligence-body .perf-find ul { margin: 0; padding-left: 16px; display: grid; gap: 3px; }
.admin-intelligence-body .perf-find li { color: #dfeaf9; font-size: 0.8rem; line-height: 1.45; }
.admin-intelligence-body .perf-find-critical li { color: #eab6bd; }
.admin-intelligence-body .perf-find-weak li { color: #ecd2a6; }
.admin-intelligence-body .perf-find-strong li { color: rgba(190, 206, 228, 0.78); }
.admin-intelligence-body .perf-note-block { display: grid; gap: 4px; margin-top: 6px; padding: 10px 12px; border-radius: 10px; background: rgba(255, 255, 255, 0.022); border: 1px solid rgba(255, 255, 255, 0.05); }
.admin-intelligence-body .perf-note-block span { color: rgba(150, 176, 208, 0.6); font-size: 0.6rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.admin-intelligence-body .perf-note-block p { margin: 0; color: #dfeaf9; font-size: 0.82rem; line-height: 1.5; }

/* Publication readiness */
.admin-intelligence-body .perf-readiness { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.admin-intelligence-body .perf-readiness > span { color: rgba(150, 176, 208, 0.62); font-size: 0.62rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.admin-intelligence-body .perf-check-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.admin-intelligence-body .perf-check { display: flex; align-items: center; gap: 10px; color: #dfeaf9; font-size: 0.8rem; }
.admin-intelligence-body .perf-check-mark { flex: 0 0 auto; width: 12px; height: 12px; border-radius: 50%; border: 2px solid rgba(150, 176, 208, 0.4); }
.admin-intelligence-body .perf-check.is-ok .perf-check-mark { background: #a9d3bd; border-color: #a9d3bd; }
.admin-intelligence-body .perf-check.is-warn .perf-check-mark { background: #f0c078; border-color: #f0c078; }
.admin-intelligence-body .perf-check.is-warn { color: #ecd2a6; }
.admin-intelligence-body .perf-check.is-pending { color: rgba(190, 206, 228, 0.6); }

/* Action footer (sticks to panel bottom because the body scrolls) */
.admin-intelligence-body .perf-review-foot {
  flex: 0 0 auto; padding: 14px 20px; border-top: 1px solid rgba(255, 255, 255, 0.08);
  background: rgba(255, 255, 255, 0.015); display: grid; gap: 12px;
}
.admin-intelligence-body .perf-foot-state { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.admin-intelligence-body .perf-foot-state small { color: rgba(150, 176, 208, 0.55); font-size: 0.72rem; }
.admin-intelligence-body .perf-foot-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.admin-intelligence-body .perf-foot-actions button { flex: 1 1 auto; min-height: 38px; }

/* Deliberate publish confirmation */
.admin-intelligence-body .perf-review-foot.is-confirm { background: rgba(108, 168, 247, 0.06); }
.admin-intelligence-body .perf-confirm { display: grid; gap: 8px; }
.admin-intelligence-body .perf-confirm-title { margin: 0; color: #eaf2fd; font-size: 0.9rem; font-weight: 680; }
.admin-intelligence-body .perf-confirm-facts { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.admin-intelligence-body .perf-confirm-facts li { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 5px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.05); }
.admin-intelligence-body .perf-confirm-facts li:last-child { border-bottom: 0; }
.admin-intelligence-body .perf-confirm-facts span { color: rgba(150, 176, 208, 0.6); font-size: 0.7rem; }
.admin-intelligence-body .perf-confirm-facts strong { color: #eaf2fd; font-size: 0.78rem; font-weight: 620; text-align: right; }
.admin-intelligence-body .perf-confirm-actions { display: flex; gap: 8px; }
.admin-intelligence-body .perf-confirm-actions button { flex: 1 1 auto; min-height: 40px; }

/* ---------------- Supporting operations ---------------- */
.admin-intelligence-body .admin-main .perf-supporting { margin-top: 18px; border-top: 1px solid rgba(255, 255, 255, 0.07); }
.admin-intelligence-body .perf-supporting > summary {
  display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; cursor: pointer; list-style: none;
  padding: 16px 2px; color: #cfe0f5;
}
.admin-intelligence-body .perf-supporting > summary::-webkit-details-marker { display: none; }
.admin-intelligence-body .perf-supporting > summary span { font-size: 0.88rem; font-weight: 660; }
.admin-intelligence-body .perf-supporting > summary small { color: rgba(150, 176, 208, 0.55); font-size: 0.74rem; }
.admin-intelligence-body .perf-supporting > summary::after {
  content: ""; margin-left: auto; width: 8px; height: 8px; flex: 0 0 auto;
  border-right: 2px solid rgba(160, 186, 216, 0.6); border-bottom: 2px solid rgba(160, 186, 216, 0.6);
  transform: rotate(45deg); transition: transform 180ms ease;
}
.admin-intelligence-body .perf-supporting[open] > summary::after { transform: rotate(-135deg); }
.admin-intelligence-body .perf-supporting > summary:focus-visible { outline: 2px solid rgba(96, 170, 255, 0.6); outline-offset: 2px; border-radius: 8px; }
.admin-intelligence-body .perf-supporting-body { display: grid; gap: 14px; padding-top: 4px; }

/* ---------------- Responsive ---------------- */
@media (max-width: 1100px) {
  .admin-intelligence-body .admin-main .perf-workspace { grid-template-columns: 1fr; }
  .admin-intelligence-body .perf-review { position: static; max-height: none; }
  /* When nothing is selected on smaller screens, the empty dock is noise. */
  .admin-intelligence-body .perf-workspace:not(.has-selection) .perf-review-dock { display: none; }
}

@media (max-width: 760px) {
  .admin-intelligence-body .admin-main .perf-summary { grid-template-columns: 1fr; gap: 14px; }
  .admin-intelligence-body .perfsum-context { padding-left: 0; border-left: 0; border-top: 1px solid rgba(255, 255, 255, 0.06); padding-top: 8px; }
  .admin-intelligence-body .perf-metric-grid { grid-template-columns: repeat(2, 1fr); }

  /* Master-detail: when a record is open, the panel takes over the screen.
     The list chrome above the panel is hidden so the in-flow panel starts at
     the top and fills the viewport, keeping its footer pinned without any
     fixed positioning (and without the contain:layout-paint overlay defect). */
  .admin-intelligence-body .perf-detail-open > .unified-page-header,
  .admin-intelligence-body .perf-detail-open > .context-strip,
  .admin-intelligence-body .perf-detail-open > .first-action-guide,
  .admin-intelligence-body .perf-detail-open > .perf-summary,
  .admin-intelligence-body .perf-detail-open > .perf-supporting { display: none; }
  .admin-intelligence-body .perf-workspace.has-selection .perf-registry { display: none; }
  .admin-intelligence-body .perf-detail-open .perf-workspace { margin-top: 0; }
  /* On mobile the panel flows at full height and the page scrolls through it
     top-to-bottom (reinforcing deliberate review). The header is pinned so the
     Close control stays reachable; the footer is the natural end of the flow.
     No fixed positioning, no internal-scroll clipping. */
  .admin-intelligence-body .perf-workspace.has-selection .perf-review { max-height: none; min-height: 0; overflow: visible; }
  .admin-intelligence-body .perf-workspace.has-selection .perf-review-body { overflow: visible; }
  .admin-intelligence-body .perf-workspace.has-selection .perf-review-head {
    position: sticky; top: 0; z-index: 3;
    background: linear-gradient(160deg, rgba(10, 16, 30, 0.99), rgba(8, 12, 22, 0.99));
  }

  /* Registry table -> structured cards */
  .admin-intelligence-body .admin-main .perf-registry .admin-table,
  .admin-intelligence-body .admin-main .perf-registry .admin-table tbody,
  .admin-intelligence-body .admin-main .perf-registry .admin-table tr,
  .admin-intelligence-body .admin-main .perf-registry .admin-table td { display: block; width: 100%; }
  .admin-intelligence-body .admin-main .perf-registry .admin-table thead { display: none; }
  .admin-intelligence-body .admin-main .perf-registry .admin-table tr {
    display: grid; gap: 2px; margin-bottom: 10px; padding: 12px 14px;
    border: 1px solid rgba(255, 255, 255, 0.07); border-left: 2px solid rgba(127, 216, 247, 0.5);
    border-radius: 12px; background: rgba(255, 255, 255, 0.022);
  }
  .admin-intelligence-body .admin-main .perf-registry .admin-table td {
    display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
    padding: 5px 0; border-bottom: 0; text-align: right;
  }
  .admin-intelligence-body .admin-main .perf-registry .admin-table td::before {
    content: attr(data-label); flex: 0 0 auto; text-align: left;
    color: rgba(150, 176, 208, 0.6); font-size: 0.62rem; font-weight: 700;
    letter-spacing: 0.08em; text-transform: uppercase;
  }
  /* client -> period -> review state -> publication -> return -> updated -> Review */
  .admin-intelligence-body .admin-main .perf-registry .admin-table td:nth-child(1) {
    order: 1; padding-bottom: 8px; margin-bottom: 4px; border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 0.95rem; font-weight: 680;
  }
  .admin-intelligence-body .admin-main .perf-registry .admin-table td:nth-child(1)::before { content: ""; }
  .admin-intelligence-body .admin-main .perf-registry .admin-table td:nth-child(2) { order: 2; }
  .admin-intelligence-body .admin-main .perf-registry .admin-table td:nth-child(5) { order: 3; }
  .admin-intelligence-body .admin-main .perf-registry .admin-table td:nth-child(6) { order: 4; }
  .admin-intelligence-body .admin-main .perf-registry .admin-table td:nth-child(3) { order: 5; }
  .admin-intelligence-body .admin-main .perf-registry .admin-table td:nth-child(4) { order: 6; }
  .admin-intelligence-body .admin-main .perf-registry .admin-table td:nth-child(7) { order: 7; }
  .admin-intelligence-body .admin-main .perf-registry .admin-table td:last-child {
    order: 8; display: block; text-align: left; padding-top: 10px; margin-top: 6px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
  }
  .admin-intelligence-body .admin-main .perf-registry .admin-table td:last-child::before { content: ""; }
  .admin-intelligence-body .admin-main .perf-registry .admin-table td:last-child .perf-review-btn { width: 100%; min-height: 40px; }
}

@media (max-width: 420px) {
  .admin-intelligence-body .perfsum-lead { grid-template-columns: 1fr; gap: 14px; }
  .admin-intelligence-body .perf-metric-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .perf-supporting > summary::after { transition: none; }
}

/* ============================================================
   AUREX ADMIN — Membership lifecycle & access-control workspace.
   Presentation only. No handler, gate, store, or calculation change.
   In-flow review panel (position: sticky, never fixed) — no portal,
   no observer, no contain:layout-paint overlay defect. Restrained
   institutional tones: "active" is calm blue, never bright green.
   ============================================================ */

/* ---------------- Restrained state chips ---------------- */
.admin-intelligence-body .sub-state {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 10px; border-radius: 999px; font-size: 0.72rem; font-weight: 640;
  border: 1px solid transparent; letter-spacing: 0.01em;
}
.admin-intelligence-body .sub-state::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; opacity: 0.85; }
.admin-intelligence-body .sub-state-active { color: #a9c8e8; background: rgba(108, 168, 247, 0.1); border-color: rgba(108, 168, 247, 0.28); }
.admin-intelligence-body .sub-state-warning { color: #f0c078; background: rgba(240, 192, 120, 0.1); border-color: rgba(240, 192, 120, 0.28); }
.admin-intelligence-body .sub-state-danger { color: #e6a6ad; background: rgba(255, 118, 132, 0.1); border-color: rgba(255, 118, 132, 0.28); }
.admin-intelligence-body .sub-state-neutral { color: rgba(190, 206, 228, 0.72); background: rgba(255, 255, 255, 0.03); border-color: rgba(255, 255, 255, 0.08); }

/* ---------------- Lifecycle summary band ---------------- */
.admin-intelligence-body .admin-main .sub-summary {
  display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
  gap: 20px; align-items: center; margin-bottom: 14px;
  padding: 18px 20px; border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.06);
  background: linear-gradient(160deg, rgba(10, 22, 42, 0.6), rgba(6, 13, 26, 0.78));
}
.admin-intelligence-body .subsum-lead { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.admin-intelligence-body .subsum-primary { display: grid; gap: 3px; align-content: start; }
.admin-intelligence-body .subsum-label { color: rgba(150, 176, 208, 0.62); font-size: 0.56rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.admin-intelligence-body .subsum-primary strong { color: #f5faff; font-size: clamp(1.6rem, 2.4vw, 2.05rem); font-weight: 700; letter-spacing: -0.026em; line-height: 1.05; font-variant-numeric: tabular-nums; }
.admin-intelligence-body .subsum-primary.is-attention strong { color: #f0d089; }
.admin-intelligence-body .subsum-primary small { color: rgba(150, 176, 208, 0.55); font-size: 0.7rem; line-height: 1.35; }
.admin-intelligence-body .subsum-context { display: grid; gap: 0; margin: 0; align-content: center; padding-left: 20px; border-left: 1px solid rgba(255, 255, 255, 0.06); }
.admin-intelligence-body .subsum-context > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding: 6px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.04); }
.admin-intelligence-body .subsum-context > div:last-child { border-bottom: 0; }
.admin-intelligence-body .subsum-context dt { color: rgba(150, 176, 208, 0.62); font-size: 0.74rem; }
.admin-intelligence-body .subsum-context dd { margin: 0; color: #e7f0fb; font-size: 0.82rem; font-weight: 640; font-variant-numeric: tabular-nums; }
.admin-intelligence-body .subsum-empty { display: grid; gap: 5px; padding: 4px 2px; }
.admin-intelligence-body .subsum-empty strong { color: #eaf2fd; font-size: 1rem; }
.admin-intelligence-body .subsum-empty p { color: rgba(190, 206, 228, 0.64); font-size: 0.84rem; max-width: 62ch; }

/* ---------------- Workspace grid ---------------- */
.admin-intelligence-body .admin-main .sub-workspace {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, 420px);
  gap: 16px; align-items: start; margin-top: 4px;
}
.admin-intelligence-body .sub-registry { min-width: 0; }
.admin-intelligence-body .admin-main .sub-registry .admin-table td { font-variant-numeric: tabular-nums; }
.admin-intelligence-body .sub-sub { color: rgba(150, 176, 208, 0.55); }
.admin-intelligence-body .sub-scope { color: rgba(190, 206, 228, 0.78); font-size: 0.82rem; }
.admin-intelligence-body .sub-attn { color: #ecd2a6; font-size: 0.8rem; }
.admin-intelligence-body .sub-attn-none { color: rgba(150, 176, 208, 0.4); }
.admin-intelligence-body .sub-registry .admin-table tr:has(.sub-review-btn.is-active) { background: rgba(108, 168, 247, 0.08); box-shadow: inset 2px 0 0 rgba(127, 216, 247, 0.6); }
.admin-intelligence-body .sub-review-btn.is-active { border-color: rgba(127, 216, 247, 0.5); color: #cfe6f6; }

/* ---------------- Review panel (in-flow, sticky) ---------------- */
.admin-intelligence-body .sub-review-dock { min-width: 0; }
.admin-intelligence-body .sub-review {
  position: sticky; top: 16px; display: flex; flex-direction: column;
  max-height: calc(100dvh - 32px); border-radius: 16px; overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.08); border-left: 2px solid rgba(127, 216, 247, 0.5);
  background: linear-gradient(160deg, rgba(10, 16, 30, 0.96), rgba(6, 10, 20, 0.98));
}
.admin-intelligence-body .sub-review.empty { border-left-color: rgba(255, 255, 255, 0.08); }
.admin-intelligence-body .sub-review:focus-visible { outline: 2px solid rgba(96, 170, 255, 0.6); outline-offset: 2px; }
.admin-intelligence-body .sub-review-empty { display: grid; gap: 6px; padding: 28px 22px; align-content: center; }
.admin-intelligence-body .sub-review-empty .eyebrow { color: rgba(150, 176, 208, 0.62); font-size: 0.6rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.admin-intelligence-body .sub-review-empty strong { color: #eaf2fd; font-size: 1.02rem; }
.admin-intelligence-body .sub-review-empty p { color: rgba(190, 206, 228, 0.64); font-size: 0.82rem; line-height: 1.5; }

.admin-intelligence-body .sub-review-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 16px 20px; border-bottom: 1px solid rgba(255, 255, 255, 0.07); flex: 0 0 auto; }
.admin-intelligence-body .sub-review-head .eyebrow { color: rgba(150, 176, 208, 0.62); font-size: 0.6rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; }
.admin-intelligence-body .sub-review-head h3 { margin: 2px 0 4px; color: #f5faff; font-size: 1.02rem; font-weight: 680; }
.admin-intelligence-body .sub-review-sub { color: rgba(150, 176, 208, 0.6); font-size: 0.76rem; }

.admin-intelligence-body .sub-review-body { flex: 1 1 auto; overflow-y: auto; min-height: 0; padding: 2px 20px 10px; }
.admin-intelligence-body .sub-rsec { padding: 14px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.055); }
.admin-intelligence-body .sub-rsec:last-child { border-bottom: 0; }
.admin-intelligence-body .sub-rsec-title { margin: 0 0 10px; color: #cfe0f5; font-size: 0.82rem; font-weight: 680; }
.admin-intelligence-body .sub-note { margin: 8px 0 0; color: rgba(190, 206, 228, 0.66); font-size: 0.76rem; line-height: 1.5; }
.admin-intelligence-body .sub-muted { color: rgba(150, 176, 208, 0.5); }

.admin-intelligence-body .sub-kv { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; }
.admin-intelligence-body .sub-kv > div { display: grid; gap: 2px; }
.admin-intelligence-body .sub-kv dt { color: rgba(150, 176, 208, 0.6); font-size: 0.6rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.admin-intelligence-body .sub-kv dd { margin: 0; color: #eaf2fd; font-size: 0.85rem; font-weight: 620; }

.admin-intelligence-body .sub-onboard { margin-top: 10px; padding: 10px 12px; border-radius: 10px; background: rgba(255, 255, 255, 0.022); border: 1px solid rgba(255, 255, 255, 0.05); }
.admin-intelligence-body .sub-onboard span { color: rgba(150, 176, 208, 0.6); font-size: 0.6rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.admin-intelligence-body .sub-onboard p { margin: 3px 0 0; color: #dfeaf9; font-size: 0.82rem; }

/* Entitlement list */
.admin-intelligence-body .sub-ent-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.admin-intelligence-body .sub-ent { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: 10px; background: rgba(255, 255, 255, 0.022); border: 1px solid rgba(255, 255, 255, 0.05); border-left: 2px solid rgba(255, 255, 255, 0.12); }
.admin-intelligence-body .sub-ent-active { border-left-color: rgba(108, 168, 247, 0.55); }
.admin-intelligence-body .sub-ent-warning { border-left-color: rgba(240, 192, 120, 0.55); }
.admin-intelligence-body .sub-ent-danger { border-left-color: rgba(255, 118, 132, 0.55); }
.admin-intelligence-body .sub-ent-neutral { border-left-color: rgba(160, 180, 210, 0.35); }
.admin-intelligence-body .sub-ent-main { display: grid; gap: 2px; min-width: 0; }
.admin-intelligence-body .sub-ent-label { color: #eaf2fd; font-size: 0.85rem; font-weight: 640; }
.admin-intelligence-body .sub-ent-main small { color: rgba(150, 176, 208, 0.55); font-size: 0.68rem; }
.admin-intelligence-body .sub-ent-state { display: grid; gap: 2px; text-align: right; flex: 0 0 auto; max-width: 46%; }
.admin-intelligence-body .sub-ent-badge { font-size: 0.76rem; font-weight: 660; color: #dfeaf9; }
.admin-intelligence-body .sub-ent-active .sub-ent-badge { color: #a9c8e8; }
.admin-intelligence-body .sub-ent-warning .sub-ent-badge { color: #f0c078; }
.admin-intelligence-body .sub-ent-danger .sub-ent-badge { color: #e6a6ad; }
.admin-intelligence-body .sub-ent-state small { color: rgba(150, 176, 208, 0.55); font-size: 0.66rem; line-height: 1.35; }

/* Restrictions */
.admin-intelligence-body .sub-restrict-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.admin-intelligence-body .sub-restrict-list li { padding: 10px 12px; border-radius: 10px; background: rgba(255, 118, 132, 0.05); border: 1px solid rgba(255, 118, 132, 0.2); }
.admin-intelligence-body .sub-restrict-list span { color: #e6a6ad; font-size: 0.78rem; font-weight: 660; }
.admin-intelligence-body .sub-restrict-list p { margin: 3px 0 0; color: rgba(230, 200, 205, 0.85); font-size: 0.78rem; line-height: 1.45; }

/* Footer (read-only status) */
.admin-intelligence-body .sub-review-foot { flex: 0 0 auto; padding: 14px 20px; border-top: 1px solid rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.015); display: grid; gap: 8px; }
.admin-intelligence-body .sub-foot-state { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.admin-intelligence-body .sub-foot-state small { color: rgba(150, 176, 208, 0.55); font-size: 0.72rem; }
.admin-intelligence-body .sub-review-foot .sub-note { margin: 0; }

/* ---------------- Attention queue ---------------- */
.admin-intelligence-body .admin-main .sub-attention { margin-top: 16px; }
.admin-intelligence-body .sub-attn-groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin-top: 4px; }
.admin-intelligence-body .sub-attn-group { padding: 12px 14px; border-radius: 12px; background: rgba(255, 255, 255, 0.022); border: 1px solid rgba(255, 255, 255, 0.06); }
.admin-intelligence-body .sub-attn-head { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.admin-intelligence-body .sub-attn-head > span:first-child { color: #eaf2fd; font-size: 0.84rem; font-weight: 660; }
.admin-intelligence-body .sub-attn-head small { color: rgba(150, 176, 208, 0.55); font-size: 0.68rem; }
.admin-intelligence-body .sub-attn-count { margin-left: auto; color: #f0c078; font-size: 0.9rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.admin-intelligence-body .sub-attn-group ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.admin-intelligence-body .sub-attn-item { width: 100%; display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 7px 10px; border-radius: 8px; cursor: pointer; text-align: left; background: rgba(255, 255, 255, 0.02); border: 1px solid rgba(255, 255, 255, 0.05); color: #dfeaf9; transition: border-color 150ms ease, background 150ms ease; }
.admin-intelligence-body .sub-attn-item:hover { border-color: rgba(122, 168, 224, 0.5); background: rgba(122, 168, 224, 0.08); }
.admin-intelligence-body .sub-attn-item:focus-visible { outline: 2px solid rgba(96, 170, 255, 0.62); outline-offset: 2px; }
.admin-intelligence-body .sub-attn-item span { font-size: 0.82rem; font-weight: 620; }
.admin-intelligence-body .sub-attn-item small { color: rgba(150, 176, 208, 0.55); font-size: 0.7rem; }
.admin-intelligence-body .sub-attn-more { margin: 6px 0 0; color: rgba(150, 176, 208, 0.5); font-size: 0.72rem; }

/* ---------------- Supporting operations ---------------- */
.admin-intelligence-body .admin-main .sub-supporting { margin-top: 18px; border-top: 1px solid rgba(255, 255, 255, 0.07); }
.admin-intelligence-body .sub-supporting > summary { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; cursor: pointer; list-style: none; padding: 16px 2px; color: #cfe0f5; }
.admin-intelligence-body .sub-supporting > summary::-webkit-details-marker { display: none; }
.admin-intelligence-body .sub-supporting > summary span { font-size: 0.88rem; font-weight: 660; }
.admin-intelligence-body .sub-supporting > summary small { color: rgba(150, 176, 208, 0.55); font-size: 0.74rem; }
.admin-intelligence-body .sub-supporting > summary::after { content: ""; margin-left: auto; width: 8px; height: 8px; flex: 0 0 auto; border-right: 2px solid rgba(160, 186, 216, 0.6); border-bottom: 2px solid rgba(160, 186, 216, 0.6); transform: rotate(45deg); transition: transform 180ms ease; }
.admin-intelligence-body .sub-supporting[open] > summary::after { transform: rotate(-135deg); }
.admin-intelligence-body .sub-supporting > summary:focus-visible { outline: 2px solid rgba(96, 170, 255, 0.6); outline-offset: 2px; border-radius: 8px; }
.admin-intelligence-body .sub-supporting-body { padding-top: 4px; }
.admin-intelligence-body .sub-def-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.admin-intelligence-body .sub-def-list li { padding: 10px 12px; border-radius: 10px; background: rgba(255, 255, 255, 0.02); border: 1px solid rgba(255, 255, 255, 0.05); }
.admin-intelligence-body .sub-def-list span { color: #cfe0f5; font-size: 0.82rem; font-weight: 660; }
.admin-intelligence-body .sub-def-list p { margin: 3px 0 0; color: rgba(190, 206, 228, 0.7); font-size: 0.78rem; line-height: 1.45; }

/* ---------------- Responsive ---------------- */
@media (max-width: 1100px) {
  .admin-intelligence-body .admin-main .sub-workspace { grid-template-columns: 1fr; }
  .admin-intelligence-body .sub-review { position: static; max-height: none; }
  .admin-intelligence-body .sub-workspace:not(.has-selection) .sub-review-dock { display: none; }
}

@media (max-width: 760px) {
  .admin-intelligence-body .admin-main .sub-summary { grid-template-columns: 1fr; gap: 14px; }
  .admin-intelligence-body .subsum-context { padding-left: 0; border-left: 0; border-top: 1px solid rgba(255, 255, 255, 0.06); padding-top: 8px; }
  .admin-intelligence-body .sub-kv { grid-template-columns: 1fr; }

  /* Master-detail: selected membership takes over; list chrome hides so the
     in-flow panel leads. No fixed positioning, no containment defect. */
  .admin-intelligence-body .sub-detail-open > .unified-page-header,
  .admin-intelligence-body .sub-detail-open > .context-strip,
  .admin-intelligence-body .sub-detail-open > .first-action-guide,
  .admin-intelligence-body .sub-detail-open > .sub-summary,
  .admin-intelligence-body .sub-detail-open > .sub-attention,
  .admin-intelligence-body .sub-detail-open > .sub-supporting { display: none; }
  .admin-intelligence-body .sub-workspace.has-selection .sub-registry { display: none; }
  .admin-intelligence-body .sub-detail-open .sub-workspace { margin-top: 0; }
  .admin-intelligence-body .sub-workspace.has-selection .sub-review { max-height: none; min-height: 0; overflow: visible; }
  .admin-intelligence-body .sub-workspace.has-selection .sub-review-body { overflow: visible; }
  .admin-intelligence-body .sub-workspace.has-selection .sub-review-head { position: sticky; top: 0; z-index: 3; background: linear-gradient(160deg, rgba(10, 16, 30, 0.99), rgba(8, 12, 22, 0.99)); }

  /* Registry table -> structured cards */
  .admin-intelligence-body .admin-main .sub-registry .admin-table,
  .admin-intelligence-body .admin-main .sub-registry .admin-table tbody,
  .admin-intelligence-body .admin-main .sub-registry .admin-table tr,
  .admin-intelligence-body .admin-main .sub-registry .admin-table td { display: block; width: 100%; }
  .admin-intelligence-body .admin-main .sub-registry .admin-table thead { display: none; }
  .admin-intelligence-body .admin-main .sub-registry .admin-table tr {
    display: grid; gap: 2px; margin-bottom: 10px; padding: 12px 14px;
    border: 1px solid rgba(255, 255, 255, 0.07); border-left: 2px solid rgba(127, 216, 247, 0.5);
    border-radius: 12px; background: rgba(255, 255, 255, 0.022);
  }
  .admin-intelligence-body .admin-main .sub-registry .admin-table td {
    display: flex; align-items: baseline; justify-content: space-between; gap: 12px;
    padding: 5px 0; border-bottom: 0; text-align: right;
  }
  .admin-intelligence-body .admin-main .sub-registry .admin-table td::before {
    content: attr(data-label); flex: 0 0 auto; text-align: left;
    color: rgba(150, 176, 208, 0.6); font-size: 0.62rem; font-weight: 700;
    letter-spacing: 0.08em; text-transform: uppercase;
  }
  /* client -> state -> type(source) -> member since -> scope -> attention -> Review */
  .admin-intelligence-body .admin-main .sub-registry .admin-table td:nth-child(1) {
    order: 1; padding-bottom: 8px; margin-bottom: 4px; border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    font-size: 0.95rem; font-weight: 680;
  }
  .admin-intelligence-body .admin-main .sub-registry .admin-table td:nth-child(1)::before { content: ""; }
  .admin-intelligence-body .admin-main .sub-registry .admin-table td:nth-child(4) { order: 2; }
  .admin-intelligence-body .admin-main .sub-registry .admin-table td:nth-child(2) { order: 3; }
  .admin-intelligence-body .admin-main .sub-registry .admin-table td:nth-child(3) { order: 4; }
  .admin-intelligence-body .admin-main .sub-registry .admin-table td:nth-child(5) { order: 5; }
  .admin-intelligence-body .admin-main .sub-registry .admin-table td:nth-child(6) { order: 6; }
  .admin-intelligence-body .admin-main .sub-registry .admin-table td:last-child {
    order: 7; display: block; text-align: left; padding-top: 10px; margin-top: 6px;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
  }
  .admin-intelligence-body .admin-main .sub-registry .admin-table td:last-child::before { content: ""; }
  .admin-intelligence-body .admin-main .sub-registry .admin-table td:last-child .sub-review-btn { width: 100%; min-height: 40px; }
  .admin-intelligence-body .sub-ent-state { max-width: 52%; }
}

@media (max-width: 420px) {
  .admin-intelligence-body .subsum-lead { grid-template-columns: 1fr; gap: 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .sub-supporting > summary::after,
  .admin-intelligence-body .sub-attn-item { transition: none; }
}

/* ============================================================
   AUREX PORTAL — Slice 1: shared state primitives + one proven
   accessibility fix. Presentation only. Additive and scoped to
   .portal-body so it cannot affect admin. Extends the existing
   .portal-empty-module / .portal-locked-state visual language
   (icon + eyebrow + heading + body + actions) rather than
   introducing a competing system. Uses existing design tokens.
   ============================================================ */

/* ---- Proven a11y fix: login-gate preview tabs had no visible focus.
   Matches the portal's existing 2px focus-visible convention. ---- */
.portal-body .portal-preview-node:focus-visible {
  outline: 2px solid rgba(96, 170, 255, 0.6);
  outline-offset: 2px;
  border-radius: 12px;
}

/* ---- Shared state primitive (loading / empty / locked / unavailable /
   permission-denied / stale / error / action-required). Content is
   caller-supplied (authoritative); the component hard-codes no business
   conclusion. Tone is a restrained accent only. ---- */
.portal-body .portal-state {
  display: grid; justify-items: center; text-align: center; gap: 12px;
  padding: 34px 26px; border-radius: var(--surface-radius);
  border: 1px solid rgba(128, 185, 235, 0.14);
  background: linear-gradient(160deg, rgba(12, 26, 47, 0.62), rgba(7, 15, 28, 0.82));
  box-shadow: var(--module-shadow);
}
.portal-body .portal-state-icon {
  display: grid; place-items: center; width: 52px; height: 52px; border-radius: 15px;
  border: 1px solid rgba(128, 185, 235, 0.2);
  background: rgba(108, 168, 247, 0.08); color: var(--blue);
}
.portal-body .portal-state-icon svg { width: 24px; height: 24px; }
.portal-body .portal-state .eyebrow {
  color: var(--muted); font-size: 0.62rem; font-weight: 700;
  letter-spacing: 0.14em; text-transform: uppercase; margin: 0;
}
.portal-body .portal-state h3 { margin: 0; color: #f3f7ff; font-size: 1.08rem; font-weight: 680; letter-spacing: -0.01em; }
.portal-body .portal-state p { margin: 0; color: var(--muted-strong); font-size: 0.86rem; line-height: 1.55; max-width: 54ch; }
.portal-body .portal-state-actions { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; margin-top: 4px; }

/* Tone accents — status is carried by the eyebrow text + icon, never colour alone. */
.portal-body .portal-state-locked .portal-state-icon,
.portal-body .portal-state-unavailable .portal-state-icon,
.portal-body .portal-state-stale .portal-state-icon { border-color: rgba(231, 199, 106, 0.34); background: rgba(231, 199, 106, 0.1); color: #ecc873; }
.portal-body .portal-state-error .portal-state-icon,
.portal-body .portal-state-permission-denied .portal-state-icon { border-color: rgba(255, 118, 132, 0.34); background: rgba(255, 118, 132, 0.1); color: #ff9aa6; }
.portal-body .portal-state-action-required .portal-state-icon { border-color: rgba(108, 168, 247, 0.4); background: rgba(108, 168, 247, 0.12); color: #8fbcff; }

/* Loading variant: skeleton lines instead of icon/text. */
.portal-body .portal-state-loading { gap: 14px; }
.portal-body .portal-state-skeleton { display: grid; gap: 10px; width: 100%; max-width: 320px; }
.portal-body .portal-state-skeleton span {
  display: block; height: 12px; border-radius: 7px;
  background: linear-gradient(90deg, rgba(128, 185, 235, 0.08) 25%, rgba(128, 185, 235, 0.16) 37%, rgba(128, 185, 235, 0.08) 63%);
  background-size: 400% 100%; animation: portalStateShimmer 1.4s ease infinite;
}
.portal-body .portal-state-skeleton span:nth-child(1) { width: 62%; margin: 0 auto; height: 16px; }
.portal-body .portal-state-skeleton span:nth-child(2) { width: 90%; }
.portal-body .portal-state-skeleton span:nth-child(3) { width: 78%; }
@keyframes portalStateShimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }

/* Compact inline variant for use inside cards/panels. */
.portal-body .portal-state.is-inline { padding: 22px 18px; box-shadow: none; background: rgba(255, 255, 255, 0.02); }
.portal-body .portal-state.is-inline .portal-state-icon { width: 42px; height: 42px; border-radius: 12px; }
.portal-body .portal-state.is-inline .portal-state-icon svg { width: 20px; height: 20px; }

@media (max-width: 560px) {
  .portal-body .portal-state { padding: 26px 16px; }
  .portal-body .portal-state-actions { width: 100%; }
  .portal-body .portal-state-actions .primary-button,
  .portal-body .portal-state-actions .secondary-button { flex: 1 1 auto; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
  .portal-body .portal-state-skeleton span { animation: none; }
}

/* ============================================================
   AUREX PORTAL — premium polish layer (Design Director pass).
   Additive, scoped to .portal-body. Extends the mature system;
   no structural or token changes. Every portal route inherits
   these refinements (KPI cards appear on overview, cashback,
   performance, membership, rewards, etc.).
   ============================================================ */

/* ---- KPI metric cards: definition + a live, premium hover ----
   The cards already declared a transition but had no hover STATE,
   so hovering did nothing. Give them a restrained lift + light. */
.portal-body .portal-stat {
  background: linear-gradient(162deg, rgba(13, 27, 48, 0.5), rgba(6, 14, 28, 0.64));
  border-color: rgba(150, 184, 220, 0.14);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
.portal-body .portal-stat span:first-child { letter-spacing: 0.1em; }
.portal-body .portal-stat strong { font-variant-numeric: tabular-nums; }
/* KPI metric cards are read-only (not clickable), so hover is a restrained
   surface emphasis — no lift or pointer affordance that would imply a click. */
@media (hover: hover) {
  .portal-body .portal-stat:hover {
    border-color: rgba(127, 216, 247, 0.3);
    box-shadow: 0 10px 30px rgba(2, 8, 20, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  }
}

/* ---- Panel headers: crisper eyebrow rhythm across the portal ---- */
.portal-body .panel-header.compact .eyebrow {
  font-weight: 720;
  letter-spacing: 0.14em;
}

/* ---- Glass panels: a whisper of top-edge light for depth (no motion) ---- */
.portal-body .portal-overview-grid .glass-panel,
.portal-body .client-recommendation-panel {
  box-shadow: var(--module-shadow), inset 0 1px 0 rgba(255, 255, 255, 0.045);
}

/* ---- Primary CTA: confident, tactile press (premium button feel) ---- */
.portal-body .portal-route-content .primary-button {
  transition: transform 140ms cubic-bezier(0.22, 0.7, 0.2, 1), box-shadow 160ms ease, filter 160ms ease;
}
@media (hover: hover) {
  .portal-body .portal-route-content .primary-button:hover { filter: brightness(1.05); box-shadow: 0 12px 28px rgba(52, 130, 246, 0.28); }
}
.portal-body .portal-route-content .primary-button:active { transform: translateY(1px); }
@media (prefers-reduced-motion: reduce) {
  .portal-body .portal-route-content .primary-button { transition: none; }
  .portal-body .portal-route-content .primary-button:active { transform: none; }
}

/* ============================================================
   AUREX — Cinematic client login (full-screen two-zone).
   Styling for the rebuilt portalClientLoginGate composition.
   Presentation only; honors prefers-reduced-motion.
   ============================================================ */
.portal-body .portal-cinematic-entry {
  position: fixed; inset: 0; z-index: 40;
  padding: 0; min-height: 100dvh; overflow: auto;
  background: linear-gradient(135deg, #02060e 0%, #050e1e 48%, #071527 100%);
}
.portal-body .portal-cinematic-entry .pce-shell {
  display: grid; grid-template-columns: 1.15fr 0.85fr; min-height: 100dvh; max-width: none;
}

/* ---------- Left: architectural intelligence environment ---------- */
.portal-body .pce-stage {
  position: relative; overflow: hidden; min-height: 100dvh;
  background:
    radial-gradient(150% 120% at 8% -10%, rgba(46, 104, 190, 0.16), transparent 46%),
    linear-gradient(158deg, #060d18 0%, #030812 52%, #01050c 100%);
  border-right: 1px solid rgba(122, 214, 255, 0.08);
}
/* Faint vertical facade rails — architectural, not decorative. */
.portal-body .pce-facade {
  position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(90deg, rgba(140, 190, 240, 0.05) 0 1px, transparent 1px 96px);
  mask-image: linear-gradient(180deg, transparent, #000 22%, #000 78%, transparent);
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 22%, #000 78%, transparent);
}
/* Controlled volumetric light shaft. */
.portal-body .pce-lightshaft {
  position: absolute; top: -30%; left: -10%; width: 62%; height: 160%; pointer-events: none;
  background: linear-gradient(102deg, rgba(96, 156, 232, 0.14), transparent 62%);
  transform: skewX(-12deg); filter: blur(26px); animation: pceDrift 18s ease-in-out infinite alternate;
}
/* Electric-blue edge lighting on the interior seam. */
.portal-body .pce-edge {
  position: absolute; top: 0; right: 0; width: 2px; height: 100%; pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(127, 216, 247, 0.55) 40%, rgba(108, 168, 247, 0.35) 60%, transparent);
  box-shadow: 0 0 26px rgba(108, 168, 247, 0.3);
}
/* Horizontal intelligence rails with a single lit accent. */
.portal-body .pce-rails { position: absolute; inset: 0; pointer-events: none; }
.portal-body .pce-rails span { position: absolute; left: 0; right: 0; height: 1px; background: rgba(140, 190, 240, 0.07); }
.portal-body .pce-rails span:nth-child(1) { top: 30%; }
.portal-body .pce-rails span:nth-child(2) { top: 62%; background: linear-gradient(90deg, transparent, rgba(127, 216, 247, 0.4) 30%, rgba(127, 216, 247, 0.06) 70%, transparent); }
.portal-body .pce-rails span:nth-child(3) { top: 82%; }

.portal-body .pce-stage-content {
  position: relative; z-index: 2; height: 100%; min-height: 100dvh;
  display: grid; grid-template-rows: auto 1fr auto; gap: 20px;
  padding: clamp(34px, 5vw, 68px);
}
.portal-body .pce-stage-top { display: grid; gap: 8px; align-content: start; }
.portal-body .pce-wordmark { color: #eaf2ff; font-size: clamp(1.5rem, 2.2vw, 2rem); font-weight: 780; letter-spacing: 0.34em; }
.portal-body .pce-kicker { color: rgba(150, 186, 224, 0.7); font-size: 0.66rem; font-weight: 700; letter-spacing: 0.24em; text-transform: uppercase; }

.portal-body .pce-statement { align-self: center; max-width: 15ch; }
.portal-body .pce-statement h2 {
  margin: 0; color: #f4f8ff; font-size: clamp(2rem, 3.6vw, 3.15rem); font-weight: 730;
  letter-spacing: -0.03em; line-height: 1.04;
}
.portal-body .pce-statement p {
  margin: 20px 0 0; max-width: 34ch; color: rgba(190, 210, 236, 0.72);
  font-size: clamp(0.92rem, 1.2vw, 1.02rem); line-height: 1.6; letter-spacing: 0.005em;
}

.portal-body .pce-stage-foot { display: grid; gap: 16px; align-content: end; }
.portal-body .pce-index { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0; color: rgba(180, 204, 232, 0.82); font-size: 0.74rem; font-weight: 640; letter-spacing: 0.02em; }
.portal-body .pce-index li { display: inline-flex; align-items: center; }
.portal-body .pce-index li:not(:last-child)::after { content: ""; width: 4px; height: 4px; margin: 0 14px; border-radius: 50%; background: rgba(127, 216, 247, 0.45); }
.portal-body .pce-signals { display: flex; flex-wrap: wrap; gap: 18px; }
.portal-body .pce-signals span { display: inline-flex; align-items: center; gap: 8px; color: rgba(160, 186, 216, 0.66); font-size: 0.7rem; font-weight: 600; letter-spacing: 0.04em; }
.portal-body .pce-signals i { width: 6px; height: 6px; border-radius: 50%; background: #59d390; box-shadow: 0 0 0 3px rgba(89, 211, 144, 0.16); animation: pcePulse 3.4s ease-in-out infinite; }
.portal-body .pce-signals span:nth-child(2) i { background: #7fd8f7; box-shadow: 0 0 0 3px rgba(127, 216, 247, 0.16); animation-delay: -1.1s; }
.portal-body .pce-signals span:nth-child(3) i { background: #c8a96a; box-shadow: 0 0 0 3px rgba(200, 169, 106, 0.16); animation-delay: -2.2s; }

/* Soft data movement — a single sweeping baseline. */
.portal-body .pce-baseline { position: absolute; left: 0; right: 0; bottom: 0; height: 1px; overflow: hidden; background: rgba(140, 190, 240, 0.08); }
.portal-body .pce-baseline span { position: absolute; top: 0; left: -40%; width: 40%; height: 100%; background: linear-gradient(90deg, transparent, rgba(127, 216, 247, 0.7), transparent); animation: pceSweep 6.5s linear infinite; }
@keyframes pceSweep { to { transform: translateX(350%); } }

/* ---------- Right: integrated access panel ---------- */
.portal-body .pce-access {
  display: grid; align-items: center; padding: clamp(28px, 5vw, 64px);
  background: linear-gradient(180deg, rgba(6, 14, 26, 0.4), rgba(4, 10, 20, 0.66));
}
.portal-body .pce-access-inner { width: min(430px, 100%); margin: 0 auto; display: grid; gap: 18px; }
.portal-body .pce-brand { display: flex; align-items: center; gap: 11px; }
.portal-body .pce-brand-mark {
  display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; font-weight: 800; color: #eafaff; letter-spacing: 0.04em;
  background: linear-gradient(145deg, rgba(67, 150, 255, 0.32), rgba(255, 255, 255, 0.05));
  border: 1px solid rgba(130, 211, 255, 0.3); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
}
.portal-body .pce-brand-word { color: #f3f7ff; font-weight: 760; letter-spacing: 0.22em; font-size: 0.95rem; }
.portal-body .pce-heading .eyebrow { color: rgba(143, 200, 255, 0.9); font-size: 0.66rem; font-weight: 800; letter-spacing: 0.22em; text-transform: uppercase; margin: 0 0 8px; }
.portal-body .pce-heading h1 { margin: 0; color: #f6faff; font-size: clamp(1.5rem, 2.5vw, 1.95rem); font-weight: 720; letter-spacing: -0.02em; line-height: 1.12; }
.portal-body .pce-sub { margin: 8px 0 0; color: var(--muted-strong); font-size: 0.92rem; line-height: 1.55; max-width: 40ch; }

.portal-body .pce-form { margin-top: 6px; gap: 13px; }
.portal-body .pce-trust { display: flex; align-items: center; gap: 8px; margin: 2px 0 0; color: rgba(160, 186, 216, 0.72); font-size: 0.74rem; }
.portal-body .pce-trust-dot { width: 7px; height: 7px; border-radius: 50%; background: #59d390; box-shadow: 0 0 0 3px rgba(89, 211, 144, 0.18); flex: 0 0 auto; }

.portal-body .pce-preview-rail { list-style: none; margin: 8px 0 0; padding: 14px 0 0; display: flex; flex-wrap: wrap; gap: 8px; border-top: 1px solid rgba(130, 198, 255, 0.1); }
.portal-body .pce-preview-rail li { display: inline-flex; align-items: center; gap: 7px; padding: 6px 11px; border-radius: 999px; font-size: 0.72rem; font-weight: 600; color: rgba(206, 224, 245, 0.82); background: rgba(255, 255, 255, 0.03); border: 1px solid rgba(122, 214, 255, 0.16); }
.portal-body .pce-chip-icon { display: grid; place-items: center; width: 16px; height: 16px; color: #8fc7ff; }
.portal-body .pce-chip-icon svg { width: 15px; height: 15px; fill: currentColor; }

/* ---------- Entry motion ---------- */
.portal-body .portal-cinematic-entry .pce-access-inner { animation: pceRise 640ms cubic-bezier(0.22, 1, 0.36, 1) both; }
@keyframes pceRise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes pceSpin { to { transform: rotate(360deg); } }
@keyframes pceFlow { to { stroke-dashoffset: -140; } }
@keyframes pcePulse { 0%, 100% { opacity: 0.7; transform: scale(0.96); } 50% { opacity: 1; transform: scale(1.06); } }
@keyframes pceFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes pceDrift { from { transform: translate(-4%, -3%); } to { transform: translate(5%, 4%); } }

/* ---------- Responsive: stage becomes an architectural top band ---------- */
@media (max-width: 900px) {
  .portal-body .portal-cinematic-entry { position: absolute; }
  .portal-body .portal-cinematic-entry .pce-shell { grid-template-columns: 1fr; min-height: auto; }
  .portal-body .pce-stage { min-height: auto; border-right: 0; border-bottom: 1px solid rgba(122, 214, 255, 0.14); }
  .portal-body .pce-edge { top: auto; bottom: 0; left: 0; right: 0; width: 100%; height: 2px; background: linear-gradient(90deg, transparent, rgba(127, 216, 247, 0.5) 45%, transparent); }
  .portal-body .pce-stage-content { min-height: auto; grid-template-rows: auto auto auto; gap: 16px; padding: 30px 22px 26px; }
  .portal-body .pce-statement { max-width: none; align-self: auto; }
  .portal-body .pce-statement h2 { font-size: clamp(1.6rem, 7vw, 2.1rem); }
  .portal-body .pce-statement p { margin-top: 12px; max-width: 46ch; }
  .portal-body .pce-baseline { display: none; }
  .portal-body .pce-access { padding: 26px 22px 44px; }
  .portal-body .pce-access-inner { max-width: 440px; }
}
@media (max-width: 420px) {
  .portal-body .pce-signals { gap: 12px; }
  .portal-body .pce-signals span:nth-child(3) { display: none; }
  .portal-body .pce-preview-rail li { font-size: 0.68rem; padding: 5px 9px; }
}

@media (prefers-reduced-motion: reduce) {
  .portal-body .pce-lightshaft,
  .portal-body .pce-signals i,
  .portal-body .pce-baseline span,
  .portal-body .portal-cinematic-entry .pce-access-inner { animation: none; }
}
/* ============================================================
   AUREX CLIENT PRODUCT SHELL V2
   One scoped, authoritative product layer for the authenticated
   client application. Existing secure-entry styling remains intact.
   ============================================================ */
.portal-product-v2 {
  --portal-v2-bg: #050b16;
  --portal-v2-sidebar: rgba(7, 15, 29, 0.94);
  --portal-v2-surface: rgba(12, 25, 45, 0.78);
  --portal-v2-surface-strong: rgba(15, 31, 54, 0.92);
  --portal-v2-line: rgba(151, 190, 228, 0.14);
  --portal-v2-line-strong: rgba(126, 211, 241, 0.28);
  --portal-v2-text: #f2f5f8;
  --portal-v2-muted: #9db0c7;
  --portal-v2-cyan: #82daf4;
  --portal-v2-blue: #6da8f4;
  --portal-v2-green: #68d29b;
  --portal-v2-amber: #d7b969;
  min-height: 100vh;
  background:
    radial-gradient(circle at 82% 2%, rgba(66, 121, 190, 0.13), transparent 34rem),
    linear-gradient(145deg, #050b16 0%, #07111f 56%, #050b16 100%);
  color: var(--portal-v2-text);
  overflow-x: hidden;
}

.portal-product-v2::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(rgba(255,255,255,0.012) 1px, transparent 1px);
  background-size: 100% 64px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,0.28), transparent 62%);
}

.portal-product-v2 .portal-shell {
  display: grid;
  grid-template-columns: 264px minmax(0, 1fr);
  min-height: 100vh;
  width: 100%;
  max-width: none;
  margin: 0;
  gap: 0;
}

.portal-product-v2 .portal-sidebar {
  position: sticky;
  top: 0;
  z-index: 30;
  display: flex;
  flex-direction: column;
  width: 264px;
  height: 100vh;
  min-height: 100vh;
  padding: 22px 16px 16px;
  border: 0;
  border-right: 1px solid var(--portal-v2-line);
  border-radius: 0;
  background: var(--portal-v2-sidebar);
  box-shadow: 22px 0 60px rgba(0, 0, 0, 0.22), inset -1px 0 rgba(255,255,255,0.02);
  backdrop-filter: blur(26px) saturate(125%);
  overflow-y: auto;
  overflow-x: hidden;
}

.portal-product-v2 .portal-sidebar .brand-lockup {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  margin: 0 0 20px;
  padding: 0 7px 17px;
  border: 0;
  border-bottom: 1px solid var(--portal-v2-line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.portal-product-v2 .portal-sidebar .brand-mark {
  display: grid;
  place-items: center;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(130, 218, 244, 0.34);
  border-radius: 8px;
  background: rgba(87, 162, 220, 0.1);
  color: #eefaff;
  box-shadow: inset 0 1px rgba(255,255,255,0.1), 0 0 20px rgba(58, 155, 211, 0.08);
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.portal-product-v2 .portal-sidebar .brand-kicker {
  margin: 0 0 3px;
  color: var(--portal-v2-cyan);
  font-size: 0.61rem;
  font-weight: 750;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.portal-product-v2 .portal-sidebar h1 {
  margin: 0;
  color: var(--portal-v2-text);
  font-size: 0.96rem;
  font-weight: 680;
  line-height: 1.25;
  letter-spacing: 0;
}

.portal-product-v2 .portal-sidebar .nav-list {
  display: grid;
  gap: 17px;
  margin: 0;
  padding: 0;
}

.portal-product-v2 .portal-nav-group {
  display: grid;
  gap: 4px;
}

.portal-product-v2 .portal-nav-group > span {
  padding: 0 10px 4px;
  color: rgba(159, 181, 208, 0.58);
  font-size: 0.61rem;
  font-weight: 760;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.portal-product-v2 .portal-sidebar .nav-item {
  position: relative;
  display: grid;
  grid-template-columns: 19px minmax(0, 1fr);
  align-items: center;
  gap: 11px;
  width: 100%;
  min-height: 38px;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: rgba(208, 220, 235, 0.76);
  font-size: 0.82rem;
  font-weight: 560;
  line-height: 1.2;
  letter-spacing: 0;
  transition: color 140ms ease, background-color 140ms ease, border-color 140ms ease;
}

.portal-product-v2 .portal-sidebar .nav-item svg {
  width: 18px;
  height: 18px;
  fill: currentColor;
  opacity: 0.74;
}

.portal-product-v2 .portal-sidebar .nav-item:hover {
  border-color: rgba(139, 191, 230, 0.12);
  background: rgba(102, 165, 218, 0.055);
  color: #edf7ff;
  transform: none;
}

.portal-product-v2 .portal-sidebar .nav-item.is-active {
  border-color: rgba(126, 211, 241, 0.2);
  background: linear-gradient(90deg, rgba(81, 154, 211, 0.18), rgba(77, 137, 190, 0.055));
  color: #f4fbff;
  box-shadow: inset 2px 0 var(--portal-v2-cyan), inset 0 1px rgba(255,255,255,0.04);
}

.portal-product-v2 .portal-sidebar .nav-item.is-active svg { color: var(--portal-v2-cyan); opacity: 1; }
.portal-product-v2 .portal-sidebar .nav-item::after { display: none; }

.portal-product-v2 .portal-sidebar-client {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr) 8px;
  align-items: center;
  gap: 10px;
  margin-top: auto;
  padding: 14px 8px 2px;
  border-top: 1px solid var(--portal-v2-line);
}

.portal-product-v2 .portal-sidebar-client .portal-avatar {
  width: 38px;
  height: 38px;
  font-size: 0.7rem;
}

.portal-product-v2 .portal-sidebar-client > div { display: grid; gap: 3px; min-width: 0; }
.portal-product-v2 .portal-sidebar-client strong { overflow: hidden; color: #edf4fb; font-size: 0.76rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.portal-product-v2 .portal-sidebar-client span { overflow: hidden; color: var(--portal-v2-muted); font-size: 0.64rem; text-overflow: ellipsis; white-space: nowrap; }
.portal-product-v2 .portal-sidebar-client > i { width: 7px; height: 7px; border-radius: 50%; background: var(--portal-v2-green); box-shadow: 0 0 0 4px rgba(104,210,155,0.08); }
.portal-product-v2 .portal-sidebar-client > i.is-attention { background: var(--portal-v2-amber); box-shadow: 0 0 0 4px rgba(215,185,105,0.08); }

.portal-product-v2 .portal-main {
  min-width: 0;
  width: 100%;
  padding: 0;
  background: transparent;
}

.portal-product-v2 .portal-main .portal-topbar {
  position: sticky;
  top: 0;
  z-index: 24;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  min-height: 78px;
  margin: 0;
  padding: 14px clamp(22px, 3vw, 44px);
  border: 0;
  border-bottom: 1px solid var(--portal-v2-line);
  border-radius: 0;
  background: rgba(5, 12, 23, 0.8);
  box-shadow: 0 16px 38px rgba(0,0,0,0.12);
  backdrop-filter: blur(22px) saturate(120%);
}

.portal-product-v2 .portal-page-heading { display: grid; gap: 2px; min-width: 0; }
.portal-product-v2 .portal-page-heading .eyebrow { margin: 0; color: rgba(130,218,244,0.72); font-size: 0.6rem; letter-spacing: 0.12em; }
.portal-product-v2 .portal-main .portal-page-heading h2 { margin: 0; color: var(--portal-v2-text); font-size: clamp(1.28rem, 2vw, 1.72rem); font-weight: 660; line-height: 1.16; letter-spacing: 0; }
.portal-product-v2 .portal-main .portal-page-heading > p:last-child { margin: 3px 0 0; color: var(--portal-v2-muted); font-size: 0.78rem; line-height: 1.35; }

.portal-product-v2 .portal-topbar-actions { display: flex; align-items: center; justify-content: flex-end; gap: 10px; }
.portal-product-v2 .portal-account-signal { display: flex; align-items: center; gap: 7px; min-height: 34px; padding: 0 10px; border: 1px solid rgba(104,210,155,0.13); border-radius: 7px; background: rgba(104,210,155,0.045); color: #b7d8c6; font-size: 0.68rem; white-space: nowrap; }
.portal-product-v2 .portal-account-signal i { width: 6px; height: 6px; border-radius: 50%; background: var(--portal-v2-green); }
.portal-product-v2 .portal-icon-button { position: relative; display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 1px solid var(--portal-v2-line); border-radius: 7px; background: rgba(255,255,255,0.025); color: #c8d8ea; cursor: pointer; }
.portal-product-v2 .portal-icon-button:hover { border-color: var(--portal-v2-line-strong); background: rgba(113,184,228,0.07); color: #fff; }
.portal-product-v2 .portal-icon-button svg { width: 18px; height: 18px; fill: currentColor; }
.portal-product-v2 .portal-icon-button > span { position: absolute; top: -5px; right: -5px; display: grid; place-items: center; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px; background: var(--portal-v2-amber); color: #09111d; font-size: 0.58rem; font-weight: 800; }

.portal-product-v2 .portal-main .portal-identity { display: flex; align-items: center; gap: 9px; min-width: 0; padding: 0 8px 0 2px; border: 0; background: transparent; }
.portal-product-v2 .portal-main .portal-identity .portal-avatar { width: 36px; height: 36px; }
.portal-product-v2 .portal-main .portal-identity > div { display: grid; gap: 2px; max-width: 180px; }
.portal-product-v2 .portal-main .portal-identity strong { overflow: hidden; color: #edf5fc; font-size: 0.75rem; text-overflow: ellipsis; white-space: nowrap; }
.portal-product-v2 .portal-main .portal-identity span { color: var(--portal-v2-muted); font-size: 0.62rem; white-space: nowrap; }

.portal-product-v2 .portal-notification-center {
  position: absolute;
  top: calc(100% + 10px);
  right: 40px;
  z-index: 40;
  display: none;
  width: min(430px, calc(100vw - 32px));
  max-height: min(580px, calc(100vh - 110px));
  padding: 14px;
  border: 1px solid var(--portal-v2-line-strong);
  border-radius: 10px;
  background: rgba(9, 20, 37, 0.97);
  box-shadow: 0 24px 70px rgba(0,0,0,0.48), inset 0 1px rgba(255,255,255,0.04);
  backdrop-filter: blur(26px);
  overflow: auto;
}
.portal-product-v2 .portal-notification-center.is-open { display: block; }

.portal-product-v2 .portal-route-content {
  width: min(100%, 1540px);
  min-height: calc(100vh - 78px);
  margin: 0 auto;
  padding: clamp(22px, 3vw, 42px) clamp(20px, 3.2vw, 48px) 64px;
  opacity: 1;
}

.portal-product-v2 .portal-route-content.route-content-enter { animation: portalV2Content 145ms ease-out both; }
.portal-product-v2 .page-rise,
.portal-product-v2 .page-load-panel { animation: none; transform: none; }
@keyframes portalV2Content { from { opacity: 0.72; } to { opacity: 1; } }

.portal-product-v2 .glass-panel,
.portal-product-v2 .portal-stat,
.portal-product-v2 .portal-service-workspace,
.portal-product-v2 .portal-overview-hero,
.portal-product-v2 .portal-service-gate {
  border: 1px solid var(--portal-v2-line);
  background: linear-gradient(150deg, rgba(17,34,58,0.76), rgba(8,18,33,0.82));
  box-shadow: 0 18px 46px rgba(0,0,0,0.18), inset 0 1px rgba(255,255,255,0.035);
  backdrop-filter: blur(18px) saturate(115%);
}

.portal-product-v2 :is(a, button, input, textarea, select):focus-visible { outline: 2px solid rgba(130,218,244,0.78); outline-offset: 2px; }
.portal-product-v2 :is(input, textarea, select) { border: 1px solid rgba(143,180,218,0.18); border-radius: 7px; background: #0a1729; color: #eef5fb; }
.portal-product-v2 :is(input, textarea, select):focus { border-color: rgba(130,218,244,0.52); box-shadow: 0 0 0 3px rgba(73,157,211,0.1); }
.portal-product-v2 :is(input, textarea, select):disabled { color: rgba(174,193,216,0.5); opacity: 0.72; }
.portal-product-v2 .primary-button { border-radius: 7px; background: linear-gradient(180deg, #88ddf5, #5ca9dc); color: #07111e; box-shadow: 0 8px 22px rgba(53,137,190,0.18), inset 0 1px rgba(255,255,255,0.45); font-weight: 720; }
.portal-product-v2 .primary-button:hover { filter: brightness(1.04); transform: translateY(-1px); }
.portal-product-v2 .secondary-button { border-radius: 7px; border-color: rgba(137,183,221,0.2); background: rgba(255,255,255,0.025); color: #d9e6f2; }

.portal-product-v2 .portal-overview-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(360px, 0.9fr);
  gap: 28px;
  align-items: stretch;
  padding: clamp(24px, 3vw, 38px);
  border-radius: 12px;
  border-color: rgba(126,211,241,0.2);
}
.portal-product-v2 .portal-overview-welcome { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; min-height: 190px; }
.portal-product-v2 .portal-overview-welcome h2 { margin: 5px 0 10px; max-width: 18ch; color: #f5f8fb; font-size: clamp(1.75rem, 3.4vw, 2.25rem); font-weight: 640; line-height: 1.13; letter-spacing: 0; }
.portal-product-v2 .portal-overview-welcome > p:not(.eyebrow) { max-width: 58ch; margin: 0; color: var(--portal-v2-muted); font-size: 0.92rem; line-height: 1.6; }
.portal-product-v2 .portal-overview-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 23px; }
.portal-product-v2 .portal-overview-status { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--portal-v2-line); border-radius: 9px; background: var(--portal-v2-line); }
.portal-product-v2 .portal-overview-status > div { display: grid; align-content: center; gap: 5px; min-height: 94px; padding: 16px; background: rgba(7,16,30,0.9); }
.portal-product-v2 .portal-overview-status span { color: var(--portal-v2-muted); font-size: 0.65rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; }
.portal-product-v2 .portal-overview-status strong { color: #eef6fc; font-size: 0.92rem; font-weight: 650; }
.portal-product-v2 .portal-overview-status small { color: rgba(157,176,199,0.66); font-size: 0.67rem; line-height: 1.35; }

.portal-product-v2 .portal-overview-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
.portal-product-v2 .portal-overview-metrics .portal-stat { min-height: 116px; padding: 17px 18px; border-radius: 9px; }
.portal-product-v2 .portal-overview-metrics .portal-stat strong { font-size: clamp(1.1rem, 2vw, 1.45rem); letter-spacing: 0; }
.portal-product-v2 .portal-overview-workspace { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(290px, 0.75fr); gap: 16px; margin-top: 16px; }
.portal-product-v2 .portal-overview-primary,
.portal-product-v2 .portal-overview-rail { display: grid; align-content: start; gap: 16px; min-width: 0; }
.portal-product-v2 .portal-overview-workspace :is(.client-recommendation-panel,.intelligence-timeline-panel,.portal-profile-card,.portal-performance-card,.portal-overview-placeholder) { margin: 0; border-radius: 10px; }
.portal-product-v2 .portal-overview-placeholder { display: flex; align-items: center; justify-content: space-between; gap: 20px; min-height: 150px; padding: 20px; }
.portal-product-v2 .portal-overview-placeholder h3 { margin: 4px 0 6px; font-size: 1rem; }
.portal-product-v2 .portal-overview-placeholder p { margin: 0; color: var(--portal-v2-muted); font-size: 0.8rem; line-height: 1.5; }

.portal-product-v2 .portal-service-workspace { display: grid; gap: 16px; padding: clamp(18px, 2.4vw, 28px); border-radius: 12px; }
.portal-product-v2 .portal-service-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 24px; padding-bottom: 17px; border-bottom: 1px solid var(--portal-v2-line); }
.portal-product-v2 .portal-service-header h2 { margin: 4px 0 7px; color: #f3f7fb; font-size: clamp(1.55rem, 2.5vw, 2rem); font-weight: 660; line-height: 1.15; letter-spacing: 0; }
.portal-product-v2 .portal-service-header p:not(.eyebrow) { max-width: 66ch; margin: 0; color: var(--portal-v2-muted); font-size: 0.85rem; line-height: 1.5; }
.portal-product-v2 .portal-service-statuses { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.portal-product-v2 .portal-service-context { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--portal-v2-line); border-radius: 8px; background: var(--portal-v2-line); }
.portal-product-v2 .portal-service-context article { display: grid; gap: 5px; min-height: 78px; padding: 14px; background: rgba(7,16,30,0.92); }
.portal-product-v2 .portal-service-context span,
.portal-product-v2 .portal-service-side span,
.portal-product-v2 .portal-chart-summary span { color: var(--portal-v2-muted); font-size: 0.62rem; font-weight: 740; letter-spacing: 0.07em; text-transform: uppercase; }
.portal-product-v2 .portal-service-context strong { color: #e7f1fa; font-size: 0.8rem; line-height: 1.35; }
.portal-product-v2 .portal-service-primary-grid { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(260px, 0.65fr); gap: 14px; }
.portal-product-v2 .portal-intelligence-stage,
.portal-product-v2 .portal-chart-stage { display: grid; align-content: start; min-height: 390px; overflow: hidden; border: 1px solid var(--portal-v2-line); border-radius: 10px; background: rgba(5,13,25,0.64); }
.portal-product-v2 .portal-stage-toolbar,
.portal-product-v2 .portal-chart-commandbar { display: flex; align-items: end; gap: 9px; padding: 13px; border-bottom: 1px solid var(--portal-v2-line); background: rgba(255,255,255,0.018); }
.portal-product-v2 .portal-stage-toolbar label,
.portal-product-v2 .portal-chart-commandbar label { display: grid; gap: 5px; min-width: 145px; color: var(--portal-v2-muted); font-size: 0.62rem; font-weight: 700; }
.portal-product-v2 .portal-stage-toolbar select,
.portal-product-v2 .portal-chart-commandbar select { min-height: 38px; }
.portal-product-v2 .portal-service-gate { display: grid; grid-template-columns: 42px minmax(0,1fr) auto; align-items: center; gap: 16px; margin: auto; width: min(92%, 760px); padding: 20px; border-radius: 10px; }
.portal-product-v2 .portal-service-gate-icon { display: grid; place-items: center; width: 40px; height: 40px; border: 1px solid rgba(215,185,105,0.28); border-radius: 8px; background: rgba(215,185,105,0.08); color: #e5c979; font-size: 1rem; font-weight: 800; }
.portal-product-v2 .portal-service-gate h3 { margin: 4px 0 6px; color: #f2f6fa; font-size: 1rem; font-weight: 650; line-height: 1.35; letter-spacing: 0; }
.portal-product-v2 .portal-service-gate p:not(.eyebrow) { margin: 0; color: var(--portal-v2-muted); font-size: 0.78rem; line-height: 1.5; }
.portal-product-v2 .portal-service-gate-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.portal-product-v2 .portal-service-side { display: grid; gap: 9px; align-content: start; }
.portal-product-v2 .portal-service-side article,
.portal-product-v2 .portal-chart-summary article { display: grid; gap: 6px; padding: 16px; border: 1px solid var(--portal-v2-line); border-radius: 9px; background: rgba(255,255,255,0.018); }
.portal-product-v2 .portal-service-side strong,
.portal-product-v2 .portal-chart-summary strong { color: #e7f0f8; font-size: 0.83rem; font-weight: 630; }
.portal-product-v2 .portal-service-side p { margin: 0; color: var(--portal-v2-muted); font-size: 0.72rem; line-height: 1.45; }
.portal-product-v2 .portal-disabled-composer { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 9px; padding-top: 4px; }
.portal-product-v2 .portal-disabled-composer input { min-height: 44px; }
.portal-product-v2 #toggleScreenshotCropBtn { position: absolute; right: 10px; bottom: 10px; z-index: 3; }
.portal-product-v2 .portal-main .carlos-head,
.portal-product-v2 .portal-main .chart-reader-head { padding: 0 0 17px; border-bottom: 1px solid var(--portal-v2-line); }
.portal-product-v2 .portal-main .carlos-head h2,
.portal-product-v2 .portal-main .chart-reader-head h2 { font-size: clamp(1.55rem, 2.5vw, 2rem); letter-spacing: 0; }
.portal-product-v2 .carlos-market-workspace { display: grid; gap: 12px; padding: 18px; border: 1px solid rgba(126,211,241,0.17); border-radius: 10px; background: linear-gradient(145deg, rgba(17,38,63,0.68), rgba(7,17,31,0.78)); }
.portal-product-v2 .carlos-market-command { display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.portal-product-v2 .carlos-market-command h3 { margin: 3px 0 4px; color: #f0f6fb; font-size: 1.02rem; }
.portal-product-v2 .carlos-market-command p:not(.eyebrow) { margin: 0; color: var(--portal-v2-muted); font-size: 0.76rem; }
.portal-product-v2 .carlos-market-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--portal-v2-line); border-radius: 7px; background: var(--portal-v2-line); }
.portal-product-v2 .carlos-market-metrics article { display: grid; gap: 4px; padding: 12px; background: rgba(5,14,27,0.9); }
.portal-product-v2 .carlos-market-metrics span,
.portal-product-v2 .carlos-market-scenarios span { color: var(--portal-v2-muted); font-size: 0.59rem; font-weight: 740; letter-spacing: 0.07em; text-transform: uppercase; }
.portal-product-v2 .carlos-market-metrics strong { color: #e8f2f9; font-size: 0.79rem; }
.portal-product-v2 .carlos-market-scenarios { display: grid; grid-template-columns: 1.25fr 1fr 1fr; gap: 8px; }
.portal-product-v2 .carlos-market-scenarios article { padding: 12px; border: 1px solid var(--portal-v2-line); border-radius: 7px; background: rgba(255,255,255,0.016); }
.portal-product-v2 .carlos-market-scenarios p { margin: 5px 0 0; color: #d2dfec; font-size: 0.72rem; line-height: 1.45; }
.portal-product-v2 .carlos-composer-context { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.portal-product-v2 .carlos-composer-context label { display: grid; gap: 5px; color: var(--portal-v2-muted); font-size: 0.62rem; font-weight: 700; }
.portal-product-v2 .carlos-composer-context select { min-height: 38px; }

.portal-product-v2.portal-secure-gated .portal-shell { display: block; }
.portal-product-v2.portal-secure-gated .portal-sidebar { display: none; }
.portal-product-v2.portal-secure-gated .portal-main { min-height: 100vh; }

@media (max-width: 1120px) {
  .portal-product-v2 .portal-shell { grid-template-columns: 224px minmax(0,1fr); }
  .portal-product-v2 .portal-sidebar { width: 224px; padding-inline: 12px; }
  .portal-product-v2 .portal-overview-hero { grid-template-columns: 1fr; }
  .portal-product-v2 .portal-overview-status { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .portal-product-v2 .portal-overview-status > div { min-height: 84px; }
  .portal-product-v2 .portal-overview-workspace { grid-template-columns: minmax(0,1.4fr) minmax(260px,0.7fr); }
  .portal-product-v2 .portal-account-signal { display: none; }
}

@media (max-width: 820px) {
  .portal-product-v2 { padding-bottom: 68px; }
  .portal-product-v2 .portal-shell { display: block; min-height: 100vh; }
  .portal-product-v2 .portal-sidebar { display: none; }
  .portal-product-v2 .portal-mobile-topbar,
  .portal-product-v2 .portal-bottom-nav { display: flex; }
  .portal-product-v2 .portal-main .portal-topbar { position: sticky; top: 58px; min-height: 64px; padding: 10px 16px; }
  .portal-product-v2 .portal-page-heading .eyebrow,
  .portal-product-v2 .portal-page-heading > p:last-child { display: none; }
  .portal-product-v2 .portal-main .portal-page-heading h2 { font-size: 1.15rem; }
  .portal-product-v2 .portal-main .portal-identity { display: none; }
  .portal-product-v2 .portal-route-content { min-height: calc(100vh - 122px); padding: 16px 14px 88px; }
  .portal-product-v2 .portal-notification-center { position: fixed; top: 68px; right: 12px; }
  .portal-product-v2 .portal-overview-hero,
  .portal-product-v2 .portal-overview-workspace,
  .portal-product-v2 .portal-service-primary-grid { grid-template-columns: 1fr; }
  .portal-product-v2 .portal-overview-status,
  .portal-product-v2 .portal-overview-metrics,
  .portal-product-v2 .portal-service-context,
  .portal-product-v2 .carlos-market-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .portal-product-v2 .portal-chart-stage { min-height: 400px; }
}

@media (max-width: 560px) {
  .portal-product-v2 .portal-topbar-actions { gap: 6px; }
  .portal-product-v2 .portal-overview-hero { gap: 18px; padding: 20px; }
  .portal-product-v2 .portal-overview-welcome { min-height: 0; }
  .portal-product-v2 .portal-overview-welcome h2 { font-size: 1.55rem; }
  .portal-product-v2 .portal-overview-status,
  .portal-product-v2 .portal-overview-metrics,
  .portal-product-v2 .portal-service-context,
  .portal-product-v2 .carlos-market-metrics,
  .portal-product-v2 .carlos-market-scenarios,
  .portal-product-v2 .carlos-composer-context { grid-template-columns: 1fr; }
  .portal-product-v2 .portal-service-header,
  .portal-product-v2 .carlos-market-command { flex-direction: column; align-items: flex-start; }
  .portal-product-v2 .portal-service-statuses { justify-content: flex-start; }
  .portal-product-v2 .portal-stage-toolbar,
  .portal-product-v2 .portal-chart-commandbar { display: grid; grid-template-columns: 1fr 1fr; align-items: end; }
  .portal-product-v2 .portal-stage-toolbar label,
  .portal-product-v2 .portal-chart-commandbar label { min-width: 0; }
  .portal-product-v2 .portal-service-gate { grid-template-columns: 36px minmax(0,1fr); margin-block: 18px; padding: 15px; }
  .portal-product-v2 .portal-service-gate-actions { grid-column: 1 / -1; justify-content: stretch; }
  .portal-product-v2 .portal-service-gate-actions a { flex: 1 1 140px; justify-content: center; }
  .portal-product-v2 .portal-disabled-composer { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .portal-product-v2 .portal-route-content.route-content-enter { animation: none; }
  .portal-product-v2 :is(.primary-button,.secondary-button,.nav-item,.portal-icon-button) { transition: none; }
  .portal-product-v2 .primary-button:hover { transform: none; }
}

/* ============================================================
   AUREX Chart Reader — experience polish.
   Structure unchanged; refines guidance, typography, surface
   rhythm and the grouped premium treatment. Presentation only.
   ============================================================ */

/* ---- Contextual guidance: native to the workspace, not documentation ---- */

/* ---- Readiness preview: shows what Carlos will produce, before analysis ---- */

/* ---- One grouped premium treatment (replaces repeated locked rows) ---- */

/* ---- Typography discipline: no marketing scale inside the workstation ---- */

/* ---- Reduce the "big box" feeling: thinner dividers, calmer separation ---- */

/* ---- Confidence: readable band, restrained fill ---- */

/* ---- Primary action: important without becoming oversized ---- */

/* ---- Analysis phases: current step reads clearly, history stays quiet ---- */

/* ---- Responsive: chart stays dominant; guidance never crowds ---- */

/* ============================================================
   AUREX Chart Reader — connected intelligence journey.
   Live context status, signature completion light path, and a
   connected ecosystem flow. Presentation only; regions unchanged.
   ============================================================ */

/* ---- Live context status: the workspace narrates the current focus ---- */
@keyframes crStatusIn { from { opacity: 0.35; transform: translateY(-2px); } to { opacity: 1; transform: none; } }

/* ---- Signature completion light path: chart → intelligence → approach ---- */
@keyframes crLightPass {
  0% { box-shadow: 0 0 0 0 rgba(127, 216, 247, 0); }
  40% { box-shadow: 0 0 0 1px rgba(127, 216, 247, 0.34), 0 8px 30px rgba(52, 130, 246, 0.16); }
  100% { box-shadow: 0 0 0 0 rgba(127, 216, 247, 0); }
}

/* ---- Trust note: quiet, not a warning ---- */

/* ---- Connected ecosystem journey: one workflow, not six cards ---- */
.portal-body .portal-service-transitions::before {
  content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(127, 216, 247, 0.18) 12%, rgba(127, 216, 247, 0.18) 88%, transparent);
}

/* ---- Candle readiness reads as a requirement, not an error ---- */

/* ---- Supporting microcopy inside the primary action stays small ---- */

/* ============================================================
   AUREX Chart Reader — experience architecture.
   Progressive disclosure (Refine Analysis), reduced big-box
   effect, and calmer surface rhythm. Presentation only.
   ============================================================ */

/* ---- Essential inputs stay compact and horizontal ---- */

/* ---- Refine Analysis: advanced controls collapsed by default ---- */

/* ---- Reduce the big-box effect: one workstation, not sixteen cards ---- */

/* ---- Quiet environmental depth behind the workstation (no bloom) ---- */

/* ============================================================
   AUREX chart lifecycle states.
   The chart panel owns initializing / loading / delayed / error
   so a stalled provider feed is never an unexplained black area.
   ============================================================ */

/* Compact spinner — restrained, not decorative. */
@keyframes crChartSpin { to { transform: rotate(360deg); } }

/* State accents: amber when delayed, red only for a genuine error. */

/* Chart state copy must read as sentences, not as a system banner. */

/* ============================================================
   AUREX Chart Reader — analysis dock.
   One authoritative line that always states what the workspace
   is doing. Driven entirely by [data-experience] on the
   workstation, so no surface keeps its own status flag.
   ============================================================ */

/* Per-state marker colour: blue while working, gold on a finished briefing,
   amber for a stalled feed, red only for a genuine failure. *
@keyframes crDockPulse { 50% { box-shadow: 0 0 0 8px rgba(127, 216, 247, 0.05); } }

/* The Decision Briefing is hidden until a report exists, then it leads. */

/* ============================================================
   Chart geometry.
   The chart must hold one stable cinematic frame. Before this,
   a long Carlos column stretched the grid row and dragged the
   chart to ~1600px, leaving a large dead area above the candles.
   The chart now keeps its own height and the intelligence
   column scrolls independently.
   ============================================================ */

/* ============================================================
   Carlos Intelligence readability.
   These rows carry sentences, not single figures. A 94px label
   column with right-aligned values crushed them into ragged
   two-word lines, so each row now reads as caption-above-value.
   ============================================================ */

/* The briefing lead — bias and confidence read first. */

/* Keep the scroll gutter off the text. */
/* Launch Task 2: registered-client control surface. Scoped to avoid changing other admin modules. */
.client-control-toolbar{display:flex;align-items:end;gap:14px;flex-wrap:wrap;margin:18px 0;padding:16px;border:1px solid rgba(126,196,236,.18);background:rgba(7,22,38,.72);border-radius:10px}
.client-control-toolbar label{display:grid;gap:6px;color:#8ea4bb;font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.client-control-toolbar input,.client-control-toolbar select{min-height:38px;min-width:190px;padding:0 11px;border:1px solid rgba(142,192,224,.22);border-radius:6px;background:#071422;color:#e7f0f8}
.client-search-field{flex:1 1 320px}.client-result-count{margin-left:auto;color:#a5c3d8;font-size:12px}
.table-subline{display:block;margin-top:4px;color:#7891a8;font-size:11px}.table-link-button{border:0;background:none;color:#9ddfff;text-decoration:underline;cursor:pointer;padding:0;font:inherit}.client-control-actions{display:flex;gap:6px;flex-wrap:wrap;min-width:260px}.client-detail-modal{max-width:760px}.client-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin:18px 0;background:rgba(142,192,224,.14)}.client-detail-grid>div{padding:14px;background:#091827}.client-detail-grid dt{color:#7891a8;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.client-detail-grid dd{margin:6px 0 0;color:#edf5fb;font-weight:600}.client-detail-actions{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.client-detail-audit{border-top:1px solid rgba(142,192,224,.16);padding-top:16px}.client-detail-audit ol{margin:0;padding-left:18px}.client-detail-audit li{display:grid;grid-template-columns:1fr auto;gap:3px 14px;padding:9px 0;border-bottom:1px solid rgba(142,192,224,.1)}.client-detail-audit small{grid-column:1 / -1;color:#8ea4bb}
@media (max-width:760px){.client-result-count{width:100%;margin-left:0}.client-detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.client-control-actions{min-width:180px}.client-control-actions .compact-action{flex:1 1 auto}}
.client-operations-panel{margin:18px 0;border:1px solid rgba(142,192,224,.18);background:rgba(8,24,39,.72);border-radius:8px;overflow:hidden}.client-operations-panel>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;cursor:pointer;list-style:none}.client-operations-panel>summary::-webkit-details-marker{display:none}.client-operations-panel>summary strong{display:block;color:#edf5fb}.client-operations-panel>summary small{display:block;margin-top:4px;color:#7891a8;font-size:11px}.client-operations-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:0 16px 16px}.client-operations-groups section{min-width:0;padding-top:12px;border-top:1px solid rgba(142,192,224,.1)}.client-operations-groups .client-detail-actions{margin:8px 0 0}.client-operations-groups .compact-action{white-space:normal}.client-operations-audit{margin:0 16px 16px;padding-top:14px;border-top:1px solid rgba(142,192,224,.1)}.client-operations-audit .panel-header{margin:0 0 8px}.client-audit-list{display:grid;gap:8px;margin:0;padding:0;list-style:none}.client-audit-list li{display:grid;gap:5px;padding:10px 12px;background:rgba(4,14,25,.66);border:1px solid rgba(142,192,224,.1);border-radius:6px}.client-audit-list li strong{color:#edf5fb;text-transform:capitalize}.client-audit-list li span,.client-audit-list li small{color:#8ea4bb}.client-audit-list code{display:block;max-height:36px;overflow:auto;color:#b9d7e8;font:11px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre-wrap;overflow-wrap:anywhere}.client-audit-list .compact-action{justify-self:start}@media(max-width:640px){.client-operations-panel>summary{align-items:flex-start;flex-direction:column}.client-operations-groups{grid-template-columns:1fr}.client-operations-audit{margin-inline:12px}}
.admin-intelligence-body .client-detail-modal .client-operations-panel{height:auto;max-height:none;overflow:visible}
.client-bulk-action-bar{position:sticky;top:12px;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;margin:0 0 12px;padding:12px 14px;border:1px solid rgba(104,205,241,.3);border-radius:9px;background:linear-gradient(110deg,rgba(8,28,46,.97),rgba(10,22,38,.94));box-shadow:0 12px 30px rgba(0,0,0,.24),0 0 22px rgba(92,201,239,.08)}.client-bulk-action-bar>div:first-child{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.client-bulk-action-bar strong{color:#f1f7fb}.client-bulk-action-bar span{color:#89a3b8;font-size:11px}.client-bulk-actions{display:flex;gap:7px;flex-wrap:wrap}.client-select-all{display:flex;align-items:center;gap:7px;color:#c7eafa;font-size:12px}.client-select-all input,.admin-table input[type=checkbox]{accent-color:#67c9ee}.client-priority{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;color:#a7b9c9;font-size:11px}.client-priority i{width:7px;height:7px;border-radius:50%;background:#7892a7;box-shadow:0 0 0 3px rgba(120,146,167,.08)}.client-priority-critical{color:#ff9ca6}.client-priority-critical i{background:#ef6979;box-shadow:0 0 0 3px rgba(239,105,121,.12),0 0 12px rgba(239,105,121,.35)}.client-priority-warning{color:#f3c77b}.client-priority-warning i{background:#eeb76d;box-shadow:0 0 0 3px rgba(238,183,109,.1),0 0 11px rgba(238,183,109,.28)}.client-priority-review{color:#8bd7ee}.client-priority-review i{background:#6fc7e5;box-shadow:0 0 0 3px rgba(111,199,229,.1)}.client-priority-normal{color:#9ed7bb}.client-priority-normal i{background:#73cda0}.client-timeline{display:grid;gap:0;margin:0;padding:0 0 0 3px;list-style:none}.client-timeline li{position:relative;display:flex;gap:10px;padding:0 0 14px 17px;border-left:1px solid rgba(117,192,225,.22)}.client-timeline li:last-child{padding-bottom:0}.client-timeline-dot{position:absolute;left:-4px;top:3px;width:7px;height:7px;border-radius:50%;background:#75ccea;box-shadow:0 0 12px rgba(117,204,234,.45)}.client-timeline li div{display:grid;gap:3px}.client-timeline strong{color:#dcecf5;font-size:12px}.client-timeline time,.client-timeline small{color:#8299ad;font-size:11px}.client-timeline time{margin-left:8px;font-weight:400}@media(max-width:720px){.client-bulk-action-bar{top:6px;align-items:flex-start}.client-bulk-action-bar>div:first-child{display:grid;gap:6px}.client-bulk-actions{width:100%}.client-bulk-actions .compact-action{flex:1 1 42%}}
.carlos-control-panel{display:grid;gap:14px;margin:16px 0;padding:18px;border:1px solid rgba(112,203,239,.2);border-radius:10px;background:linear-gradient(135deg,rgba(8,26,43,.9),rgba(7,17,30,.82));box-shadow:0 16px 42px rgba(0,0,0,.2),0 0 28px rgba(77,180,229,.06)}.ccp-head,.ccp-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.ccp-head h3,.ccp-card-head h4{margin:2px 0 4px;color:#eff7fb}.ccp-head p:not(.cb-eyebrow),.ccp-card-head p:not(.cb-eyebrow){margin:0;color:#8ca5b8;font-size:12px;line-height:1.5}.ccp-state{display:grid;justify-items:end;gap:6px}.ccp-state small{color:#8299ad;font-size:10px}.ccp-card{display:grid;gap:12px;padding:14px;border:1px solid rgba(137,195,225,.13);border-radius:8px;background:rgba(5,17,29,.58)}.ccp-form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.ccp-form-grid label,.ccp-card>label{display:grid;gap:6px;color:#91a9bb;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.ccp-form-grid input,.ccp-form-grid select,.ccp-card input,.ccp-card select,.ccp-card textarea{width:100%;min-height:36px;padding:8px 10px;border:1px solid rgba(137,195,225,.2);border-radius:6px;background:#061321;color:#eaf4f9;font:inherit;text-transform:none;letter-spacing:0}.ccp-card textarea{resize:vertical;line-height:1.5}.ccp-toggle{display:flex!important;align-items:center;align-content:center;grid-column:span 2;gap:8px!important;text-transform:none!important;letter-spacing:0!important;color:#d8edf5!important}.ccp-toggle input,.ccp-flag input{width:auto!important;min-height:auto!important;accent-color:#69c9ed}.ccp-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.ccp-two-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.ccp-flag-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.ccp-flag{display:flex;align-items:center;gap:9px;padding:9px;border:1px solid rgba(137,195,225,.12);border-radius:6px;background:rgba(9,29,46,.55);cursor:pointer}.ccp-flag span{display:grid;gap:3px}.ccp-flag strong{color:#dcecf3;font-size:12px;text-transform:capitalize}.ccp-flag small,.ccp-list span,.ccp-list small{color:#829bae;font-size:10px}.ccp-list{display:grid;gap:6px;margin:0;padding:0;list-style:none}.ccp-list li{display:flex;align-items:center;gap:9px;flex-wrap:wrap;padding:8px 9px;border-top:1px solid rgba(137,195,225,.1)}.ccp-list li strong{color:#dcecf3;font-size:12px}.ccp-list li span{margin-left:auto}.ccp-list li small{width:100%}.ccp-list .is-empty{color:#829bae}@media(max-width:900px){.ccp-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ccp-flag-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.ccp-head,.ccp-card-head{flex-direction:column}.ccp-state{justify-items:start}.ccp-form-grid,.ccp-two-col,.ccp-flag-grid{grid-template-columns:1fr}.ccp-toggle{grid-column:auto!important}.ccp-actions{align-items:flex-start;flex-direction:column}}

/* ==============================================================
   AUREX CASHBACK — presentation refresh (scoped)
   Every rule below is nested under a Cashback-only wrapper:
   .cashback-experience (client) or .cashback-admin / .cbk-* (admin).
   No global or shared selector is modified outside these parents.
   ============================================================== */

/* ---- Client: six-stage lifecycle as the hero ---- */
.cashback-experience .cashback-lifecycle {
  display: grid; grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0; padding: 4px 0; margin: 0 0 6px; list-style: none;
}
.cashback-experience .cashback-lifecycle .cbf-stage {
  position: relative; display: grid; gap: 6px; justify-items: center; text-align: center;
  padding: 16px 12px 14px;
}
/* Connector line between nodes, drawn behind them. */
.cashback-experience .cashback-lifecycle .cbf-stage::before {
  content: ""; position: absolute; top: 30px; left: -50%; width: 100%; height: 2px;
  background: rgba(143, 184, 218, 0.18); z-index: 0;
}
.cashback-experience .cashback-lifecycle .cbf-stage:first-child::before { display: none; }
.cashback-experience .cashback-lifecycle .cbf-node {
  position: relative; z-index: 1; display: grid; place-items: center;
  width: 30px; height: 30px; border-radius: 50%;
  background: rgba(9, 20, 34, 0.95); border: 1px solid rgba(143, 184, 218, 0.3);
  color: #cddbe6; font-style: normal;
}
.cashback-experience .cashback-lifecycle .cbf-node b { font-size: 12px; font-weight: 700; }
.cashback-experience .cashback-lifecycle .cbf-stage > span {
  font-size: 11px; font-weight: 620; letter-spacing: 0.02em; color: #8fa6ba; line-height: 1.35;
}
.cashback-experience .cashback-lifecycle .cbf-stage > strong {
  font-size: 18px; font-weight: 720; letter-spacing: -0.01em; color: #eef5fb;
  font-variant-numeric: tabular-nums;
}
/* Available now is the actionable stage — emphasise it. */
.cashback-experience .cashback-lifecycle .cbf-available .cbf-node {
  border-color: rgba(131, 216, 174, 0.6); box-shadow: 0 0 0 4px rgba(131, 216, 174, 0.12);
}
.cashback-experience .cashback-lifecycle .cbf-available > strong { color: #a9ecc9; }
.cashback-experience .cashback-lifecycle .cbf-paid .cbf-node { border-color: rgba(214, 193, 122, 0.5); }
.cashback-experience .cashback-lifecycle .cbf-paid > strong { color: #ecd9a3; }

/* ---- Client: activity grid (lots + tier, no money duplication) ---- */
.cashback-experience .cashback-activity-grid { margin-top: 4px; }

/* ---- Client: bonus progress tiles ---- */
.cashback-experience .cbk-bonus-summary { gap: 12px; }

/* ---- Client: lower half (rank / request / history) ---- */
.cashback-experience .cashback-lower { align-items: start; gap: 14px; }
.cashback-experience .cbk-rank-card { display: grid; gap: 8px; }
.cashback-experience .cbk-rank-card .portal-progress {
  height: 8px; border-radius: 999px; overflow: hidden; background: rgba(143, 184, 218, 0.14);
}
.cashback-experience .cbk-rank-card .portal-progress > span {
  display: block; height: 100%; border-radius: inherit;
  background: linear-gradient(90deg, rgba(131, 216, 174, 0.85), rgba(145, 222, 243, 0.9));
}
.cashback-experience .cbk-request-card.is-request-available .primary-button { font-weight: 640; }
.cashback-experience .cbk-request-card.is-request-unavailable {
  opacity: 0.92; border-color: rgba(143, 184, 218, 0.16);
}

/* ---- Client: payout history rows ---- */
.cashback-experience .cbk-payout-list { display: grid; gap: 8px; }
.cashback-experience .cbk-payout-row {
  display: grid; gap: 3px; padding: 11px 12px; border-radius: 10px;
  background: rgba(255, 255, 255, 0.02); border: 1px solid rgba(143, 184, 218, 0.1);
  border-left: 2px solid rgba(143, 184, 218, 0.28);
}
.cashback-experience .cbk-payout-row > strong { font-variant-numeric: tabular-nums; font-size: 15px; color: #eef5fb; }
.cashback-experience .cbk-payout-row.is-paid { border-left-color: #83d8ae; }
.cashback-experience .cbk-payout-row.is-rejected { border-left-color: #ff8f9c; }
.cashback-experience .cbk-payout-row.is-on-hold,
.cashback-experience .cbk-payout-row.is-requested,
.cashback-experience .cbk-payout-row.is-approved,
.cashback-experience .cbk-payout-row.is-partially-paid { border-left-color: #d6c17a; }

/* ---- Client: rank modal ladder ---- */
.cashback-experience .cbk-rank-ladder { display: grid; gap: 6px; }
.cashback-experience .cbk-rank-row {
  padding: 10px 12px; border-radius: 9px; border: 1px solid rgba(143, 184, 218, 0.12);
  background: rgba(255, 255, 255, 0.015);
}
.cashback-experience .cbk-rank-row.is-locked { opacity: 0.6; }
.cashback-experience .cbk-rank-row.is-current {
  border-color: rgba(145, 222, 243, 0.4); background: rgba(145, 222, 243, 0.06);
}

/* ---- Client responsive ---- */
@media (max-width: 860px) {
  .cashback-experience .cashback-lifecycle { grid-template-columns: 1fr; }
  .cashback-experience .cashback-lifecycle .cbf-stage {
    grid-template-columns: 30px 1fr auto; justify-items: start; text-align: left;
    align-items: center; gap: 10px; padding: 10px 6px;
  }
  .cashback-experience .cashback-lifecycle .cbf-stage::before {
    top: auto; bottom: -1px; left: 20px; width: 2px; height: 100%;
  }
  .cashback-experience .cashback-lifecycle .cbf-stage > strong { margin-left: auto; }
  .cashback-experience .cashback-lower { grid-template-columns: 1fr; }
}

/* ---- Admin: two clearly separated funnels ---- */
.cashback-admin .cbk-funnel { margin: 14px 0; }
.cashback-admin .cbk-funnel-head {
  display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; margin-bottom: 6px;
}
.cashback-admin .cbk-funnel-eyebrow {
  font-size: 12px; font-weight: 680; letter-spacing: 0.06em; text-transform: uppercase; color: #cddbe6;
}
.cashback-admin .cbk-funnel-flow {
  font-size: 11px; font-weight: 600; letter-spacing: 0.03em; color: #7f97ad;
  font-variant-numeric: tabular-nums;
}
.cashback-admin .cbk-reward-operations { border-left: 2px solid rgba(131, 216, 174, 0.35); padding-left: 12px; }
.cashback-admin .cbk-payout-requests { border-left: 2px solid rgba(145, 222, 243, 0.35); padding-left: 12px; }
.cashback-admin .cbk-reward-operations .reward-wallet-summary { gap: 10px; }

@media (max-width: 720px) {
  .cashback-admin .cbk-reward-operations,
  .cashback-admin .cbk-payout-requests { padding-left: 8px; }
  .cashback-admin .cbk-funnel-head { gap: 4px; }
}

/* ==============================================================
   AUREX CASHBACK — Phase A: client top hierarchy (scoped)
   Hero, formula strip and six-stage lifecycle. Every selector is
   nested under .cashback-experience; append-only; no shared or bare
   selector is modified.
   ============================================================== */

/* ---- Hero: the four facts that matter, in one glance ---- */
.cashback-experience .cashback-hero {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px; margin: 0 0 12px;
  border-radius: 16px; overflow: hidden;
  background: rgba(143, 184, 218, 0.1);
  border: 1px solid rgba(143, 184, 218, 0.14);
}
.cashback-experience .cbk-hero-metric {
  display: grid; gap: 5px; align-content: center;
  padding: 20px 22px; min-width: 0;
  background: linear-gradient(168deg, rgba(11, 22, 39, 0.62), rgba(7, 15, 27, 0.72));
}
.cashback-experience .cbk-hero-metric > span {
  font-size: 11px; font-weight: 640; letter-spacing: 0.07em; text-transform: uppercase;
  color: #8299ae;
}
.cashback-experience .cbk-hero-metric > strong {
  font-size: 26px; font-weight: 720; letter-spacing: -0.02em; line-height: 1.05;
  color: #f2f8fc; font-variant-numeric: tabular-nums;
}
.cashback-experience .cbk-hero-metric > small {
  font-size: 12px; line-height: 1.4; color: #7f97ad; overflow-wrap: anywhere;
}
/* Restrained accent per metric — a hairline, not a glow. */
.cashback-experience .cbk-hero-metric { box-shadow: inset 0 2px 0 rgba(143, 184, 218, 0.16); }
.cashback-experience .cbk-hero-available { box-shadow: inset 0 2px 0 rgba(131, 216, 174, 0.55); }
.cashback-experience .cbk-hero-available > strong { color: #a9ecc9; }
.cashback-experience .cbk-hero-rank { box-shadow: inset 0 2px 0 rgba(145, 222, 243, 0.5); }
.cashback-experience .cbk-hero-next { box-shadow: inset 0 2px 0 rgba(214, 193, 122, 0.5); }
.cashback-experience .cbk-hero-next > strong { color: #ecd9a3; }

/* ---- Formula strip: quiet operands, emphatic result ---- */
.cashback-experience .cashback-formula-strip {
  display: flex; align-items: stretch; gap: 4px; flex-wrap: wrap;
  padding: 16px 18px; margin: 0 0 12px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.018);
  border: 1px solid rgba(143, 184, 218, 0.12);
}
.cashback-experience .cashback-formula-strip .cfs-term {
  display: grid; gap: 3px; align-content: center; flex: 1 1 150px; min-width: 0; padding: 4px 10px;
}
.cashback-experience .cashback-formula-strip .cfs-term > span {
  font-size: 10.5px; font-weight: 620; letter-spacing: 0.06em; text-transform: uppercase; color: #7f97ad;
}
.cashback-experience .cashback-formula-strip .cfs-term > strong {
  font-size: 19px; font-weight: 680; letter-spacing: -0.01em; color: #dfeaf2; font-variant-numeric: tabular-nums;
}
.cashback-experience .cashback-formula-strip .cfs-term > small { font-size: 11px; color: #7f97ad; }
.cashback-experience .cashback-formula-strip .cfs-op {
  display: grid; place-items: center; flex: 0 0 auto; padding: 0 6px;
  font-size: 18px; font-weight: 600; color: #6f889d;
}
.cashback-experience .cashback-formula-strip .cfs-result {
  border-radius: 10px; background: rgba(131, 216, 174, 0.07); flex: 1.3 1 180px;
}
.cashback-experience .cashback-formula-strip .cfs-result > strong { font-size: 24px; color: #b6f0d3; }

/* ---- Six-stage lifecycle: connectors, node hierarchy, status colours ---- */
.cashback-experience .cashback-lifecycle {
  margin: 0 0 14px; padding: 6px 0;
  border-top: 1px solid rgba(143, 184, 218, 0.1);
  border-bottom: 1px solid rgba(143, 184, 218, 0.1);
}
.cashback-experience .cashback-lifecycle .cbf-stage > span {
  font-size: 11px; font-weight: 600; color: #8299ae; letter-spacing: 0.01em;
}
.cashback-experience .cashback-lifecycle .cbf-stage > strong { font-size: 17px; font-weight: 700; }
/* Per-stage node accent — restrained rings, one accent each. */
.cashback-experience .cashback-lifecycle .cbf-estimated .cbf-node { border-color: rgba(145, 222, 243, 0.45); }
.cashback-experience .cashback-lifecycle .cbf-awaiting .cbf-node { border-color: rgba(240, 193, 104, 0.5); }
.cashback-experience .cashback-lifecycle .cbf-awaiting > strong { color: #f0d089; }
.cashback-experience .cashback-lifecycle .cbf-available .cbf-node {
  border-color: rgba(131, 216, 174, 0.7); box-shadow: 0 0 0 4px rgba(131, 216, 174, 0.1);
}
.cashback-experience .cashback-lifecycle .cbf-available > span { color: #a9ecc9; }
.cashback-experience .cashback-lifecycle .cbf-requested .cbf-node { border-color: rgba(231, 160, 108, 0.5); }
.cashback-experience .cashback-lifecycle .cbf-requested > strong { color: #ecc09a; }
.cashback-experience .cashback-lifecycle .cbf-approved .cbf-node { border-color: rgba(120, 168, 240, 0.55); }
.cashback-experience .cashback-lifecycle .cbf-approved > strong { color: #b8ccf0; }
.cashback-experience .cashback-lifecycle .cbf-paid .cbf-node { border-color: rgba(214, 193, 122, 0.55); }

/* ---- Phase A responsive ---- */
@media (max-width: 1080px) {
  .cashback-experience .cashback-hero { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cashback-experience .cbk-hero-metric > strong { font-size: 23px; }
}
@media (max-width: 560px) {
  .cashback-experience .cashback-hero { grid-template-columns: 1fr; }
  .cashback-experience .cbk-hero-metric { padding: 15px 16px; }
  .cashback-experience .cashback-formula-strip .cfs-op { flex-basis: 100%; padding: 2px 0; }
  .cashback-experience .cashback-formula-strip .cfs-term { flex-basis: 100%; }
}

/* ==============================================================
   AUREX CASHBACK — Phase A.5 premium refinement (scoped)
   Reference direction only; no literal recreation. Every selector
   below is nested under .cashback-experience; append-only; no bare
   shared selector is modified. Business logic, values, ids, and
   data-* hooks are unchanged -- this block is presentation only.
   ============================================================== */

/* ---- Section grouping: Your Money / Your Progression / Your Payout ---- */
.cashback-experience .cbk-group { margin: 0 0 30px; }
.cashback-experience .cbk-group:last-of-type { margin-bottom: 14px; }
.cashback-experience .cbk-group-eyebrow {
  margin: 0 0 12px; font-size: 11px; font-weight: 700; letter-spacing: 0.14em;
  text-transform: uppercase; color: #6f889d;
}
.cashback-experience .cbk-group-eyebrow::after {
  content: ""; display: block; margin-top: 8px; height: 1px;
  background: linear-gradient(90deg, rgba(143, 184, 218, 0.22), transparent 65%);
}

/* ---- Hero: increase spacing, hierarchy, dominant Available Now ---- */
.cashback-experience .cashback-hero {
  grid-template-columns: 1.15fr 1.3fr 1fr 1fr;
  gap: 1px; margin: 0 0 14px; border-radius: 18px;
}
.cashback-experience .cbk-hero-metric { padding: 24px 24px 22px; gap: 7px; }
.cashback-experience .cbk-hero-metric > span { font-size: 11.5px; }
.cashback-experience .cbk-hero-metric > strong { font-size: 27px; }
/* Available Now: the dominant card -- larger figure, brighter surface, restrained glow. */
.cashback-experience .cbk-hero-available {
  background: linear-gradient(168deg, rgba(131, 216, 174, 0.1), rgba(7, 15, 27, 0.74));
  box-shadow: inset 0 2px 0 rgba(131, 216, 174, 0.65), 0 0 32px -18px rgba(131, 216, 174, 0.45);
}
.cashback-experience .cbk-hero-available > span { color: #a9ecc9; }
.cashback-experience .cbk-hero-available > strong { font-size: 34px; letter-spacing: -0.025em; }
/* Current Rank: premium treatment inside the hero band. */
.cashback-experience .cbk-hero-rank > strong { font-size: 23px; color: #d8f0fb; }
/* Next Milestone: refined progress visualization using the existing rank progress value. */
.cashback-experience .cbk-hero-next-progress { margin-top: 2px; }
.cashback-experience .cbk-hero-next-progress .portal-progress {
  height: 5px; border-radius: 999px; overflow: hidden; background: rgba(214, 193, 122, 0.16);
}
.cashback-experience .cbk-hero-next-progress .portal-progress > span {
  display: block; height: 100%; border-radius: inherit;
  background: linear-gradient(90deg, rgba(214, 193, 122, 0.7), rgba(236, 217, 163, 0.95));
}

/* ---- Bonus widgets: premium progress cards ---- */
.cashback-experience .cbk-bonus-summary {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin: 0 0 14px;
}
.cashback-experience .cbk-bonus-widget {
  padding: 18px 20px; border-radius: 14px;
  background: rgba(255, 255, 255, 0.018); border: 1px solid rgba(143, 184, 218, 0.12);
}
.cashback-experience .cbk-bonus-widget.is-reached { border-color: rgba(131, 216, 174, 0.4); }
.cashback-experience .cbk-bonus-widget-head {
  display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px;
}
.cashback-experience .cbk-bonus-widget-head > span {
  font-size: 12px; font-weight: 680; letter-spacing: 0.03em; color: #cddbe6;
}
.cashback-experience .cbk-bonus-reached {
  font-size: 10px; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase;
  color: #83d8ae; padding: 2px 8px; border-radius: 999px; background: rgba(131, 216, 174, 0.12);
}
.cashback-experience .cbk-bonus-track {
  height: 7px; border-radius: 999px; overflow: hidden; margin-bottom: 10px;
  background: rgba(143, 184, 218, 0.14);
}
.cashback-experience .cbk-bonus-track > i {
  display: block; height: 100%; border-radius: inherit; font-style: normal;
  background: linear-gradient(90deg, rgba(145, 222, 243, 0.75), rgba(131, 216, 174, 0.9));
  transition: width 220ms ease;
}
.cashback-experience .cbk-bonus-figures {
  display: flex; justify-content: space-between; gap: 10px; margin-bottom: 10px;
}
.cashback-experience .cbk-bonus-figures > span { font-size: 11.5px; color: #8299ae; }
.cashback-experience .cbk-bonus-potential {
  display: flex; align-items: baseline; justify-content: space-between;
  padding-top: 10px; border-top: 1px solid rgba(143, 184, 218, 0.1);
}
.cashback-experience .cbk-bonus-potential > span { font-size: 11px; color: #7f97ad; }
.cashback-experience .cbk-bonus-potential > strong { font-size: 16px; font-weight: 700; color: #dfeaf2; }

/* ---- Formula: financial-equation flow with a dominant result ---- */
.cashback-experience .cbk-formula-flow { align-items: stretch; }
.cashback-experience .cbk-formula-flow .cfs-op-result { color: #83d8ae; font-size: 20px; }
.cashback-experience .cbk-formula-flow .cfs-result {
  background: rgba(131, 216, 174, 0.1); box-shadow: inset 0 1px 0 rgba(131, 216, 174, 0.3);
}
.cashback-experience .cbk-formula-flow .cfs-result > strong { font-size: 27px; }

/* ---- Lifecycle: refined spacing, connector, number-circle depth ---- */
.cashback-experience .cashback-lifecycle { padding: 10px 0; }
.cashback-experience .cashback-lifecycle .cbf-node {
  width: 34px; height: 34px;
  background: radial-gradient(circle at 32% 28%, rgba(255, 255, 255, 0.05), rgba(9, 20, 34, 0.96));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
.cashback-experience .cashback-lifecycle .cbf-stage::before { top: 34px; }
.cashback-experience .cashback-lifecycle .cbf-available .cbf-node { box-shadow: 0 0 0 5px rgba(131, 216, 174, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.06); }

/* ---- Rewards Journey: lighter, easier to scan ---- */
.cashback-experience .cbk-journey-light {
  padding: 16px 20px; border-radius: 14px;
  background: rgba(255, 255, 255, 0.012); border: 1px solid rgba(143, 184, 218, 0.08);
  box-shadow: none;
}
.cashback-experience .cbk-journey-light .prj-head h3 { font-size: 15px; font-weight: 640; }
.cashback-experience .cbk-journey-light .prj-rail { gap: 10px; }
.cashback-experience .cbk-journey-light .prj-step {
  padding: 9px 0; background: none; border: 0; border-bottom: 1px solid rgba(143, 184, 218, 0.07);
}
.cashback-experience .cbk-journey-light .prj-step:last-child { border-bottom: 0; }
.cashback-experience .cbk-journey-light .prj-state {
  font-size: 10.5px; color: #7f97ad; background: none;
}

/* ---- Current Rank: premium showcase ---- */
.cashback-experience .cbk-rank-card { padding: 22px 24px; }
.cashback-experience .cbk-rank-badge {
  display: inline-flex; align-items: center; padding: 3px 12px; border-radius: 999px;
  font-size: 17px; font-weight: 720; letter-spacing: -0.01em;
  background: rgba(145, 222, 243, 0.1); border: 1px solid rgba(145, 222, 243, 0.28); color: #d8f0fb;
}
.cashback-experience .cbk-rank-card .portal-progress { height: 7px; margin: 14px 0 10px; }

/* ---- Rank ladder: aspirational tier showcase ---- */
.cashback-experience .cbk-rank-ladder { gap: 8px; }
.cashback-experience .cbk-rank-row { display: flex; align-items: flex-start; gap: 12px; padding: 13px 14px; }
.cashback-experience .cbk-rank-icon {
  flex: 0 0 auto; width: 10px; height: 10px; margin-top: 5px; border-radius: 50%;
  background: rgba(143, 184, 218, 0.3);
}
.cashback-experience .cbk-rank-tier-bronze .cbk-rank-icon { background: #c98a52; }
.cashback-experience .cbk-rank-tier-silver .cbk-rank-icon { background: #b9c6d4; }
.cashback-experience .cbk-rank-tier-gold .cbk-rank-icon { background: #e7c76a; }
.cashback-experience .cbk-rank-tier-platinum .cbk-rank-icon { background: #9be0e8; }
.cashback-experience .cbk-rank-row.is-current { background: rgba(145, 222, 243, 0.07); border-color: rgba(145, 222, 243, 0.32); }
.cashback-experience .cbk-rank-row.is-locked .cbk-rank-icon { opacity: 0.45; }

/* ---- Request Cashback: the strongest call-to-action ---- */
.cashback-experience .cbk-request-card {
  padding: 24px 26px; display: grid; gap: 10px;
}
.cashback-experience .cbk-request-card.is-request-available {
  background: linear-gradient(168deg, rgba(131, 216, 174, 0.09), rgba(7, 15, 27, 0.74));
  box-shadow: inset 0 2px 0 rgba(131, 216, 174, 0.55);
}
.cashback-experience .cbk-request-amount { display: flex; align-items: baseline; gap: 10px; }
.cashback-experience .cbk-request-amount > span { font-size: 12px; color: #a9ecc9; }
.cashback-experience .cbk-request-amount > strong {
  font-size: 30px; font-weight: 740; letter-spacing: -0.02em; color: #b6f0d3;
}
.cashback-experience .cbk-request-card .primary-button {
  min-height: 46px; font-size: 14px; font-weight: 660; letter-spacing: 0.01em; margin-top: 4px;
}

/* ---- Payout history: clear distinction per status ---- */
.cashback-experience .cbk-payout-row.is-cancelled { border-left-color: #8299ae; }
.cashback-experience .cbk-payout-row.is-paid .portal-status-pill { background: rgba(131, 216, 174, 0.16); color: #a9ecc9; }
.cashback-experience .cbk-payout-row.is-rejected .portal-status-pill { background: rgba(255, 143, 156, 0.14); color: #ffb3bb; }
.cashback-experience .cbk-payout-row.is-cancelled .portal-status-pill { background: rgba(130, 153, 174, 0.16); color: #b7c6d4; }
.cashback-experience .cbk-payout-row.is-on-hold .portal-status-pill { background: rgba(214, 193, 122, 0.14); color: #ecd9a3; }
.cashback-experience .cbk-payout-row.is-requested .portal-status-pill { background: rgba(240, 193, 104, 0.14); color: #f0d089; }
.cashback-experience .cbk-payout-row.is-approved .portal-status-pill { background: rgba(120, 168, 240, 0.16); color: #b8ccf0; }
.cashback-experience .cbk-payout-row.is-partially-paid .portal-status-pill { background: rgba(231, 160, 108, 0.16); color: #ecc09a; }

/* ---- Responsive ---- */
@media (max-width: 1080px) {
  .cashback-experience .cbk-bonus-summary { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .cashback-experience .cbk-group { margin-bottom: 22px; }
  .cashback-experience .cbk-hero-metric { padding: 17px 16px; }
  .cashback-experience .cbk-hero-available > strong { font-size: 27px; }
  .cashback-experience .cbk-request-card { padding: 18px 18px; }
  .cashback-experience .cbk-request-amount > strong { font-size: 25px; }
  /* The formula's arrows read as a vertical flow on narrow screens. */
  .cashback-experience .cbk-formula-flow .cfs-op { transform: rotate(90deg); }
}

@media (prefers-reduced-motion: reduce) {
  .cashback-experience .cbk-bonus-track > i { transition: none; }
}

/* ==============================================================
   AUREX CASHBACK -- Cinematic loyalty and reward experience
   Focused pass: rank card, rank ladder, bonus zero-state,
   rewards journey, request panel, payout history. Every rule is
   scoped under .cashback-experience, append-only, no bare shared
   selector is modified. No values, ids, data-* hooks, handlers,
   or business logic are changed by this block -- presentation only.
   ============================================================== */

/* ---- Rank card: the emotional centerpiece ---- */
.cashback-experience .cbk-rank-card {
  position: relative; padding: 26px 26px 24px; overflow: hidden;
  background: radial-gradient(120% 100% at 14% 0%, rgba(201, 138, 82, 0.1), rgba(7, 15, 27, 0.86) 62%);
  border: 1px solid rgba(201, 138, 82, 0.22);
}
.cashback-experience .cbk-rank-card::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(60% 70% at 100% 0%, rgba(201, 138, 82, 0.08), transparent 70%);
}
.cashback-experience .cbk-rank-card.cbk-rank-tier-silver {
  background: radial-gradient(120% 100% at 14% 0%, rgba(185, 198, 212, 0.1), rgba(7, 15, 27, 0.86) 62%);
  border-color: rgba(185, 198, 212, 0.24);
}
.cashback-experience .cbk-rank-card.cbk-rank-tier-gold {
  background: radial-gradient(120% 100% at 14% 0%, rgba(231, 199, 106, 0.11), rgba(7, 15, 27, 0.86) 62%);
  border-color: rgba(231, 199, 106, 0.26);
}
.cashback-experience .cbk-rank-card.cbk-rank-tier-platinum {
  background: radial-gradient(120% 100% at 14% 0%, rgba(155, 143, 232, 0.12), rgba(7, 15, 27, 0.88) 62%);
  border-color: rgba(155, 143, 232, 0.28);
}

.cashback-experience .cbk-rank-identity { position: relative; display: flex; align-items: center; gap: 16px; margin-bottom: 18px; }
.cashback-experience .cbk-rank-emblem {
  flex: 0 0 auto; width: 56px; height: 56px; border-radius: 16px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(155deg, rgba(201, 138, 82, 0.55), rgba(120, 76, 40, 0.75) 55%, rgba(7, 15, 27, 0.9));
  border: 1px solid rgba(255, 255, 255, 0.14);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), inset 0 -10px 16px rgba(0, 0, 0, 0.35), 0 6px 18px -10px rgba(201, 138, 82, 0.55);
}
.cashback-experience .cbk-rank-emblem b {
  font-size: 21px; font-weight: 760; letter-spacing: 0.01em; color: #fbeee1;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
}
.cashback-experience .cbk-rank-tier-silver .cbk-rank-emblem { background: linear-gradient(155deg, rgba(185, 198, 212, 0.55), rgba(110, 124, 138, 0.75) 55%, rgba(7, 15, 27, 0.9)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), inset 0 -10px 16px rgba(0, 0, 0, 0.35), 0 6px 18px -10px rgba(185, 198, 212, 0.5); }
.cashback-experience .cbk-rank-tier-silver .cbk-rank-emblem b { color: #f2f6f9; }
.cashback-experience .cbk-rank-tier-gold .cbk-rank-emblem { background: linear-gradient(155deg, rgba(231, 199, 106, 0.55), rgba(154, 122, 40, 0.75) 55%, rgba(7, 15, 27, 0.9)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.26), inset 0 -10px 16px rgba(0, 0, 0, 0.35), 0 6px 18px -10px rgba(231, 199, 106, 0.55); }
.cashback-experience .cbk-rank-tier-gold .cbk-rank-emblem b { color: #fff6e0; }
.cashback-experience .cbk-rank-tier-platinum .cbk-rank-emblem { background: linear-gradient(155deg, rgba(155, 143, 232, 0.55), rgba(84, 68, 168, 0.75) 55%, rgba(7, 15, 27, 0.9)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), inset 0 -10px 16px rgba(0, 0, 0, 0.35), 0 6px 18px -10px rgba(155, 143, 232, 0.55); }
.cashback-experience .cbk-rank-tier-platinum .cbk-rank-emblem b { color: #f1eeff; }

.cashback-experience .cbk-rank-identity .eyebrow { margin: 0 0 3px; }
.cashback-experience .cbk-rank-identity h3 { margin: 0 0 4px; }
.cashback-experience .cbk-rank-badge { font-size: 20px; padding: 4px 14px; }
.cashback-experience .cbk-rank-identity small { color: #9fb2c4; font-size: 12.5px; }

.cashback-experience .cbk-rank-lifetime {
  position: relative; display: flex; align-items: baseline; justify-content: space-between;
  padding: 12px 14px; margin-bottom: 16px; border-radius: 10px;
  background: rgba(255, 255, 255, 0.02); border: 1px solid rgba(143, 184, 218, 0.1);
}
.cashback-experience .cbk-rank-lifetime > span { font-size: 11.5px; letter-spacing: 0.02em; color: #8299ae; }
.cashback-experience .cbk-rank-lifetime > strong { font-size: 19px; font-weight: 720; color: #e7edf3; font-variant-numeric: tabular-nums; }

.cashback-experience .cbk-rank-rail { position: relative; margin-bottom: 8px; }
.cashback-experience .cbk-rank-rail .portal-progress { height: 8px; border-radius: 999px; overflow: hidden; }
.cashback-experience .cbk-rank-rail-anchors { display: flex; justify-content: space-between; margin-top: 8px; }
.cashback-experience .cbk-rail-anchor { font-size: 10.5px; font-weight: 660; letter-spacing: 0.04em; text-transform: uppercase; color: #7f97ad; }
.cashback-experience .cbk-rail-current { color: #cddbe6; }
.cashback-experience .cbk-rail-next { color: #d8b877; }

.cashback-experience .cbk-rank-remaining { margin: 4px 0 16px; font-size: 13px; color: #b7c6d4; }

.cashback-experience .cbk-rank-next-unlock {
  position: relative; padding: 16px 18px; border-radius: 12px; margin-bottom: 16px;
  background: linear-gradient(165deg, rgba(214, 193, 122, 0.09), rgba(255, 255, 255, 0.015));
  border: 1px solid rgba(214, 193, 122, 0.24);
}
.cashback-experience .cbk-rank-next-unlock.is-top {
  display: flex; align-items: center; padding: 14px 18px;
  background: rgba(131, 216, 174, 0.07); border-color: rgba(131, 216, 174, 0.26); color: #a9ecc9; font-size: 13px;
}
.cashback-experience .cbk-rank-next-eyebrow {
  display: block; font-size: 10px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  color: #d6c17a; margin-bottom: 8px;
}
.cashback-experience .cbk-rank-next-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.cashback-experience .cbk-rank-next-head > strong { font-size: 17px; font-weight: 720; color: #f2e7c9; }
.cashback-experience .cbk-rank-next-head > b { font-size: 13px; font-weight: 640; color: #cddbe6; }
.cashback-experience .cbk-rank-uplift { margin: 6px 0 0; font-size: 12.5px; font-weight: 660; color: #83d8ae; }
.cashback-experience .cbk-rank-benefits { list-style: none; margin: 10px 0 0; padding: 10px 0 0; border-top: 1px solid rgba(214, 193, 122, 0.16); display: grid; gap: 5px; }
.cashback-experience .cbk-rank-benefits li { font-size: 12px; color: #b7c6d4; padding-left: 14px; position: relative; }
.cashback-experience .cbk-rank-benefits li::before { content: ""; position: absolute; left: 0; top: 7px; width: 5px; height: 5px; border-radius: 50%; background: rgba(214, 193, 122, 0.7); }

/* ---- Rank ladder: four distinct tier identities + status psychology ---- */
.cashback-experience .cbk-rank-row {
  position: relative; border-radius: 12px; border: 1px solid transparent;
  background: rgba(255, 255, 255, 0.014); transition: background 160ms ease;
}
.cashback-experience .cbk-rank-icon {
  width: 30px; height: 30px; margin-top: 0; border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(155deg, rgba(143, 184, 218, 0.3), rgba(7, 15, 27, 0.7));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
}
.cashback-experience .cbk-rank-tier-bronze .cbk-rank-icon { background: linear-gradient(155deg, rgba(201, 138, 82, 0.6), rgba(120, 76, 40, 0.7)); }
.cashback-experience .cbk-rank-tier-silver .cbk-rank-icon { background: linear-gradient(155deg, rgba(185, 198, 212, 0.6), rgba(110, 124, 138, 0.7)); }
.cashback-experience .cbk-rank-tier-gold .cbk-rank-icon { background: linear-gradient(155deg, rgba(231, 199, 106, 0.6), rgba(154, 122, 40, 0.7)); }
.cashback-experience .cbk-rank-tier-platinum .cbk-rank-icon { background: linear-gradient(155deg, rgba(155, 143, 232, 0.6), rgba(84, 68, 168, 0.7)); }
.cashback-experience .cbk-rank-row.is-current {
  background: rgba(145, 222, 243, 0.06); border-color: rgba(145, 222, 243, 0.3);
  box-shadow: inset 0 1px 0 rgba(145, 222, 243, 0.14);
}
.cashback-experience .cbk-rank-row.is-current > strong { color: #9bdcf5; }
.cashback-experience .cbk-rank-row.is-next {
  background: rgba(214, 193, 122, 0.05); border-color: rgba(214, 193, 122, 0.26);
}
.cashback-experience .cbk-rank-row.is-next > strong { color: #d6c17a; }
.cashback-experience .cbk-rank-row.is-locked { opacity: 0.72; }
.cashback-experience .cbk-rank-row.is-locked .cbk-rank-icon { opacity: 0.5; filter: saturate(0.6); }

/* ---- Bonus: de-emphasize a $0.00 potential figure, keep the value visible ---- */
.cashback-experience .cbk-bonus-potential.is-zero > strong { color: #6f889d; font-size: 14px; font-weight: 600; }
.cashback-experience .cbk-bonus-potential.is-zero > span { color: #7f97ad; }
.cashback-experience .cbk-bonus-figures > span:last-child { color: #a9c8de; font-weight: 600; }

/* ---- Rewards journey: current-position emphasis, quieter connectors ---- */
.cashback-experience .cbk-journey-light .prj-step.is-current { background: rgba(145, 222, 243, 0.04); border-radius: 8px; padding-left: 6px; padding-right: 6px; }
.cashback-experience .cbk-journey-light .prj-step.is-current .prj-state { color: #9bdcf5; font-weight: 660; }

/* ---- Request Cashback: available amount as the focal point ---- */
.cashback-experience .cbk-request-amount { flex-direction: column; align-items: flex-start; gap: 2px; }
.cashback-experience .cbk-request-amount > span { font-size: 11px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.cashback-experience .cbk-request-amount > small { font-size: 12px; color: #7f97ad; margin-top: 2px; }
.cashback-experience .cbk-request-card.is-request-unavailable .cbk-request-amount > strong { color: #cddbe6; }
.cashback-experience .cbk-request-note { color: #8299ae; font-size: 12.5px; }

/* ---- Payout history: cancelled reads as neutral amber-gray ---- */
.cashback-experience .cbk-payout-row.is-cancelled .portal-status-pill { background: rgba(170, 153, 130, 0.15); color: #c9baa4; }
.cashback-experience .cbk-payout-row.is-paid,
.cashback-experience .cbk-payout-row.is-rejected,
.cashback-experience .cbk-payout-row.is-cancelled { margin-top: 4px; }
.cashback-experience .cbk-payout-row.is-requested,
.cashback-experience .cbk-payout-row.is-approved,
.cashback-experience .cbk-payout-row.is-partially-paid,
.cashback-experience .cbk-payout-row.is-on-hold { border-left-width: 2px; }

/* ---- Responsive ---- */
@media (max-width: 640px) {
  .cashback-experience .cbk-rank-card { padding: 20px 18px; }
  .cashback-experience .cbk-rank-identity { gap: 12px; }
  .cashback-experience .cbk-rank-emblem { width: 46px; height: 46px; border-radius: 13px; }
  .cashback-experience .cbk-rank-emblem b { font-size: 18px; }
  .cashback-experience .cbk-rank-next-head { flex-direction: column; align-items: flex-start; gap: 2px; }
}

@media (prefers-reduced-motion: reduce) {
  .cashback-experience .cbk-rank-row { transition: none; }
}

/* ---- Bonus: subtle one-time completion pulse on reaching threshold ---- */
@keyframes cbkBonusReachedPulse {
  0% { box-shadow: 0 0 0 0 rgba(131, 216, 174, 0.35); }
  100% { box-shadow: 0 0 0 9px rgba(131, 216, 174, 0); }
}
.cashback-experience .cbk-bonus-widget.is-reached { animation: cbkBonusReachedPulse 900ms ease-out 1; }

@media (prefers-reduced-motion: reduce) {
  .cashback-experience .cbk-bonus-widget.is-reached { animation: none; }
}

/* ==============================================================
   AUREX CASHBACK -- Final client micro-polish pass
   Scoped under .cashback-experience (and .cashback-experience
   #portalRankDetails for the dialog, which stays a DOM descendant
   of .cashback-experience -- confirmed no JS re-parents it).
   Append-only. No bare shared selector modified. No id, data-*,
   handler, value, or condition changed by this block.
   ============================================================== */

/* ---- Rank card: compact 3-column composition (desktop) ---- */
.cashback-experience .cbk-rank-card {
  display: grid;
  grid-template-columns: minmax(150px, 0.85fr) minmax(200px, 1.25fr) minmax(190px, 1fr);
  grid-template-areas:
    "identity lifetime unlock"
    "identity rail unlock"
    "identity remaining unlock"
    "explore explore explore";
  column-gap: 24px;
  row-gap: 12px;
  align-items: start;
  padding: 24px 26px 22px;
}
.cashback-experience .cbk-rank-identity { grid-area: identity; margin-bottom: 0; flex-direction: column; align-items: flex-start; gap: 12px; }
.cashback-experience .cbk-rank-lifetime { grid-area: lifetime; margin-bottom: 0; }
.cashback-experience .cbk-rank-rail { grid-area: rail; margin-bottom: 0; align-self: center; }
.cashback-experience .cbk-rank-remaining { grid-area: remaining; margin: 0; align-self: start; }
.cashback-experience .cbk-rank-next-unlock { grid-area: unlock; margin-bottom: 0; height: 100%; box-sizing: border-box; }
.cashback-experience .cbk-rank-card .cbk-rank-explore { grid-area: explore; }

/* ---- Rank identity: emblem + name balanced as a premium membership badge ---- */
.cashback-experience .cbk-rank-identity { position: relative; }
.cashback-experience .cbk-rank-emblem {
  width: 60px; height: 60px; border-radius: 17px;
  position: relative;
}
.cashback-experience .cbk-rank-emblem::after {
  content: ""; position: absolute; inset: 3px; border-radius: 13px;
  border: 1px solid rgba(255, 255, 255, 0.14); pointer-events: none;
}
.cashback-experience .cbk-rank-emblem b { font-size: 23px; }

/* ---- Lifetime lots figure: tighter, tabular ---- */
.cashback-experience .cbk-rank-lifetime {
  flex-direction: column; align-items: flex-start; gap: 2px; padding: 11px 13px;
}
.cashback-experience .cbk-rank-lifetime > strong { font-size: 21px; }

/* ---- Progress rail: thicker, premium status advancement bar ---- */
.cashback-experience .cbk-rank-rail .portal-progress {
  height: 13px; border-radius: 999px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(143, 184, 218, 0.14);
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.35);
  position: relative;
}
.cashback-experience .cbk-rank-rail .portal-progress > span {
  position: relative; border-radius: 999px;
  background: linear-gradient(90deg, rgba(200, 169, 106, 0.75), rgba(233, 208, 150, 0.95));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 0 10px -2px rgba(233, 208, 150, 0.55);
}
.cashback-experience .cbk-rank-rail .portal-progress::before,
.cashback-experience .cbk-rank-rail .portal-progress::after {
  content: ""; position: absolute; top: 50%; width: 3px; height: 3px; border-radius: 50%;
  background: rgba(7, 15, 27, 0.9); transform: translateY(-50%); z-index: 1;
}
.cashback-experience .cbk-rank-rail .portal-progress::before { left: 3px; }
.cashback-experience .cbk-rank-rail .portal-progress::after { right: 3px; }
.cashback-experience .cbk-rank-rail-anchors { margin-top: 10px; }
.cashback-experience .cbk-rail-anchor { font-size: 11px; display: flex; align-items: center; gap: 5px; }
.cashback-experience .cbk-rail-anchor::before { content: ""; width: 6px; height: 6px; border-radius: 50%; }
.cashback-experience .cbk-rail-current { color: #dbe6ee; font-weight: 720; }
.cashback-experience .cbk-rail-current::before { background: #dbe6ee; }
.cashback-experience .cbk-rail-next { color: #e9d096; font-weight: 720; }
.cashback-experience .cbk-rail-next::before { background: #e9d096; }

/* ---- Remaining lots: the figure reads first ---- */
.cashback-experience .cbk-rank-remaining { font-size: 13.5px; color: #a9bacb; }
.cashback-experience .cbk-rank-remaining strong { color: #f2e7c9; font-weight: 720; font-variant-numeric: tabular-nums; }

/* ---- Next unlock: stronger hierarchy, tier-matched accent ---- */
.cashback-experience .cbk-rank-next-unlock { display: flex; flex-direction: column; }
.cashback-experience .cbk-rank-next-eyebrow { font-size: 10.5px; }
.cashback-experience .cbk-rank-next-head > strong { font-size: 19px; }
.cashback-experience .cbk-rank-uplift {
  display: inline-flex; align-self: flex-start; margin-top: 8px; padding: 3px 10px;
  border-radius: 999px; font-size: 12px; font-weight: 700;
  background: rgba(131, 216, 174, 0.14); color: #a9ecc9;
}
.cashback-experience .cbk-rank-benefits { flex: 1; }
.cashback-experience .cbk-rank-benefits li { line-height: 1.5; }

.cashback-experience .cbk-rank-next-unlock.cbk-rank-tier-silver {
  background: linear-gradient(165deg, rgba(185, 198, 212, 0.1), rgba(255, 255, 255, 0.015));
  border-color: rgba(185, 198, 212, 0.26);
}
.cashback-experience .cbk-rank-next-unlock.cbk-rank-tier-silver .cbk-rank-next-eyebrow,
.cashback-experience .cbk-rank-next-unlock.cbk-rank-tier-silver .cbk-rank-next-head > strong { color: #e3ebf1; }
.cashback-experience .cbk-rank-next-unlock.cbk-rank-tier-gold {
  background: linear-gradient(165deg, rgba(231, 199, 106, 0.1), rgba(255, 255, 255, 0.015));
  border-color: rgba(231, 199, 106, 0.26);
}
.cashback-experience .cbk-rank-next-unlock.cbk-rank-tier-gold .cbk-rank-next-eyebrow,
.cashback-experience .cbk-rank-next-unlock.cbk-rank-tier-gold .cbk-rank-next-head > strong { color: #f2e0ab; }
.cashback-experience .cbk-rank-next-unlock.cbk-rank-tier-platinum {
  background: linear-gradient(165deg, rgba(155, 143, 232, 0.1), rgba(255, 255, 255, 0.015));
  border-color: rgba(155, 143, 232, 0.26);
}
.cashback-experience .cbk-rank-next-unlock.cbk-rank-tier-platinum .cbk-rank-next-eyebrow,
.cashback-experience .cbk-rank-next-unlock.cbk-rank-tier-platinum .cbk-rank-next-head > strong { color: #ded8f5; }

/* ---- View all ranks: premium secondary action, not a default control ---- */
.cashback-experience .cbk-rank-card .cbk-rank-explore {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; width: 100%; margin-top: 4px; padding: 0 18px;
  border-radius: 10px; border: 1px solid rgba(143, 184, 218, 0.2);
  background: rgba(255, 255, 255, 0.02); color: #cddbe6;
  font-size: 13px; font-weight: 640; letter-spacing: 0.01em;
  transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}
.cashback-experience .cbk-rank-card .cbk-rank-explore::after {
  content: "\2192"; display: inline-block; transition: transform 160ms ease;
}
.cashback-experience .cbk-rank-card .cbk-rank-explore:hover {
  background: rgba(103, 232, 249, 0.06); border-color: rgba(103, 232, 249, 0.32);
  color: #e7edf3; transform: translateY(-1px);
}
.cashback-experience .cbk-rank-card .cbk-rank-explore:hover::after { transform: translateX(3px); }
.cashback-experience .cbk-rank-card .cbk-rank-explore:focus-visible { outline: 2px solid rgba(103, 232, 249, 0.55); outline-offset: 2px; }

/* ---- Rank ladder: deeper material identity per tier ---- */
.cashback-experience .cbk-rank-ladder { gap: 9px; }
.cashback-experience .cbk-rank-row { padding: 14px 15px; border-radius: 13px; }
.cashback-experience .cbk-rank-row > strong { font-size: 11.5px; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; color: #7f97ad; align-self: center; }
.cashback-experience .cbk-rank-row.is-current > strong,
.cashback-experience .cbk-rank-row.is-next > strong { text-transform: none; letter-spacing: 0.01em; font-size: 12.5px; }
.cashback-experience .cbk-rank-tier-bronze.cbk-rank-row { background: linear-gradient(120deg, rgba(201, 138, 82, 0.05), rgba(255, 255, 255, 0.012)); }
.cashback-experience .cbk-rank-tier-silver.cbk-rank-row { background: linear-gradient(120deg, rgba(185, 198, 212, 0.05), rgba(255, 255, 255, 0.012)); }
.cashback-experience .cbk-rank-tier-gold.cbk-rank-row { background: linear-gradient(120deg, rgba(231, 199, 106, 0.05), rgba(255, 255, 255, 0.012)); }
.cashback-experience .cbk-rank-tier-platinum.cbk-rank-row { background: linear-gradient(120deg, rgba(155, 143, 232, 0.045), rgba(255, 255, 255, 0.012)); }
.cashback-experience .cbk-rank-row.is-locked { background: rgba(255, 255, 255, 0.012) !important; }

/* ==============================================================
   Rank modal -- deep navy surface, refined border, real depth.
   The dialog is a confirmed DOM descendant of .cashback-experience
   (no JS re-parenting to document.body), so this descendant
   selector is a safe, exact, Cashback-only scope.
   ============================================================== */
.cashback-experience #portalRankDetails {
  position: fixed;
  z-index: 500;
  padding: 0;
  border: 0;
  border-radius: 20px;
  background: transparent;
  color: #dfeaf2;
  width: min(560px, 92vw);
  max-height: min(680px, 88vh);
  overflow: visible;
}
.cashback-experience #portalRankDetails::backdrop {
  background: rgba(3, 8, 16, 0.74);
  backdrop-filter: blur(7px);
}
.cashback-experience #portalRankDetails .portal-chart-card {
  border-radius: 20px;
  border: 1px solid rgba(121, 223, 246, 0.24);
  background: linear-gradient(165deg, rgba(11, 24, 42, 0.98), rgba(4, 10, 19, 0.99));
  box-shadow: 0 34px 90px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 0 0 1px rgba(121, 223, 246, 0.05);
  max-height: min(680px, 88vh);
  overflow-y: auto;
  padding: 26px 28px 24px;
  display: flex; flex-direction: column; gap: 16px;
}
.cashback-experience #portalRankDetails .eyebrow { color: var(--gold); }
.cashback-experience #portalRankDetails h3 { color: #f3f7fa; font-size: 17px; }
.cashback-experience #portalRankDetails > .portal-chart-card > div > p { color: #a9bacb; font-size: 13px; }
.cashback-experience #portalRankDetails .secondary-button {
  align-self: flex-start; min-height: 42px; padding: 0 20px; border-radius: 10px;
  background: rgba(255, 255, 255, 0.02); border: 1px solid rgba(143, 184, 218, 0.22); color: #cddbe6;
  transition: background 160ms ease, border-color 160ms ease;
}
.cashback-experience #portalRankDetails .secondary-button:hover {
  background: rgba(103, 232, 249, 0.06); border-color: rgba(103, 232, 249, 0.32);
}

/* ---- Responsive: mobile stack + near-fullscreen bottom sheet ---- */
@media (max-width: 760px) {
  .cashback-experience .cbk-rank-card {
    grid-template-columns: 1fr;
    grid-template-areas: "identity" "lifetime" "rail" "remaining" "unlock" "explore";
  }
  .cashback-experience .cbk-rank-next-unlock { height: auto; }
}

@media (max-width: 640px) {
  .cashback-experience #portalRankDetails {
    position: fixed; inset: auto 0 0 0; width: 100%;
    max-height: 86vh; border-radius: 18px 18px 0 0;
  }
  .cashback-experience #portalRankDetails .portal-chart-card {
    border-radius: 18px 18px 0 0; max-height: 86vh;
    padding: 20px 18px calc(18px + env(safe-area-inset-bottom, 0px));
  }
}

@media (prefers-reduced-motion: reduce) {
  .cashback-experience .cbk-rank-card .cbk-rank-explore,
  .cashback-experience .cbk-rank-card .cbk-rank-explore::after,
  .cashback-experience #portalRankDetails .secondary-button { transition: none; }
}

/* ---- Request Cashback: compact, action-focused ---- */
.cashback-experience .cbk-request-card { padding: 20px 24px; gap: 8px; }
.cashback-experience .cbk-request-amount > strong { font-size: 27px; }
.cashback-experience .cbk-request-note { margin: 0; }
.cashback-experience .cbk-request-card .primary-button { margin-top: 6px; }

/* ---- Payout history: clearer per-row rhythm ---- */
.cashback-experience .cbk-payout-list { gap: 10px; }
.cashback-experience .cbk-payout-row {
  display: grid; grid-template-columns: auto 1fr auto; column-gap: 12px; row-gap: 4px;
  align-items: baseline; padding: 14px 16px; line-height: 1.45;
}
.cashback-experience .cbk-payout-row > strong { font-size: 16.5px; font-variant-numeric: tabular-nums; }
.cashback-experience .cbk-payout-row .portal-status-pill { justify-self: end; }
.cashback-experience .cbk-payout-row > small { grid-column: 1 / -1; color: #8299ae; }

@media (max-width: 560px) {
  .cashback-experience .cbk-payout-row { grid-template-columns: 1fr auto; }
}

/* ==============================================================
   AUREX CASHBACK -- Final freeze polish pass
   CSS-only. No markup, id, data-*, handler, value, or condition
   changed. Every rule scoped under .cashback-experience (or its
   confirmed descendant #portalRankDetails). Append-only.
   ============================================================== */

/* ---- Consistency: unified radius + shadow language ---- */
.cashback-experience .cbk-rank-card {
  border-radius: 18px;
  box-shadow: 0 26px 64px -30px rgba(0, 0, 0, 0.65), inset 0 1px 0 rgba(255, 255, 255, 0.045);
}
.cashback-experience .cbk-request-card,
.cashback-experience #portalRankDetails .portal-chart-card {
  border-radius: 18px;
}

/* ---- Rank card: hierarchy the eye can follow top-to-bottom per column ---- */
.cashback-experience .cbk-rank-lifetime > span { font-size: 11px; color: #7f97ad; }
.cashback-experience .cbk-rank-lifetime > strong { font-size: 19px; }
.cashback-experience .cbk-rank-badge { font-weight: 740; }

/* ---- Emblem: private membership badge, not a rounded-square icon ---- */
.cashback-experience .cbk-rank-emblem {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.24),
    inset 0 -10px 16px rgba(0, 0, 0, 0.38),
    0 8px 22px -12px rgba(201, 138, 82, 0.6),
    0 0 0 4px rgba(255, 255, 255, 0.02);
}
.cashback-experience .cbk-rank-emblem b { letter-spacing: 0.02em; }
.cashback-experience .cbk-rank-tier-silver .cbk-rank-emblem,
.cashback-experience .cbk-rank-tier-gold .cbk-rank-emblem,
.cashback-experience .cbk-rank-tier-platinum .cbk-rank-emblem { box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24), inset 0 -10px 16px rgba(0, 0, 0, 0.38), 0 0 0 4px rgba(255, 255, 255, 0.02); }

/* ---- Progress rail: a destination marker, not a loading bar ---- */
.cashback-experience .cbk-rank-rail .portal-progress { overflow: visible; }
.cashback-experience .cbk-rank-rail .portal-progress > span {
  position: relative;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45), 0 0 14px -2px rgba(233, 208, 150, 0.6);
}
.cashback-experience .cbk-rank-rail .portal-progress > span::after {
  content: ""; position: absolute; top: 50%; right: 0; width: 11px; height: 11px;
  border-radius: 50%; transform: translate(50%, -50%);
  background: radial-gradient(circle, #fff6df 0%, rgba(233, 208, 150, 0.95) 55%, transparent 75%);
  box-shadow: 0 0 12px 2px rgba(233, 208, 150, 0.6);
}

/* ---- Next Unlock: the emotional section ---- */
.cashback-experience .cbk-rank-next-unlock {
  border-left: 2px solid rgba(214, 193, 122, 0.35);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
.cashback-experience .cbk-rank-next-unlock.cbk-rank-tier-silver { border-left-color: rgba(185, 198, 212, 0.4); }
.cashback-experience .cbk-rank-next-unlock.cbk-rank-tier-gold { border-left-color: rgba(231, 199, 106, 0.4); }
.cashback-experience .cbk-rank-next-unlock.cbk-rank-tier-platinum { border-left-color: rgba(155, 143, 232, 0.4); }
.cashback-experience .cbk-rank-next-head > strong { font-size: 22px; letter-spacing: -0.01em; }
.cashback-experience .cbk-rank-benefits { margin-top: 12px; padding-top: 12px; gap: 7px; }
.cashback-experience .cbk-rank-benefits li {
  padding-left: 17px; font-size: 12.5px;
}
.cashback-experience .cbk-rank-benefits li::before {
  content: "\2713"; width: auto; height: auto; border-radius: 0; top: 0;
  background: none; color: #83d8ae; font-size: 11px; font-weight: 700; line-height: 1.5;
}

/* ---- Rank modal: refined scrollbar, tier separation, aspirational locked state ---- */
.cashback-experience #portalRankDetails .portal-chart-card {
  scrollbar-width: thin;
  scrollbar-color: rgba(103, 232, 249, 0.32) rgba(255, 255, 255, 0.04);
}
.cashback-experience #portalRankDetails .portal-chart-card::-webkit-scrollbar { width: 8px; }
.cashback-experience #portalRankDetails .portal-chart-card::-webkit-scrollbar-track { background: rgba(255, 255, 255, 0.03); border-radius: 999px; }
.cashback-experience #portalRankDetails .portal-chart-card::-webkit-scrollbar-thumb { background: rgba(103, 232, 249, 0.28); border-radius: 999px; }
.cashback-experience #portalRankDetails .portal-chart-card::-webkit-scrollbar-thumb:hover { background: rgba(103, 232, 249, 0.42); }

.cashback-experience .cbk-rank-ladder { gap: 10px; }
.cashback-experience .cbk-rank-row { align-items: center; }
.cashback-experience .cbk-rank-row.is-locked { opacity: 0.88; }
.cashback-experience .cbk-rank-row.is-locked .cbk-rank-icon { opacity: 0.7; }
.cashback-experience .cbk-rank-row.is-locked > strong { color: #6f889d; font-weight: 640; }
.cashback-experience .cbk-rank-row.is-current { box-shadow: 0 0 0 1px rgba(145, 222, 243, 0.12), 0 14px 30px -20px rgba(145, 222, 243, 0.35); }
.cashback-experience .cbk-rank-row.is-next { box-shadow: 0 14px 30px -22px rgba(214, 193, 122, 0.3); }

/* ---- Request Cashback: tighter, calmer, banking-serious ---- */
.cashback-experience .cbk-request-card { gap: 6px; }
.cashback-experience .cbk-request-note { line-height: 1.45; }

/* ---- Payout history: readability refinement ---- */
.cashback-experience .cbk-payout-row { row-gap: 5px; }
.cashback-experience .cbk-payout-row > small { line-height: 1.5; }

/* ---- Micro animations: 2-3px lift, soft glow, brighter border ---- */
.cashback-experience .cbk-rank-card,
.cashback-experience .cbk-request-card {
  transition: transform 200ms ease, box-shadow 200ms ease;
}
.cashback-experience .cbk-rank-card:hover,
.cashback-experience .cbk-request-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 34px 76px -32px rgba(0, 0, 0, 0.7);
}
.cashback-experience .cbk-rank-ladder .cbk-rank-row {
  transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease;
}
.cashback-experience .cbk-rank-ladder .cbk-rank-row:hover {
  transform: translateY(-2px);
  border-color: rgba(103, 232, 249, 0.26);
}
.cashback-experience .cbk-payout-row {
  transition: transform 180ms ease, border-color 180ms ease;
}
.cashback-experience .cbk-payout-row:hover {
  transform: translateY(-1px);
  border-color: rgba(143, 184, 218, 0.24);
}
.cashback-experience .cbk-bonus-widget {
  transition: transform 180ms ease, border-color 180ms ease;
}
.cashback-experience .cbk-bonus-widget:hover {
  transform: translateY(-2px);
  border-color: rgba(143, 184, 218, 0.22);
}

@media (prefers-reduced-motion: reduce) {
  .cashback-experience .cbk-rank-card,
  .cashback-experience .cbk-request-card,
  .cashback-experience .cbk-rank-ladder .cbk-rank-row,
  .cashback-experience .cbk-payout-row,
  .cashback-experience .cbk-bonus-widget {
    transition: none;
  }
  .cashback-experience .cbk-rank-card:hover,
  .cashback-experience .cbk-request-card:hover,
  .cashback-experience .cbk-rank-ladder .cbk-rank-row:hover,
  .cashback-experience .cbk-payout-row:hover,
  .cashback-experience .cbk-bonus-widget:hover {
    transform: none;
  }
}

/* ---- Responsive: keep the marker and hover lift safe on narrow viewports ---- */
@media (max-width: 760px) {
  .cashback-experience .cbk-rank-card:hover,
  .cashback-experience .cbk-rank-ladder .cbk-rank-row:hover,
  .cashback-experience .cbk-payout-row:hover {
    transform: none;
  }
}

/* ==============================================================
   AUREX CASHBACK -- Final maximum polish / freeze pass
   CSS-only (no markup, id, data-*, handler, value, or condition
   changed). Every rule scoped under .cashback-experience or its
   confirmed descendant #portalRankDetails. Append-only.
   ============================================================== */

/* ---- 1. Hero: tabular numerals + surface depth ---- */
.cashback-experience .cashback-hero {
  box-shadow: 0 24px 60px -30px rgba(0, 0, 0, 0.55);
}
.cashback-experience .cbk-hero-metric > strong { font-variant-numeric: tabular-nums; }

/* ---- 2. Bonus: small CSS-only header glyph, deeper track ---- */
.cashback-experience .cbk-bonus-widget-head > span { display: flex; align-items: center; gap: 7px; }
.cashback-experience .cbk-bonus-widget-head > span::before {
  content: ""; width: 6px; height: 6px; border-radius: 2px; transform: rotate(45deg);
  background: rgba(145, 222, 243, 0.75); flex: 0 0 auto;
}
.cashback-experience .cbk-bonus-widget:nth-child(2) .cbk-bonus-widget-head > span::before { background: rgba(214, 193, 122, 0.8); }
.cashback-experience .cbk-bonus-track { box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.4); }
.cashback-experience .cbk-bonus-figures > span:first-child { font-variant-numeric: tabular-nums; }

/* ---- 3. Formula: result prominence ---- */
.cashback-experience .cashback-formula-strip .cfs-result {
  border: 1px solid rgba(131, 216, 174, 0.16);
}

/* ---- 4. Lifecycle: distinct stage identity + connector depth ---- */
.cashback-experience .cashback-lifecycle .cbf-requested .cbf-node { border-color: rgba(224, 138, 74, 0.6); }
.cashback-experience .cashback-lifecycle .cbf-requested > strong { color: #f0b285; }
.cashback-experience .cashback-lifecycle .cbf-stage::before {
  background: linear-gradient(90deg, rgba(143, 184, 218, 0.05), rgba(143, 184, 218, 0.22), rgba(143, 184, 218, 0.05));
}
.cashback-experience .cashback-lifecycle .cbf-node { transition: box-shadow 180ms ease, border-color 180ms ease; }

/* ---- 5. Activity / financial metric cards: consistent rhythm ---- */
.cashback-experience .cashback-activity-grid .portal-stat {
  min-height: 92px; padding: 16px 18px; display: flex; flex-direction: column; justify-content: center; gap: 5px;
}
.cashback-experience .cashback-activity-grid .portal-stat strong { font-variant-numeric: tabular-nums; }

/* ---- 12. Rewards journey: vertical progression strip with a real connector ---- */
.cashback-experience .cbk-journey-light .prj-rail { display: grid; grid-template-columns: 1fr; gap: 2px; }
.cashback-experience .cbk-journey-light .prj-step {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px;
}
.cashback-experience .cbk-journey-light .prj-step::after { content: none; }
.cashback-experience .cbk-journey-light .prj-dot { position: relative; }
.cashback-experience .cbk-journey-light .prj-dot::after {
  content: ""; position: absolute; top: 130%; left: 50%; width: 1px; height: 16px;
  background: rgba(143, 184, 218, 0.16); transform: translateX(-50%);
}
.cashback-experience .cbk-journey-light .prj-step:last-child .prj-dot::after { display: none; }
.cashback-experience .cbk-journey-light .prj-step.is-complete .prj-body strong { color: #93a7b8; font-weight: 600; }
.cashback-experience .cbk-journey-light .prj-step.is-complete .prj-dot { opacity: 0.75; }

/* ---- 14. Payout request form: premium banking form presentation ---- */
.cashback-experience .cashback-request-form-card { padding: 22px 24px 20px; display: grid; gap: 16px; }
.cashback-experience .cashback-request-form-card form { display: grid; gap: 14px; }
.cashback-experience .cashback-request-form-card label {
  display: grid; gap: 7px; font-size: 11.5px; font-weight: 660; letter-spacing: 0.03em;
  text-transform: uppercase; color: #8299ae;
}
.cashback-experience .cashback-request-form-card input,
.cashback-experience .cashback-request-form-card textarea {
  width: 100%; min-height: 46px; padding: 0 14px; border: 1px solid rgba(143, 184, 218, 0.18);
  border-radius: 11px; background: rgba(255, 255, 255, 0.02); color: #eef5fb;
  font-size: 13.5px; font-weight: 500; text-transform: none; letter-spacing: normal;
}
.cashback-experience .cashback-request-form-card textarea { min-height: 84px; padding: 12px 14px; line-height: 1.5; resize: vertical; }
.cashback-experience .cashback-request-form-card input:focus-visible,
.cashback-experience .cashback-request-form-card textarea:focus-visible {
  outline: none; border-color: rgba(103, 232, 249, 0.5); box-shadow: 0 0 0 3px rgba(103, 232, 249, 0.14);
}
.cashback-experience .cashback-request-form-card .portal-form-actions { margin-top: 2px; gap: 12px; }

/* ---- 15. Payout history: on-hold reads as muted amber, distinct from requested ---- */
.cashback-experience .cbk-payout-row.is-on-hold .portal-status-pill { background: rgba(214, 193, 122, 0.08); color: #c9b98a; }

/* ---- 17. Bottom journey strip: light Cashback-only touch (shared component, exact scope) ---- */
.cashback-experience .portal-journey-strip { border-color: rgba(143, 184, 218, 0.1); }

/* ---- 18. Consistent hover depth on remaining interactive rows ---- */
.cashback-experience .cbk-bonus-widget,
.cashback-experience .cashback-request-form-card input,
.cashback-experience .cashback-request-form-card textarea {
  transition: border-color 180ms ease, box-shadow 180ms ease;
}

@media (prefers-reduced-motion: reduce) {
  .cashback-experience .cashback-lifecycle .cbf-node,
  .cashback-experience .cbk-bonus-widget,
  .cashback-experience .cashback-request-form-card input,
  .cashback-experience .cashback-request-form-card textarea {
    transition: none;
  }
}

/* ---- 19. Responsive: activity cards + journey + form stay clean on mobile ---- */
@media (max-width: 640px) {
  .cashback-experience .cashback-activity-grid .portal-stat { min-height: 76px; padding: 13px 15px; }
  .cashback-experience .cashback-request-form-card { padding: 18px 16px; }
}

/* ==============================================================
   AUREX CASHBACK -- Final layout correction only
   CSS-only. No markup, id, data-*, handler, value, or condition
   changed. Scoped under .cashback-experience. Append-only.
   ============================================================== */

/* ---- 1. Request Cashback: size to content, do not stretch to match Payout History ---- */
.cashback-experience .cbk-payout-grid { align-items: start; }
.cashback-experience .cbk-request-card { align-self: start; height: auto; }

/* ---- 2. Rewards Journey: compact horizontal strip restored on desktop ----
   Mobile (<=760px) keeps the vertical stepper added in the prior pass;
   this block re-establishes the original horizontal 5-column strip above
   that breakpoint and neutralizes the mobile-only vertical connector. */
@media (min-width: 761px) {
  .cashback-experience .cbk-journey-light .prj-rail {
    display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px;
  }
  .cashback-experience .cbk-journey-light .prj-step {
    display: grid; grid-template-columns: 1fr; align-items: start; gap: 5px;
    padding: 10px 11px; border-bottom: 0;
  }
  .cashback-experience .cbk-journey-light .prj-step::after {
    content: ""; position: absolute; top: 16px; right: -5px; width: 8px; height: 2px;
    background: rgba(143, 184, 218, 0.28);
  }
  .cashback-experience .cbk-journey-light .prj-step:last-child::after { display: none; }
  .cashback-experience .cbk-journey-light .prj-dot::after { content: none; }
}

/* ==============================================================
   AUREX ADMIN CASHBACK -- Phase A (operations command header,
   executive summary, three-mode separation). Presentation only.
   Every selector scoped under .cashback-admin (some additionally
   prefixed with .admin-intelligence-body to safely out-specify
   pre-existing .admin-intelligence-body .admin-main rules on the
   same classes -- still requires .cashback-admin as an ancestor,
   so the blast radius stays contained to this route). No client
   Cashback selector (.cashback-experience, #portalRankDetails) is
   touched. No bare .admin-table / .primary-button / .secondary-button
   / .status-badge / .cashback-engine-panel rule is modified -- only
   ancestor-qualified overrides are added. Append-only.
   ============================================================== */

/* ---- 1. Operations command header ---- */
.cashback-admin .cbk-ops-header {
  padding: 18px 22px; border-radius: 16px; margin: 0 0 14px;
  border: 1px solid rgba(103, 232, 249, 0.14);
  background: linear-gradient(160deg, rgba(10, 22, 40, 0.85), rgba(4, 10, 20, 0.92));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
}
.cashback-admin .cbk-ops-header-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.cashback-admin .cbk-ops-eyebrow { margin: 0 0 4px; font-size: 1.05rem; font-weight: 720; color: #f5faff; letter-spacing: -0.01em; }
.cashback-admin .cbk-ops-subtitle { margin: 0; max-width: 58ch; color: rgba(190, 206, 228, 0.68); font-size: 0.82rem; line-height: 1.5; }
.cashback-admin .cbk-ops-health {
  flex: 0 0 auto; padding: 5px 12px; border-radius: 999px; font-size: 0.66rem; font-weight: 700;
  letter-spacing: 0.06em; text-transform: uppercase; color: #9fb4ca;
  border: 1px solid rgba(150, 176, 208, 0.22); background: rgba(150, 176, 208, 0.06);
}
.cashback-admin .cbk-ops-now { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 16px; }
.cashback-admin .cbk-ops-now-item {
  display: grid; gap: 3px; padding: 12px 14px; border-radius: 12px;
  border: 1px solid rgba(150, 176, 208, 0.14); background: rgba(255, 255, 255, 0.014);
}
.cashback-admin .cbk-ops-now-item > strong { font-size: 1.5rem; font-weight: 720; color: #e7f0fb; font-variant-numeric: tabular-nums; }
.cashback-admin .cbk-ops-now-item > span { font-size: 0.72rem; color: rgba(150, 176, 208, 0.6); }
.cashback-admin .cbk-ops-now-item.is-attention { border-color: rgba(240, 193, 104, 0.32); background: rgba(240, 193, 104, 0.05); }
.cashback-admin .cbk-ops-now-item.is-attention > strong { color: #f0d089; }

/* ---- 2. Executive operations summary (compact command strip) ---- */
.admin-intelligence-body .cashback-admin .cb-summary { padding: 16px 20px; border-radius: 14px; }
.admin-intelligence-body .cashback-admin .cbsum-strip { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 12px; }
.admin-intelligence-body .cashback-admin .cbsum-tile {
  display: grid; gap: 4px; padding: 12px 14px; border-radius: 11px;
  border: 1px solid rgba(150, 176, 208, 0.12); background: rgba(255, 255, 255, 0.012);
}
.admin-intelligence-body .cashback-admin .cbsum-tile-emphasis { border-color: rgba(150, 176, 208, 0.2); background: rgba(255, 255, 255, 0.02); }
.admin-intelligence-body .cashback-admin .cbsum-tile-emphasis > strong { font-size: 1.3rem; }
.admin-intelligence-body .cashback-admin .cbsum-tile-quiet { opacity: 0.86; }
.admin-intelligence-body .cashback-admin .cbsum-tile-quiet > strong { font-size: 1.05rem; font-weight: 620; }
.admin-intelligence-body .cashback-admin .cbsum-tile.is-attention { border-color: rgba(240, 193, 104, 0.34); background: rgba(240, 193, 104, 0.06); }
.admin-intelligence-body .cashback-admin .cbsum-tile.is-attention > strong { color: #f0d089; }
.admin-intelligence-body .cashback-admin .cbsum-tile .cbsum-label { font-size: 0.64rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(150, 176, 208, 0.6); }
.admin-intelligence-body .cashback-admin .cbsum-tile > strong { font-variant-numeric: tabular-nums; color: #e7f0fb; }
.admin-intelligence-body .cashback-admin .cbsum-tile > small { color: rgba(150, 176, 208, 0.5); font-size: 0.64rem; }

/* ---- 3. Three operational modes: distinct identity ---- */
.cashback-admin .cbk-verification-mode { margin: 0 0 14px; }
.admin-intelligence-body .cashback-admin .cbk-verification-mode .cashback-engine-panel {
  border-color: rgba(150, 176, 208, 0.18);
  background:
    radial-gradient(circle at 12% 0%, rgba(150, 176, 208, 0.06), transparent 22rem),
    linear-gradient(145deg, rgba(14, 20, 32, 0.8), rgba(5, 9, 17, 0.92));
}

.cashback-admin .cbk-funnel { border-radius: 16px; padding: 16px 16px 16px 14px; background: rgba(255, 255, 255, 0.01); }
.cashback-admin .cbk-reward-operations { border-left-color: rgba(131, 216, 174, 0.4); background: linear-gradient(100deg, rgba(131, 216, 174, 0.035), transparent 60%); }
.cashback-admin .cbk-payout-requests { border-left-color: rgba(103, 232, 249, 0.4); background: linear-gradient(100deg, rgba(103, 232, 249, 0.035), transparent 60%); }
.cashback-admin .cbk-funnel-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; margin-bottom: 12px; }
.cashback-admin .cbk-funnel-eyebrow { font-size: 0.94rem; font-weight: 720; color: #eaf2fd; }
.cashback-admin .cbk-funnel-flow { font-size: 0.7rem; font-weight: 640; letter-spacing: 0.02em; color: rgba(150, 176, 208, 0.65); font-variant-numeric: tabular-nums; }
.cashback-admin .cbk-reward-operations .cbk-funnel-flow { color: rgba(131, 216, 174, 0.85); }
.cashback-admin .cbk-payout-requests .cbk-funnel-flow { color: rgba(103, 232, 249, 0.85); }
.cashback-admin .cbk-funnel-caption { flex-basis: 100%; font-size: 0.72rem; color: rgba(150, 176, 208, 0.5); }

/* ---- 10. Responsive: laptop/tablet ---- */
@media (max-width: 1200px) {
  .admin-intelligence-body .cashback-admin .cbsum-strip { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .cashback-admin .cbk-ops-now { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-intelligence-body .cashback-admin .cbsum-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cashback-admin .cbk-ops-header-top { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 620px) {
  .cashback-admin .cbk-ops-now { grid-template-columns: 1fr; }
  .admin-intelligence-body .cashback-admin .cbsum-strip { grid-template-columns: 1fr; }
  .cashback-admin .cbk-funnel { padding: 14px 12px 14px 12px; }
}

/* ==============================================================
   AUREX ADMIN CASHBACK -- Phase A.1 header and color correction.
   Presentation only. Every selector scoped under .cashback-admin
   (some compounded with .admin-intelligence-body purely to safely
   out-specify pre-existing rules on the same classes -- still
   requires .cashback-admin as an ancestor). No client Cashback
   selector touched. No bare shared selector modified. Append-only.
   ============================================================== */

/* ---- 1. Command header: compact single-line status strip ---- */
.cashback-admin .cbk-ops-header {
  display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px;
  padding: 10px 16px; border-radius: 10px; margin: 0 0 10px;
  border: 1px solid rgba(150, 176, 208, 0.14);
  background: rgba(255, 255, 255, 0.014);
  box-shadow: none;
}
.cashback-admin .cbk-ops-eyebrow {
  margin: 0; font-size: 0.66rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  color: rgba(150, 176, 208, 0.62);
}
.cashback-admin .cbk-ops-line {
  margin: 0; font-size: 0.82rem; font-weight: 600; color: #d8e2ee; font-variant-numeric: tabular-nums;
}

/* ---- 2. Executive summary: calmer contrast, quieter historical tiles ---- */
.admin-intelligence-body .cashback-admin .cb-summary {
  padding: 14px 18px; border-radius: 12px; margin: 0 0 10px;
  border-color: rgba(150, 176, 208, 0.12);
  background: rgba(255, 255, 255, 0.012);
  box-shadow: none;
}
.admin-intelligence-body .cashback-admin .cbsum-tile {
  border-color: rgba(150, 176, 208, 0.1); background: rgba(255, 255, 255, 0.01);
}
.admin-intelligence-body .cashback-admin .cbsum-tile-emphasis {
  border-color: rgba(150, 176, 208, 0.16); background: rgba(255, 255, 255, 0.018);
}
.admin-intelligence-body .cashback-admin .cbsum-tile-quiet { opacity: 0.72; }
.admin-intelligence-body .cashback-admin .cbsum-tile-quiet > strong { font-size: 0.98rem; color: #c3d0de; }
.admin-intelligence-body .cashback-admin .cbsum-tile.is-attention {
  border-color: rgba(240, 193, 104, 0.3); background: rgba(240, 193, 104, 0.045);
}

/* ---- 3. De-blue the panel surfaces: deep navy / charcoal, restrained accents ---- */
.admin-intelligence-body .cashback-admin .cbk-verification-mode .cashback-engine-panel {
  border-color: rgba(150, 176, 208, 0.16);
  background: linear-gradient(150deg, rgba(16, 22, 32, 0.86), rgba(6, 10, 16, 0.94));
}
.admin-intelligence-body .cashback-admin .cbk-reward-operations .cashback-engine-panel {
  border-color: rgba(131, 216, 174, 0.15);
  background: linear-gradient(150deg, rgba(14, 26, 22, 0.86), rgba(6, 12, 10, 0.94));
}
.cashback-admin .cbk-funnel { background: rgba(255, 255, 255, 0.008); border-radius: 14px; }
.cashback-admin .cbk-reward-operations { background: rgba(131, 216, 174, 0.02); }
.cashback-admin .cbk-payout-requests { background: rgba(103, 232, 249, 0.018); }
.cashback-admin .cbk-funnel-eyebrow { color: #dbe4ee; font-weight: 680; }

/* ---- 4. Section rhythm: tighter, still clearly separated ---- */
.cashback-admin .cbk-verification-mode { margin: 0 0 10px; }
.cashback-admin .cbk-funnel { margin: 0 0 10px; padding: 14px 14px 14px 13px; }
.cashback-admin .cbk-funnel:last-child { margin-bottom: 0; }
.cashback-admin .cbk-funnel-head { margin-bottom: 10px; }

/* ==============================================================
   AUREX ADMIN CASHBACK -- Final enterprise polish (visual freeze).
   Presentation only. Every selector scoped under .cashback-admin
   or .cashback-supporting (both unique to this route), some
   compounded with .admin-intelligence-body purely to safely
   out-specify pre-existing rules on the same shared classes.
   No client Cashback selector touched. No bare shared selector
   modified -- only ancestor-qualified overrides. Append-only.
   ============================================================== */

/* ---- 1. Executive header: plain inline status line, no second header ---- */
.cashback-admin .cbk-ops-header {
  border: 0; background: transparent; padding: 2px 0 12px; margin: 0 0 4px;
  border-bottom: 1px solid rgba(150, 176, 208, 0.1);
}
.cashback-admin .cbk-ops-eyebrow { color: rgba(150, 176, 208, 0.5); }
.cashback-admin .cbk-ops-line { color: rgba(200, 212, 228, 0.78); font-weight: 550; }

/* ---- 2 & 9. Section identity + reduced cyan wash ---- */
.admin-intelligence-body .cashback-admin .cbk-verification-mode .cashback-engine-panel {
  border-color: rgba(150, 176, 208, 0.15);
  background: linear-gradient(150deg, rgba(15, 20, 29, 0.88), rgba(6, 9, 15, 0.95));
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22);
}
.admin-intelligence-body .cashback-admin .cbk-reward-operations .cashback-engine-panel {
  border-color: rgba(131, 216, 174, 0.14);
  background: linear-gradient(150deg, rgba(13, 24, 20, 0.88), rgba(6, 11, 9, 0.95));
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22);
}
.admin-intelligence-body .cashback-admin .cbk-payout-requests .admin-table-panel {
  border-color: rgba(96, 150, 214, 0.2);
  background: linear-gradient(150deg, rgba(14, 20, 30, 0.9), rgba(5, 9, 16, 0.96));
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22);
}
.admin-intelligence-body .cashback-admin .cbk-payout-requests .status-badge { border-color: rgba(96, 150, 214, 0.24); }
.admin-intelligence-body .cashback-supporting .cashback-engine-panel,
.admin-intelligence-body .cashback-supporting .admin-table-panel,
.admin-intelligence-body .cashback-supporting .cashback-supporting-link {
  border-color: rgba(140, 150, 162, 0.14);
  background: linear-gradient(150deg, rgba(17, 18, 22, 0.9), rgba(8, 9, 11, 0.96));
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.2);
}
.cashback-admin .cbk-payout-requests { border-left-color: rgba(96, 150, 214, 0.4); }
.cashback-admin .cbk-payout-requests .cbk-funnel-flow { color: rgba(140, 182, 230, 0.85); }

/* ---- 3. Executive statistics: eight-tile KPI strip ---- */
.admin-intelligence-body .cashback-admin .cbsum-strip { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 12px; }
.admin-intelligence-body .cashback-admin .cbsum-tile { padding: 11px 13px; }
.admin-intelligence-body .cashback-admin .cbsum-tile-emphasis > strong { font-size: 1.22rem; }

/* ---- 4. Reward Operations: wallet totals as an accounting ledger ---- */
.cashback-admin .cbk-reward-operations .cashback-summary-grid {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px;
  margin: 14px 0; border: 1px solid rgba(131, 216, 174, 0.1); border-radius: 12px;
  overflow: hidden; background: rgba(131, 216, 174, 0.1);
}
.cashback-admin .cbk-reward-operations .cbk-wallet-item {
  display: grid; gap: 3px; padding: 11px 13px; background: rgba(8, 14, 12, 0.92);
}
.cashback-admin .cbk-reward-operations .cbk-wallet-item > small {
  font-size: 0.62rem; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; color: rgba(150, 176, 208, 0.55);
}
.cashback-admin .cbk-reward-operations .cbk-wallet-item > strong {
  font-size: 1.02rem; font-weight: 660; color: #d8e2ee; font-variant-numeric: tabular-nums;
}
.cashback-admin .cbk-reward-operations .cbk-wallet-item.cbk-wallet-key { background: rgba(11, 20, 17, 0.96); }
.cashback-admin .cbk-reward-operations .cbk-wallet-item.cbk-wallet-key > strong { color: #a9ecc9; font-size: 1.14rem; }
.cashback-admin .cbk-reward-operations .table-action-group { gap: 6px; }

/* ---- 5. Table polish (ancestor-qualified: reward + payout tables only) ---- */
.admin-intelligence-body .cashback-admin .cbk-reward-operations .admin-table th,
.admin-intelligence-body .cashback-admin .cbk-payout-requests .admin-table th {
  color: rgba(150, 176, 208, 0.7); font-size: 0.66rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase;
  border-bottom: 1px solid rgba(150, 176, 208, 0.14);
}
.admin-intelligence-body .cashback-admin .cbk-reward-operations .admin-table td,
.admin-intelligence-body .cashback-admin .cbk-payout-requests .admin-table td {
  padding-top: 10px; padding-bottom: 10px; border-bottom: 1px solid rgba(150, 176, 208, 0.06);
}
.admin-intelligence-body .cashback-admin .cbk-reward-operations .admin-table tbody tr:hover td,
.admin-intelligence-body .cashback-admin .cbk-payout-requests .admin-table tbody tr:hover td {
  background: rgba(150, 176, 208, 0.03);
}
.admin-intelligence-body .cashback-admin .cbk-reward-operations .status-badge,
.admin-intelligence-body .cashback-admin .cbk-payout-requests .status-badge {
  min-height: 24px; padding: 3px 10px;
}

/* ---- 6. Button hierarchy ---- */
.cashback-admin .cbk-op-btn {
  min-height: 30px; padding: 0 11px; border-radius: 7px; font-size: 0.72rem; font-weight: 640;
  border: 1px solid rgba(150, 176, 208, 0.18); background: rgba(255, 255, 255, 0.02); color: #cddbe6;
  transition: border-color 150ms ease, background 150ms ease;
}
.cashback-admin .cbk-op-btn:hover { border-color: rgba(150, 176, 208, 0.34); }
.cashback-admin .cbk-op-primary {
  border-color: rgba(131, 216, 174, 0.4); background: rgba(131, 216, 174, 0.12); color: #cdf3de; font-weight: 680;
}
.cashback-admin .cbk-op-primary:hover { background: rgba(131, 216, 174, 0.18); border-color: rgba(131, 216, 174, 0.55); }
.cashback-admin .cbk-op-danger {
  border-color: rgba(255, 118, 132, 0.28); background: rgba(255, 118, 132, 0.06); color: #ffc4cc;
}
.cashback-admin .cbk-op-danger:hover { background: rgba(255, 118, 132, 0.12); border-color: rgba(255, 118, 132, 0.44); }
.cashback-admin .cbk-op-secondary { opacity: 0.88; }
.cashback-admin .secondary-button.cbk-op-primary {
  border-color: rgba(131, 216, 174, 0.4); background: rgba(131, 216, 174, 0.1); color: #cdf3de;
}
.cashback-admin .secondary-button.cbk-op-primary:hover { background: rgba(131, 216, 174, 0.16); }
.cashback-admin .cb-review-trigger { opacity: 0.82; }

/* ---- 7. Empty states: premium, not unfinished ---- */
.cashback-admin .empty-state {
  display: grid; gap: 4px; padding: 26px 18px; text-align: center;
  color: rgba(150, 176, 208, 0.62); font-size: 0.8rem;
}
.cashback-admin .empty-state strong { color: rgba(200, 212, 228, 0.82); font-size: 0.88rem; font-weight: 640; }

/* ---- 8 & 11. Typography and alignment consistency ---- */
.cashback-admin .cashback-engine-panel,
.cashback-admin .admin-table-panel,
.cashback-admin .cb-summary { border-radius: 14px; }
.cashback-admin .panel-header.compact h3 { font-weight: 680; letter-spacing: -0.005em; }
.cashback-admin .preview-note { line-height: 1.5; color: rgba(150, 176, 208, 0.58); }

@media (max-width: 1100px) {
  .admin-intelligence-body .cashback-admin .cbsum-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cashback-admin .cbk-reward-operations .cashback-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .admin-intelligence-body .cashback-admin .cbsum-strip { grid-template-columns: 1fr; }
  .cashback-admin .cbk-reward-operations .cashback-summary-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .cashback-admin .cbk-op-btn { transition: none; }
}

/* ==============================================================
   AUREX ADMIN CASHBACK -- Final phase: Payout Queue + Claim Review
   Drawer. Presentation only. In-flow rules scoped under
   .cashback-admin. Drawer rules scoped under the confirmed unique,
   portalled selectors (.cb-review-backdrop, .cb-review-drawer,
   .cb-review-head, .cb-review-body, .cb-review-section, .cb-kv-grid,
   .cb-kv-money, .cb-lifecycle-trail, .cb-action-card, .cb-review-foot).
   No client Cashback selector touched. No bare shared button/table/
   input/modal/status selector modified. Append-only.
   ============================================================== */

/* ---- 1/2. Payout queue: per-status row + badge distinction ---- */
.admin-intelligence-body .cashback-admin .cbk-payout-requests tr:has(.cbk-claim-row-requested) { border-left: 2px solid rgba(240, 193, 104, 0.55); }
.admin-intelligence-body .cashback-admin .cbk-payout-requests tr:has(.cbk-claim-row-approved) { border-left: 2px solid rgba(96, 150, 214, 0.55); }
.admin-intelligence-body .cashback-admin .cbk-payout-requests tr:has(.cbk-claim-row-partially-paid) { border-left: 2px solid rgba(214, 178, 90, 0.6); }
.admin-intelligence-body .cashback-admin .cbk-payout-requests tr:has(.cbk-claim-row-on-hold) { border-left: 2px solid rgba(200, 170, 120, 0.35); }
.admin-intelligence-body .cashback-admin .cbk-payout-requests tr:has(.cbk-claim-row-paid) { border-left: 2px solid rgba(131, 216, 174, 0.4); }
.admin-intelligence-body .cashback-admin .cbk-payout-requests tr:has(.cbk-claim-row-rejected) { border-left: 2px solid rgba(255, 118, 132, 0.4); }
.admin-intelligence-body .cashback-admin .cbk-payout-requests tr:has(.cbk-claim-row-cancelled) { border-left: 2px solid rgba(170, 153, 130, 0.32); }

.cashback-admin .cbk-payout-requests .cbk-claim-row-requested .status-badge { border-color: rgba(240, 193, 104, 0.4); color: #f0d089; }
.cashback-admin .cbk-payout-requests .cbk-claim-row-approved .status-badge { border-color: rgba(96, 150, 214, 0.42); color: #a9c9f0; }
.cashback-admin .cbk-payout-requests .cbk-claim-row-partially-paid .status-badge { border-color: rgba(214, 178, 90, 0.44); color: #e9d09a; }
.cashback-admin .cbk-payout-requests .cbk-claim-row-on-hold .status-badge { border-color: rgba(200, 170, 120, 0.3); color: #c9b98a; }
.cashback-admin .cbk-payout-requests .cbk-claim-row-paid .status-badge { border-color: rgba(131, 216, 174, 0.38); color: #a9ecc9; }
.cashback-admin .cbk-payout-requests .cbk-claim-row-rejected .status-badge { border-color: rgba(255, 118, 132, 0.36); color: #ffb3bb; }
.cashback-admin .cbk-payout-requests .cbk-claim-row-cancelled .status-badge { border-color: rgba(170, 153, 130, 0.3); color: #c9baa4; }

/* Review is the primary row action; inline state-change buttons stay
   available but quieter until the admin opens the drawer. */
.cashback-admin .cbk-payout-requests .cb-review-trigger {
  min-height: 30px; padding: 0 14px; border-radius: 7px; font-size: 0.74rem; font-weight: 700;
  border: 1px solid rgba(96, 150, 214, 0.4); background: rgba(96, 150, 214, 0.14); color: #cfe0f5;
  opacity: 1;
}
.cashback-admin .cbk-payout-requests .cb-review-trigger:hover { background: rgba(96, 150, 214, 0.2); border-color: rgba(96, 150, 214, 0.55); }
.cashback-admin .cbk-payout-requests .table-action-group .cbk-op-btn {
  min-height: 26px; padding: 0 8px; font-size: 0.66rem; opacity: 0.72; background: transparent;
}
.cashback-admin .cbk-payout-requests .table-action-group .cbk-op-btn:hover { opacity: 1; }

/* ---- 3. Premium empty state ---- */
.cashback-admin .cbk-payout-requests .empty-state,
.cashback-admin .cbk-reward-operations .empty-state {
  padding: 34px 18px;
}

/* ==============================================================
   Claim Review Drawer -- portalled to document.body. Scoped under
   the confirmed unique selectors listed in the brief; not nested
   under .cashback-admin, which would not match at runtime.
   ============================================================== */

/* ---- 8. Surface, dividers, controlled shadow ---- */
.cb-review-drawer {
  background: linear-gradient(165deg, rgba(12, 16, 24, 0.98), rgba(5, 7, 11, 0.99));
  box-shadow: -20px 0 50px rgba(0, 0, 0, 0.4);
}
.cb-review-head { border-bottom: 1px solid rgba(150, 176, 208, 0.12); }
.cb-review-section { border-bottom: 1px solid rgba(150, 176, 208, 0.08); }
.cb-review-section:last-child { border-bottom: 0; }
.cb-review-section-title {
  font-size: 0.68rem; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase;
  color: rgba(150, 176, 208, 0.55);
}

/* ---- 5A. Claim identity: compact metadata ---- */
.cb-review-identity .cb-kv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.cb-kv-grid dd { font-variant-numeric: tabular-nums; }

/* ---- 5B/7. Financial summary: strongest section, Remaining emphasized ---- */
.cb-kv-grid-financial { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 14px; }
.cb-kv-grid-financial > div {
  padding: 10px 12px; border-radius: 10px; border: 1px solid rgba(150, 176, 208, 0.1); background: rgba(255, 255, 255, 0.012);
}
.cb-kv-grid-financial .cb-kv-money { font-size: 1.05rem; }
.cb-kv-grid .cb-kv-remaining-focus {
  border-color: rgba(214, 178, 90, 0.34) !important; background: rgba(214, 178, 90, 0.07) !important;
}
.cb-kv-grid .cb-kv-remaining-focus .cb-kv-money { color: #e9d09a !important; font-size: 1.2rem !important; }

/* ---- 6. Action hierarchy inside the drawer (reuses the queue's button system) ---- */
.cb-action-card .cbk-op-btn {
  min-height: 34px; padding: 0 16px; border-radius: 8px; font-size: 0.78rem; font-weight: 660;
  border: 1px solid rgba(150, 176, 208, 0.2); background: rgba(255, 255, 255, 0.02); color: #cddbe6;
  transition: border-color 150ms ease, background 150ms ease;
}
.cb-action-card .cbk-op-primary { border-color: rgba(96, 150, 214, 0.44); background: rgba(96, 150, 214, 0.14); color: #cfe0f5; font-weight: 700; }
.cb-action-card .cbk-op-primary:hover { background: rgba(96, 150, 214, 0.2); border-color: rgba(96, 150, 214, 0.6); }
.cb-action-card .cbk-op-danger { border-color: rgba(255, 118, 132, 0.32); background: rgba(255, 118, 132, 0.06); color: #ffc4cc; }
.cb-action-card .cbk-op-danger:hover { background: rgba(255, 118, 132, 0.12); border-color: rgba(255, 118, 132, 0.48); }
.cb-action-card .cbk-op-secondary { opacity: 0.86; }
.cb-review-foot { border-top: 1px solid rgba(150, 176, 208, 0.12); }

@media (prefers-reduced-motion: reduce) {
  .cb-action-card .cbk-op-btn { transition: none; }
}

/* ---- 9. Responsive drawer: no clipped buttons, no hidden amounts ---- */
@media (max-width: 1024px) {
  .cb-kv-grid-financial { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cb-review-identity .cb-kv-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .cb-kv-grid-financial { grid-template-columns: 1fr 1fr; }
}

/* ==============================================================
   AUREX -- Pass 1 (Login/Auth): support-link copy polish.
   Presentation only. Scoped to the existing auth-screen wrapper
   classes (.portal-entry-actions, .admin-intelligence-body
   .ax-auth-panel) already used exclusively by these two login
   screens. Append-only.
   ============================================================== */
.portal-entry-actions .pce-help-lead {
  display: block; font-weight: 600; color: rgba(230, 240, 252, 0.86); margin-bottom: 2px;
}
.admin-intelligence-body .ax-auth-help {
  max-width: 26rem; color: rgba(150, 176, 208, 0.6); font-size: 0.78rem; line-height: 1.5; margin: 0;
}
.admin-intelligence-body .ax-auth-help span { display: block; color: rgba(190, 206, 228, 0.72); font-weight: 600; margin-bottom: 2px; }
.admin-intelligence-body .ax-auth-help a { color: #9ee8ff; text-decoration: none; }
.admin-intelligence-body .ax-auth-help a:hover { text-decoration: underline; }

/* ==============================================================
   AUREX -- Pass 2 (Cashback): Request Cashback success/error
   message presentation. Confirmed unstyled anywhere in the
   stylesheet before this addition (grep returned zero matches).
   Scoped under .cashback-experience, consistent with all prior
   Cashback CSS in this file. Append-only.
   ============================================================== */
.cashback-experience .portal-form-success,
.cashback-experience .portal-form-error {
  display: flex; align-items: baseline; gap: 8px;
  padding: 11px 14px; margin: 0 0 4px; border-radius: 10px;
  font-size: 12.5px; line-height: 1.5;
}
.cashback-experience .portal-form-success {
  border: 1px solid rgba(131, 216, 174, 0.28); background: rgba(131, 216, 174, 0.08); color: #a9ecc9;
}
.cashback-experience .portal-form-error {
  border: 1px solid rgba(255, 118, 132, 0.28); background: rgba(255, 118, 132, 0.07); color: #ffb3bb;
}

/* ==============================================================
   AUREX -- Pass 3: Weekly CSV Import presentation.
   admin/operations/weekly-csv-import.js is FROZEN (manifest-pinned)
   and was not edited. Every rule below targets class names already
   rendered by that file's existing markup -- CSS only, no new
   wrapper elements, no data-* hooks touched, no behavior changed.
   Scoped to classes exclusive to this workflow. Append-only.
   ============================================================== */

/* ---- Import For / Main Admin vs IB: must be unmistakable ---- */
.weekly-csv-source-selector {
  padding: 20px 22px; border-radius: 14px; margin-bottom: 16px;
  border: 1px solid rgba(150, 176, 208, 0.16);
  background: linear-gradient(150deg, rgba(14, 24, 42, 0.9), rgba(6, 12, 22, 0.95));
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.22);
}
.weekly-csv-source-selector .button-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.weekly-csv-source-selector .secondary-button {
  min-height: 46px; padding: 0 22px; font-size: 0.86rem; font-weight: 660;
  border: 1px solid rgba(150, 176, 208, 0.2); background: rgba(255, 255, 255, 0.02); color: #cddbe6;
  transition: border-color 150ms ease, background 150ms ease;
}
.weekly-csv-source-selector .secondary-button[data-weekly-import-mode="main"].is-active {
  border-color: rgba(96, 150, 214, 0.55); background: rgba(96, 150, 214, 0.16); color: #cfe0f5; font-weight: 740;
  box-shadow: inset 0 0 0 1px rgba(96, 150, 214, 0.26);
}
.weekly-csv-source-selector .secondary-button[data-weekly-import-mode="ib"].is-active {
  border-color: rgba(214, 178, 90, 0.55); background: rgba(214, 178, 90, 0.16); color: #e9d09a; font-weight: 740;
  box-shadow: inset 0 0 0 1px rgba(214, 178, 90, 0.26);
}
.weekly-csv-source-selector .client-search-field {
  margin-top: 14px; display: grid; gap: 6px; max-width: 380px;
}
.weekly-csv-source-selector .client-search-field span {
  font-size: 0.68rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: rgba(150, 176, 208, 0.6);
}
.weekly-csv-source-selector .client-search-field select {
  min-height: 44px; padding: 0 12px; border-radius: 9px; font-size: 0.86rem;
  border: 1px solid rgba(214, 178, 90, 0.3); background: rgba(214, 178, 90, 0.06); color: #eef5fb;
}
.weekly-csv-source-selector .client-search-field select:focus-visible {
  outline: 2px solid rgba(214, 178, 90, 0.5); outline-offset: 2px;
}

/* ---- Panel surface: consistent across dropzone / processing / summary / error ---- */
.weekly-csv-panel {
  padding: 24px 26px; border-radius: 16px;
  border: 1px solid rgba(150, 176, 208, 0.14);
  background: linear-gradient(150deg, rgba(12, 20, 36, 0.9), rgba(5, 10, 19, 0.96));
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.24);
}
.weekly-csv-dropzone { border-color: rgba(96, 150, 214, 0.16); }
.weekly-csv-processing { border-color: rgba(214, 178, 90, 0.22); }
.weekly-csv-summary { border-color: rgba(131, 216, 174, 0.2); }

/* ---- Choose CSV: styled trigger, native file input hidden but still clickable
   via label-wraps-control association (no behavior change). ---- */
.weekly-csv-choose {
  display: inline-flex; align-items: center; gap: 8px; cursor: pointer; margin: 16px 0 6px;
  position: relative; overflow: hidden;
}
.weekly-csv-choose input[type="file"] {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* ---- Completion summary: a real result grid, not stacked labels ---- */
.weekly-csv-counts {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px;
  margin: 16px 0; border: 1px solid rgba(131, 216, 174, 0.14); border-radius: 12px; overflow: hidden;
  background: rgba(131, 216, 174, 0.1);
}
.weekly-csv-counts > div { padding: 14px 16px; background: rgba(8, 16, 13, 0.94); display: grid; gap: 4px; }
.weekly-csv-counts small {
  font-size: 0.62rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(150, 176, 208, 0.55);
}
.weekly-csv-counts strong { font-size: 1.28rem; font-weight: 720; color: #a9ecc9; font-variant-numeric: tabular-nums; }

/* ---- Processing stage indicator ---- */
.weekly-csv-status {
  margin-top: 14px; padding: 12px 16px; border-radius: 10px;
  border: 1px solid rgba(214, 178, 90, 0.24); background: rgba(214, 178, 90, 0.07);
  color: #e9d09a; font-size: 0.86rem; font-weight: 620;
}

/* ---- Responsive: laptop / tablet ---- */
@media (max-width: 1024px) {
  .weekly-csv-counts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .weekly-csv-panel { padding: 18px 16px; }
  .weekly-csv-counts { grid-template-columns: 1fr; }
  .weekly-csv-source-selector .button-row { flex-direction: column; }
  .weekly-csv-source-selector .button-row .secondary-button { width: 100%; text-align: center; }
  .weekly-csv-source-selector .client-search-field { max-width: none; }
}

/* ==============================================================
   AUREX -- Pass 4: IB Management + Trading Account (broker
   verification) presentation.
   admin/ib-management/workspace.js is FROZEN (manifest-pinned)
   and was not edited. All IB Management rules below are scoped
   via #adminRouteContent[data-route-key="ib-management"] -- the
   existing route-content wrapper already rendered by the
   (non-frozen) AdminLayout() in admin/shared/components.js -- so
   nothing here can leak into any other Admin route. No new
   wrapper elements or classes were added to the frozen file.
   Append-only.
   ============================================================== */

/* ---- IB directory: rows read as a real partner list, not plain text ---- */
#adminRouteContent[data-route-key="ib-management"] .admin-list-row {
  display: flex; align-items: center; gap: 14px; padding: 14px 16px; margin-bottom: 8px;
  border-radius: 12px; border: 1px solid rgba(150, 176, 208, 0.14);
  background: rgba(255, 255, 255, 0.014);
  transition: border-color 150ms ease, background 150ms ease;
}
#adminRouteContent[data-route-key="ib-management"] .admin-list-row:hover {
  border-color: rgba(214, 178, 90, 0.3); background: rgba(214, 178, 90, 0.04);
}
#adminRouteContent[data-route-key="ib-management"] .admin-list-row > div:first-child { flex: 1 1 auto; min-width: 0; display: grid; gap: 3px; }
#adminRouteContent[data-route-key="ib-management"] .admin-list-row strong { font-size: 0.92rem; font-weight: 700; color: #eaf2fd; }
#adminRouteContent[data-route-key="ib-management"] .admin-list-row .table-subline { color: rgba(150, 176, 208, 0.6); }
#adminRouteContent[data-route-key="ib-management"] .admin-list-row > span {
  flex: 0 0 auto; font-size: 0.76rem; color: rgba(150, 176, 208, 0.55); font-variant-numeric: tabular-nums;
}

/* ---- Overview / Clients / Uploads tabs: unmistakable current state ---- */
#adminRouteContent[data-route-key="ib-management"] .admin-tabs {
  display: flex; gap: 4px; margin: 4px 0 16px; padding: 4px;
  border-radius: 11px; background: rgba(255, 255, 255, 0.014); border: 1px solid rgba(150, 176, 208, 0.1);
}
#adminRouteContent[data-route-key="ib-management"] .admin-tabs button {
  flex: 1 1 auto; min-height: 38px; padding: 0 16px; border-radius: 8px; border: 0; background: transparent;
  color: rgba(150, 176, 208, 0.62); font-size: 0.82rem; font-weight: 620; cursor: pointer;
  transition: background 150ms ease, color 150ms ease;
}
#adminRouteContent[data-route-key="ib-management"] .admin-tabs button.is-active {
  background: rgba(214, 178, 90, 0.16); color: #e9d09a; font-weight: 700;
  box-shadow: inset 0 0 0 1px rgba(214, 178, 90, 0.26);
}
#adminRouteContent[data-route-key="ib-management"] .admin-tabs button:hover:not(.is-active) { color: #cddbe6; }

/* ---- Overview metrics: an accounting-ledger grid, matching Reward Operations ---- */
#adminRouteContent[data-route-key="ib-management"] .cashback-summary-grid {
  display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1px;
  margin: 14px 0; border: 1px solid rgba(214, 178, 90, 0.14); border-radius: 12px;
  overflow: hidden; background: rgba(214, 178, 90, 0.1);
}
#adminRouteContent[data-route-key="ib-management"] .cashback-summary-grid > div {
  padding: 12px 14px; background: rgba(15, 12, 6, 0.92); display: grid; gap: 4px;
}
#adminRouteContent[data-route-key="ib-management"] .cashback-summary-grid small {
  font-size: 0.62rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(150, 176, 208, 0.55);
}
#adminRouteContent[data-route-key="ib-management"] .cashback-summary-grid strong {
  font-size: 1.14rem; font-weight: 700; color: #e9d09a; font-variant-numeric: tabular-nums;
}

/* ---- Search fields: real inputs, not bare browser defaults ---- */
#adminRouteContent[data-route-key="ib-management"] .client-search-field {
  display: grid; gap: 6px; max-width: 360px; margin: 14px 0;
}
#adminRouteContent[data-route-key="ib-management"] .client-search-field span {
  font-size: 0.68rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase; color: rgba(150, 176, 208, 0.6);
}
#adminRouteContent[data-route-key="ib-management"] .client-search-field input {
  min-height: 42px; padding: 0 13px; border-radius: 9px; font-size: 0.86rem;
  border: 1px solid rgba(150, 176, 208, 0.2); background: rgba(255, 255, 255, 0.02); color: #eef5fb;
}
#adminRouteContent[data-route-key="ib-management"] .client-search-field input:focus-visible {
  outline: 2px solid rgba(214, 178, 90, 0.5); outline-offset: 2px;
}

/* ---- Responsive ---- */
@media (max-width: 1100px) {
  #adminRouteContent[data-route-key="ib-management"] .cashback-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  #adminRouteContent[data-route-key="ib-management"] .cashback-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #adminRouteContent[data-route-key="ib-management"] .admin-list-row { flex-wrap: wrap; }
  #adminRouteContent[data-route-key="ib-management"] .client-search-field { max-width: none; }
}

@media (prefers-reduced-motion: reduce) {
  #adminRouteContent[data-route-key="ib-management"] .admin-list-row,
  #adminRouteContent[data-route-key="ib-management"] .admin-tabs button {
    transition: none;
  }
}

/* ==============================================================
   Trading Accounts: no dedicated section exists inside Client
   Details (confirmed by reading admin/clients/workspace.js in
   full -- only a plain editable "Broker" text field exists there,
   not a verification card/table). Per your standing rule to polish
   the closest existing UI rather than invent a new one, this
   extends the broker-account verification queue/table already in
   admin/cashback/workspace.js (non-frozen, already wrapped in the
   neutral .cbk-verification-mode identity from an earlier pass).
   ============================================================== */
.cashback-admin .cbk-verification-mode .admin-table th {
  color: rgba(150, 176, 208, 0.7); font-size: 0.64rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase;
  border-bottom: 1px solid rgba(150, 176, 208, 0.14);
}
.cashback-admin .cbk-verification-mode .admin-table td {
  padding-top: 10px; padding-bottom: 10px; border-bottom: 1px solid rgba(150, 176, 208, 0.06);
}
.cashback-admin .cbk-verification-mode .admin-table tbody tr:hover td { background: rgba(150, 176, 208, 0.03); }
.cashback-admin .cbk-verification-mode .admin-table td:first-child { font-weight: 620; color: #dfeaf2; }
.cashback-admin .cbk-verification-mode .status-badge { min-height: 24px; padding: 3px 10px; }

/* ==============================================================
   AUREX -- Pass 5: Coming Soon screens + service navigation
   identity + final client-portal polish. Presentation only.
   No client Cashback selector (.cashback-experience,
   #portalRankDetails) is touched. Scoped to unique classes
   introduced this pass or the existing .portal-sidebar /
   .nav-item[data-portal-route] hooks already rendered by
   portal/index.html (no markup change there). Append-only.
   ============================================================== */

/* ---- Coming Soon: shared shell ---- */
.portal-coming-soon {
  position: relative; overflow: hidden; min-height: 58vh;
  display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
  padding: 60px 24px; border-radius: 20px; margin: 0 0 4px;
  border: 1px solid rgba(150, 176, 208, 0.14);
  background: linear-gradient(165deg, rgba(10, 18, 32, 0.94), rgba(4, 8, 16, 0.98));
  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.3);
}
.portal-coming-soon .pcs-body { position: relative; z-index: 1; max-width: 560px; }
.portal-coming-soon .pcs-eyebrow {
  margin: 0 0 10px; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
  color: rgba(150, 176, 208, 0.6);
}
.portal-coming-soon h1 { margin: 0 0 14px; font-size: clamp(1.8rem, 4vw, 2.5rem); font-weight: 620; color: #f5f8fb; line-height: 1.16; }
.portal-coming-soon .pcs-lede { margin: 0 0 24px; color: rgba(190, 206, 228, 0.72); font-size: 0.96rem; line-height: 1.6; }
.portal-coming-soon .pcs-badge {
  display: inline-flex; padding: 7px 18px; border-radius: 999px; font-size: 0.68rem; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase; color: rgba(200, 212, 228, 0.82);
  border: 1px solid rgba(150, 176, 208, 0.26); background: rgba(255, 255, 255, 0.02);
}

/* ---- Carlos: abstract AI node field, restrained sweep ---- */
.portal-coming-soon-carlos { border-color: rgba(103, 232, 249, 0.14); }
.portal-coming-soon-carlos .pcs-badge { border-color: rgba(103, 232, 249, 0.3); color: #a7ecf7; }
.portal-coming-soon-carlos .pcs-field { position: absolute; inset: 0; opacity: 0.55; pointer-events: none; }
.portal-coming-soon-carlos .pcs-node {
  position: absolute; width: 5px; height: 5px; border-radius: 50%;
  background: rgba(103, 232, 249, 0.55); box-shadow: 0 0 14px 2px rgba(103, 232, 249, 0.28);
  animation: pcsNodeDrift 9s ease-in-out infinite;
}
.portal-coming-soon-carlos .pcs-node:nth-child(1) { top: 22%; left: 16%; animation-delay: 0s; }
.portal-coming-soon-carlos .pcs-node:nth-child(2) { top: 64%; left: 26%; animation-delay: 1.6s; }
.portal-coming-soon-carlos .pcs-node:nth-child(3) { top: 36%; left: 76%; animation-delay: 3.2s; }
.portal-coming-soon-carlos .pcs-node:nth-child(4) { top: 78%; left: 68%; animation-delay: 4.8s; }
.portal-coming-soon-carlos .pcs-node:nth-child(5) { top: 12%; left: 52%; animation-delay: 6.4s; }
@keyframes pcsNodeDrift { 0%, 100% { transform: translateY(0); opacity: 0.5; } 50% { transform: translateY(-9px); opacity: 0.9; } }
.portal-coming-soon-carlos .pcs-sweep {
  position: absolute; top: 0; bottom: 0; left: -30%; width: 26%;
  background: linear-gradient(90deg, transparent, rgba(103, 232, 249, 0.05), transparent);
  animation: pcsSweep 10s linear infinite;
}
@keyframes pcsSweep { 0% { transform: translateX(0); } 100% { transform: translateX(430%); } }

/* ---- Chart Reader: muted market silhouette, static trend line ---- */
.portal-coming-soon-chart { border-color: rgba(108, 168, 247, 0.14); }
.portal-coming-soon-chart .pcs-badge { border-color: rgba(108, 168, 247, 0.3); color: #a9c9fb; }
.portal-coming-soon-chart .pcs-field-chart {
  position: absolute; inset: auto 0 0 0; height: 38%;
  display: flex; align-items: flex-end; justify-content: center; gap: 14px; opacity: 0.4; pointer-events: none;
}
.portal-coming-soon-chart .pcs-bar { width: 10px; border-radius: 3px 3px 0 0; background: linear-gradient(180deg, rgba(108, 168, 247, 0.5), rgba(108, 168, 247, 0.06)); }
.portal-coming-soon-chart .pcs-bar:nth-child(1) { height: 28%; }
.portal-coming-soon-chart .pcs-bar:nth-child(2) { height: 52%; }
.portal-coming-soon-chart .pcs-bar:nth-child(3) { height: 38%; }
.portal-coming-soon-chart .pcs-bar:nth-child(4) { height: 68%; }
.portal-coming-soon-chart .pcs-bar:nth-child(5) { height: 46%; }
.portal-coming-soon-chart .pcs-bar:nth-child(6) { height: 60%; }
.portal-coming-soon-chart .pcs-line {
  position: absolute; left: 10%; right: 10%; bottom: 30%; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(131, 216, 174, 0.4), transparent);
}

@media (prefers-reduced-motion: reduce) {
  .portal-coming-soon-carlos .pcs-node,
  .portal-coming-soon-carlos .pcs-sweep { animation: none; }
}
@media (max-width: 640px) {
  .portal-coming-soon { padding: 44px 18px; min-height: 46vh; }
  .portal-coming-soon-chart .pcs-field-chart { gap: 9px; }
  .portal-coming-soon-chart .pcs-bar { width: 7px; }
}

/* ==============================================================
   Service navigation: distinct identity per service, one shared
   language. Uses the existing data-portal-route attribute already
   rendered in portal/index.html -- no markup change.
   ============================================================== */
.portal-sidebar .nav-item { transition: background 160ms ease, color 160ms ease, transform 160ms ease; }
.portal-sidebar .nav-item:hover { transform: translateX(2px); }
.portal-sidebar .nav-item[data-portal-route="carlos"] svg { color: rgba(103, 232, 249, 0.82); }
.portal-sidebar .nav-item[data-portal-route="chart-reader"] svg { color: rgba(108, 168, 247, 0.82); }
.portal-sidebar .nav-item[data-portal-route="strategy-lab"] svg { color: rgba(167, 139, 250, 0.82); }
.portal-sidebar .nav-item[data-portal-route="trading-accounts"] svg { color: rgba(89, 211, 192, 0.82); }
.portal-sidebar .nav-item[data-portal-route="activity"] svg { color: rgba(89, 211, 144, 0.82); }
.portal-sidebar .nav-item[data-portal-route="cashback"] svg { color: rgba(214, 193, 122, 0.88); }
.portal-sidebar .nav-item[data-portal-route="education"] svg { color: rgba(224, 163, 92, 0.82); }
.portal-sidebar .nav-item[data-portal-route="membership"] svg { color: rgba(201, 163, 224, 0.82); }

.portal-sidebar .nav-item.is-active[data-portal-route="carlos"] { box-shadow: inset 3px 0 0 rgba(103, 232, 249, 0.65); }
.portal-sidebar .nav-item.is-active[data-portal-route="chart-reader"] { box-shadow: inset 3px 0 0 rgba(108, 168, 247, 0.65); }
.portal-sidebar .nav-item.is-active[data-portal-route="strategy-lab"] { box-shadow: inset 3px 0 0 rgba(167, 139, 250, 0.65); }
.portal-sidebar .nav-item.is-active[data-portal-route="trading-accounts"] { box-shadow: inset 3px 0 0 rgba(89, 211, 192, 0.65); }
.portal-sidebar .nav-item.is-active[data-portal-route="activity"] { box-shadow: inset 3px 0 0 rgba(89, 211, 144, 0.65); }
.portal-sidebar .nav-item.is-active[data-portal-route="cashback"] { box-shadow: inset 3px 0 0 rgba(214, 193, 122, 0.7); }
.portal-sidebar .nav-item.is-active[data-portal-route="education"] { box-shadow: inset 3px 0 0 rgba(224, 163, 92, 0.65); }
.portal-sidebar .nav-item.is-active[data-portal-route="membership"] { box-shadow: inset 3px 0 0 rgba(201, 163, 224, 0.65); }

@media (prefers-reduced-motion: reduce) {
  .portal-sidebar .nav-item { transition: none; }
  .portal-sidebar .nav-item:hover { transform: none; }
}

/* ---- Accessibility: focus-visible on nav items and bottom tabs ---- */
.portal-sidebar .nav-item:focus-visible,
.portal-tab:focus-visible,
.portal-more-item:focus-visible {
  outline: 2px solid rgba(103, 232, 249, 0.55); outline-offset: 2px;
}

/* ==============================================================
   AUREX -- Final cinematic product design pass (client portal).
   Presentation only. No client Cashback selector is touched
   (.cashback-experience / #portalRankDetails untouched by this
   block). Scoped to: .portal-sidebar, .portal-product-v2 .portal-
   main .portal-topbar, .portal-main .pjs-*, .portal-main .glass-
   panel / .portal-chart-card, and the .portal-coming-soon-* classes
   introduced in the previous pass. Append-only.
   ============================================================== */

/* ==================================================
   1/2. SIDEBAR + SERVICE IDENTITY
   ================================================== */
.portal-sidebar .nav-item[data-portal-route="overview"] { --nav-accent: 150, 176, 208; }
.portal-sidebar .nav-item[data-portal-route="carlos"] { --nav-accent: 103, 232, 249; }
.portal-sidebar .nav-item[data-portal-route="chart-reader"] { --nav-accent: 76, 140, 230; }
.portal-sidebar .nav-item[data-portal-route="strategy-lab"] { --nav-accent: 167, 139, 250; }
.portal-sidebar .nav-item[data-portal-route="trading-accounts"] { --nav-accent: 89, 211, 192; }
.portal-sidebar .nav-item[data-portal-route="activity"] { --nav-accent: 89, 211, 144; }
.portal-sidebar .nav-item[data-portal-route="cashback"] { --nav-accent: 214, 193, 122; }
.portal-sidebar .nav-item[data-portal-route="education"] { --nav-accent: 224, 163, 92; }
.portal-sidebar .nav-item[data-portal-route="membership"] { --nav-accent: 201, 163, 224; }
.portal-sidebar .nav-item[data-portal-route="support"] { --nav-accent: 130, 198, 255; }

.portal-sidebar .nav-list { display: grid; gap: 3px; }
.portal-sidebar .nav-item {
  display: flex; align-items: center; gap: 12px; padding: 9px 12px; border-radius: 11px;
  position: relative;
  transition: background 180ms ease, transform 180ms ease;
}
.portal-sidebar .nav-item svg {
  width: 34px; height: 34px; padding: 7px; border-radius: 10px; flex: 0 0 auto; box-sizing: border-box;
  background: rgba(var(--nav-accent, 150, 176, 208), 0.07);
  border: 1px solid rgba(var(--nav-accent, 150, 176, 208), 0.16);
  color: rgba(var(--nav-accent, 150, 176, 208), 0.85);
  transition: background 180ms ease, border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}
.portal-sidebar .nav-item span { font-size: 0.86rem; font-weight: 600; letter-spacing: 0.002em; color: rgba(210, 222, 236, 0.82); transition: color 180ms ease; }
.portal-sidebar .nav-item:hover { background: rgba(255, 255, 255, 0.02); transform: translateX(1px); }
.portal-sidebar .nav-item:hover svg { background: rgba(var(--nav-accent, 150, 176, 208), 0.13); transform: scale(1.05); }
.portal-sidebar .nav-item:hover span { color: #eaf2fd; }
.portal-sidebar .nav-item.is-active {
  background: linear-gradient(100deg, rgba(var(--nav-accent, 150, 176, 208), 0.1), transparent 75%);
}
.portal-sidebar .nav-item.is-active::before {
  content: ""; position: absolute; left: -2px; top: 10%; bottom: 10%; width: 3px; border-radius: 999px;
  background: rgb(var(--nav-accent, 150, 176, 208));
}
.portal-sidebar .nav-item.is-active svg {
  background: rgba(var(--nav-accent, 150, 176, 208), 0.2); border-color: rgba(var(--nav-accent, 150, 176, 208), 0.5);
  box-shadow: 0 0 16px -5px rgba(var(--nav-accent, 150, 176, 208), 0.75); color: rgb(var(--nav-accent, 150, 176, 208));
}
.portal-sidebar .nav-item.is-active span { color: #f5f8fb; font-weight: 700; }

@media (prefers-reduced-motion: reduce) {
  .portal-sidebar .nav-item,
  .portal-sidebar .nav-item svg,
  .portal-sidebar .nav-item:hover { transition: none; transform: none; }
}

/* ==================================================
   3. CHART READER COMING SOON -- market-analysis scene
   ================================================== */
.portal-coming-soon-chart {
  background:
    radial-gradient(120% 90% at 20% 100%, rgba(76, 140, 230, 0.09), transparent 60%),
    linear-gradient(165deg, rgba(9, 15, 28, 0.95), rgba(4, 7, 14, 0.98));
}
.portal-coming-soon-chart .pcs-grid {
  position: absolute; inset: 0; opacity: 0.35; pointer-events: none;
  background-image:
    linear-gradient(rgba(108, 168, 247, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(108, 168, 247, 0.06) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: radial-gradient(circle at 50% 45%, #000 55%, transparent 92%);
}
.portal-coming-soon-chart .pcs-zone {
  position: absolute; left: 8%; right: 8%; height: 15%; pointer-events: none;
  border-top: 1px dashed rgba(108, 168, 247, 0.16); border-bottom: 1px dashed rgba(108, 168, 247, 0.16);
  background: linear-gradient(90deg, transparent, rgba(108, 168, 247, 0.045), transparent);
}
.portal-coming-soon-chart .pcs-zone-a { top: 20%; }
.portal-coming-soon-chart .pcs-zone-b { top: 46%; height: 10%; border-color: rgba(131, 216, 174, 0.14); background: linear-gradient(90deg, transparent, rgba(131, 216, 174, 0.04), transparent); }
.portal-coming-soon-chart .pcs-field-chart { position: relative; }
.portal-coming-soon-chart .pcs-bar { position: relative; }
.portal-coming-soon-chart .pcs-bar::after {
  content: ""; position: absolute; left: 50%; top: -9px; bottom: -9px; width: 1px;
  background: rgba(108, 168, 247, 0.3); transform: translateX(-50%);
}
.portal-coming-soon-chart .pcs-trend {
  position: absolute; left: 6%; right: 6%; bottom: 6%; height: 34%; overflow: visible; pointer-events: none;
}
.portal-coming-soon-chart .pcs-trend polyline {
  fill: none; stroke: rgba(131, 216, 174, 0.55); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round;
}
.portal-coming-soon-chart .pcs-point {
  position: absolute; bottom: 30%; width: 6px; height: 6px; border-radius: 50%;
  background: rgba(131, 216, 174, 0.8); box-shadow: 0 0 8px 2px rgba(131, 216, 174, 0.35);
}
.portal-coming-soon-chart .pcs-scan {
  position: absolute; top: 8%; bottom: 8%; width: 1px; left: 10%;
  background: linear-gradient(180deg, transparent, rgba(108, 168, 247, 0.5), transparent);
  animation: pcsScanMove 11s ease-in-out infinite;
}
@keyframes pcsScanMove { 0%, 100% { left: 10%; opacity: 0.5; } 50% { left: 86%; opacity: 0.9; } }

/* ==================================================
   4. CARLOS COMING SOON -- intelligence system scene
   ================================================== */
.portal-coming-soon-carlos {
  background:
    radial-gradient(70% 60% at 50% 46%, rgba(103, 232, 249, 0.1), transparent 70%),
    linear-gradient(165deg, rgba(10, 18, 32, 0.95), rgba(4, 8, 16, 0.98));
}
.portal-coming-soon-carlos .pcs-core {
  position: absolute; top: 44%; left: 50%; width: 180px; height: 180px; transform: translate(-50%, -50%);
  pointer-events: none; z-index: 0;
}
.portal-coming-soon-carlos .pcs-core-ring {
  position: absolute; inset: 0; border-radius: 50%; border: 1px solid rgba(103, 232, 249, 0.22);
  animation: pcsRingPulse 6s ease-out infinite;
}
.portal-coming-soon-carlos .pcs-core-ring-2 { animation-delay: 3s; }
.portal-coming-soon-carlos .pcs-core-dot {
  position: absolute; top: 50%; left: 50%; width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%;
  background: rgba(103, 232, 249, 0.85); box-shadow: 0 0 22px 6px rgba(103, 232, 249, 0.28);
}
@keyframes pcsRingPulse { 0% { transform: scale(0.5); opacity: 0.55; } 100% { transform: scale(1.7); opacity: 0; } }

/* ==================================================
   5. TYPOGRAPHY SYSTEM (client portal)
   ================================================== */
.portal-product-v2 .portal-main .portal-page-heading h2 { font-weight: 680; letter-spacing: -0.01em; }
.portal-product-v2 .portal-main .eyebrow { font-weight: 720; letter-spacing: 0.13em; }
.portal-main .glass-panel .panel-header h3,
.portal-main .portal-chart-card .panel-header h3 { letter-spacing: -0.005em; font-weight: 660; }
.portal-main .portal-focus-number strong,
.portal-main .portal-stat strong,
.portal-main .kpi-card strong { font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.portal-main .glass-panel small,
.portal-main .portal-chart-card small { letter-spacing: 0.01em; }

/* ==================================================
   6/7. CARDS, SURFACES, MICRO-INTERACTIONS
   ================================================== */
.portal-main .glass-panel,
.portal-main .portal-chart-card {
  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease;
}
.portal-main .glass-panel:hover,
.portal-main .portal-chart-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 30px 70px -32px rgba(0, 0, 0, 0.6);
}
.portal-main .portal-overview-hero,
.portal-main .client-recommendation-panel {
  box-shadow: 0 34px 80px -34px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.05);
}

@media (prefers-reduced-motion: reduce) {
  .portal-main .glass-panel,
  .portal-main .portal-chart-card,
  .portal-coming-soon-chart .pcs-scan,
  .portal-coming-soon-carlos .pcs-core-ring {
    transition: none; animation: none;
  }
  .portal-main .glass-panel:hover,
  .portal-main .portal-chart-card:hover { transform: none; }
}

/* ==================================================
   8. CLIENT HEADER
   ================================================== */
.portal-product-v2 .portal-main .portal-account-signal {
  display: flex; align-items: center; gap: 7px; padding: 5px 11px; border-radius: 999px;
  border: 1px solid rgba(131, 216, 174, 0.24); background: rgba(131, 216, 174, 0.06);
  font-size: 0.7rem; font-weight: 640; color: #a9ecc9;
}
.portal-product-v2 .portal-main .portal-account-signal i {
  width: 6px; height: 6px; border-radius: 50%; background: #83d8ae; box-shadow: 0 0 0 3px rgba(131, 216, 174, 0.18);
}
.portal-product-v2 .portal-main .portal-icon-button {
  transition: background 160ms ease, border-color 160ms ease, transform 160ms ease;
}
.portal-product-v2 .portal-main .portal-icon-button:hover { transform: translateY(-1px); }
.portal-product-v2 .portal-main .portal-identity strong { font-weight: 680; }

@media (prefers-reduced-motion: reduce) {
  .portal-product-v2 .portal-main .portal-icon-button { transition: none; }
  .portal-product-v2 .portal-main .portal-icon-button:hover { transform: none; }
}

/* ==================================================
   9. SERVICE JOURNEY (Understand -> Analyze -> Plan -> Review -> Earn -> Progress)
   ================================================== */
.portal-main .pjs-rail { position: relative; gap: 8px; }
.portal-main .pjs-rail::before {
  content: ""; position: absolute; top: 5px; left: 4%; right: 4%; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(130, 198, 255, 0.22) 12%, rgba(130, 198, 255, 0.22) 88%, transparent);
  z-index: 0;
}
.portal-main .pjs-phase { position: relative; z-index: 1; }
.portal-main .pjs-phase a { padding-top: 14px; }
.portal-main .pjs-dot { position: relative; z-index: 2; background: #0a1524; }
.portal-main .pjs-phase.is-current a {
  box-shadow: 0 16px 34px -20px rgba(103, 232, 249, 0.45);
}
.portal-main .pjs-phase.is-current .pjs-body strong { letter-spacing: -0.005em; }

@media (prefers-reduced-motion: reduce) {
  .portal-main .pjs-phase a { transition: none; }
}

/* ==================================================
   10. RESPONSIVE
   ================================================== */
@media (max-width: 1080px) {
  .portal-coming-soon-carlos .pcs-core { width: 140px; height: 140px; }
}
@media (max-width: 760px) {
  .portal-sidebar .nav-item svg { width: 30px; height: 30px; padding: 6px; }
  .portal-coming-soon-chart .pcs-grid { background-size: 30px 30px; }
  .portal-coming-soon-chart .pcs-zone { display: none; }
  .portal-coming-soon-carlos .pcs-core { width: 120px; height: 120px; top: 40%; }
}
@media (max-width: 480px) {
  .portal-coming-soon .pcs-scan { display: none; }
  .portal-main .glass-panel:hover,
  .portal-main .portal-chart-card:hover { transform: none; box-shadow: none; }
}

/* ==============================================================
   AUREX -- Final client experience & service design system.
   Presentation only. No client Cashback selector touched. Scoped
   to .portal-sidebar, .portal-main, .portal-product-v2, the
   .portal-coming-soon-* family, and #portalRouteContent[data-
   route-key] (already rendered, no markup change needed for that
   hook). Append-only.
   ============================================================== */

/* ==================================================
   SIDEBAR GROUPING (Core / Intelligence / Trading / Growth / Assistance)
   ================================================== */
.portal-sidebar .nav-group { display: grid; gap: 2px; margin-bottom: 10px; }
.portal-sidebar .nav-group:last-child { margin-bottom: 0; }
.portal-sidebar .nav-group-label {
  margin: 4px 0 3px 12px; font-size: 0.6rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  color: rgba(150, 176, 208, 0.42);
}

/* ==================================================
   PAGE-LEVEL SERVICE IDENTITY (restrained accent bleed)
   ================================================== */
#portalRouteContent[data-route-key="carlos"] .portal-topbar .eyebrow,
#portalRouteContent[data-route-key="ai"] .portal-topbar .eyebrow { color: rgba(103, 232, 249, 0.75); }
#portalRouteContent[data-route-key="chart-reader"] .portal-topbar .eyebrow { color: rgba(76, 140, 230, 0.8); }
#portalRouteContent[data-route-key="strategy-lab"] .portal-topbar .eyebrow { color: rgba(167, 139, 250, 0.8); }
#portalRouteContent[data-route-key="trading-accounts"] .portal-topbar .eyebrow { color: rgba(89, 211, 192, 0.8); }
#portalRouteContent[data-route-key="activity"] .portal-topbar .eyebrow { color: rgba(89, 211, 144, 0.8); }
#portalRouteContent[data-route-key="cashback"] .portal-topbar .eyebrow { color: rgba(214, 193, 122, 0.85); }
#portalRouteContent[data-route-key="education"] .portal-topbar .eyebrow { color: rgba(224, 163, 92, 0.8); }
#portalRouteContent[data-route-key="membership"] .portal-topbar .eyebrow { color: rgba(201, 163, 224, 0.8); }

/* ==================================================
   STRATEGY LAB COMING SOON -- blueprint / construction identity
   ================================================== */
.portal-coming-soon-strategy {
  background:
    radial-gradient(120% 90% at 80% 100%, rgba(167, 139, 250, 0.08), transparent 60%),
    linear-gradient(165deg, rgba(14, 11, 26, 0.95), rgba(6, 5, 12, 0.98));
}
.portal-coming-soon-strategy .pcs-badge { border-color: rgba(167, 139, 250, 0.32); color: #cdbdfa; }
.portal-coming-soon-strategy .pcs-grid-violet {
  position: absolute; inset: 0; opacity: 0.32; pointer-events: none;
  background-image:
    linear-gradient(rgba(167, 139, 250, 0.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(167, 139, 250, 0.07) 1px, transparent 1px);
  background-size: 36px 36px;
  mask-image: radial-gradient(circle at 50% 45%, #000 55%, transparent 92%);
}
.portal-coming-soon-strategy .pcs-blueprint {
  position: absolute; left: 8%; right: 8%; top: 14%; height: 52%; overflow: visible; pointer-events: none; opacity: 0.75;
}
.portal-coming-soon-strategy .pcs-blueprint rect {
  fill: rgba(167, 139, 250, 0.05); stroke: rgba(167, 139, 250, 0.4); stroke-width: 1.2;
}
.portal-coming-soon-strategy .pcs-blueprint line {
  stroke: rgba(167, 139, 250, 0.28); stroke-width: 1; stroke-dasharray: 3 3;
}
.portal-coming-soon-strategy .pcs-sweep-violet {
  position: absolute; top: 0; bottom: 0; left: -30%; width: 26%;
  background: linear-gradient(90deg, transparent, rgba(167, 139, 250, 0.05), transparent);
  animation: pcsSweep 12s linear infinite;
}

@media (prefers-reduced-motion: reduce) {
  .portal-coming-soon-strategy .pcs-sweep-violet { animation: none; }
}
@media (max-width: 760px) {
  .portal-coming-soon-strategy .pcs-grid-violet { background-size: 26px 26px; }
  .portal-coming-soon-strategy .pcs-blueprint { top: 10%; height: 44%; }
}

/* ==================================================
   OVERVIEW -- command center (metrics-5, progression)
   ================================================== */
.portal-product-v2 .portal-overview-metrics-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.portal-product-v2 .portal-overview-progression {
  display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px;
  margin-top: 14px; padding: 16px 22px; border-radius: 14px;
  border: 1px solid rgba(214, 193, 122, 0.16);
  background: linear-gradient(100deg, rgba(214, 193, 122, 0.05), transparent 70%);
}
.portal-product-v2 .portal-overview-progression .pov-rank { display: grid; gap: 3px; }
.portal-product-v2 .portal-overview-progression .pov-rank strong { font-size: 1.05rem; font-weight: 720; color: #eee3c2; }
.portal-product-v2 .portal-overview-progression .pov-rail { min-width: 0; }
.portal-product-v2 .portal-overview-progression .pov-rail .portal-progress {
  height: 8px; border-radius: 999px; background: rgba(214, 193, 122, 0.14);
}
.portal-product-v2 .portal-overview-progression .pov-rail .portal-progress > span {
  display: block; height: 100%; border-radius: inherit;
  background: linear-gradient(90deg, rgba(214, 193, 122, 0.7), rgba(236, 217, 163, 0.95));
}
.portal-product-v2 .portal-overview-progression .pov-next {
  display: flex; align-items: center; gap: 12px; font-size: 0.78rem; color: rgba(190, 206, 228, 0.72); white-space: nowrap;
}
.portal-product-v2 .portal-overview-progression .pov-next a { color: #e9d09a; text-decoration: none; font-weight: 640; }
.portal-product-v2 .portal-overview-progression .pov-next a:hover { text-decoration: underline; }

@media (max-width: 900px) {
  .portal-product-v2 .portal-overview-metrics-5 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .portal-product-v2 .portal-overview-progression { grid-template-columns: 1fr; text-align: left; gap: 10px; }
  .portal-product-v2 .portal-overview-progression .pov-next { white-space: normal; }
}
@media (max-width: 560px) {
  .portal-product-v2 .portal-overview-metrics-5 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ==================================================
   TRADING ACCOUNTS -- infrastructure / terminal identity
   ================================================== */
.portal-main .trading-account-card {
  border-color: rgba(89, 211, 192, 0.14);
  background: linear-gradient(155deg, rgba(89, 211, 192, 0.035), transparent 65%), var(--panel, rgba(9, 20, 34, 0.92));
  transition: border-color 200ms ease, transform 200ms ease;
}
.portal-main .trading-account-card:hover { border-color: rgba(89, 211, 192, 0.3); transform: translateY(-2px); }
.portal-main .trading-account-card-head .eyebrow { color: rgba(89, 211, 192, 0.75); }
.portal-main .trading-account-card h3 { font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: -0.005em; }
.portal-main .trading-account-meta span { font-variant-numeric: tabular-nums; }

@media (prefers-reduced-motion: reduce) {
  .portal-main .trading-account-card { transition: none; }
  .portal-main .trading-account-card:hover { transform: none; }
}

/* ==================================================
   PERFORMANCE -- analytical empty state
   ================================================== */
.portal-main .portal-overview-placeholder {
  position: relative; overflow: hidden;
  background:
    linear-gradient(rgba(89, 211, 144, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(89, 211, 144, 0.04) 1px, transparent 1px),
    var(--panel, rgba(9, 20, 34, 0.92));
  background-size: 34px 34px, 34px 34px, auto;
}
.portal-main .portal-overview-placeholder::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  mask-image: radial-gradient(circle at 85% 15%, #000, transparent 70%);
  background: radial-gradient(circle at 85% 15%, rgba(89, 211, 144, 0.08), transparent 70%);
}

/* ==================================================
   REWARDS -- premium value identity (light reinforcement only;
   the Cashback page itself already carries extensive dedicated
   styling from prior passes -- this only touches the Overview-
   level metric numbers for consistency).
   ================================================== */
.portal-product-v2 .portal-overview-hero .portal-overview-status strong { font-variant-numeric: tabular-nums; }

/* ==================================================
   TYPOGRAPHY -- final hierarchy pass
   ================================================== */
.portal-main .portal-stat span,
.portal-main .kpi-card p,
.portal-main .portal-focus-number span {
  font-size: 0.66rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
}
.portal-main .portal-page-heading > p:last-child { font-weight: 500; }
.portal-main .status-pill,
.portal-main .portal-status-pill { font-variant-numeric: tabular-nums; }

/* ==============================================================
   AUREX -- Final Visual Pass A: Overview + Performance + service
   icon system. Presentation only. Scoped to .portal-sidebar,
   .portal-product-v2, #portalRouteContent[data-route-key], and
   .performance-coach-empty / .pfa-* (new, unique to this pass).
   No client Cashback selector touched. Append-only.
   ============================================================== */

/* ==================================================
   1. SERVICE ICON SYSTEM -- replaces the "cheap circle" look
   ================================================== */
.portal-sidebar .nav-item svg {
  width: 32px; height: 32px; padding: 8px; border-radius: 9px; flex: 0 0 auto; box-sizing: border-box;
  background: linear-gradient(155deg, rgba(var(--nav-accent, 150, 176, 208), 0.16), rgba(8, 14, 24, 0.92));
  border: 1px solid rgba(var(--nav-accent, 150, 176, 208), 0.24);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), inset 0 -7px 11px rgba(0, 0, 0, 0.28);
  color: rgba(var(--nav-accent, 150, 176, 208), 0.92);
}
.portal-sidebar .nav-item:hover svg {
  background: linear-gradient(155deg, rgba(var(--nav-accent, 150, 176, 208), 0.22), rgba(9, 15, 26, 0.9));
  border-color: rgba(var(--nav-accent, 150, 176, 208), 0.38);
}
.portal-sidebar .nav-item.is-active svg {
  background: linear-gradient(155deg, rgba(var(--nav-accent, 150, 176, 208), 0.3), rgba(10, 16, 28, 0.94));
  border-color: rgba(var(--nav-accent, 150, 176, 208), 0.58);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), inset 0 -7px 11px rgba(0, 0, 0, 0.32), 0 0 18px -6px rgba(var(--nav-accent, 150, 176, 208), 0.65);
  color: rgb(var(--nav-accent, 150, 176, 208));
}

@media (max-width: 760px) {
  .portal-sidebar .nav-item svg { width: 30px; height: 30px; padding: 7px; }
}

/* ==================================================
   2/4. OVERVIEW -- cinematic depth + steel/cyan page accent
   ================================================== */
.portal-product-v2 .portal-overview-hero { position: relative; overflow: hidden; }
.portal-product-v2 .portal-overview-hero::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background-image:
    linear-gradient(rgba(103, 232, 249, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(103, 232, 249, 0.035) 1px, transparent 1px);
  background-size: 38px 38px;
  mask-image: radial-gradient(140% 100% at 100% 0%, #000 0%, transparent 65%);
}
.portal-product-v2 .portal-overview-hero::after {
  content: ""; position: absolute; top: -20%; right: -10%; width: 50%; height: 140%; pointer-events: none; z-index: 0;
  background: radial-gradient(circle, rgba(120, 168, 240, 0.09), transparent 70%);
}
.portal-product-v2 .portal-overview-hero > * { position: relative; z-index: 1; }
.portal-product-v2 .portal-overview-welcome h2 { text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); }
#portalRouteContent[data-route-key="overview"] .portal-overview-hero { border-color: rgba(103, 232, 249, 0.16); }

/* ==================================================
   3/4. PERFORMANCE -- analytical scene, emerald page accent
   ================================================== */
#portalRouteContent[data-route-key="activity"] .portal-kpi-grid .portal-stat:nth-child(1) {
  border-color: rgba(89, 211, 144, 0.2);
}
#portalRouteContent[data-route-key="activity"] .portal-kpi-grid .portal-stat:nth-child(1) strong {
  color: #a9ecc9; font-size: 1.15em;
}
#portalRouteContent[data-route-key="activity"] .portal-kpi-grid .portal-stat:nth-child(n+4) {
  opacity: 0.88;
}

.performance-coach-empty { position: relative; overflow: hidden; min-height: 220px; }
.performance-coach-empty .panel-header,
.performance-coach-empty .preview-note { position: relative; z-index: 1; }
.performance-coach-empty .pfa-scene { position: absolute; inset: 0; z-index: 0; opacity: 0.55; pointer-events: none; }
.performance-coach-empty .pfa-grid {
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(89, 211, 144, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(89, 211, 144, 0.06) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: radial-gradient(circle at 82% 20%, #000 0%, transparent 62%);
}
.performance-coach-empty .pfa-trace {
  position: absolute; right: 4%; top: 8%; width: 55%; height: 40%; overflow: visible;
}
.performance-coach-empty .pfa-trace polyline {
  fill: none; stroke: rgba(89, 211, 144, 0.4); stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 4 3;
}
.performance-coach-empty .pfa-crosshair-h,
.performance-coach-empty .pfa-crosshair-v { position: absolute; background: rgba(89, 211, 144, 0.14); }
.performance-coach-empty .pfa-crosshair-h { top: 28%; right: 4%; width: 55%; height: 1px; }
.performance-coach-empty .pfa-crosshair-v { top: 8%; right: 4%; width: 1px; height: 40%; }

#portalRouteContent[data-route-key="activity"] .portal-welcome-panel .eyebrow { color: rgba(89, 211, 144, 0.85); }
#portalRouteContent[data-route-key="activity"] .glass-panel.performance-coach-panel { border-color: rgba(89, 211, 144, 0.14); }

/* "No monthly report" empty module: enrich only within Performance */
#portalRouteContent[data-route-key="activity"] .portal-empty-module {
  position: relative; overflow: hidden;
  background:
    linear-gradient(rgba(89, 211, 144, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(89, 211, 144, 0.035) 1px, transparent 1px);
  background-size: 30px 30px;
}

@media (prefers-reduced-motion: reduce) {
  .portal-sidebar .nav-item svg { transition: none; }
}
@media (max-width: 760px) {
  .performance-coach-empty .pfa-trace,
  .performance-coach-empty .pfa-crosshair-h,
  .performance-coach-empty .pfa-crosshair-v { opacity: 0.6; }
}
@media (max-width: 480px) {
  .performance-coach-empty .pfa-scene { opacity: 0.3; }
}

/* ==============================================================
   AUREX -- Corporate Service System + Core Experience Pass.
   Presentation only. Scoped to .portal-sidebar, .portal-main,
   .portal-product-v2, .performance-coach-empty (existing), and
   new unique classes introduced this pass. No client Cashback
   selector touched. Cashback page itself not touched. Append-only.
   ============================================================== */

/* ==================================================
   1. SIDEBAR -- compact corporate icon system (full rebuild,
   replacing the tile/capsule treatment from prior passes)
   ================================================== */
.portal-product-v2 .portal-sidebar .nav-item {
  padding: 7px 10px; border-radius: 7px; gap: 10px;
}
.portal-sidebar .nav-item svg {
  width: 19px; height: 19px; padding: 3px; border-radius: 5px; flex: 0 0 auto; box-sizing: border-box;
  background: rgba(255, 255, 255, 0.015);
  border: 1px solid rgba(150, 176, 208, 0.16);
  box-shadow: none;
  color: rgba(var(--nav-accent, 150, 176, 208), 0.7);
  transition: border-color 140ms ease, color 140ms ease;
}
.portal-sidebar .nav-item span { font-size: 0.82rem; font-weight: 560; color: rgba(205, 219, 234, 0.78); transition: color 140ms ease; }
.portal-sidebar .nav-item:hover { background: transparent; transform: translateX(1px); }
.portal-sidebar .nav-item:hover svg { border-color: rgba(var(--nav-accent, 150, 176, 208), 0.32); }
.portal-sidebar .nav-item:hover span { color: #eaf2fd; }
.portal-sidebar .nav-item.is-active {
  background: rgba(255, 255, 255, 0.025);
}
.portal-sidebar .nav-item.is-active::before {
  content: ""; position: absolute; left: -2px; top: 14%; bottom: 14%; width: 2px; border-radius: 999px;
  background: rgb(var(--nav-accent, 150, 176, 208));
}
.portal-sidebar .nav-item.is-active svg {
  border-color: rgba(var(--nav-accent, 150, 176, 208), 0.42);
  color: rgb(var(--nav-accent, 150, 176, 208));
  background: rgba(255, 255, 255, 0.02);
}
.portal-sidebar .nav-item.is-active span { color: #f7fafd; font-weight: 660; }

@media (prefers-reduced-motion: reduce) {
  .portal-sidebar .nav-item,
  .portal-sidebar .nav-item svg,
  .portal-sidebar .nav-item span { transition: none; }
  .portal-sidebar .nav-item:hover { transform: none; }
}
@media (max-width: 760px) {
  .portal-sidebar .nav-item svg { width: 19px; height: 19px; }
}

/* ==================================================
   2. OVERVIEW -- AUREX Status strip + Service Status columns
   ================================================== */
.portal-product-v2 .portal-aurex-status {
  display: grid; gap: 8px; margin: 14px 0 0; padding: 12px 18px; border-radius: 12px;
  border: 1px solid rgba(103, 232, 249, 0.12); background: rgba(255, 255, 255, 0.012);
}
.portal-product-v2 .pas-eyebrow {
  font-size: 0.62rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(150, 176, 208, 0.55);
}
.portal-product-v2 .pas-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 4px 14px; margin: 0; }
.portal-product-v2 .pas-grid > div { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 4px 0; border-bottom: 1px solid rgba(150, 176, 208, 0.08); }
.portal-product-v2 .pas-grid dt { font-size: 0.68rem; color: rgba(150, 176, 208, 0.6); }
.portal-product-v2 .pas-grid dd { margin: 0; font-size: 0.76rem; font-weight: 640; color: #dfeaf2; text-align: right; }

.portal-product-v2 .pss-columns { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin: 10px 0; }
.portal-product-v2 .pss-col-label { display: block; margin-bottom: 6px; font-size: 0.6rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(89, 211, 144, 0.75); }
.portal-product-v2 .pss-col-dev .pss-col-label { color: rgba(167, 139, 250, 0.75); }
.portal-product-v2 .pss-columns ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 4px; }
.portal-product-v2 .pss-columns li { font-size: 0.78rem; color: rgba(210, 222, 236, 0.78); padding-left: 12px; position: relative; }
.portal-product-v2 .pss-columns li::before { content: ""; position: absolute; left: 0; top: 7px; width: 4px; height: 4px; border-radius: 50%; background: rgba(89, 211, 144, 0.7); }
.portal-product-v2 .pss-col-dev li::before { background: rgba(167, 139, 250, 0.7); }

@media (max-width: 900px) {
  .portal-product-v2 .pas-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .portal-product-v2 .pss-columns { grid-template-columns: 1fr; }
}

/* ==================================================
   3. PERFORMANCE -- report pipeline + coach context grid
   ================================================== */
.portal-main .portal-report-pipeline {
  display: flex; align-items: center; gap: 0; margin: 0 0 14px; padding: 0; list-style: none;
}
.portal-main .portal-report-pipeline li {
  flex: 1 1 0; position: relative; padding: 10px 6px 0; text-align: center;
  font-size: 0.66rem; font-weight: 640; letter-spacing: 0.01em; color: rgba(150, 176, 208, 0.5);
}
.portal-main .portal-report-pipeline li::before {
  content: ""; position: absolute; top: 3px; left: 0; right: 0; height: 1px; background: rgba(150, 176, 208, 0.16);
}
.portal-main .portal-report-pipeline li:first-child::before { left: 50%; }
.portal-main .portal-report-pipeline li:last-child::before { right: 50%; }
.portal-main .portal-report-pipeline li::after {
  content: ""; position: absolute; top: 0; left: 50%; width: 6px; height: 6px; border-radius: 50%; transform: translateX(-50%);
  background: #0a1524; border: 1px solid rgba(150, 176, 208, 0.3);
}
.portal-main .portal-report-pipeline li.is-done { color: rgba(190, 206, 228, 0.7); }
.portal-main .portal-report-pipeline li.is-done::after { background: #59d390; border-color: #59d390; }
.portal-main .portal-report-pipeline li.is-current { color: #a9ecc9; font-weight: 700; }
.portal-main .portal-report-pipeline li.is-current::after { background: #8fe3ff; border-color: #8fe3ff; box-shadow: 0 0 0 3px rgba(103, 232, 249, 0.18); }

.performance-coach-empty .pfa-context-grid {
  position: relative; z-index: 1; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 12px 0;
}
.performance-coach-empty .pfa-context-grid > div {
  padding: 10px 12px; border-radius: 10px; border: 1px solid rgba(89, 211, 144, 0.1); background: rgba(255, 255, 255, 0.012);
}
.performance-coach-empty .pfa-context-grid dt { font-size: 0.6rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: rgba(150, 176, 208, 0.55); margin-bottom: 3px; }
.performance-coach-empty .pfa-context-grid dd { margin: 0; font-size: 0.76rem; color: rgba(210, 222, 236, 0.82); line-height: 1.4; }

@media (max-width: 900px) {
  .portal-main .portal-report-pipeline li { font-size: 0.6rem; }
  .performance-coach-empty .pfa-context-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 480px) {
  .portal-main .portal-report-pipeline { flex-wrap: wrap; gap: 8px 0; }
  .portal-main .portal-report-pipeline li { flex: 1 1 33%; }
}

/* ==================================================
   4. MEMBERSHIP -- Coming Soon tone + visual weight
   ================================================== */
.portal-main .psm-item.tone-violet .psm-state { color: #cdbdfa; }
.portal-main .psm-item.tone-violet .psm-icon { background: rgba(167, 139, 250, 0.14); }
.portal-main .psm-item.tone-violet .psm-icon svg { fill: #cdbdfa; }
.portal-main .psm-item.tone-violet { border-color: rgba(167, 139, 250, 0.16); }

.portal-main .portal-access-center .pac-type { font-variant-numeric: tabular-nums; }
.portal-main .pac-facts dd { letter-spacing: -0.005em; }

/* ==================================================
   6. TYPOGRAPHY -- final institutional pass
   ================================================== */
.portal-main .eyebrow,
.portal-product-v2 .pas-eyebrow { font-variant-numeric: tabular-nums; }
.portal-main dl dd,
.portal-main .pac-facts dd,
.portal-main .psm-body strong { font-feature-settings: "tnum" 1; }

/* ==============================================================
   AUREX -- High-end corporate refinement: sidebar.
   ROOT-CAUSE FIX: .portal-product-v2 .portal-sidebar .nav-item
   is a complete, pre-existing, well-designed system (bare icon,
   opacity-only state, transform:none on hover, 2px inset accent
   rail on active) that predates this session's sidebar work.
   My prior three passes added capsule/border/box-shadow treatment
   to .nav-item svg at LOWER specificity than this system's own
   rules for layout, so those additions never replaced anything --
   they only ADDED visual weight on top of the clean base, which is
   almost certainly the actual "cheap circle/bubble" the feedback
   kept describing. This block matches the pre-existing system's
   exact specificity and explicitly resets what I previously added
   (background/border/box-shadow/radius/padding -> none), then
   extends it with per-service accent color instead of the single
   hardcoded cyan it used for every active item. Append-only.
   ============================================================== */
.portal-product-v2 .portal-sidebar .nav-item svg {
  background: none; border: 0; box-shadow: none; border-radius: 0; padding: 0;
  width: 18px; height: 18px;
  color: rgba(var(--nav-accent, 130, 218, 244), 0.72);
  transition: color 140ms ease, opacity 140ms ease;
}
.portal-product-v2 .portal-sidebar .nav-item:hover svg { opacity: 0.95; }
.portal-product-v2 .portal-sidebar .nav-item.is-active {
  background: linear-gradient(90deg, rgba(var(--nav-accent, 130, 218, 244), 0.16), rgba(var(--nav-accent, 130, 218, 244), 0.04));
  border-color: rgba(var(--nav-accent, 130, 218, 244), 0.22);
  box-shadow: inset 2px 0 rgb(var(--nav-accent, 130, 218, 244)), inset 0 1px rgba(255, 255, 255, 0.04);
}
.portal-product-v2 .portal-sidebar .nav-item.is-active svg { color: rgb(var(--nav-accent, 130, 218, 244)); opacity: 1; }

@media (prefers-reduced-motion: reduce) {
  .portal-product-v2 .portal-sidebar .nav-item svg { transition: none; }
}

/* ---- Group labels: now correctly targeting the pre-existing
   .portal-nav-group system (class name mismatch fixed in
   portal/index.html this pass) -- light reinforcement only. ---- */
.portal-product-v2 .portal-nav-group > span { opacity: 0.9; }
.portal-product-v2 .portal-sidebar .nav-list { row-gap: 18px; }

/* ---- Brand area: subtle reinforcement of the existing system. ---- */
.portal-product-v2 .portal-sidebar .brand-mark {
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.14), 0 0 16px rgba(58, 155, 211, 0.1);
}
.portal-product-v2 .portal-sidebar .brand-kicker { opacity: 0.95; }

/* ---- Client identity area: quieter, more deliberate frame. ---- */
.portal-product-v2 .portal-sidebar-client {
  margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--portal-v2-line, rgba(150, 176, 208, 0.14));
}

/* ==============================================================
   AUREX -- High-end corporate refinement: Overview / Performance
   / Membership. Light, targeted refinement on top of the
   substantial work already done across prior passes -- section
   rhythm, numerical typography, and accent restraint rather than
   further structural rebuilds. Scoped to .portal-product-v2 /
   .portal-main. Append-only.
   ============================================================== */

/* ---- Overview: section rhythm + numerical hierarchy ---- */
.portal-product-v2 .portal-overview-hero,
.portal-product-v2 .portal-aurex-status,
.portal-product-v2 .portal-overview-metrics-5,
.portal-product-v2 .portal-overview-progression,
.portal-product-v2 .portal-overview-workspace {
  margin-bottom: 16px;
}
.portal-product-v2 .portal-overview-workspace { margin-bottom: 0; }
.portal-product-v2 .portal-overview-metrics-5 .portal-stat strong {
  font-variant-numeric: tabular-nums; letter-spacing: -0.015em;
}
.portal-product-v2 .portal-overview-welcome .eyebrow { color: rgba(130, 218, 244, 0.78); }

/* ---- Performance: understated emerald restraint ---- */
.portal-main .performance-coach-panel:not(.performance-coach-empty) { border-left: 2px solid rgba(89, 211, 144, 0.35); }
.portal-main .coach-score-grid .portal-stat strong { font-variant-numeric: tabular-nums; }
.portal-main .portal-kpi-grid { margin-bottom: 14px; }

/* ---- Membership: platinum/cyan restraint ---- */
.portal-main .portal-access-center.access-positive { border-left-color: rgba(126, 211, 241, 0.55); }
.portal-main .pac-type { letter-spacing: -0.005em; }
.portal-main .portal-access-grid { row-gap: 16px; }
.portal-main .pag-left,
.portal-main .pag-right { display: grid; gap: 16px; }

/* ---- Typography: institutional metric weight, portal-wide ---- */
.portal-main .portal-focus-number strong,
.portal-main .portal-stat strong,
.portal-main .kpi-card strong,
.portal-main .pac-facts dd,
.portal-main .psm-body strong {
  font-variant-numeric: tabular-nums;
}
.portal-main .card-title,
.portal-main .panel-header h3 { letter-spacing: -0.006em; }

@media (max-width: 900px) {
  .portal-main .pag-left,
  .portal-main .pag-right { gap: 12px; }
}

/* ==============================================================
   AUREX -- Private Client Terminal rail (.axr).
   ROOT CAUSE OF FOUR FAILED SIDEBAR PASSES: styles.css contains
   107 competing `.nav-item` rules, and <body> carries BOTH
   `portal-product-v2` AND `portal-classic-shell`, so two complete
   design systems applied at identical (0,3,0) specificity and were
   resolved only by source order. No appended rule could reliably
   control that surface. The sidebar has therefore been rebuilt on
   the `axr-` namespace, which had ZERO pre-existing rules -- this
   block is the ONLY styling that applies to it. All JS hooks are
   unchanged: active state still keys on [data-portal-route] +
   `is-active` (see setPortalActiveRoute), and every sidebar id is
   preserved. Append-only.
   ============================================================== */

/* ---- Rail container ---- */
.portal-body .portal-product-v2 .axr {
  display: flex; flex-direction: column; gap: 0;
  padding: 22px 14px 18px;
}

/* ---- Service accent tokens ---- */
.axr .axr-link[data-portal-route="overview"] { --axr-accent: 150, 176, 208; }
.axr .axr-link[data-portal-route="carlos"] { --axr-accent: 103, 232, 249; }
.axr .axr-link[data-portal-route="chart-reader"] { --axr-accent: 108, 168, 247; }
.axr .axr-link[data-portal-route="strategy-lab"] { --axr-accent: 167, 139, 250; }
.axr .axr-link[data-portal-route="trading-accounts"] { --axr-accent: 89, 211, 192; }
.axr .axr-link[data-portal-route="activity"] { --axr-accent: 89, 211, 144; }
.axr .axr-link[data-portal-route="cashback"] { --axr-accent: 214, 193, 122; }
.axr .axr-link[data-portal-route="education"] { --axr-accent: 224, 163, 92; }
.axr .axr-link[data-portal-route="membership"] { --axr-accent: 201, 163, 224; }
.axr .axr-link[data-portal-route="support"] { --axr-accent: 130, 198, 255; }

/* ==================================================
   BRAND BLOCK -- institutional terminal identity
   ================================================== */
.axr .axr-brand {
  display: flex; align-items: center; gap: 13px;
  padding: 0 6px 18px; margin: 0 0 6px;
  border-bottom: 1px solid rgba(140, 178, 214, 0.13);
}
.axr .axr-mark {
  position: relative; flex: 0 0 42px; width: 42px; height: 42px; border-radius: 11px;
  display: grid; place-items: center; color: #cfeeff;
  background:
    linear-gradient(150deg, rgba(150, 224, 255, 0.2), rgba(24, 52, 78, 0.5) 46%, rgba(8, 16, 28, 0.92));
  border: 1px solid rgba(146, 216, 248, 0.34);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.22),
    inset 0 -9px 14px rgba(0, 0, 0, 0.4),
    0 6px 18px -8px rgba(58, 155, 211, 0.5);
}
.axr .axr-mark::after {
  content: ""; position: absolute; inset: 3px; border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.07); pointer-events: none;
}
.axr .axr-mark svg { width: 25px; height: 25px; }
.axr .axr-word { display: grid; gap: 1px; min-width: 0; }
.axr .axr-kicker {
  font-size: 0.545rem; font-weight: 750; letter-spacing: 0.17em; text-transform: uppercase;
  color: rgba(133, 200, 240, 0.72);
}
.axr .axr-word h1 {
  margin: 0; font-size: 1.06rem; font-weight: 720; line-height: 1.1;
  letter-spacing: 0.19em; color: #f2f9ff;
}
.axr .axr-sub {
  font-size: 0.585rem; font-weight: 600; letter-spacing: 0.13em; text-transform: uppercase;
  color: rgba(150, 176, 208, 0.5);
}

/* ==================================================
   NAV STRUCTURE + GROUP LABELS
   ================================================== */
.axr .axr-nav { display: grid; gap: 16px; margin: 0; padding: 0; }
.axr .axr-group { display: grid; gap: 1px; }
.axr .axr-group-label {
  padding: 0 10px 7px; margin: 0;
  font-size: 0.555rem; font-weight: 780; letter-spacing: 0.185em; text-transform: uppercase;
  color: rgba(146, 172, 202, 0.46);
}

/* ==================================================
   NAV ROWS -- compact institutional terminal rows
   ================================================== */
.axr .axr-link {
  position: relative; display: grid; grid-template-columns: 18px minmax(0, 1fr);
  align-items: center; gap: 11px;
  min-height: 37px; padding: 0 10px;
  border: 1px solid transparent; border-radius: 6px;
  text-decoration: none; overflow: hidden;
  transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease;
}
.axr .axr-glyph { display: grid; place-items: center; width: 18px; height: 18px; }
.axr .axr-glyph svg {
  width: 18px; height: 18px; display: block;
  color: rgba(var(--axr-accent, 150, 176, 208), 0.6);
  transition: color 150ms ease;
}
.axr .axr-label {
  font-size: 0.815rem; font-weight: 560; letter-spacing: 0.004em; line-height: 1.2;
  color: rgba(203, 218, 234, 0.74);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  transition: color 150ms ease;
}

/* Hover -- premium, minimal */
.axr .axr-link:hover { background: rgba(255, 255, 255, 0.028); border-color: rgba(140, 178, 214, 0.1); }
.axr .axr-link:hover .axr-glyph svg { color: rgba(var(--axr-accent, 150, 176, 208), 0.9); }
.axr .axr-link:hover .axr-label { color: #eef5fc; }

/* Active -- 2px accent rail + left-edge illumination, no glow */
.axr .axr-link.is-active {
  background:
    linear-gradient(90deg, rgba(var(--axr-accent, 150, 176, 208), 0.15), rgba(var(--axr-accent, 150, 176, 208), 0.02) 62%, transparent);
  border-color: rgba(var(--axr-accent, 150, 176, 208), 0.2);
}
.axr .axr-link.is-active::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 2px;
  background: rgb(var(--axr-accent, 150, 176, 208));
}
.axr .axr-link.is-active .axr-glyph svg { color: rgb(var(--axr-accent, 150, 176, 208)); }
.axr .axr-link.is-active .axr-label { color: #ffffff; font-weight: 680; }
.axr .axr-link:focus-visible { outline: 2px solid rgba(var(--axr-accent, 103, 232, 249), 0.6); outline-offset: -2px; }

/* ==================================================
   PRIVATE CLIENT FOOTER
   ================================================== */
.axr .axr-note {
  margin-top: auto; padding: 14px 10px 12px;
  border-top: 1px solid rgba(140, 178, 214, 0.11);
}
.axr .axr-note-label {
  display: block; margin-bottom: 5px;
  font-size: 0.545rem; font-weight: 780; letter-spacing: 0.17em; text-transform: uppercase;
  color: rgba(133, 200, 240, 0.62);
}
.axr .axr-note p { margin: 0; font-size: 0.685rem; line-height: 1.5; color: rgba(150, 176, 208, 0.55); }

.axr .axr-client {
  margin-top: 10px; padding: 11px 10px;
  border: 1px solid rgba(140, 178, 214, 0.13); border-radius: 8px;
  background: rgba(255, 255, 255, 0.016);
}
.axr .axr-client strong { font-size: 0.775rem; font-weight: 680; color: #f0f6fc; }
.axr .axr-client span { font-size: 0.635rem; color: rgba(150, 176, 208, 0.62); }

/* ==================================================
   RESPONSIVE -- keep the terminal identity on mobile chrome
   ================================================== */
@media (max-width: 1100px) {
  .portal-body .portal-product-v2 .axr { padding: 18px 11px 16px; }
  .axr .axr-word h1 { font-size: 0.98rem; letter-spacing: 0.15em; }
}
.portal-body .portal-bottom-nav .portal-tab.is-active,
.portal-body .portal-more-sheet .portal-more-item.is-active { color: #eaf5ff; }
.portal-body .portal-more-sheet .portal-more-item:focus-visible,
.portal-body .portal-bottom-nav .portal-tab:focus-visible {
  outline: 2px solid rgba(103, 232, 249, 0.55); outline-offset: -2px;
}

@media (prefers-reduced-motion: reduce) {
  .axr .axr-link,
  .axr .axr-glyph svg,
  .axr .axr-label { transition: none; }
}

/* ==============================================================
   AUREX -- Terminal header (.axh): private-client identity cluster
   + page header system. New namespace (zero pre-existing rules);
   3-class selectors so this reliably wins against the existing
   .portal-product-v2 .portal-main .portal-topbar system without
   removing its working layout / notification-center positioning.
   All ids and handlers preserved. Append-only.
   ============================================================== */

/* ---- Page header block ---- */
.portal-body .axh .axh-heading .eyebrow {
  font-size: 0.555rem; font-weight: 780; letter-spacing: 0.185em; text-transform: uppercase;
  color: rgba(133, 200, 240, 0.68);
}
.portal-body .axh .axh-heading h2 { font-weight: 700; letter-spacing: -0.012em; }
.portal-body .axh .axh-heading > p:last-child { color: rgba(150, 176, 208, 0.66); font-weight: 500; }
.portal-body .portal-product-v2 .portal-main .portal-topbar.axh {
  border-bottom: 1px solid rgba(140, 178, 214, 0.14);
  box-shadow: 0 18px 40px -32px rgba(0, 0, 0, 0.7);
}

/* ---- Identity cluster ---- */
.portal-body .axh .axh-cluster { align-items: center; gap: 12px; }
.portal-body .axh .axh-divider {
  width: 1px; height: 24px; flex: 0 0 auto;
  background: linear-gradient(180deg, transparent, rgba(140, 178, 214, 0.26), transparent);
}
.portal-body .axh .axh-signal {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 5px 11px; border-radius: 999px;
  border: 1px solid rgba(131, 216, 174, 0.24); background: rgba(131, 216, 174, 0.055);
  font-size: 0.665rem; font-weight: 650; letter-spacing: 0.02em; color: #a9ecc9; white-space: nowrap;
}
.portal-body .axh .axh-signal i {
  width: 6px; height: 6px; border-radius: 50%; flex: 0 0 auto;
  background: #83d8ae; box-shadow: 0 0 0 3px rgba(131, 216, 174, 0.16);
}
.portal-body .axh .axh-icon {
  border: 1px solid rgba(140, 178, 214, 0.16); border-radius: 8px;
  background: rgba(255, 255, 255, 0.02); color: rgba(205, 219, 234, 0.8);
  transition: border-color 150ms ease, background-color 150ms ease, color 150ms ease;
}
.portal-body .axh .axh-icon:hover {
  border-color: rgba(126, 211, 241, 0.34); background: rgba(103, 232, 249, 0.07); color: #eaf5ff;
}
.portal-body .axh .axh-signout:hover {
  border-color: rgba(255, 138, 150, 0.34); background: rgba(255, 118, 132, 0.07); color: #ffc4cc;
}
.portal-body .axh .axh-icon:focus-visible { outline: 2px solid rgba(103, 232, 249, 0.55); outline-offset: 2px; }

.portal-body .axh .axh-identity {
  border: 1px solid rgba(140, 178, 214, 0.15); border-radius: 9px;
  background: linear-gradient(150deg, rgba(103, 232, 249, 0.05), rgba(255, 255, 255, 0.012));
  padding: 7px 13px 7px 8px;
}
.portal-body .axh .axh-identity strong {
  font-size: 0.8rem; font-weight: 700; letter-spacing: -0.004em; color: #f4f9fd;
}
.portal-body .axh .axh-identity > div > span {
  font-size: 0.635rem; font-weight: 560; letter-spacing: 0.02em; color: rgba(150, 176, 208, 0.68);
}
.portal-body .axh .axh-avatar {
  border: 1px solid rgba(146, 216, 248, 0.3);
  background: linear-gradient(150deg, rgba(126, 211, 241, 0.2), rgba(10, 20, 34, 0.9));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16);
  font-weight: 750; letter-spacing: 0.04em;
}

/* ==================================================
   SHELL DEPTH -- precision over blur
   ================================================== */
.portal-body.portal-product-v2 .portal-route-content { position: relative; }
.portal-body .portal-product-v2 .portal-main .glass-panel,
.portal-body .portal-product-v2 .portal-main .portal-chart-card {
  border-color: rgba(140, 178, 214, 0.14);
}

@media (prefers-reduced-motion: reduce) {
  .portal-body .axh .axh-icon { transition: none; }
}
@media (max-width: 1100px) {
  .portal-body .axh .axh-signal { display: none; }
  .portal-body .axh .axh-divider { display: none; }
}

/* ==============================================================
   AUREX -- Cashback premium experience pass. Presentation only.
   Every selector nested under .cashback-experience (the client
   Cashback wrapper). No calculation, status, hook, or handler is
   touched by this block. Append-only.
   ============================================================== */

/* ---- Reward period chip (uses existing totals.period) ---- */
.cashback-experience .cbk-period-chip {
  display: inline-flex; align-items: center; gap: 7px; margin-top: 12px;
  padding: 5px 12px; border-radius: 999px;
  border: 1px solid rgba(145, 222, 243, 0.24); background: rgba(145, 222, 243, 0.06);
  font-size: 11px; font-weight: 660; letter-spacing: 0.04em; color: #b9e6f5;
  font-variant-numeric: tabular-nums;
}
.cashback-experience .cbk-period-chip i {
  width: 5px; height: 5px; border-radius: 50%; background: #7fd8f7; flex: 0 0 auto;
}

/* ==================================================
   HERO -- Available Now carries the strongest emphasis
   ================================================== */
.cashback-experience .cbk-hero-available > strong { font-size: 38px; letter-spacing: -0.03em; }
.cashback-experience .cbk-hero-metric > strong { font-variant-numeric: tabular-nums; }
.cashback-experience .cbk-hero-earned > strong,
.cashback-experience .cbk-hero-rank > strong,
.cashback-experience .cbk-hero-next > strong { opacity: 0.94; }
.cashback-experience .cbk-hero-available {
  box-shadow: inset 0 2px 0 rgba(131, 216, 174, 0.75), 0 0 44px -22px rgba(131, 216, 174, 0.5);
}

/* ==================================================
   LIFECYCLE -- completed / current / future clarity
   ================================================== */
.cashback-experience .cashback-lifecycle .cbf-stage { padding-bottom: 18px; }
.cashback-experience .cashback-lifecycle .cbf-note {
  display: block; font-style: normal; margin-top: 5px; max-width: 17ch;
  font-size: 10px; line-height: 1.45; letter-spacing: 0.01em;
  color: rgba(150, 176, 208, 0.5);
}
.cashback-experience .cashback-lifecycle .cbf-stage > strong { font-variant-numeric: tabular-nums; }

/* Stages holding no value read as quiet future/complete states. */
.cashback-experience .cashback-lifecycle .cbf-stage.is-empty > strong { color: rgba(190, 206, 228, 0.42); font-weight: 620; }
.cashback-experience .cashback-lifecycle .cbf-stage.is-empty > span { color: rgba(150, 176, 208, 0.52); }
.cashback-experience .cashback-lifecycle .cbf-stage.is-empty .cbf-node { opacity: 0.55; }
.cashback-experience .cashback-lifecycle .cbf-stage.is-empty .cbf-note { opacity: 0.6; }

/* Stages holding value read as active positions in the ledger. */
.cashback-experience .cashback-lifecycle .cbf-stage.is-populated > strong { font-weight: 740; }
.cashback-experience .cashback-lifecycle .cbf-available.is-populated .cbf-node {
  box-shadow: 0 0 0 5px rgba(131, 216, 174, 0.14), inset 0 1px 0 rgba(255, 255, 255, 0.08);
}
.cashback-experience .cashback-lifecycle .cbf-available.is-populated > strong { color: #b6f0d3; }

/* ==================================================
   CALCULATION STRIP -- financial equation typography
   ================================================== */
.cashback-experience .cbk-formula-flow .cfs-term > strong {
  font-variant-numeric: tabular-nums; letter-spacing: -0.02em; font-weight: 700;
}
.cashback-experience .cbk-formula-flow .cfs-term { border-left: 1px solid rgba(143, 184, 218, 0.08); }
.cashback-experience .cbk-formula-flow .cfs-term:first-child { border-left: 0; }
.cashback-experience .cbk-formula-flow .cfs-op { color: rgba(150, 176, 208, 0.45); font-weight: 500; }
.cashback-experience .cbk-formula-flow .cfs-result > strong { font-size: 26px; letter-spacing: -0.028em; }
.cashback-experience .cbk-formula-flow .cfs-term > span {
  font-size: 10px; letter-spacing: 0.09em;
}

/* ==================================================
   BONUS PROGRESS -- precise targets
   ================================================== */
.cashback-experience .cbk-bonus-track {
  height: 8px; box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.4);
  border: 1px solid rgba(143, 184, 218, 0.08);
}
.cashback-experience .cbk-bonus-track > i {
  position: relative;
  transition: width 420ms cubic-bezier(0.22, 1, 0.36, 1);
}
.cashback-experience .cbk-bonus-figures > span { font-variant-numeric: tabular-nums; }
.cashback-experience .cbk-bonus-figures > span:first-child { color: #cddbe6; font-weight: 620; }
.cashback-experience .cbk-bonus-potential > strong { font-variant-numeric: tabular-nums; }

/* ==================================================
   VERIFIED ACTIVITY LEDGER
   ================================================== */
.cashback-experience .cashback-activity-grid .portal-stat strong {
  font-variant-numeric: tabular-nums; letter-spacing: -0.015em;
}
.cashback-experience .cashback-activity-grid .portal-stat span {
  font-size: 10px; font-weight: 720; letter-spacing: 0.09em; text-transform: uppercase;
  color: rgba(150, 176, 208, 0.58);
}
.cashback-experience .cashback-activity-grid .portal-stat small { color: rgba(150, 176, 208, 0.5); }

/* ==================================================
   PAYOUT HISTORY -- clean transaction ledger
   ================================================== */
.cashback-experience .cbk-payout-row > strong { letter-spacing: -0.018em; }
.cashback-experience .cbk-payout-row > span { font-variant-numeric: tabular-nums; font-weight: 620; color: #cddbe6; }
.cashback-experience .cbk-payout-row > small { font-variant-numeric: tabular-nums; }
.cashback-experience .cbk-payout-row .portal-status-pill {
  font-size: 10px; font-weight: 740; letter-spacing: 0.07em; text-transform: uppercase;
}

/* ==================================================
   REQUEST CASHBACK -- secure financial action
   ================================================== */
.cashback-experience .cbk-request-amount > strong {
  font-variant-numeric: tabular-nums; letter-spacing: -0.03em;
}
.cashback-experience .cbk-request-card .primary-button { letter-spacing: 0.015em; }

/* ==================================================
   RESPONSIVE
   ================================================== */
@media (max-width: 900px) {
  .cashback-experience .cashback-lifecycle .cbf-note { max-width: none; }
}
@media (max-width: 560px) {
  .cashback-experience .cbk-hero-available > strong { font-size: 30px; }
  .cashback-experience .cashback-lifecycle .cbf-note { font-size: 10.5px; margin-top: 3px; }
  .cashback-experience .cbk-period-chip { font-size: 10.5px; }
}

@media (prefers-reduced-motion: reduce) {
  .cashback-experience .cbk-bonus-track > i { transition: none; }
}

/* ==============================================================
   AUREX -- Final brand shell + client terminal pass.
   DELIBERATELY CSS-ONLY. portal/index.html and portal/shared/
   bootstrap.js currently MATCH the Leaderboard V1 freeze manifest,
   so this pass adds nothing to them; every refinement below is
   achieved through the .axr / .axh markup hooks already present.
   The Leaderboard data contract (public_leaderboard_entries ->
   publicLeaderboard -> /portal/#leaderboard, read-only) is not
   touched. Append-only.
   ============================================================== */

/* ---- Missing accent token for the Leaderboard route ---- */
.axr .axr-link[data-portal-route="leaderboard"] { --axr-accent: 158, 190, 226; }

/* ==================================================
   1. AUREX BRAND LOCKUP -- corporate terminal identity
   ================================================== */
.axr .axr-brand {
  position: relative;
  align-items: center; gap: 14px;
  padding: 2px 6px 20px; margin: 0 0 8px;
  border-bottom: 1px solid rgba(140, 178, 214, 0.14);
}
/* Terminal hairline: a brighter cyan segment anchored left, fading right. */
.axr .axr-brand::after {
  content: ""; position: absolute; left: 6px; right: 6px; bottom: -1px; height: 1px;
  background: linear-gradient(90deg, rgba(126, 211, 241, 0.55), rgba(126, 211, 241, 0.08) 42%, transparent 78%);
}

.axr .axr-mark {
  flex: 0 0 44px; width: 44px; height: 44px; border-radius: 12px;
  color: #dcf3ff;
  background:
    linear-gradient(158deg, rgba(186, 236, 255, 0.26) 0%, rgba(96, 168, 214, 0.16) 26%,
                    rgba(18, 42, 66, 0.6) 58%, rgba(6, 13, 24, 0.96) 100%);
  border: 1px solid rgba(150, 220, 250, 0.38);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.3),
    inset 0 -10px 16px rgba(0, 0, 0, 0.45),
    0 8px 22px -10px rgba(58, 155, 211, 0.55);
}
.axr .axr-mark::after {
  content: ""; position: absolute; inset: 3.5px; border-radius: 8.5px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  background: linear-gradient(158deg, rgba(255, 255, 255, 0.07), transparent 48%);
  pointer-events: none;
}
.axr .axr-mark svg {
  width: 26px; height: 26px; position: relative; z-index: 1;
  filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.45));
}

.axr .axr-word { gap: 2px; }
.axr .axr-kicker {
  font-size: 0.525rem; font-weight: 800; letter-spacing: 0.21em; text-transform: uppercase;
  color: rgba(133, 200, 240, 0.7);
}
.axr .axr-word h1 {
  font-size: 1.14rem; font-weight: 760; line-height: 1.04;
  letter-spacing: 0.235em; color: #f6fbff;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35);
}
.axr .axr-sub {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 0.545rem; font-weight: 700; letter-spacing: 0.17em; text-transform: uppercase;
  color: rgba(146, 172, 202, 0.52);
}
.axr .axr-sub::before {
  content: ""; width: 12px; height: 1px; background: rgba(146, 172, 202, 0.4); flex: 0 0 auto;
}

/* ==================================================
   2. RAIL -- structural grouping rhythm
   ================================================== */
.axr .axr-nav { gap: 4px; }
.axr .axr-group { padding-bottom: 12px; position: relative; }
.axr .axr-group:not(:last-child)::after {
  content: ""; position: absolute; left: 10px; right: 10px; bottom: 0; height: 1px;
  background: linear-gradient(90deg, rgba(140, 178, 214, 0.13), rgba(140, 178, 214, 0.03) 70%, transparent);
}
.axr .axr-group:last-child { padding-bottom: 0; }
.axr .axr-group-label {
  padding: 12px 10px 8px;
  font-size: 0.535rem; font-weight: 800; letter-spacing: 0.2em;
  color: rgba(146, 172, 202, 0.44);
}
.axr .axr-group:first-child .axr-group-label { padding-top: 4px; }

/* ==================================================
   3. ACTIVE SERVICE -- directional lighting, no glow
   ================================================== */
.axr .axr-link.is-active {
  background:
    linear-gradient(97deg,
      rgba(var(--axr-accent, 150, 176, 208), 0.17) 0%,
      rgba(var(--axr-accent, 150, 176, 208), 0.055) 38%,
      rgba(255, 255, 255, 0.012) 72%,
      transparent 100%);
  border-color: rgba(var(--axr-accent, 150, 176, 208), 0.24);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.055),
    0 1px 0 rgba(0, 0, 0, 0.22);
}
.axr .axr-link.is-active::before {
  width: 2px; border-radius: 0 2px 2px 0;
  background: linear-gradient(180deg,
    rgba(var(--axr-accent, 150, 176, 208), 0.55),
    rgb(var(--axr-accent, 150, 176, 208)) 32%,
    rgb(var(--axr-accent, 150, 176, 208)) 68%,
    rgba(var(--axr-accent, 150, 176, 208), 0.55));
}
.axr .axr-link.is-active .axr-glyph svg { filter: drop-shadow(0 0 5px rgba(var(--axr-accent, 150, 176, 208), 0.35)); }
.axr .axr-link.is-active .axr-label { letter-spacing: 0.006em; }

/* ==================================================
   4. UPPER-RIGHT CLIENT IDENTITY -- same terminal frame
   ================================================== */
.portal-body .axh .axh-identity {
  border-color: rgba(150, 220, 250, 0.2);
  background: linear-gradient(150deg, rgba(126, 211, 241, 0.075), rgba(255, 255, 255, 0.014) 60%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
}
.portal-body .axh .axh-avatar {
  border-color: rgba(150, 220, 250, 0.34);
  background: linear-gradient(158deg, rgba(186, 236, 255, 0.24), rgba(18, 42, 66, 0.55) 55%, rgba(6, 13, 24, 0.94));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.24), inset 0 -6px 10px rgba(0, 0, 0, 0.35);
}
.portal-body .axh .axh-identity > div > span {
  font-size: 0.615rem; font-weight: 640; letter-spacing: 0.055em; text-transform: uppercase;
  color: rgba(146, 190, 226, 0.66);
}
.portal-body .axh .axh-signal { font-variant-numeric: tabular-nums; }

/* ==================================================
   5. SHELL -- data-grid texture, depth, edge lighting
   ================================================== */
.portal-body.portal-product-v2 .portal-main {
  background-image:
    linear-gradient(rgba(126, 190, 235, 0.016) 1px, transparent 1px),
    linear-gradient(90deg, rgba(126, 190, 235, 0.016) 1px, transparent 1px);
  background-size: 46px 46px;
}
.portal-body.portal-product-v2 .portal-sidebar.axr {
  border-right: 1px solid rgba(140, 178, 214, 0.13);
  box-shadow: 1px 0 0 rgba(0, 0, 0, 0.28), 14px 0 40px -30px rgba(0, 0, 0, 0.7);
}
.portal-body .portal-product-v2 .portal-main .glass-panel,
.portal-body .portal-product-v2 .portal-main .portal-chart-card,
.portal-body .portal-product-v2 .portal-main .portal-stat {
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.028) inset, 0 20px 46px -34px rgba(0, 0, 0, 0.72);
}

/* ==================================================
   6. PAGE HEADER SYSTEM -- one consistent frame
   ================================================== */
.portal-body .axh .axh-heading .eyebrow {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 0.535rem; font-weight: 800; letter-spacing: 0.2em;
  color: rgba(133, 200, 240, 0.7);
}
.portal-body .axh .axh-heading .eyebrow::before {
  content: ""; width: 10px; height: 1px; background: rgba(126, 211, 241, 0.5); flex: 0 0 auto;
}
.portal-body .axh .axh-heading h2 { font-size: clamp(1.3rem, 2vw, 1.68rem); font-weight: 720; letter-spacing: -0.015em; }
.portal-body .axh .axh-heading > p:last-child { font-size: 0.775rem; letter-spacing: 0.005em; }

/* ==================================================
   RESPONSIVE
   ================================================== */
@media (max-width: 1100px) {
  .axr .axr-mark { flex-basis: 40px; width: 40px; height: 40px; }
  .axr .axr-mark svg { width: 23px; height: 23px; }
  .axr .axr-word h1 { font-size: 1.02rem; letter-spacing: 0.19em; }
  .portal-body.portal-product-v2 .portal-main { background-size: 38px 38px; }
}
@media (max-width: 820px) {
  .portal-body.portal-product-v2 .portal-main { background-size: 32px 32px; }
}

@media (prefers-reduced-motion: reduce) {
  .axr .axr-link.is-active .axr-glyph svg { filter: none; }
}

/* ==============================================================
   AUREX ADMIN -- Operations terminal refinement.
   INSPECTION FINDING: styles.css carries 226 competing `.admin-table`
   rules, so generic table selectors are unreliable. Everything below
   is therefore anchored to `.table-registered-clients` (the per-table
   slug AdminTable already emits) or `.admin-intelligence-body`, which
   places it above the generic pile and confines the blast radius to
   this one surface. Mobile card layout reuses the `data-label`
   attribute AdminTable already writes on every <td> -- no markup
   change was needed for it. Append-only.
   ============================================================== */

/* ==================================================
   REGISTERED CLIENTS -- table density + hierarchy
   ================================================== */
.admin-intelligence-body .table-registered-clients .admin-table { min-width: 0; }
.admin-intelligence-body .table-registered-clients .admin-table th {
  padding: 10px 14px; font-size: 0.6rem; font-weight: 780; letter-spacing: 0.11em; text-transform: uppercase;
  color: rgba(150, 176, 208, 0.6); border-bottom: 1px solid rgba(150, 176, 208, 0.16); white-space: nowrap;
}
.admin-intelligence-body .table-registered-clients .admin-table td {
  padding: 12px 14px; vertical-align: middle;
  border-bottom: 1px solid rgba(150, 176, 208, 0.07);
}
.admin-intelligence-body .table-registered-clients .admin-table tbody tr { transition: background-color 140ms ease; }
.admin-intelligence-body .table-registered-clients .admin-table tbody tr:hover { background: rgba(150, 176, 208, 0.035); }

/* ---- Client cell: name dominant, identifier demoted ---- */
.admin-intelligence-body .acc-client { display: grid; gap: 3px; min-width: 0; }
.admin-intelligence-body .acc-client-name { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.admin-intelligence-body .acc-client-name strong {
  font-size: 0.86rem; font-weight: 680; color: #eef5fb; letter-spacing: -0.004em;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.admin-intelligence-body .acc-client .client-priority { flex: 0 0 auto; gap: 0; }
.admin-intelligence-body .acc-client .client-priority i {
  display: block; width: 6px; height: 6px; border-radius: 50%; background: currentColor;
}
.admin-intelligence-body .acc-client-id {
  justify-self: start; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-family: ui-monospace, "SFMono-Regular", "Cascadia Mono", Menlo, Consolas, monospace;
  font-size: 0.645rem; letter-spacing: 0.01em;
  color: rgba(150, 176, 208, 0.52); text-decoration: none; border-bottom: 1px dotted rgba(150, 176, 208, 0.28);
}
.admin-intelligence-body .acc-client-id:hover { color: #9ddfff; border-bottom-color: rgba(157, 223, 255, 0.5); }

/* ---- Contact / date / membership cells ---- */
.admin-intelligence-body .acc-contact { display: grid; gap: 2px; min-width: 0; }
.admin-intelligence-body .acc-contact > span {
  font-size: 0.78rem; color: rgba(222, 234, 246, 0.86);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.admin-intelligence-body .acc-date { font-variant-numeric: tabular-nums; font-size: 0.78rem; color: rgba(210, 224, 240, 0.8); white-space: nowrap; }
.admin-intelligence-body .acc-membership { display: grid; gap: 2px; }
.admin-intelligence-body .acc-membership > span { font-size: 0.78rem; color: rgba(222, 234, 246, 0.84); }
.admin-intelligence-body .acc-membership .table-subline { font-variant-numeric: tabular-nums; }

/* ---- Row actions: one restrained primary, links secondary ---- */
.admin-intelligence-body .acc-actions { min-width: 0; gap: 8px; align-items: center; flex-wrap: nowrap; }
.admin-intelligence-body .acc-review {
  min-height: 30px; padding: 0 13px; border-radius: 7px;
  font-size: 0.725rem; font-weight: 660; white-space: nowrap;
  border: 1px solid rgba(150, 176, 208, 0.22); background: rgba(255, 255, 255, 0.022); color: #d8e4f0;
  transition: border-color 140ms ease, background-color 140ms ease, color 140ms ease;
}
.admin-intelligence-body .acc-review:hover {
  border-color: rgba(126, 211, 241, 0.4); background: rgba(103, 232, 249, 0.08); color: #eaf5ff;
}
.admin-intelligence-body .acc-actions .table-link-button { font-size: 0.7rem; text-decoration: none; opacity: 0.72; white-space: nowrap; }
.admin-intelligence-body .acc-actions .table-link-button:hover { opacity: 1; text-decoration: underline; }

/* ---- Status chips: coherent semantic system, no glow ---- */
.admin-intelligence-body .table-registered-clients .status-badge {
  min-height: 22px; padding: 3px 9px; border-radius: 5px;
  font-size: 0.645rem; font-weight: 720; letter-spacing: 0.055em; text-transform: uppercase;
  box-shadow: none; white-space: nowrap;
}
.admin-intelligence-body .table-registered-clients .status-badge.positive { background: rgba(89, 211, 144, 0.1); border-color: rgba(89, 211, 144, 0.3); color: #8fe3b4; }
.admin-intelligence-body .table-registered-clients .status-badge.warning { background: rgba(231, 199, 106, 0.1); border-color: rgba(231, 199, 106, 0.3); color: #ecd08a; }
.admin-intelligence-body .table-registered-clients .status-badge.danger { background: rgba(255, 118, 132, 0.09); border-color: rgba(255, 118, 132, 0.3); color: #ffa8b3; }
.admin-intelligence-body .table-registered-clients .status-badge.neutral { background: rgba(150, 176, 208, 0.08); border-color: rgba(150, 176, 208, 0.22); color: rgba(200, 214, 230, 0.8); }

/* ==================================================
   BULK BAR -- quiet until a selection exists
   ================================================== */
.admin-intelligence-body .client-bulk-action-bar {
  transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}
.admin-intelligence-body .client-bulk-action-bar.is-idle {
  border-color: rgba(150, 176, 208, 0.14);
  background: rgba(255, 255, 255, 0.015);
  box-shadow: none;
}
.admin-intelligence-body .client-bulk-action-bar.is-idle .client-bulk-actions { opacity: 0.42; pointer-events: none; }
.admin-intelligence-body .client-bulk-action-bar.is-idle strong { color: rgba(150, 176, 208, 0.6); font-weight: 600; }
.admin-intelligence-body .client-bulk-action-bar.is-engaged {
  border-color: rgba(126, 211, 241, 0.34);
  background: linear-gradient(100deg, rgba(103, 232, 249, 0.08), rgba(10, 22, 38, 0.96) 62%);
  box-shadow: 0 10px 26px -14px rgba(0, 0, 0, 0.6);
}
.admin-intelligence-body .client-bulk-action-bar.is-engaged strong {
  color: #eaf5ff; font-weight: 740; font-variant-numeric: tabular-nums;
}

/* ==================================================
   CASHBACK ADMIN -- financial console density
   ================================================== */
.admin-intelligence-body .cashback-admin .admin-table th {
  font-size: 0.6rem; font-weight: 780; letter-spacing: 0.1em; text-transform: uppercase;
  color: rgba(150, 176, 208, 0.6);
}
.admin-intelligence-body .cashback-admin .admin-table td { padding-top: 11px; padding-bottom: 11px; }
.admin-intelligence-body .cashback-admin .status-badge {
  min-height: 22px; padding: 3px 9px; border-radius: 5px; box-shadow: none;
  font-size: 0.645rem; font-weight: 720; letter-spacing: 0.055em; text-transform: uppercase;
}
.admin-intelligence-body .cashback-admin .cbk-funnel-eyebrow { letter-spacing: -0.004em; }

/* ==================================================
   MOBILE -- stacked client records, not a squeezed table.
   Uses the data-label attribute AdminTable already emits.
   ================================================== */
@media (max-width: 860px) {
  .admin-intelligence-body .table-registered-clients .admin-table-wrap { overflow: visible; }
  .admin-intelligence-body .table-registered-clients .admin-table,
  .admin-intelligence-body .table-registered-clients .admin-table tbody,
  .admin-intelligence-body .table-registered-clients .admin-table tr,
  .admin-intelligence-body .table-registered-clients .admin-table td { display: block; width: auto; }
  .admin-intelligence-body .table-registered-clients .admin-table thead { display: none; }
  .admin-intelligence-body .table-registered-clients .admin-table tr {
    position: relative; margin: 0 0 10px; padding: 14px 14px 12px;
    border: 1px solid rgba(150, 176, 208, 0.15); border-radius: 10px;
    background: rgba(255, 255, 255, 0.016);
  }
  .admin-intelligence-body .table-registered-clients .admin-table td {
    display: grid; grid-template-columns: 8.5rem minmax(0, 1fr); gap: 10px;
    padding: 6px 0; border-bottom: 1px solid rgba(150, 176, 208, 0.06);
  }
  .admin-intelligence-body .table-registered-clients .admin-table td::before {
    content: attr(data-label);
    font-size: 0.6rem; font-weight: 760; letter-spacing: 0.09em; text-transform: uppercase;
    color: rgba(150, 176, 208, 0.55); align-self: center;
  }
  .admin-intelligence-body .table-registered-clients .admin-table td:last-child { border-bottom: 0; padding-bottom: 0; }
  /* Client + Select lead the card and drop their label. */
  .admin-intelligence-body .table-registered-clients .admin-table td[data-label="Client"] { grid-template-columns: 1fr; padding-top: 0; }
  .admin-intelligence-body .table-registered-clients .admin-table td[data-label="Client"]::before { display: none; }
  .admin-intelligence-body .table-registered-clients .admin-table td[data-label="Client"] .acc-client-name strong { font-size: 0.95rem; white-space: normal; }
  .admin-intelligence-body .table-registered-clients .admin-table td[data-label="Select"] {
    position: absolute; top: 12px; right: 12px; grid-template-columns: 1fr; padding: 0; border-bottom: 0; width: auto;
  }
  .admin-intelligence-body .table-registered-clients .admin-table td[data-label="Select"]::before { display: none; }
  /* Actions wrap and stay reachable without becoming easy to mis-tap. */
  .admin-intelligence-body .table-registered-clients .admin-table td[data-label="Actions"] { grid-template-columns: 1fr; padding-top: 12px; }
  .admin-intelligence-body .table-registered-clients .admin-table td[data-label="Actions"]::before { display: none; }
  .admin-intelligence-body .acc-actions { flex-wrap: wrap; gap: 10px 16px; }
  .admin-intelligence-body .acc-review { min-height: 38px; padding: 0 18px; }
  .admin-intelligence-body .acc-client-id { font-size: 0.68rem; }
  .admin-intelligence-body .client-bulk-action-bar { position: static; }
}

@media (prefers-reduced-motion: reduce) {
  .admin-intelligence-body .table-registered-clients .admin-table tbody tr,
  .admin-intelligence-body .acc-review,
  .admin-intelligence-body .client-bulk-action-bar { transition: none; }
}

/* ==============================================================
   AUREX -- Performance Cinematic V2 (.pfx).
   New namespace, verified to have zero pre-existing rules, so this
   block is the only styling that applies to the Performance page
   composition. Every value rendered comes from the existing
   activityPage() computation; the data-performance-scope hook and
   all leaderboard/verified-lot semantics are untouched.
   Append-only.
   ============================================================== */

.pfx { display: grid; gap: 14px; }
.pfx .pfx-panel {
  position: relative; padding: 18px 20px; border-radius: 13px; min-width: 0;
  border: 1px solid rgba(140, 178, 214, 0.14);
  background: linear-gradient(158deg, rgba(12, 22, 38, 0.82), rgba(6, 12, 22, 0.94));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035), 0 20px 44px -34px rgba(0, 0, 0, 0.75);
}
.pfx .pfx-panel-eyebrow {
  margin: 0 0 10px; font-size: 0.575rem; font-weight: 800; letter-spacing: 0.18em; text-transform: uppercase;
  color: rgba(146, 190, 226, 0.62);
}
.pfx .pfx-panel-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.pfx .pfx-panel-meta { font-size: 0.68rem; color: rgba(150, 176, 208, 0.6); font-variant-numeric: tabular-nums; }

/* ==================================================
   1. HERO
   ================================================== */
.pfx .pfx-hero {
  position: relative; overflow: hidden;
  display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  padding: 26px 26px 22px; border-radius: 16px;
  border: 1px solid rgba(103, 232, 249, 0.16);
  background:
    radial-gradient(120% 130% at 100% 0%, rgba(103, 232, 249, 0.11), transparent 62%),
    linear-gradient(158deg, rgba(11, 24, 42, 0.92), rgba(4, 9, 18, 0.97));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 26px 60px -38px rgba(0, 0, 0, 0.8);
}
.pfx .pfx-hero-grid {
  position: absolute; inset: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(126, 190, 235, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(126, 190, 235, 0.035) 1px, transparent 1px);
  background-size: 34px 34px;
  mask-image: radial-gradient(120% 120% at 100% 0%, #000 10%, transparent 70%);
}
.pfx .pfx-hero-main { position: relative; z-index: 1; min-width: 0; }
.pfx .pfx-eyebrow {
  margin: 0 0 6px; font-size: 0.575rem; font-weight: 800; letter-spacing: 0.2em; text-transform: uppercase;
  color: rgba(133, 200, 240, 0.72);
}
.pfx .pfx-primary { display: flex; align-items: baseline; gap: 10px; margin: 0 0 8px; }
.pfx .pfx-primary strong {
  font-size: clamp(2.3rem, 6vw, 3.5rem); font-weight: 740; line-height: 0.95;
  letter-spacing: -0.035em; color: #f6fbff; font-variant-numeric: tabular-nums;
}
.pfx .pfx-primary span {
  font-size: 0.78rem; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase;
  color: rgba(146, 190, 226, 0.6);
}
.pfx .pfx-sub { margin: 0 0 14px; max-width: 46ch; font-size: 0.8rem; line-height: 1.55; color: rgba(190, 206, 228, 0.66); }
.pfx .pfx-signals { display: flex; flex-wrap: wrap; gap: 8px; }
.pfx .pfx-signal {
  display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px; border-radius: 999px;
  border: 1px solid rgba(140, 178, 214, 0.2); background: rgba(255, 255, 255, 0.025);
  font-size: 0.665rem; font-weight: 660; letter-spacing: 0.03em; color: rgba(214, 228, 242, 0.86);
  font-variant-numeric: tabular-nums;
}
.pfx .pfx-signal i { width: 6px; height: 6px; border-radius: 50%; background: #59d390; box-shadow: 0 0 0 3px rgba(89, 211, 144, 0.16); }

/* ---- Period control: terminal segmented control ---- */
.pfx .pfx-scope {
  position: relative; z-index: 1; display: inline-flex; gap: 2px; padding: 3px;
  border-radius: 9px; border: 1px solid rgba(140, 178, 214, 0.18); background: rgba(4, 10, 18, 0.7);
}
.pfx .pfx-scope-btn {
  min-height: 34px; padding: 0 16px; border: 0; border-radius: 7px; cursor: pointer;
  background: transparent; color: rgba(180, 200, 222, 0.66);
  font-size: 0.725rem; font-weight: 680; letter-spacing: 0.075em; text-transform: uppercase;
  transition: background-color 180ms ease, color 180ms ease;
}
.pfx .pfx-scope-btn:hover { color: #eaf5ff; }
.pfx .pfx-scope-btn.is-active {
  background: linear-gradient(160deg, rgba(103, 232, 249, 0.2), rgba(103, 232, 249, 0.07));
  color: #eafaff; box-shadow: inset 0 0 0 1px rgba(126, 211, 241, 0.34);
}
.pfx .pfx-scope-btn:focus-visible { outline: 2px solid rgba(103, 232, 249, 0.6); outline-offset: 2px; }

/* ==================================================
   4. INSTRUMENT GRID
   ================================================== */
.pfx .pfx-instruments { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 1px; border-radius: 13px; overflow: hidden; background: rgba(140, 178, 214, 0.13); border: 1px solid rgba(140, 178, 214, 0.13); }
.pfx .pfx-inst { display: grid; gap: 5px; align-content: center; padding: 15px 16px; min-height: 84px; background: rgba(7, 14, 25, 0.95); }
.pfx .pfx-inst strong {
  font-size: 1.28rem; font-weight: 720; letter-spacing: -0.02em; color: #eef6fd;
  font-variant-numeric: tabular-nums; line-height: 1.1;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pfx .pfx-inst span { font-size: 0.585rem; font-weight: 760; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(150, 176, 208, 0.55); }

/* ==================================================
   LAYOUT SPLITS
   ================================================== */
.pfx .pfx-split { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: 14px; }
.pfx .pfx-split-reward { grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); }

/* ==================================================
   2. RANK PROGRESSION
   ================================================== */
.pfx .pfx-rank-value {
  margin: 0 0 4px; font-size: clamp(2rem, 4vw, 2.7rem); font-weight: 760; line-height: 1;
  letter-spacing: -0.03em; color: #f4fbff; font-variant-numeric: tabular-nums;
}
.pfx .pfx-rank-note { margin: 0 0 14px; font-size: 0.78rem; color: rgba(190, 206, 228, 0.7); }
.pfx .pfx-rank-note strong { color: #eafaff; font-weight: 720; font-variant-numeric: tabular-nums; }
.pfx .pfx-rank-rail { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; margin-bottom: 16px; }
.pfx .pfx-rail-you, .pfx .pfx-rail-top {
  font-size: 0.615rem; font-weight: 740; letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap;
}
.pfx .pfx-rail-you { color: rgba(214, 228, 242, 0.82); }
.pfx .pfx-rail-top { color: rgba(214, 193, 122, 0.85); }
.pfx .pfx-rail-track {
  position: relative; height: 4px; border-radius: 999px; background: rgba(140, 178, 214, 0.16);
}
.pfx .pfx-rail-track i {
  position: absolute; top: 50%; left: 0; right: 0; height: 1px; transform: translateY(-50%);
  background: linear-gradient(90deg, rgba(103, 232, 249, 0.7), rgba(214, 193, 122, 0.55));
}
.pfx .pfx-rail-track::after {
  content: ""; position: absolute; top: 50%; right: 22%; width: 9px; height: 9px; border-radius: 50%;
  transform: translate(50%, -50%); background: #0a1524; border: 2px solid rgba(103, 232, 249, 0.85);
}
.pfx .pfx-positions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin: 0; border-radius: 9px; overflow: hidden; background: rgba(140, 178, 214, 0.12); }
.pfx .pfx-positions > div { display: grid; gap: 3px; padding: 10px 12px; background: rgba(8, 15, 26, 0.95); }
.pfx .pfx-positions dt { font-size: 0.565rem; font-weight: 760; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(150, 176, 208, 0.52); }
.pfx .pfx-positions dd { margin: 0; font-size: 0.85rem; font-weight: 700; color: #e7f0fa; font-variant-numeric: tabular-nums; }

/* ==================================================
   3. VERIFIED ACTIVITY CHART
   ================================================== */
.pfx .pfx-chart-plot {
  display: flex; align-items: flex-end; gap: 5px; height: 132px; margin-top: 14px;
  padding: 10px 2px 0; border-bottom: 1px solid rgba(140, 178, 214, 0.16);
}
.pfx .pfx-bar {
  flex: 1 1 0; min-width: 5px; border-radius: 3px 3px 0 0;
  background: linear-gradient(180deg, rgba(103, 232, 249, 0.72), rgba(103, 232, 249, 0.14));
  transition: background 180ms ease;
  animation: pfxBarRise 420ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
.pfx .pfx-bar:hover { background: linear-gradient(180deg, rgba(146, 244, 255, 0.9), rgba(103, 232, 249, 0.24)); }
@keyframes pfxBarRise { from { transform: scaleY(0.02); opacity: 0; } to { transform: scaleY(1); opacity: 1; } }
.pfx .pfx-chart-plot .pfx-bar { transform-origin: bottom; }
.pfx .pfx-chart-axis { display: flex; justify-content: space-between; gap: 10px; margin-top: 8px; font-size: 0.62rem; color: rgba(150, 176, 208, 0.52); font-variant-numeric: tabular-nums; }
.pfx .pfx-chart-empty { display: grid; gap: 4px; padding: 34px 12px; text-align: center; }
.pfx .pfx-chart-empty strong { font-size: 0.85rem; color: rgba(214, 228, 242, 0.82); }
.pfx .pfx-chart-empty span { font-size: 0.72rem; color: rgba(150, 176, 208, 0.55); }

/* ==================================================
   6. REWARD
   ================================================== */
.pfx .pfx-reward { border-color: rgba(214, 193, 122, 0.2); background: linear-gradient(158deg, rgba(30, 25, 12, 0.5), rgba(6, 12, 22, 0.95) 62%); }
.pfx .pfx-reward.is-qualified { border-color: rgba(89, 211, 144, 0.32); background: linear-gradient(158deg, rgba(14, 32, 24, 0.55), rgba(6, 12, 22, 0.95) 62%); }
.pfx .pfx-reward .pfx-panel-eyebrow { color: rgba(226, 200, 130, 0.8); }
.pfx .pfx-reward.is-qualified .pfx-panel-eyebrow { color: rgba(140, 226, 178, 0.85); }
.pfx .pfx-reward-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.pfx .pfx-reward-grid > div { display: grid; gap: 4px; min-width: 0; }
.pfx .pfx-reward-grid span { font-size: 0.565rem; font-weight: 760; letter-spacing: 0.11em; text-transform: uppercase; color: rgba(150, 176, 208, 0.55); }
.pfx .pfx-reward-grid strong { font-size: 1.15rem; font-weight: 740; letter-spacing: -0.018em; color: #f2e7c9; font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; }
.pfx .pfx-reward.is-qualified .pfx-reward-grid strong { color: #cdf3de; }
.pfx .pfx-reward-state { font-size: 0.8rem !important; letter-spacing: 0 !important; }
.pfx .pfx-reward-progress { margin: 0 0 10px; font-size: 0.76rem; font-weight: 660; color: rgba(226, 200, 130, 0.85); font-variant-numeric: tabular-nums; }
.pfx .pfx-reward-note { margin: 0 0 14px; font-size: 0.68rem; line-height: 1.5; color: rgba(150, 176, 208, 0.55); }
.pfx .pfx-reward-actions { display: flex; flex-wrap: wrap; gap: 9px; }

.pfx .pfx-rule-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.pfx .pfx-rule-list li {
  display: grid; grid-template-columns: 5.5rem minmax(0, 1fr); gap: 2px 12px; align-items: baseline;
  padding: 10px 0; border-bottom: 1px solid rgba(140, 178, 214, 0.08);
}
.pfx .pfx-rule-list li:last-child { border-bottom: 0; }
.pfx .pfx-rule-list span { font-size: 0.6rem; font-weight: 760; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(150, 176, 208, 0.55); }
.pfx .pfx-rule-list strong { font-size: 0.86rem; font-weight: 700; color: #e7f0fa; font-variant-numeric: tabular-nums; }
.pfx .pfx-rule-list small { grid-column: 2; font-size: 0.66rem; color: rgba(150, 176, 208, 0.55); }

/* ==================================================
   5 / 7. INSIGHT + RECENT ACTIVITY TIMELINE
   ================================================== */
.pfx .pfx-insight-head { margin: 0 0 8px; font-size: 1.12rem; font-weight: 720; letter-spacing: -0.012em; color: #f2f8fd; }
.pfx .pfx-insight-copy { margin: 0 0 8px; font-size: 0.8rem; line-height: 1.6; color: rgba(200, 216, 234, 0.78); }
.pfx .pfx-insight-muted { color: rgba(150, 176, 208, 0.58); font-size: 0.74rem; margin-bottom: 0; }

.pfx .pfx-timeline { display: grid; gap: 2px; }
.pfx .pfx-event {
  position: relative; display: grid; grid-template-columns: 14px minmax(0, 1fr) auto auto;
  align-items: center; gap: 12px; padding: 10px 0;
  border-bottom: 1px solid rgba(140, 178, 214, 0.07);
}
.pfx .pfx-event:last-child { border-bottom: 0; }
.pfx .pfx-event i {
  width: 7px; height: 7px; border-radius: 50%; justify-self: center;
  background: rgba(89, 211, 144, 0.85); box-shadow: 0 0 0 3px rgba(89, 211, 144, 0.12);
}
.pfx .pfx-event-lots { font-size: 0.86rem; font-weight: 720; color: #eaf5ff; font-variant-numeric: tabular-nums; }
.pfx .pfx-event-state { font-size: 0.585rem; font-weight: 760; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(140, 226, 178, 0.75); }
.pfx .pfx-event-date { font-size: 0.7rem; color: rgba(150, 176, 208, 0.58); font-variant-numeric: tabular-nums; white-space: nowrap; }

/* ==================================================
   10. RESPONSIVE
   ================================================== */
@media (max-width: 1180px) {
  .pfx .pfx-instruments { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  .pfx .pfx-split, .pfx .pfx-split-reward { grid-template-columns: 1fr; }
  .pfx .pfx-hero { align-items: flex-start; }
  .pfx .pfx-scope { width: 100%; }
  .pfx .pfx-scope-btn { flex: 1 1 0; padding: 0 10px; }
}
@media (max-width: 620px) {
  .pfx .pfx-instruments { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pfx .pfx-hero { padding: 20px 17px 18px; }
  .pfx .pfx-panel { padding: 16px 15px; }
  .pfx .pfx-reward-grid { grid-template-columns: 1fr; gap: 10px; }
  .pfx .pfx-positions { grid-template-columns: 1fr; }
  .pfx .pfx-rank-rail { grid-template-columns: 1fr; gap: 6px; }
  .pfx .pfx-rail-track { height: 4px; }
  .pfx .pfx-event { grid-template-columns: 14px minmax(0, 1fr) auto; row-gap: 2px; }
  .pfx .pfx-event-date { grid-column: 2 / -1; }
  .pfx .pfx-chart-plot { height: 108px; }
  .pfx .pfx-scope-btn { font-size: 0.665rem; letter-spacing: 0.05em; }
}

@media (prefers-reduced-motion: reduce) {
  .pfx .pfx-bar { animation: none; transition: none; }
  .pfx .pfx-scope-btn { transition: none; }
}

/* ==============================================================
   AUREX -- Leaderboard Cinematic V2 (.pfl).
   The Leaderboard page now carries BOTH `.pfx` and `.pfl`, so it
   genuinely reuses the Performance V2 design system (hero, scope
   selector, panel, typography) rather than duplicating it. `.pfl`
   adds only leaderboard-specific composition. Leaderboard V1 data
   contract untouched: public_leaderboard_entries -> publicLeaderboard,
   server rank read as-is, no recalculation, no private fields.
   Append-only.
   ============================================================== */

.pfl { display: grid; gap: 14px; }
.pfl .pfl-hero-title {
  margin: 0 0 8px; font-size: clamp(1.6rem, 3.4vw, 2.3rem); font-weight: 740;
  letter-spacing: -0.022em; line-height: 1.06; color: #f6fbff;
}

/* ==================================================
   2. PODIUM -- #2 / #1 / #3 visual order, restrained materials
   ================================================== */
.pfl .pfl-podium {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: end; gap: 12px;
}
.pfl .pfl-pod {
  position: relative; display: grid; gap: 6px; justify-items: center; text-align: center;
  padding: 20px 14px 18px; border-radius: 13px; min-width: 0;
  border: 1px solid rgba(140, 178, 214, 0.16);
  background: linear-gradient(168deg, rgba(14, 24, 40, 0.86), rgba(6, 12, 22, 0.95));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04), 0 18px 40px -32px rgba(0, 0, 0, 0.8);
}
.pfl .pfl-pod-rank {
  font-size: 0.72rem; font-weight: 800; letter-spacing: 0.1em;
  color: rgba(150, 176, 208, 0.6); font-variant-numeric: tabular-nums;
}
.pfl .pfl-pod-name {
  font-size: 0.92rem; font-weight: 700; color: #eef6fd; letter-spacing: -0.006em;
  max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.pfl .pfl-pod-name em {
  font-style: normal; font-size: 0.58rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase;
  color: #7fd8f7; margin-left: 5px;
}
.pfl .pfl-pod-lots { font-size: 0.76rem; color: rgba(190, 206, 228, 0.66); font-variant-numeric: tabular-nums; }
.pfl .pfl-pod-lots b { font-size: 1.14rem; font-weight: 740; color: #f2f8fd; letter-spacing: -0.02em; }
.pfl .pfl-pod-reward {
  margin-top: 3px; padding: 3px 11px; border-radius: 999px;
  font-size: 0.615rem; font-weight: 760; letter-spacing: 0.075em; text-transform: uppercase;
  border: 1px solid rgba(214, 193, 122, 0.34); background: rgba(214, 193, 122, 0.09); color: #e9d09a;
}

/* #1 -- elevated, restrained platinum-gold */
.pfl .pfl-pod-1 {
  padding-top: 28px; padding-bottom: 24px;
  border-color: rgba(226, 200, 130, 0.3);
  background: linear-gradient(168deg, rgba(40, 33, 16, 0.55), rgba(8, 13, 22, 0.96) 62%);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.07), 0 24px 52px -34px rgba(214, 193, 122, 0.4);
}
.pfl .pfl-pod-1 .pfl-pod-rank { color: rgba(233, 208, 154, 0.9); }
.pfl .pfl-pod-1 .pfl-pod-lots b { font-size: 1.36rem; color: #fdf6e6; }
.pfl .pfl-pod-1 .pfl-pod-name { font-size: 1rem; }
/* #2 -- steel/silver */
.pfl .pfl-pod-2 { border-color: rgba(185, 198, 212, 0.24); background: linear-gradient(168deg, rgba(26, 32, 40, 0.6), rgba(6, 12, 22, 0.95) 62%); }
.pfl .pfl-pod-2 .pfl-pod-rank { color: rgba(203, 214, 226, 0.8); }
/* #3 -- warm bronze */
.pfl .pfl-pod-3 { border-color: rgba(201, 138, 82, 0.24); background: linear-gradient(168deg, rgba(36, 24, 16, 0.5), rgba(6, 12, 22, 0.95) 62%); }
.pfl .pfl-pod-3 .pfl-pod-rank { color: rgba(216, 163, 116, 0.82); }

.pfl .pfl-pod.is-vacant { opacity: 0.5; }
.pfl .pfl-pod.is-vacant .pfl-pod-name { font-weight: 600; color: rgba(190, 206, 228, 0.6); }
.pfl .pfl-pod.is-vacant .pfl-pod-lots { font-size: 0.7rem; }
.pfl .pfl-pod.is-you { box-shadow: inset 0 0 0 1px rgba(126, 211, 241, 0.4), 0 20px 44px -32px rgba(0, 0, 0, 0.8); }

/* ==================================================
   3. PERSONAL POSITION
   ================================================== */
.pfl .pfl-you-card {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 22px;
  border-color: rgba(126, 211, 241, 0.24);
  background: linear-gradient(120deg, rgba(103, 232, 249, 0.08), rgba(6, 12, 22, 0.95) 58%);
}
.pfl .pfl-you-lead { display: grid; gap: 2px; }
.pfl .pfl-you-rank {
  margin: 0; font-size: clamp(1.9rem, 4vw, 2.5rem); font-weight: 760; line-height: 1;
  letter-spacing: -0.03em; color: #f4fbff; font-variant-numeric: tabular-nums;
}
.pfl .pfl-you-note { margin: 0; font-size: 0.78rem; color: rgba(190, 206, 228, 0.68); max-width: 46ch; }
.pfl .pfl-you-facts { display: flex; flex-wrap: wrap; gap: 10px 26px; }
.pfl .pfl-you-facts > div { display: grid; gap: 3px; min-width: 0; }
.pfl .pfl-you-facts span { font-size: 0.575rem; font-weight: 780; letter-spacing: 0.11em; text-transform: uppercase; color: rgba(150, 176, 208, 0.55); }
.pfl .pfl-you-facts strong { font-size: 1.08rem; font-weight: 720; color: #eaf5ff; font-variant-numeric: tabular-nums; letter-spacing: -0.018em; }
.pfl .pfl-you-reward { color: #e9d09a !important; }
.pfl .pfl-you-card.is-empty { grid-template-columns: minmax(0, 1fr) auto; }

/* ==================================================
   4. RANKING TABLE
   ================================================== */
.pfl .pfl-table-panel { padding-bottom: 8px; }
.pfl .leaderboard-table { display: grid; gap: 1px; margin-top: 12px; }
.pfl .leaderboard-row {
  display: grid; grid-template-columns: 4.5rem minmax(0, 1fr) 8rem 9rem;
  align-items: center; gap: 14px; padding: 12px 12px;
  border-radius: 8px; border: 1px solid transparent;
  transition: background-color 150ms ease, border-color 150ms ease;
}
.pfl .leaderboard-row.leaderboard-head {
  padding-top: 0; padding-bottom: 9px; border-radius: 0; border: 0;
  border-bottom: 1px solid rgba(140, 178, 214, 0.16);
  font-size: 0.575rem; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase;
  color: rgba(150, 176, 208, 0.55);
}
.pfl .leaderboard-row.leaderboard-head:hover { background: none; }
.pfl .leaderboard-row:not(.leaderboard-head):hover { background: rgba(150, 176, 208, 0.04); }
.pfl .leaderboard-row > span,
.pfl .leaderboard-row > strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pfl .leaderboard-row > span:first-child { font-size: 0.86rem; font-weight: 740; color: rgba(190, 206, 228, 0.7); font-variant-numeric: tabular-nums; }
.pfl .leaderboard-row > strong { font-size: 0.87rem; font-weight: 660; color: #eaf2fb; }
.pfl .leaderboard-row > span:nth-child(3) { font-size: 0.87rem; font-weight: 700; color: #f0f7fd; font-variant-numeric: tabular-nums; }
.pfl .leaderboard-row > span:nth-child(4) { font-size: 0.73rem; color: rgba(190, 206, 228, 0.62); }
.pfl .leaderboard-place-1 > span:first-child { color: #e9d09a; }
.pfl .leaderboard-place-2 > span:first-child { color: #cbd6e2; }
.pfl .leaderboard-place-3 > span:first-child { color: #d8a374; }
.pfl .leaderboard-row.is-you {
  background: rgba(103, 232, 249, 0.07); border-color: rgba(126, 211, 241, 0.28);
}
.pfl .pfl-you {
  font-style: normal; margin-left: 7px; padding: 2px 7px; border-radius: 4px;
  font-size: 0.555rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase;
  background: rgba(126, 211, 241, 0.16); color: #9fe6fb;
}
.pfl .leaderboard-empty { display: grid; gap: 4px; padding: 34px 12px; text-align: center; }
.pfl .leaderboard-empty strong { font-size: 0.88rem; color: rgba(214, 228, 242, 0.84); }
.pfl .leaderboard-empty span { font-size: 0.74rem; color: rgba(150, 176, 208, 0.55); }

/* ==================================================
   8. IDENTITY -- compact, must not compete with rankings
   ================================================== */
.pfl .leaderboard-identity-panel {
  padding: 16px 18px; border-radius: 12px;
  border: 1px solid rgba(140, 178, 214, 0.13); background: rgba(255, 255, 255, 0.013); box-shadow: none;
}
.pfl .leaderboard-identity-panel .eyebrow { font-size: 0.565rem; letter-spacing: 0.16em; color: rgba(146, 190, 226, 0.58); }
.pfl .leaderboard-identity-panel h3 { font-size: 0.98rem; font-weight: 700; }
.pfl .leaderboard-identity-panel p { font-size: 0.73rem; color: rgba(150, 176, 208, 0.58); }

.pfl .pfl-nav { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.pfl .pfl-nav .pfx-panel-eyebrow { margin: 0; }
.pfl .pfl-nav-actions { display: flex; flex-wrap: wrap; gap: 9px; }

/* ==================================================
   10. MOTION -- entrance only, no continuous animation
   ================================================== */
.pfl .pfl-pod { animation: pflPodRise 380ms cubic-bezier(0.22, 1, 0.36, 1) both; }
.pfl .pfl-pod-2 { animation-delay: 60ms; }
.pfl .pfl-pod-3 { animation-delay: 120ms; }
@keyframes pflPodRise { from { transform: translateY(10px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ==================================================
   11. MOBILE
   ================================================== */
@media (max-width: 900px) {
  .pfl .pfl-you-card { grid-template-columns: 1fr; gap: 14px; }
  .pfl .pfl-you-card.is-empty { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .pfl .pfl-podium { grid-template-columns: 1fr; }
  .pfl .pfl-pod-1 { order: -1; padding-top: 22px; }
  .pfl .pfl-pod { justify-items: start; text-align: left; grid-template-columns: auto minmax(0, 1fr); grid-auto-flow: column; align-items: center; gap: 4px 14px; padding: 14px 15px; }
  .pfl .pfl-pod-rank { grid-row: 1 / span 2; font-size: 1rem; }
  .pfl .pfl-pod-reward { justify-self: start; }
  /* Ranking rows become compact cards. */
  .pfl .leaderboard-row.leaderboard-head { display: none; }
  .pfl .leaderboard-row {
    grid-template-columns: 3.2rem minmax(0, 1fr); row-gap: 4px; padding: 12px 13px;
    border: 1px solid rgba(140, 178, 214, 0.13); background: rgba(255, 255, 255, 0.014); margin-bottom: 8px;
  }
  .pfl .leaderboard-row > span:first-child { grid-row: 1 / span 2; align-self: center; font-size: 1rem; }
  .pfl .leaderboard-row > span:nth-child(3)::after { content: " lots"; font-size: 0.7rem; font-weight: 500; color: rgba(150, 176, 208, 0.55); }
  .pfl .leaderboard-row > span:nth-child(4) { grid-column: 2; font-size: 0.68rem; }
}
@media (max-width: 430px) {
  .pfl .pfl-you-facts { gap: 10px 18px; }
  .pfl .pfl-hero-title { font-size: 1.45rem; }
}

@media (prefers-reduced-motion: reduce) {
  .pfl .pfl-pod { animation: none; }
  .pfl .leaderboard-row { transition: none; }
}

/* ==============================================================
   12. SHELL FIX -- sticky header bleed-through.
   The portal topbar is sticky at z-index 24 with a background of
   rgba(5,12,23,0.8). At 80% opacity, page content scrolling beneath
   it shows through, which reads exactly like the header "cutting
   through" mid-page content. Raising the surface opacity fixes it
   while keeping the existing blur as enhancement. Position, z-index,
   routing and auth behaviour are unchanged.
   ============================================================== */
.portal-body.portal-product-v2 .portal-main .portal-topbar {
  background: rgba(5, 11, 21, 0.97);
}
@supports (backdrop-filter: blur(10px)) {
  .portal-body.portal-product-v2 .portal-main .portal-topbar { background: rgba(5, 11, 21, 0.92); }
}

/* ==============================================================
   AUREX -- Cashback / Rewards Cinematic V2.
   The Cashback page now carries BOTH `.cashback-experience` and
   `.pfx`, so it inherits the Performance/Leaderboard V2 design
   system (hero, panel, typography, motion discipline) instead of
   duplicating it. Existing .cashback-experience styling from prior
   approved passes is preserved; this block adds the family bridge
   plus the two read-only connection modules. No calculation,
   claim, tier, or ledger behaviour is touched. Append-only.
   ============================================================== */

/* The Cashback page manages its own section rhythm via .cbk-group,
   so neutralise the .pfx grid gap here and keep the existing flow. */
.cashback-experience.pfx { display: block; }

/* ---- Hero: rewards headline ---- */
.cashback-experience.pfx .pfx-hero { margin-bottom: 14px; }
.cashback-experience.pfx .pfx-hero-label {
  margin: 0 0 2px; font-size: 0.585rem; font-weight: 780; letter-spacing: 0.15em; text-transform: uppercase;
  color: rgba(150, 176, 208, 0.55);
}
.cashback-experience.pfx .pfx-primary strong {
  color: #b6f0d3; font-size: clamp(2.4rem, 6vw, 3.6rem);
}
.cashback-experience.pfx .pfx-hero {
  border-color: rgba(131, 216, 174, 0.18);
  background:
    radial-gradient(120% 130% at 100% 0%, rgba(131, 216, 174, 0.1), transparent 62%),
    linear-gradient(158deg, rgba(9, 22, 18, 0.9), rgba(4, 9, 18, 0.97));
}
.cashback-experience.pfx .pfx-hero .cbk-period-chip { position: relative; z-index: 1; margin-top: 0; align-self: flex-start; }
.cashback-experience.pfx .pfx-signal { font-variant-numeric: tabular-nums; }

/* The month selector keeps its own row below the hero. */
.cashback-experience .cbk-month-select { display: flex; justify-content: flex-end; margin-bottom: 12px; }
.cashback-experience .cbk-month-select:empty { display: none; }

/* ---- Connection bridges: Leaderboard reward + Verified activity ---- */
.cashback-experience .cbk-bridges {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 0 0 14px;
}
.cashback-experience .cbk-bridge { display: grid; gap: 6px; align-content: start; }
.cashback-experience .cbk-bridge-value {
  margin: 0; font-size: 1.5rem; font-weight: 740; letter-spacing: -0.024em; color: #eef6fd;
  font-variant-numeric: tabular-nums;
}
.cashback-experience .cbk-bridge-value span {
  font-size: 0.72rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  color: rgba(150, 176, 208, 0.55); margin-left: 4px;
}
.cashback-experience .cbk-bridge-note { margin: 0; font-size: 0.74rem; color: rgba(190, 206, 228, 0.66); font-variant-numeric: tabular-nums; }
.cashback-experience .cbk-bridge-gap { color: rgba(233, 208, 154, 0.85); font-weight: 640; }
.cashback-experience .cbk-bridge-empty { margin: 0; font-size: 0.78rem; color: rgba(150, 176, 208, 0.58); }
.cashback-experience .cbk-bridge .secondary-button { justify-self: start; margin-top: 6px; }

/* ---- Family alignment: reuse the V2 instrument treatment on the
   existing verified-activity grid without restructuring it. ---- */
.cashback-experience .cashback-activity-grid .portal-stat strong { letter-spacing: -0.02em; }

@media (max-width: 760px) {
  .cashback-experience .cbk-bridges { grid-template-columns: 1fr; }
  .cashback-experience .cbk-month-select { justify-content: flex-start; }
}
@media (max-width: 430px) {
  .cashback-experience.pfx .pfx-primary strong { font-size: 2.1rem; }
  .cashback-experience .cbk-bridge-value { font-size: 1.3rem; }
}

/* ==============================================================
   AUREX -- Client Overview Cinematic V2 (.pov).
   The Overview now carries BOTH `.pfx` and `.pov`, so it inherits
   the Performance / Leaderboard / Cashback V2 design system rather
   than introducing a fourth. `.pov` adds only Overview-specific
   composition. All values come from existing hydrated helpers.
   Append-only.
   ============================================================== */

.pov { display: grid; gap: 14px; }

/* ---- Hero ---- */
.pov .pov-hero-name {
  margin: 0 0 8px; font-size: clamp(1.7rem, 3.6vw, 2.45rem); font-weight: 740;
  letter-spacing: -0.024em; line-height: 1.05; color: #f6fbff;
}

/* ---- Next actions ---- */
.pov .pov-action-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.pov .pov-action-list a {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 14px;
  padding: 12px 12px; border-radius: 9px; border: 1px solid transparent;
  text-decoration: none; transition: background-color 150ms ease, border-color 150ms ease;
}
.pov .pov-action-list a:hover { background: rgba(103, 232, 249, 0.055); border-color: rgba(126, 211, 241, 0.24); }
.pov .pov-action-body { display: grid; gap: 2px; min-width: 0; }
.pov .pov-action-body strong { font-size: 0.86rem; font-weight: 680; color: #eaf3fb; }
.pov .pov-action-body small { font-size: 0.72rem; color: rgba(150, 176, 208, 0.62); }
.pov .pov-action-list em { font-style: normal; color: rgba(126, 211, 241, 0.7); font-size: 0.95rem; }

/* ---- Bridge panels ---- */
.pov .pov-bridge { display: grid; gap: 8px; align-content: start; }
.pov .pov-bridge .secondary-button { justify-self: start; margin-top: 4px; }
.pov .pov-bridge-figures { display: flex; flex-wrap: wrap; gap: 10px 28px; }
.pov .pov-bridge-figures > div { display: grid; gap: 2px; min-width: 0; }
.pov .pov-bridge-figures span { font-size: 0.565rem; font-weight: 780; letter-spacing: 0.11em; text-transform: uppercase; color: rgba(150, 176, 208, 0.55); }
.pov .pov-bridge-figures strong { font-size: 1.14rem; font-weight: 730; color: #eef6fd; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.pov .pov-bridge-rank {
  margin: 0; font-size: 2rem; font-weight: 760; letter-spacing: -0.03em; color: #f4fbff; font-variant-numeric: tabular-nums; line-height: 1;
}
.pov .pov-bridge-rank span { font-size: 0.68rem; font-weight: 760; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(150, 176, 208, 0.55); margin-left: 6px; }
.pov .pov-bridge-money {
  margin: 0; font-size: 1.9rem; font-weight: 750; letter-spacing: -0.03em; color: #b6f0d3; font-variant-numeric: tabular-nums; line-height: 1;
}
.pov .pov-bridge-note { margin: 0; font-size: 0.75rem; color: rgba(190, 206, 228, 0.66); font-variant-numeric: tabular-nums; }
.pov .pov-bridge-empty { margin: 0; font-size: 0.78rem; color: rgba(150, 176, 208, 0.58); max-width: 44ch; }

/* ---- Trading account state ---- */
.pov .pov-broker-state {
  margin: 0; display: inline-flex; align-items: center; gap: 8px;
  font-size: 1.02rem; font-weight: 720; letter-spacing: -0.01em;
}
.pov .pov-broker-state i { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.pov .pov-broker-state.is-connected { color: #a9ecc9; }
.pov .pov-broker-state.is-connected i { background: #83d8ae; box-shadow: 0 0 0 3px rgba(131, 216, 174, 0.16); }
.pov .pov-broker-state.is-pending { color: #ecd08a; }
.pov .pov-broker-state.is-pending i { background: #e7c76a; box-shadow: 0 0 0 3px rgba(231, 199, 106, 0.14); }

/* ---- Service status: compact terminal rows, not cards ---- */
.pov .pov-service-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 6px; margin-top: 12px; }
.pov .pov-service {
  display: flex; align-items: center; gap: 8px; min-width: 0;
  padding: 9px 11px; border-radius: 7px; text-decoration: none;
  border: 1px solid rgba(140, 178, 214, 0.12); background: rgba(255, 255, 255, 0.014);
  font-size: 0.735rem; font-weight: 620; color: rgba(210, 224, 240, 0.82);
  transition: border-color 150ms ease, background-color 150ms ease, color 150ms ease;
}
.pov .pov-service span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pov .pov-service i { width: 6px; height: 6px; border-radius: 50%; flex: 0 0 auto; }
.pov .pov-service.is-live i { background: #59d390; box-shadow: 0 0 0 2px rgba(89, 211, 144, 0.14); }
.pov .pov-service.is-live:hover { border-color: rgba(126, 211, 241, 0.3); background: rgba(103, 232, 249, 0.06); color: #eaf5ff; }
.pov .pov-service.is-dev { opacity: 0.6; cursor: default; }
.pov .pov-service.is-dev i { background: rgba(167, 139, 250, 0.75); }

/* ---- Ecosystem chain ---- */
.pov .pov-chain {
  display: flex; align-items: center; flex-wrap: wrap; gap: 6px 4px;
  padding: 12px 16px; border-radius: 11px;
  border: 1px solid rgba(140, 178, 214, 0.11); background: rgba(255, 255, 255, 0.012);
}
.pov .pov-chain-step {
  font-size: 0.6rem; font-weight: 780; letter-spacing: 0.11em; text-transform: uppercase;
  color: rgba(150, 176, 208, 0.6);
}
.pov .pov-chain-step + .pov-chain-step::before {
  content: "→"; margin: 0 9px 0 5px; color: rgba(126, 211, 241, 0.45); font-weight: 500; letter-spacing: 0;
}

/* ---- Recommendation panel: aligned to the family, kept reachable ---- */
.pov .pov-recommendation .client-recommendation-panel {
  margin: 0; border-radius: 13px; border-color: rgba(140, 178, 214, 0.16);
}

/* ---- Responsive ---- */
@media (max-width: 1080px) {
  .pov .pov-service-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .pov .pov-service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pov .pov-bridge-figures { gap: 10px 20px; }
}
@media (max-width: 430px) {
  .pov .pov-hero-name { font-size: 1.55rem; }
  .pov .pov-service-grid { grid-template-columns: 1fr; }
  .pov .pov-bridge-rank { font-size: 1.7rem; }
  .pov .pov-bridge-money { font-size: 1.6rem; }
  .pov .pov-chain { gap: 4px 2px; }
  .pov .pov-chain-step + .pov-chain-step::before { margin: 0 5px 0 2px; }
}

@media (prefers-reduced-motion: reduce) {
  .pov .pov-action-list a,
  .pov .pov-service { transition: none; }
}

/* ==============================================================
   AUREX -- Trading Accounts Cinematic V2 (.tac).
   Extends the approved .pfx family (hero, panel, typography) with
   an operational broker-connection variant. All form fields, the
   form id, and every data-trading-accounts-* hook are unchanged;
   submission, validation and verification logic are untouched.
   Append-only.
   ============================================================== */

.tac { display: grid; gap: 14px; }

/* ---- Hero: operational, not analytical ---- */
.tac .pfx-hero { border-color: rgba(89, 211, 192, 0.18); background:
  radial-gradient(120% 130% at 100% 0%, rgba(89, 211, 192, 0.09), transparent 62%),
  linear-gradient(158deg, rgba(9, 22, 26, 0.9), rgba(4, 9, 18, 0.97)); }
.tac .tac-hero-title {
  margin: 0 0 8px; font-size: clamp(1.5rem, 3.2vw, 2.15rem); font-weight: 730;
  letter-spacing: -0.022em; line-height: 1.08; color: #f4fbfb;
}
.tac .tac-hero-actions { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 9px; }
.tac .tac-signal i { width: 7px; height: 7px; border-radius: 50%; flex: 0 0 auto; }
.tac .tac-signal.is-connected { border-color: rgba(131, 216, 174, 0.34); color: #a9ecc9; }
.tac .tac-signal.is-connected i { background: #83d8ae; box-shadow: 0 0 0 3px rgba(131, 216, 174, 0.16); }
.tac .tac-signal.is-pending { border-color: rgba(231, 199, 106, 0.34); color: #ecd08a; }
.tac .tac-signal.is-pending i { background: #e7c76a; box-shadow: 0 0 0 3px rgba(231, 199, 106, 0.14); }
.tac .tac-signal.is-attention { border-color: rgba(255, 138, 150, 0.32); color: #ffb3bb; }
.tac .tac-signal.is-attention i { background: #ff8a96; box-shadow: 0 0 0 3px rgba(255, 118, 132, 0.14); }
.tac .tac-signal.is-none { border-color: rgba(150, 176, 208, 0.26); color: rgba(200, 214, 230, 0.8); }
.tac .tac-signal.is-none i { background: rgba(150, 176, 208, 0.7); }

/* ---- Account cards ---- */
.tac .tac-section { display: grid; gap: 10px; }
.tac .tac-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(268px, 1fr)); gap: 12px; }
.tac .tac-card { display: grid; gap: 14px; align-content: start; }
.tac .tac-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.tac .tac-ident { display: grid; gap: 3px; min-width: 0; }
.tac .tac-broker {
  font-size: 0.575rem; font-weight: 800; letter-spacing: 0.15em; text-transform: uppercase;
  color: rgba(146, 190, 226, 0.6);
}
.tac .tac-number {
  font-size: 1.22rem; font-weight: 740; letter-spacing: 0.02em; color: #eef6fd;
  font-variant-numeric: tabular-nums; overflow-wrap: anywhere;
}
.tac .tac-nickname { font-size: 0.73rem; color: rgba(150, 176, 208, 0.62); overflow-wrap: anywhere; }
.tac .tac-pill {
  flex: 0 0 auto; font-size: 0.6rem; font-weight: 760; letter-spacing: 0.07em; text-transform: uppercase;
  box-shadow: none;
}
.tac .tac-meta {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; margin: 0;
  border-radius: 9px; overflow: hidden; background: rgba(140, 178, 214, 0.11);
}
.tac .tac-meta > div { display: grid; gap: 3px; padding: 10px 12px; background: rgba(8, 15, 26, 0.95); min-width: 0; }
.tac .tac-meta dt { font-size: 0.545rem; font-weight: 780; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(150, 176, 208, 0.52); }
.tac .tac-meta dd { margin: 0; font-size: 0.775rem; font-weight: 640; color: #e7f0fa; overflow-wrap: anywhere; }
.tac .tac-meta .tac-on { color: #a9ecc9; }
.tac .tac-meta .tac-off { color: rgba(190, 206, 228, 0.6); }

/* State accents -- restrained, no giant warning blocks */
.tac .tac-card.is-verified { border-color: rgba(131, 216, 174, 0.24); }
.tac .tac-card.is-pending, .tac .tac-card.is-conflict { border-color: rgba(231, 199, 106, 0.22); }
.tac .tac-card.is-rejected { border-color: rgba(255, 118, 132, 0.24); }
.tac .tac-card.is-inactive { opacity: 0.82; }

/* ---- Connection flow ---- */
.tac .tac-flow-rail {
  list-style: none; margin: 12px 0 0; padding: 0;
  display: flex; align-items: center; flex-wrap: wrap; gap: 8px 0;
}
.tac .tac-flow-rail li {
  position: relative; flex: 1 1 140px; display: grid; justify-items: center; gap: 7px; text-align: center;
  font-size: 0.635rem; font-weight: 680; letter-spacing: 0.02em; color: rgba(150, 176, 208, 0.55);
}
.tac .tac-flow-rail li::before {
  content: ""; position: absolute; top: 5px; left: 0; right: 0; height: 1px; background: rgba(140, 178, 214, 0.16);
}
.tac .tac-flow-rail li:first-child::before { left: 50%; }
.tac .tac-flow-rail li:last-child::before { right: 50%; }
.tac .tac-flow-rail i {
  position: relative; z-index: 1; width: 11px; height: 11px; border-radius: 50%;
  background: #0a1524; border: 1px solid rgba(150, 176, 208, 0.34);
}
.tac .tac-flow-rail li.is-done { color: rgba(214, 228, 242, 0.82); }
.tac .tac-flow-rail li.is-done i { background: #59d390; border-color: #59d390; }

/* ---- No-account experience ---- */
.tac .tac-empty { display: grid; gap: 12px; justify-items: start; }
.tac .tac-empty-title { margin: 0; font-size: 1.1rem; font-weight: 700; letter-spacing: -0.012em; color: #f2f8fd; max-width: 46ch; }
.tac .tac-unlock { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 10px; }
.tac .tac-unlock li {
  display: inline-flex; align-items: center; gap: 8px; padding: 7px 13px; border-radius: 999px;
  border: 1px solid rgba(140, 178, 214, 0.16); background: rgba(255, 255, 255, 0.016);
  font-size: 0.72rem; font-weight: 620; color: rgba(214, 228, 242, 0.82);
}
.tac .tac-unlock i { width: 5px; height: 5px; border-radius: 50%; background: rgba(89, 211, 192, 0.8); flex: 0 0 auto; }

/* ---- Add-account form ---- */
.tac .tac-form-panel { display: grid; gap: 10px; }
.tac .tac-form-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.tac .tac-form-head .pfx-panel-eyebrow { margin: 0; }
.tac .tac-form-close { flex: 0 0 auto; }
.tac .tac-form-note { margin: 0 0 4px; font-size: 0.73rem; line-height: 1.55; color: rgba(150, 176, 208, 0.6); max-width: 62ch; }
.tac .tac-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.tac .tac-form-grid label {
  display: grid; gap: 6px; min-width: 0;
  font-size: 0.6rem; font-weight: 780; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(150, 176, 208, 0.6);
}
.tac .tac-form-grid label span { text-transform: none; letter-spacing: 0; font-weight: 500; color: rgba(150, 176, 208, 0.45); }
.tac .tac-form-grid input {
  width: 100%; box-sizing: border-box; min-height: 44px; padding: 0 13px;
  border: 1px solid rgba(140, 178, 214, 0.18); border-radius: 9px;
  background: rgba(255, 255, 255, 0.02); color: #eef5fb;
  font-size: 0.85rem; font-weight: 500; text-transform: none; letter-spacing: normal;
}
.tac .tac-form-grid input:focus-visible {
  outline: none; border-color: rgba(89, 211, 192, 0.5); box-shadow: 0 0 0 3px rgba(89, 211, 192, 0.14);
}
.tac .tac-form-grid .portal-form-wide { grid-column: 1 / -1; }
.tac .tac-form-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }

/* ---- Trust panel + states ---- */
.tac .tac-trust-copy { margin: 0; font-size: 0.76rem; line-height: 1.6; color: rgba(190, 206, 228, 0.66); max-width: 78ch; }
.tac .portal-success-state, .tac .portal-error-state, .tac .portal-loading-state {
  padding: 12px 15px; border-radius: 10px; font-size: 0.79rem;
  border: 1px solid rgba(140, 178, 214, 0.16); background: rgba(255, 255, 255, 0.014);
}
.tac .portal-success-state { border-color: rgba(131, 216, 174, 0.3); background: rgba(131, 216, 174, 0.07); color: #a9ecc9; }
.tac .portal-error-state { border-color: rgba(255, 118, 132, 0.3); background: rgba(255, 118, 132, 0.06); color: #ffb3bb; }
.tac .portal-loading-state { color: rgba(150, 176, 208, 0.7); }

/* ---- Motion: entrance only ---- */
.tac .tac-card { animation: tacCardIn 340ms cubic-bezier(0.22, 1, 0.36, 1) both; }
@keyframes tacCardIn { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ---- Responsive ---- */
@media (max-width: 760px) {
  .tac .tac-form-grid { grid-template-columns: 1fr; }
  .tac .tac-meta { grid-template-columns: 1fr; }
  .tac .tac-hero-actions { width: 100%; }
  .tac .tac-hero-actions .compact-action { flex: 1 1 auto; justify-content: center; }
}
@media (max-width: 430px) {
  .tac .tac-hero-title { font-size: 1.35rem; }
  .tac .tac-number { font-size: 1.08rem; }
  .tac .tac-grid { grid-template-columns: 1fr; }
  .tac .tac-flow-rail li { flex-basis: 50%; }
}

@media (prefers-reduced-motion: reduce) {
  .tac .tac-card { animation: none; }
}

/* Client quick access: compact utility actions, not a competing dashboard. */
.portal-main .pov-quick-access { display: grid; gap: 12px; }
.portal-main .pov-quick-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.portal-main .pov-quick-grid a { display: grid; gap: 5px; min-height: 54px; padding: 12px 14px; border: 1px solid rgba(130,198,255,0.14); border-radius: 9px; color: #eaf4ff; background: rgba(255,255,255,0.018); text-decoration: none; }
.portal-main .pov-quick-grid a:hover { border-color: rgba(130,198,255,0.34); background: rgba(130,198,255,0.06); }
.portal-main .pov-quick-label { color: rgba(145,215,239,0.82); font-size: 0.68rem; font-weight: 760; letter-spacing: 0.1em; text-transform: uppercase; }
.portal-main .pov-quick-grid strong { font-size: 0.82rem; font-weight: 650; }
.portal-main .portal-more-external span { color: #91d7ef; }
@media (max-width: 760px) {
  .portal-main .pov-quick-grid { grid-template-columns: 1fr; }
  .portal-main .pov-quick-grid a { min-height: 48px; }
}

/* Final Trading Accounts polish: terminal hierarchy and review-state clarity. */
.tac .tac-section { gap: 9px; }
.tac .tac-section > .pfx-panel-eyebrow {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 0;
  color: rgba(190, 214, 232, 0.72);
}
.tac .tac-grid { gap: 14px; }
.tac .tac-card {
  position: relative;
  overflow: hidden;
  min-height: 188px;
  padding: 20px;
  background:
    linear-gradient(145deg, rgba(89, 211, 192, 0.055), transparent 48%),
    linear-gradient(180deg, rgba(10, 23, 37, 0.98), rgba(5, 12, 22, 0.98));
  box-shadow: inset 0 1px 0 rgba(220, 250, 250, 0.045), 0 14px 30px rgba(0, 0, 0, 0.12);
}
.tac .tac-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 2px;
  background: rgba(150, 176, 208, 0.34);
}
.tac .tac-card.is-verified::before { background: #83d8ae; }
.tac .tac-card.is-pending::before,
.tac .tac-card.is-conflict::before { background: #e7c76a; }
.tac .tac-card.is-rejected::before { background: #ff8a96; }
.tac .tac-card.is-inactive::before { background: #8299ae; }
.tac .tac-head { align-items: center; }
.tac .tac-broker { color: rgba(145, 222, 243, 0.72); }
.tac .tac-number { font-size: clamp(1.18rem, 2vw, 1.42rem); letter-spacing: 0.045em; }
.tac .tac-pill { white-space: nowrap; }
.tac .tac-state-note {
  min-height: 2.5em;
  margin: -3px 0 0;
  color: rgba(190, 206, 228, 0.68);
  font-size: 0.74rem;
  line-height: 1.5;
}
.tac .tac-meta { margin-top: auto; }
.tac .tac-meta > div { padding: 11px 12px; }
.tac .tac-meta dd { font-size: 0.74rem; }
.tac .tac-flow { padding: 18px 20px 20px; }
.tac .tac-flow .pfx-panel-eyebrow { margin-bottom: 3px; }
.tac .tac-empty { min-height: 0; padding: 22px 24px; }
.tac .tac-empty-title { max-width: 52ch; }
.tac .tac-trust { padding: 16px 20px; }
.tac .tac-trust .pfx-panel-eyebrow { margin-bottom: 7px; }
.tac .tac-hero-actions .compact-action { min-height: 40px; }
.tac .tac-form-panel { padding: 22px 24px; }
.tac .tac-form-head { padding-bottom: 2px; }
.tac .tac-form-note { max-width: 58ch; }
.tac .tac-form-actions .primary-button,
.tac .tac-form-actions .secondary-button { min-height: 40px; }
@media (max-width: 760px) {
  .tac .tac-card { min-height: 0; padding: 17px; }
  .tac .tac-head { align-items: flex-start; }
  .tac .tac-form-panel { padding: 18px 16px; }
  .tac .tac-form-actions > * { flex: 1 1 140px; justify-content: center; }
}
@media (max-width: 430px) {
  .tac .tac-head { flex-direction: column; gap: 9px; }
  .tac .tac-pill { justify-self: start; }
  .tac .tac-empty { padding: 18px 16px; }
}

/* ==============================================================
   AUREX -- Portal motion system.
   TECHNIQUE NOTE: every progress reveal animates `transform:
   scaleX()` with `transform-origin: left`, NOT `width`. The
   authoritative inline `width:<real>%` is never touched, so the
   final painted state is always the real value and no incorrect
   intermediate number or length is ever displayed. Number reveals
   are opacity/translate only -- deliberately NOT count-up
   interpolation, which cannot paint a wrong figure this way.
   All animations are one-shot (`both`) except one very slow, very
   low-opacity ambient drift. Everything is disabled under
   prefers-reduced-motion at the end of this block. Append-only.
   ============================================================== */

/* ==================================================
   1/3. SIDEBAR ICON MICRO-INTERACTION
   ================================================== */
.portal-product-v2 .portal-sidebar .nav-item .axr-glyph { transition: transform 170ms ease; }
.portal-product-v2 .portal-sidebar .axr-link:hover .axr-glyph { transform: translateX(1.5px); }
.portal-product-v2 .portal-sidebar .axr-link.is-active::before {
  transition: opacity 180ms ease;
  animation: axrRailIn 220ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes axrRailIn { from { transform: scaleY(0.3); opacity: 0; } to { transform: none; opacity: 1; } }
.portal-product-v2 .portal-sidebar .axr-link.is-active::before { transform-origin: center; }

/* ==================================================
   4/6. PROGRESS FILL REVEALS -- scaleX, width untouched
   ================================================== */
.cashback-experience .cbk-rank-rail .portal-progress > span,
.cashback-experience .cbk-hero-next-progress .portal-progress > span,
.cashback-experience .cbk-bonus-track > i {
  transform-origin: left center;
  animation: axFillReveal 720ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
.cashback-experience .cbk-bonus-summary .cbk-bonus-widget:nth-child(2) .cbk-bonus-track > i { animation-delay: 110ms; }
@keyframes axFillReveal { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* Performance rank rail + its marker */
.pfx .pfx-rail-track i { transform-origin: left center; animation: axFillReveal 720ms cubic-bezier(0.22, 1, 0.36, 1) both; }
.pfx .pfx-rail-track::after { animation: axPointIn 340ms cubic-bezier(0.22, 1, 0.36, 1) 420ms both; }
@keyframes axPointIn { from { transform: translate(50%, -50%) scale(0.2); opacity: 0; } to { transform: translate(50%, -50%) scale(1); opacity: 1; } }

/* ==================================================
   5. VERIFIED ACTIVITY -> REWARD LIFECYCLE STAGGER
   Reveals the six existing stages in order, once. State classes
   (is-populated / is-empty) are unchanged -- nothing is simulated.
   ================================================== */
.cashback-experience .cashback-lifecycle .cbf-stage {
  animation: axStageIn 380ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
.cashback-experience .cashback-lifecycle .cbf-stage:nth-child(1) { animation-delay: 0ms; }
.cashback-experience .cashback-lifecycle .cbf-stage:nth-child(2) { animation-delay: 70ms; }
.cashback-experience .cashback-lifecycle .cbf-stage:nth-child(3) { animation-delay: 140ms; }
.cashback-experience .cashback-lifecycle .cbf-stage:nth-child(4) { animation-delay: 210ms; }
.cashback-experience .cashback-lifecycle .cbf-stage:nth-child(5) { animation-delay: 280ms; }
.cashback-experience .cashback-lifecycle .cbf-stage:nth-child(6) { animation-delay: 350ms; }
@keyframes axStageIn { from { transform: translateY(7px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ==================================================
   8. METRIC / MONEY REVEALS -- reveal, never interpolate
   ================================================== */
.pfx .pfx-primary strong,
.pfx .pfx-rank-value,
.pfl .pfl-you-rank,
.pov .pov-bridge-money,
.pov .pov-bridge-rank,
.cashback-experience.pfx .pfx-primary strong {
  animation: axValueIn 400ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
@keyframes axValueIn { from { transform: translateY(6px); opacity: 0; } to { transform: none; opacity: 1; } }

/* Instrument cluster stagger (Performance + Overview) */
.pfx .pfx-instruments .pfx-inst { animation: axValueIn 360ms cubic-bezier(0.22, 1, 0.36, 1) both; }
.pfx .pfx-instruments .pfx-inst:nth-child(1) { animation-delay: 0ms; }
.pfx .pfx-instruments .pfx-inst:nth-child(2) { animation-delay: 55ms; }
.pfx .pfx-instruments .pfx-inst:nth-child(3) { animation-delay: 110ms; }
.pfx .pfx-instruments .pfx-inst:nth-child(4) { animation-delay: 165ms; }
.pfx .pfx-instruments .pfx-inst:nth-child(5) { animation-delay: 220ms; }
.pfx .pfx-instruments .pfx-inst:nth-child(6) { animation-delay: 275ms; }

/* ==================================================
   7. TIER / MILESTONE MOMENT -- single restrained sweep
   Fires only on the existing `is-reached` state; no new state.
   ================================================== */
.cashback-experience .cbk-bonus-widget.is-reached { position: relative; overflow: hidden; }
.cashback-experience .cbk-bonus-widget.is-reached::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: -40%; width: 34%; pointer-events: none;
  background: linear-gradient(100deg, transparent, rgba(131, 216, 174, 0.13), transparent);
  animation: axMilestoneSweep 600ms ease-out 260ms both;
}
@keyframes axMilestoneSweep { from { transform: translateX(0); } to { transform: translateX(420%); } }

/* ==================================================
   10. LEADERBOARD -- signed-in row + reward chip entrance
   ================================================== */
.pfl .leaderboard-row.is-you { animation: axRowIn 420ms cubic-bezier(0.22, 1, 0.36, 1) 180ms both; }
@keyframes axRowIn { from { background-color: transparent; border-color: transparent; } to { background-color: rgba(103, 232, 249, 0.07); border-color: rgba(126, 211, 241, 0.28); } }
.pfl .pfl-pod-reward { animation: axValueIn 340ms cubic-bezier(0.22, 1, 0.36, 1) 260ms both; }

/* ==================================================
   9. PERFORMANCE -- reward card status reveal
   ================================================== */
.pfx .pfx-reward-state { animation: axValueIn 380ms cubic-bezier(0.22, 1, 0.36, 1) 140ms both; }

/* ==================================================
   11. CASHBACK AMBIENT DETAIL -- one slow, faint drift
   Reuses the existing decorative .pfx-hero-grid element; only
   background-position moves (cheap, no layout, no repaint of text).
   ================================================== */
.cashback-experience.pfx .pfx-hero-grid {
  animation: axAmbientDrift 34s linear infinite;
  opacity: 0.5;
}
@keyframes axAmbientDrift { from { background-position: 0 0, 0 0; } to { background-position: 34px 34px, 34px 34px; } }

/* ==================================================
   12. REDUCED MOTION -- one authoritative override
   ================================================== */
@media (prefers-reduced-motion: reduce) {
  .portal-product-v2 .portal-sidebar .nav-item .axr-glyph,
  .portal-product-v2 .portal-sidebar .axr-link.is-active::before,
  .cashback-experience .cbk-rank-rail .portal-progress > span,
  .cashback-experience .cbk-hero-next-progress .portal-progress > span,
  .cashback-experience .cbk-bonus-track > i,
  .pfx .pfx-rail-track i,
  .pfx .pfx-rail-track::after,
  .cashback-experience .cashback-lifecycle .cbf-stage,
  .pfx .pfx-primary strong,
  .pfx .pfx-rank-value,
  .pfl .pfl-you-rank,
  .pov .pov-bridge-money,
  .pov .pov-bridge-rank,
  .cashback-experience.pfx .pfx-primary strong,
  .pfx .pfx-instruments .pfx-inst,
  .cashback-experience .cbk-bonus-widget.is-reached::after,
  .pfl .leaderboard-row.is-you,
  .pfl .pfl-pod-reward,
  .pfx .pfx-reward-state,
  .cashback-experience.pfx .pfx-hero-grid {
    /* animation:none restores each element's base CSS, which is already the
       correct final state (scaleX(1) fills, untranslated rows). `transform`
       is deliberately NOT reset here: .pfx-rail-track::after uses a
       functional translate(50%,-50%) for positioning that must survive. */
    animation: none !important;
    transition: none !important;
  }
  .portal-product-v2 .portal-sidebar .axr-link:hover .axr-glyph { transform: none; }
}

/* ==============================================================
   AUREX -- Motion visibility fix (live-verified).
   FINDING 1: the previous motion block targeted
   `.portal-product-v2 .portal-sidebar .nav-item ...`, but the
   accepted sidebar rebuild replaced `nav-item` with `axr-link`.
   Live DOM check: `.portal-sidebar .nav-item` matches 0 elements,
   so every sidebar motion rule was dead. Retargeted below.
   FINDING 2: Cashback motion WAS applying (verified computed
   animation-name/duration on real probes) but the amplitude was
   too small to read. Durations already sat inside the requested
   ranges, so this block increases DISTANCE/CONTRAST, not time.
   Progress still animates scaleX only -- authoritative inline
   width is never touched. Append-only.
   ============================================================== */

/* ==================================================
   SIDEBAR -- retargeted to .axr-link + stronger states
   ================================================== */
.portal-product-v2 .portal-sidebar .axr-link {
  transition: background-color 170ms ease, border-color 170ms ease, box-shadow 170ms ease;
}
.portal-product-v2 .portal-sidebar .axr-link .axr-glyph {
  transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
}
.portal-product-v2 .portal-sidebar .axr-link .axr-glyph svg { transition: color 170ms ease, opacity 170ms ease; }
.portal-product-v2 .portal-sidebar .axr-link .axr-label { transition: color 170ms ease; }

/* Hover: visible surface + 2px icon shift + brighter glyph/text */
.portal-product-v2 .portal-sidebar .axr-link:hover {
  background: rgba(103, 232, 249, 0.06);
  border-color: rgba(126, 211, 241, 0.2);
}
.portal-product-v2 .portal-sidebar .axr-link:hover .axr-glyph { transform: translateX(2px); }
.portal-product-v2 .portal-sidebar .axr-link:hover .axr-glyph svg { color: rgb(var(--axr-accent, 150, 176, 208)); }
.portal-product-v2 .portal-sidebar .axr-link:hover .axr-label { color: #f4fbff; }

/* Active: clearly stronger surface, brighter rail, inner cyan edge */
.portal-product-v2 .portal-sidebar .axr-link.is-active {
  background:
    linear-gradient(97deg,
      rgba(var(--axr-accent, 150, 176, 208), 0.22) 0%,
      rgba(var(--axr-accent, 150, 176, 208), 0.075) 42%,
      rgba(255, 255, 255, 0.015) 74%,
      transparent 100%);
  border-color: rgba(var(--axr-accent, 150, 176, 208), 0.32);
  box-shadow:
    inset 0 0 0 1px rgba(var(--axr-accent, 150, 176, 208), 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.07);
}
.portal-product-v2 .portal-sidebar .axr-link.is-active::before {
  width: 2.5px;
  box-shadow: 0 0 8px -1px rgba(var(--axr-accent, 150, 176, 208), 0.7);
  animation: axrRailIn 240ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
.portal-product-v2 .portal-sidebar .axr-link.is-active .axr-glyph svg { opacity: 1; }

/* ==================================================
   STRONGER REVEAL AMPLITUDES (durations unchanged)
   ================================================== */
@keyframes axValueInStrong {
  from { transform: translateY(14px) scale(0.965); opacity: 0; }
  to { transform: none; opacity: 1; }
}
@keyframes axStageInStrong {
  from { transform: translateY(14px); opacity: 0; }
  to { transform: none; opacity: 1; }
}

.pfx .pfx-primary strong,
.pfx .pfx-rank-value,
.pfl .pfl-you-rank,
.pov .pov-bridge-money,
.pov .pov-bridge-rank,
.cashback-experience.pfx .pfx-primary strong {
  animation-name: axValueInStrong;
  animation-duration: 440ms;
}
.pfx .pfx-instruments .pfx-inst { animation-name: axValueInStrong; animation-duration: 460ms; }

.cashback-experience .cashback-lifecycle .cbf-stage {
  animation-name: axStageInStrong;
  animation-duration: 440ms;
}
.cashback-experience .cashback-lifecycle .cbf-stage:nth-child(2) { animation-delay: 90ms; }
.cashback-experience .cashback-lifecycle .cbf-stage:nth-child(3) { animation-delay: 180ms; }
.cashback-experience .cashback-lifecycle .cbf-stage:nth-child(4) { animation-delay: 270ms; }
.cashback-experience .cashback-lifecycle .cbf-stage:nth-child(5) { animation-delay: 360ms; }
.cashback-experience .cashback-lifecycle .cbf-stage:nth-child(6) { animation-delay: 450ms; }

/* Progress fills: longer, more deliberate travel (scaleX only) */
.cashback-experience .cbk-rank-rail .portal-progress > span,
.cashback-experience .cbk-hero-next-progress .portal-progress > span,
.cashback-experience .cbk-bonus-track > i,
.pfx .pfx-rail-track i {
  animation-duration: 860ms;
  animation-delay: 120ms;
}
.cashback-experience .cbk-bonus-summary .cbk-bonus-widget:nth-child(2) .cbk-bonus-track > i { animation-delay: 260ms; }

/* Hero surface resolve, then figure reveal */
.cashback-experience.pfx .pfx-hero { animation: axHeroResolve 420ms cubic-bezier(0.22, 1, 0.36, 1) both; }
@keyframes axHeroResolve { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.cashback-experience.pfx .pfx-primary strong { animation-delay: 160ms; }

/* Milestone sweep: brighter, still one-shot */
.cashback-experience .cbk-bonus-widget.is-reached::after {
  background: linear-gradient(100deg, transparent, rgba(131, 216, 174, 0.24), transparent);
  animation-duration: 640ms;
}

/* ==================================================
   AMBIENT DETAIL -- perceptible but slow and faint
   ================================================== */
.cashback-experience.pfx .pfx-hero-grid {
  animation-duration: 24s;
  opacity: 0.62;
}

/* ==================================================
   REDUCED MOTION
   ================================================== */
@media (prefers-reduced-motion: reduce) {
  .portal-product-v2 .portal-sidebar .axr-link,
  .portal-product-v2 .portal-sidebar .axr-link .axr-glyph,
  .portal-product-v2 .portal-sidebar .axr-link .axr-glyph svg,
  .portal-product-v2 .portal-sidebar .axr-link .axr-label,
  .portal-product-v2 .portal-sidebar .axr-link.is-active::before,
  .cashback-experience.pfx .pfx-hero,
  .cashback-experience.pfx .pfx-hero-grid {
    animation: none !important;
    transition: none !important;
  }
  .portal-product-v2 .portal-sidebar .axr-link:hover .axr-glyph { transform: none; }
}

/* ==============================================================
   AUREX -- Authenticated sidebar + Leaderboard motion V3.
   Targets the LIVE .axr-link / .axr-glyph structure only (verified
   in the running portal: 11 .axr-link, 0 .nav-item). No dead
   .nav-item selector is used or relied on here. Append-only.
   ============================================================== */

/* ==================================================
   2. CORPORATE ICON CONTAINER
   Small, square, low-contrast -- a terminal frame, not a bubble.
   ================================================== */
.portal-product-v2 .portal-sidebar .axr-link { grid-template-columns: 27px minmax(0, 1fr); gap: 12px; }
.portal-product-v2 .portal-sidebar .axr-glyph {
  width: 27px; height: 27px; border-radius: 7px; box-sizing: border-box;
  display: grid; place-items: center;
  background: rgba(255, 255, 255, 0.018);
  border: 1px solid rgba(150, 176, 208, 0.16);
  transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1),
              border-color 170ms ease, background-color 170ms ease, box-shadow 170ms ease;
}
.portal-product-v2 .portal-sidebar .axr-glyph svg { width: 16px; height: 16px; }

.portal-product-v2 .portal-sidebar .axr-link:hover .axr-glyph {
  transform: translateX(2px);
  border-color: rgba(var(--axr-accent, 150, 176, 208), 0.4);
  background: rgba(var(--axr-accent, 150, 176, 208), 0.07);
}
.portal-product-v2 .portal-sidebar .axr-link.is-active .axr-glyph {
  border-color: rgba(var(--axr-accent, 150, 176, 208), 0.55);
  background: rgba(var(--axr-accent, 150, 176, 208), 0.14);
  box-shadow: inset 0 0 0 1px rgba(var(--axr-accent, 150, 176, 208), 0.12),
              0 0 10px -3px rgba(var(--axr-accent, 150, 176, 208), 0.55);
}

/* ==================================================
   3. SECTION HIERARCHY -- quieter, more spaced
   ================================================== */
.portal-product-v2 .portal-sidebar .axr-nav { gap: 6px; }
.portal-product-v2 .portal-sidebar .axr-group { padding-bottom: 15px; }
.portal-product-v2 .portal-sidebar .axr-group-label {
  padding: 14px 10px 9px;
  font-size: 0.505rem; font-weight: 800; letter-spacing: 0.26em;
  color: rgba(146, 172, 202, 0.38);
}
.portal-product-v2 .portal-sidebar .axr-group:first-child .axr-group-label { padding-top: 6px; }

/* ==================================================
   4. BRAND BLOCK -- subtle refinement only
   ================================================== */
.portal-product-v2 .portal-sidebar .axr-brand { padding-bottom: 22px; margin-bottom: 10px; }
.portal-product-v2 .portal-sidebar .axr-mark { border-radius: 10px; }
.portal-product-v2 .portal-sidebar .axr-kicker { letter-spacing: 0.23em; color: rgba(133, 200, 240, 0.62); }
.portal-product-v2 .portal-sidebar .axr-sub { letter-spacing: 0.19em; color: rgba(146, 172, 202, 0.45); }

/* ==================================================
   5. ACTIVE ROUTE MOTION -- 180-240ms resolve
   ================================================== */
.portal-product-v2 .portal-sidebar .axr-link.is-active { animation: axrRowResolve 200ms ease-out both; }
@keyframes axrRowResolve { from { background-color: transparent; } to { background-color: initial; } }
.portal-product-v2 .portal-sidebar .axr-link.is-active .axr-label { animation: axrLabelIn 200ms ease-out both; }
@keyframes axrLabelIn { from { opacity: 0.62; } to { opacity: 1; } }

/* ==================================================
   6/13. LEADERBOARD HERO -- the ONE ambient animation
   ================================================== */
.pfl .pfx-hero-grid {
  animation: axAmbientDrift 30s linear infinite;
  opacity: 0.55;
}

/* ==================================================
   7. PODIUM ENTRANCE -- #1 first, then #2, then #3
   Source order is #2,#1,#3 (visual podium), so delays are
   assigned per place class, not per DOM position.
   ================================================== */
.pfl .pfl-pod { animation: pflPodRiseV3 380ms cubic-bezier(0.22, 1, 0.36, 1) both; }
.pfl .pfl-pod-1 { animation-delay: 0ms; animation-duration: 420ms; }
.pfl .pfl-pod-2 { animation-delay: 70ms; }
.pfl .pfl-pod-3 { animation-delay: 140ms; }
@keyframes pflPodRiseV3 { from { transform: translateY(16px); opacity: 0; } to { transform: none; opacity: 1; } }
.pfl .pfl-pod-1::after {
  content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
  background: linear-gradient(120deg, transparent 30%, rgba(233, 208, 154, 0.16) 50%, transparent 70%);
  animation: pflGoldSweep 700ms ease-out 260ms both;
}
@keyframes pflGoldSweep { from { opacity: 0; transform: translateX(-30%); } 40% { opacity: 1; } to { opacity: 0; transform: translateX(30%); } }

/* ==================================================
   8/12. YOUR POSITION -- panel resolve + gap rail
   ================================================== */
.pfl .pfl-you-card { animation: pflCardResolve 420ms cubic-bezier(0.22, 1, 0.36, 1) 120ms both; }
@keyframes pflCardResolve { from { transform: translateY(10px); opacity: 0; } to { transform: none; opacity: 1; } }
.pfl .pfl-you-facts > div { animation: pflFactIn 360ms ease-out both; }
.pfl .pfl-you-facts > div:nth-child(1) { animation-delay: 240ms; }
.pfl .pfl-you-facts > div:nth-child(2) { animation-delay: 300ms; }
.pfl .pfl-you-facts > div:nth-child(3) { animation-delay: 360ms; }
@keyframes pflFactIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.pfl .pfl-gap-rail {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 11px;
  margin-top: 4px;
}
.pfl .pfl-gap-you, .pfl .pfl-gap-top {
  font-size: 0.575rem; font-weight: 780; letter-spacing: 0.13em; text-transform: uppercase; white-space: nowrap;
}
.pfl .pfl-gap-you { color: rgba(146, 214, 240, 0.85); }
.pfl .pfl-gap-top { color: rgba(233, 208, 154, 0.85); }
.pfl .pfl-gap-track {
  position: relative; height: 3px; border-radius: 999px; background: rgba(140, 178, 214, 0.16); overflow: visible;
}
.pfl .pfl-gap-track i {
  position: absolute; inset: 0; border-radius: inherit; transform-origin: left center;
  background: linear-gradient(90deg, rgba(103, 232, 249, 0.75), rgba(214, 193, 122, 0.6));
  animation: axFillReveal 820ms cubic-bezier(0.22, 1, 0.36, 1) 320ms both;
}
.pfl .pfl-gap-track::after {
  content: ""; position: absolute; top: 50%; right: 0; width: 9px; height: 9px; border-radius: 50%;
  transform: translate(50%, -50%); background: #0a1524; border: 2px solid rgba(233, 208, 154, 0.9);
  animation: pflGapPoint 300ms cubic-bezier(0.22, 1, 0.36, 1) 900ms both;
}
@keyframes pflGapPoint { from { transform: translate(50%, -50%) scale(0.2); opacity: 0; } to { transform: translate(50%, -50%) scale(1); opacity: 1; } }

/* ==================================================
   9. CURRENT USER ROW -- one-time highlight, no pulsing
   ================================================== */
.pfl .leaderboard-row.is-you { animation: pflYouRowIn 460ms cubic-bezier(0.22, 1, 0.36, 1) 260ms both; }
@keyframes pflYouRowIn {
  from { background-color: rgba(103, 232, 249, 0); border-color: rgba(126, 211, 241, 0); box-shadow: none; }
  60% { background-color: rgba(103, 232, 249, 0.13); border-color: rgba(126, 211, 241, 0.45); }
  to { background-color: rgba(103, 232, 249, 0.07); border-color: rgba(126, 211, 241, 0.28); }
}
.pfl .pfl-you { animation: pflFactIn 340ms ease-out 520ms both; }

/* ==================================================
   10/11. ROW + REWARD MICRO-MOTION
   ================================================== */
.pfl .leaderboard-table .leaderboard-row:not(.leaderboard-head) { animation: pflRowIn 320ms ease-out both; }
.pfl .leaderboard-table .leaderboard-row:nth-child(2) { animation-delay: 40ms; }
.pfl .leaderboard-table .leaderboard-row:nth-child(3) { animation-delay: 80ms; }
.pfl .leaderboard-table .leaderboard-row:nth-child(4) { animation-delay: 120ms; }
.pfl .leaderboard-table .leaderboard-row:nth-child(5) { animation-delay: 160ms; }
.pfl .leaderboard-table .leaderboard-row:nth-child(n+6) { animation-delay: 200ms; }
@keyframes pflRowIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }

.pfl .pfl-pod-reward {
  position: relative; overflow: hidden;
  animation: pflFactIn 380ms cubic-bezier(0.22, 1, 0.36, 1) 300ms both;
}
.pfl .pfl-pod-reward::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: -50%; width: 40%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.16), transparent);
  animation: pflRewardSweep 450ms ease-out 620ms both;
}
@keyframes pflRewardSweep { from { transform: translateX(0); } to { transform: translateX(380%); } }

/* ==================================================
   14. REDUCED MOTION
   Functional transforms on ::after markers are preserved --
   only animation/transition are cleared.
   ================================================== */
@media (prefers-reduced-motion: reduce) {
  .portal-product-v2 .portal-sidebar .axr-glyph,
  .portal-product-v2 .portal-sidebar .axr-link.is-active,
  .portal-product-v2 .portal-sidebar .axr-link.is-active .axr-label,
  .pfl .pfx-hero-grid,
  .pfl .pfl-pod,
  .pfl .pfl-pod-1::after,
  .pfl .pfl-you-card,
  .pfl .pfl-you-facts > div,
  .pfl .pfl-gap-track i,
  .pfl .pfl-gap-track::after,
  .pfl .leaderboard-row.is-you,
  .pfl .pfl-you,
  .pfl .leaderboard-table .leaderboard-row:not(.leaderboard-head),
  .pfl .pfl-pod-reward,
  .pfl .pfl-pod-reward::after {
    animation: none !important;
    transition: none !important;
  }
  .portal-product-v2 .portal-sidebar .axr-link:hover .axr-glyph { transform: none; }
  .pfl .pfl-pod-1::after, .pfl .pfl-pod-reward::after { display: none; }
}

/* Specificity fix (live-verified): `.pfl .leaderboard-table .leaderboard-row
   :not(.leaderboard-head)` scores 0,4,0 and was overriding the 0,3,0
   `.pfl .leaderboard-row.is-you` rule, so the signed-in row received the
   generic entrance instead of its premium one-time highlight. Matching
   specificity and placing it later restores the intended treatment. */
.pfl .leaderboard-table .leaderboard-row.is-you {
  animation: pflYouRowIn 460ms cubic-bezier(0.22, 1, 0.36, 1) 260ms both;
}
@media (prefers-reduced-motion: reduce) {
  .pfl .leaderboard-table .leaderboard-row.is-you { animation: none !important; }
}

/* ==============================================================
   AUREX -- Final cinematic UI system pass.
   Live-inspected before writing: .axr-link x11, .axr-glyph x11,
   .axr-group x5, .portal-sidebar .nav-item x0 (dead, not used
   here). Targets only selectors confirmed present in the running
   authenticated shell. Append-only.
   ============================================================== */

/* ==================================================
   1. NEW ICON FAMILY -- optical sizing
   ================================================== */
.portal-product-v2 .portal-sidebar .axr-glyph svg { width: 18.5px; height: 18.5px; }

/* Leaderboard reads as platinum/gold ranking, not neutral steel */
.axr .axr-link[data-portal-route="leaderboard"] { --axr-accent: 222, 202, 156; }

/* ==================================================
   7/8. PODIUM -- real vertical hierarchy
   ================================================== */
.pfl .pfl-podium { align-items: end; gap: 14px; }
.pfl .pfl-pod { position: relative; overflow: hidden; }
.pfl .pfl-pod-lots { display: grid; gap: 2px; justify-items: center; }
.pfl .pfl-pod-lots small {
  font-size: 0.545rem; font-weight: 780; letter-spacing: 0.13em; text-transform: uppercase;
  color: rgba(150, 176, 208, 0.5);
}
.pfl .pfl-crown {
  display: grid; place-items: center; width: 26px; height: 26px; margin-bottom: 2px;
  color: rgba(233, 208, 154, 0.92);
}
.pfl .pfl-crown svg { width: 22px; height: 22px; }

/* #1 dominates: taller, brighter, richer material */
.pfl .pfl-pod-1 {
  padding-top: 20px; padding-bottom: 26px;
  border-color: rgba(226, 200, 130, 0.38);
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(233, 208, 154, 0.16), transparent 62%),
    linear-gradient(168deg, rgba(44, 36, 17, 0.62), rgba(8, 13, 22, 0.97) 66%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    0 26px 56px -32px rgba(214, 193, 122, 0.5);
}
.pfl .pfl-pod-1 .pfl-pod-rank { font-size: 0.95rem; color: #f0dcac; letter-spacing: 0.06em; }
.pfl .pfl-pod-1 .pfl-pod-name { font-size: 1.08rem; color: #fdf7ea; }
.pfl .pfl-pod-1 .pfl-pod-lots b { font-size: 1.62rem; color: #fdf6e6; letter-spacing: -0.03em; }
/* Restrained metallic edge that resolves once */
.pfl .pfl-pod-1::before {
  content: ""; position: absolute; inset: -1px; border-radius: inherit; padding: 1px; pointer-events: none;
  background: linear-gradient(140deg, rgba(240, 220, 170, 0.55), transparent 42%, transparent 62%, rgba(240, 220, 170, 0.3));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  animation: pflEdgeIn 620ms ease-out 240ms both;
}
@keyframes pflEdgeIn { from { opacity: 0; } to { opacity: 1; } }

.pfl .pfl-pod-2 { padding-bottom: 16px; border-color: rgba(196, 208, 222, 0.28); }
.pfl .pfl-pod-2 .pfl-pod-rank { color: #d3dde8; }
.pfl .pfl-pod-2 .pfl-pod-lots b { font-size: 1.24rem; }
.pfl .pfl-pod-3 { padding-bottom: 12px; border-color: rgba(206, 150, 96, 0.28); }
.pfl .pfl-pod-3 .pfl-pod-rank { color: #dca97c; }
.pfl .pfl-pod-3 .pfl-pod-lots b { font-size: 1.14rem; }

.pfl .pfl-pod.is-you { box-shadow: inset 0 0 0 1px rgba(126, 211, 241, 0.45), 0 20px 44px -30px rgba(0, 0, 0, 0.8); }
.pfl .pfl-pod-name em {
  font-style: normal; margin-left: 6px; padding: 2px 7px; border-radius: 4px;
  font-size: 0.53rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase;
  background: rgba(126, 211, 241, 0.18); color: #9fe6fb; vertical-align: middle;
}

/* ==================================================
   9/10/11. COMPETITION MODULE
   ================================================== */
.pfl .pfl-you-card { grid-template-columns: auto minmax(0, 1fr); row-gap: 16px; }
.pfl .pfl-you-rank { font-size: clamp(2.3rem, 5vw, 3.1rem); }
.pfl .pfl-you-facts { gap: 12px 34px; }
.pfl .pfl-you-facts strong { font-size: 1.22rem; }
.pfl .pfl-fact-chase strong { color: #f0dcac; }
.pfl .pfl-you-noreward { font-size: 0.8rem !important; font-weight: 600 !important; color: rgba(150, 176, 208, 0.6) !important; }

.pfl .pfl-gap-rail {
  grid-column: 1 / -1;
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px;
  padding-top: 14px; border-top: 1px solid rgba(140, 178, 214, 0.1);
}
.pfl .pfl-gap-end { display: grid; gap: 2px; }
.pfl .pfl-gap-end b {
  font-size: 0.575rem; font-weight: 800; letter-spacing: 0.13em; text-transform: uppercase;
  color: rgba(146, 214, 240, 0.85);
}
.pfl .pfl-gap-end i {
  font-style: normal; font-size: 0.98rem; font-weight: 730; color: #eaf5ff;
  font-variant-numeric: tabular-nums; letter-spacing: -0.02em;
}
.pfl .pfl-gap-end-top { text-align: right; justify-items: end; }
.pfl .pfl-gap-end-top b { color: rgba(233, 208, 154, 0.9); }
.pfl .pfl-gap-end-top i { color: #f6ecd4; }

.pfl .pfl-insight {
  grid-column: 1 / -1; margin: 0;
  font-size: 0.82rem; line-height: 1.55; color: rgba(200, 216, 234, 0.78);
  font-variant-numeric: tabular-nums;
}
.pfl .pfl-you-card .secondary-button { grid-column: 1 / -1; justify-self: start; }

/* ==================================================
   16. OVERVIEW -- one connected instrument cluster
   ================================================== */
.pov .pfx-instruments .pfx-inst:nth-child(1) strong { color: #a9ecc9; }
.pov .pfx-instruments .pfx-inst:nth-child(2) strong { color: #e6edf6; }
.pov .pfx-instruments .pfx-inst:nth-child(3) strong { color: #b6f0d3; }
.pov .pfx-instruments .pfx-inst:nth-child(4) strong { color: #ecd8a8; }
.pov .pfx-instruments .pfx-inst:nth-child(5) strong { color: #a9dcec; }
.pov .pfx-instruments .pfx-inst:nth-child(6) strong { color: #d9e2ee; }
.pov .pfx-instruments .pfx-inst strong { font-size: 1.36rem; }

/* ==================================================
   17. NEXT ACTIONS -- numbered priority queue
   ================================================== */
.pov .pov-action-list { counter-reset: povq; gap: 0; }
.pov .pov-action-list li { counter-increment: povq; border-bottom: 1px solid rgba(140, 178, 214, 0.08); }
.pov .pov-action-list li:last-child { border-bottom: 0; }
.pov .pov-action-list a {
  grid-template-columns: 2.1rem minmax(0, 1fr) auto; gap: 14px; padding: 14px 10px; border-radius: 8px;
}
.pov .pov-action-list a::before {
  content: counter(povq, decimal-leading-zero);
  font-size: 0.7rem; font-weight: 800; letter-spacing: 0.08em;
  color: rgba(126, 211, 241, 0.55); font-variant-numeric: tabular-nums;
}
.pov .pov-action-body strong {
  font-size: 0.815rem; font-weight: 720; letter-spacing: 0.055em; text-transform: uppercase; color: #eef5fb;
}
.pov .pov-action-body small { font-size: 0.735rem; }

/* Recommendation: serious, not a game badge */
.pov .pov-recommendation .client-recommendation-panel .portal-status-pill,
.pov .pov-recommendation .client-recommendation-panel .status-pill {
  font-size: 0.585rem; font-weight: 780; letter-spacing: 0.1em; text-transform: uppercase; box-shadow: none;
}

/* ==================================================
   24. RESPONSIVE
   ================================================== */
@media (max-width: 900px) {
  .pfl .pfl-you-card { grid-template-columns: 1fr; }
  .pfl .pfl-gap-rail { grid-template-columns: 1fr; gap: 10px; }
  .pfl .pfl-gap-end-top { text-align: left; justify-items: start; }
}
@media (max-width: 720px) {
  /* Podium stacks #1, #2, #3 */
  .pfl .pfl-pod-1 { order: -1; padding-top: 18px; padding-bottom: 16px; }
  .pfl .pfl-crown { margin: 0 0 0 auto; }
  .pfl .pfl-pod-lots { justify-items: start; }
  .pfl .pfl-pod-1 .pfl-pod-lots b { font-size: 1.34rem; }
}
@media (max-width: 430px) {
  .pfl .pfl-you-rank { font-size: 2.1rem; }
  .pfl .pfl-you-facts strong { font-size: 1.06rem; }
  .pov .pfx-instruments .pfx-inst strong { font-size: 1.14rem; }
  .pov .pov-action-list a { grid-template-columns: 1.8rem minmax(0, 1fr) auto; gap: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .pfl .pfl-pod-1::before { animation: none !important; }
}

/* Final client terminal polish: presentation-only, existing values/hooks. */
.portal-body .axh .axh-membership {
  display: grid; gap: 2px; min-width: 104px; padding-left: 12px;
  border-left: 1px solid rgba(140, 178, 214, 0.16);
}
.portal-body .axh .axh-membership span {
  color: rgba(150, 176, 208, 0.56); font-size: 0.56rem; font-weight: 720;
  letter-spacing: 0.12em; text-transform: uppercase;
}
.portal-body .axh .axh-membership strong {
  color: #b6f0d3; font-size: 0.68rem; font-weight: 720;
  letter-spacing: 0.075em; text-transform: uppercase;
}
.cashback-experience .cashback-signature {
  grid-template-columns: 1.25fr repeat(4, minmax(0, 1fr));
}
.cashback-experience .cbk-hero-activity {
  box-shadow: inset 0 2px 0 rgba(145, 222, 243, 0.48);
}
.cashback-experience .cbk-hero-activity > strong { color: #c4edf9; }
.cashback-experience .cashback-signature .cbk-hero-metric { min-height: 116px; }
@media (max-width: 1080px) {
  .cashback-experience .cashback-signature { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cashback-experience .cashback-signature .cbk-hero-available { grid-column: span 2; }
}
@media (max-width: 900px) {
  .portal-body .axh .axh-membership { display: none; }
  .portal-body .axh .axh-heading > p:last-child { display: none; }
}
@media (max-width: 560px) {
  .cashback-experience .cashback-signature { grid-template-columns: 1fr; }
  .cashback-experience .cashback-signature .cbk-hero-available { grid-column: auto; }
  .cashback-experience .cashback-signature .cbk-hero-metric { min-height: 88px; }
}

/* Final Cashback recomposition: one balance-led experience, existing values/hooks. */
.cashback-experience .cbk-hero-available {
  align-content: start;
}
.cashback-experience .cbk-hero-available #requestCashbackPayout {
  justify-self: start;
  margin-top: 5px;
}
.cashback-experience .cashback-lifecycle {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0;
  padding: 0;
  border: 1px solid rgba(140, 178, 214, 0.14);
  border-radius: 14px;
  overflow: hidden;
  background: rgba(7, 14, 25, 0.72);
}
.cashback-experience .cashback-lifecycle .cbf-stage {
  min-height: 126px;
  padding: 17px 14px 15px;
  border: 0;
  border-right: 1px solid rgba(140, 178, 214, 0.12);
  border-radius: 0;
}
.cashback-experience .cashback-lifecycle .cbf-stage:last-child { border-right: 0; }
.cashback-experience .cashback-lifecycle .cbf-stage:not(:last-child)::after {
  right: -5px;
  z-index: 2;
}
.cashback-experience .cbk-request-location {
  margin: 14px 0 0;
  color: rgba(150, 176, 208, 0.6);
  font-size: 0.72rem;
}
.cashback-experience .cbk-ecosystem-bridge {
  display: grid;
  gap: 12px;
  margin: 2px 0 14px;
  padding: 16px 18px;
  border: 1px solid rgba(140, 178, 214, 0.12);
  border-radius: 14px;
  background: rgba(7, 14, 25, 0.52);
}
.cashback-experience .cbk-ecosystem-bridge .cbk-group-eyebrow { margin: 0; }
.cashback-experience .cbk-ecosystem-rail {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: rgba(214, 228, 242, 0.78);
  font-size: 0.66rem;
  font-weight: 760;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.cashback-experience .cbk-ecosystem-rail i {
  color: rgba(145, 222, 243, 0.55);
  font-style: normal;
}
.cashback-experience .cbk-ecosystem-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
@media (max-width: 1080px) {
  .cashback-experience .cashback-lifecycle { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .cashback-experience .cashback-lifecycle .cbf-stage:nth-child(3) { border-right: 0; }
  .cashback-experience .cashback-lifecycle .cbf-stage:nth-child(-n + 3) { border-bottom: 1px solid rgba(140, 178, 214, 0.12); }
}
@media (max-width: 680px) {
  .cashback-experience .cashback-lifecycle { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cashback-experience .cashback-lifecycle .cbf-stage:nth-child(3) { border-right: 1px solid rgba(140, 178, 214, 0.12); }
  .cashback-experience .cashback-lifecycle .cbf-stage:nth-child(2n) { border-right: 0; }
  .cashback-experience .cashback-lifecycle .cbf-stage:nth-child(n + 3) { border-bottom: 1px solid rgba(140, 178, 214, 0.12); }
  .cashback-experience .cbk-ecosystem-rail { align-items: flex-start; flex-direction: column; gap: 6px; }
  .cashback-experience .cbk-ecosystem-rail i { display: none; }
}
@media (max-width: 480px) {
  .cashback-experience .cashback-lifecycle { grid-template-columns: 1fr; }
  .cashback-experience .cashback-lifecycle .cbf-stage,
  .cashback-experience .cashback-lifecycle .cbf-stage:nth-child(3) { border-right: 0; border-bottom: 1px solid rgba(140, 178, 214, 0.12); }
  .cashback-experience .cashback-lifecycle .cbf-stage:last-child { border-bottom: 0; }
}

/* Keep the payout ledger bounded while leaving its header and every row intact. */
.cashback-experience .cashback-history-card .cbk-payout-list {
  max-height: 360px;
  overflow-y: auto;
  overflow-x: hidden;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(145, 222, 243, 0.55) rgba(140, 178, 214, 0.08);
  scrollbar-gutter: stable;
  padding: 2px 8px 2px 2px;
}
.cashback-experience .cashback-history-card .cbk-payout-list::-webkit-scrollbar { width: 7px; }
.cashback-experience .cashback-history-card .cbk-payout-list::-webkit-scrollbar-track {
  background: rgba(140, 178, 214, 0.08);
  border-radius: 999px;
}
.cashback-experience .cashback-history-card .cbk-payout-list::-webkit-scrollbar-thumb {
  background: rgba(145, 222, 243, 0.5);
  border: 2px solid rgba(7, 14, 25, 0.78);
  border-radius: 999px;
}
.cashback-experience .cashback-history-card .cbk-payout-list::-webkit-scrollbar-thumb:hover {
  background: rgba(145, 222, 243, 0.74);
}
@media (max-width: 560px) {
  .cashback-experience .cashback-history-card .cbk-payout-list {
    max-height: 300px;
    padding-right: 6px;
  }
}

/* AUREX monogram: shared geometry across active portal, admin, and entry shells. */
.aurex-mark-svg { display: block; width: 100%; height: 100%; }
.public-brand span .aurex-mark-svg { width: 24px; height: 24px; }
.portal-mobile-mark .aurex-mark-svg { width: 22px; height: 22px; }
.portal-body .pce-brand-mark .aurex-mark-svg { width: 25px; height: 25px; }
.admin-brand-lockup .brand-mark .aurex-mark-svg { width: 42px; height: 42px; }
.admin-intelligence-body .ax-auth-mark .aurex-mark-svg { width: 28px; height: 28px; }

/* ==================================================
   AUTH EXPERIENCE -- clear access hierarchy
   Presentation only: existing form IDs and auth handlers stay intact.
   ================================================== */
.portal-body .pce-access-inner { gap: 20px; }
.portal-body .pce-heading h1 { max-width: 15ch; }
.portal-body .pce-form { gap: 14px; }
.portal-body .pce-form > label { gap: 8px; color: rgba(220, 235, 252, 0.76); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
.portal-body .pce-form > label input { min-height: 48px; border-color: rgba(142, 193, 232, 0.22); background: rgba(1, 8, 18, 0.72); }
.portal-body .pce-form > label input:focus { border-color: rgba(127, 216, 247, 0.72); box-shadow: 0 0 0 3px rgba(127, 216, 247, 0.12); }
.portal-body .pce-login-links { display: flex; align-items: center; gap: 9px; margin-top: -5px; color: rgba(163, 190, 220, 0.58); font-size: 0.76rem; }
.portal-body .pce-login-links a { color: #a8dff4; text-decoration: none; }
.portal-body .pce-login-links a:hover { color: #f2fbff; text-decoration: underline; text-underline-offset: 3px; }
.portal-body .pce-login-links a:first-child { color: rgba(214, 226, 242, 0.72); }
.portal-body .portal-login-submit { min-height: 54px; font-size: 0.92rem; letter-spacing: 0.08em; text-transform: uppercase; }
.portal-body .portal-entry-status { margin-top: -2px; }
.registration-password-field { position: relative; display: block; }
.registration-password-field input { padding-right: 72px !important; }
.registration-password-toggle { position: absolute; top: 50%; right: 8px; min-height: 34px; padding: 0 9px; transform: translateY(-50%); border: 0; background: transparent; color: #9bdcf2; font-size: 0.7rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; cursor: pointer; }
.registration-password-toggle:hover { color: #f0fbff; }
.registration-password-toggle:focus-visible { outline: 2px solid #7cdeff; outline-offset: 2px; }
.registration-card input { min-height: 46px; }
.registration-card-head { align-items: center; }
.registration-badge { letter-spacing: 0.06em; text-transform: uppercase; }
.registration-submit { min-height: 54px; letter-spacing: 0.04em; text-transform: uppercase; }
.registration-success-note { color: #8fa8c1; font-size: 0.78rem; line-height: 1.55; }
.registration-success-note a { color: #9bdff4; }
.ax-auth-links { display: flex; align-items: center; gap: 9px; margin-top: 3px; color: rgba(162, 190, 220, 0.56); font-size: 0.76rem; }
.ax-auth-links a { color: #9ddff4; text-decoration: none; }
.ax-auth-links a:hover { color: #f3fbff; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 900px) {
  .portal-body .pce-heading h1 { max-width: 20ch; }
  .portal-body .pce-login-links { margin-top: 0; }
}
@media (max-width: 520px) {
  .portal-body .pce-access { padding: 24px 18px 36px; }
  .portal-body .pce-access-inner { gap: 17px; }
  .portal-body .pce-heading h1 { font-size: 1.62rem; }
  .portal-body .pce-login-links { flex-wrap: wrap; }
  .registration-shell { width: min(100% - 24px, 620px); padding: 24px 0 32px; }
  .registration-intro h1 { font-size: clamp(2.2rem, 12vw, 3.2rem); }
}

/* Portal QA pass: keep every route inside the shared terminal frame. */
.portal-body.portal-product-v2 { overflow-x: hidden; }
.portal-product-v2 .portal-main,
.portal-product-v2 .portal-route-content,
.portal-product-v2 .portal-route-content > *,
.portal-product-v2 .portal-route-content :is(.portal-page-hero, .portal-service-header, .portal-topbar) > * { min-width: 0; }
.portal-product-v2 .portal-main :is(.primary-button, .secondary-button, .compact-action) {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
}
.portal-product-v2 .portal-main :is(input, select, textarea) { box-sizing: border-box; max-width: 100%; }
.portal-product-v2 .portal-main :is(button, a, select, input, textarea):focus-visible {
  outline: 2px solid rgba(130, 218, 244, 0.78); outline-offset: 2px;
}
@media (max-width: 680px) {
  .portal-product-v2 .portal-main .portal-topbar { gap: 12px; }
  .portal-product-v2 .portal-main .portal-topbar-actions { min-width: 0; flex-wrap: wrap; }
  .portal-product-v2 .portal-main .portal-page-actions > * { flex: 1 1 160px; }
}

/* ============================================================
   AUREX MOBILE CLIENT TERMINAL
   The desktop shell remains unchanged; these rules replace only the
   compact-phone navigation and composition at authenticated widths.
   ============================================================ */
.portal-mobile-menu,
.portal-mobile-avatar,
.portal-mobile-drawer,
.portal-mobile-drawer-backdrop { display: none; }

@media (max-width: 820px) {
  .portal-body.portal-product-v2 {
    --portal-mtop-h: 58px;
    overflow-x: hidden;
  }
  .portal-body.portal-product-v2.portal-mobile-drawer-open { overflow: hidden; }
  .portal-body.portal-product-v2 .portal-main {
    padding: calc(var(--portal-mtop-h) + 16px) clamp(14px, 4.2vw, 18px) 24px;
  }
  .portal-body.portal-product-v2 .portal-main .portal-topbar { display: none; }
  .portal-body.portal-product-v2 .portal-bottom-nav { display: none; }
  .portal-body.portal-product-v2:not(.portal-secure-gated) .portal-mobile-topbar {
    display: grid;
    grid-template-columns: 40px 1fr auto;
    gap: 10px;
    align-items: center;
    height: var(--portal-mtop-h);
    padding: 0 14px;
  }
  .portal-mobile-menu,
  .portal-mobile-bell {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 11px;
    color: var(--muted-strong);
    background: rgba(255, 255, 255, 0.035);
    cursor: pointer;
  }
  .portal-mobile-menu svg,
  .portal-mobile-bell svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
  .portal-mobile-bell svg { fill: currentColor; stroke: none; }
  .portal-mobile-brand { min-width: 0; gap: 9px; }
  .portal-mobile-mark { width: 30px; height: 30px; border-radius: 9px; }
  .portal-mobile-wordmark { font-size: 0.88rem; }
  .portal-mobile-actions { display: flex; align-items: center; gap: 8px; }
  .portal-mobile-avatar {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border: 1px solid rgba(121, 223, 246, 0.28);
    border-radius: 50%;
    color: var(--cyan);
    background: rgba(121, 223, 246, 0.08);
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.04em;
  }
  .portal-body.portal-product-v2 .portal-mobile-drawer-backdrop {
    position: fixed;
    inset: 0;
    z-index: 90;
    display: block;
    background: rgba(2, 7, 16, 0.64);
    opacity: 0;
    pointer-events: none;
    transition: opacity 220ms ease;
  }
  .portal-body.portal-product-v2 .portal-mobile-drawer {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 91;
    display: flex;
    flex-direction: column;
    width: min(286px, 86vw);
    padding: max(16px, env(safe-area-inset-top, 0px)) 14px max(14px, env(safe-area-inset-bottom, 0px));
    border-right: 1px solid var(--line-strong);
    background: linear-gradient(180deg, rgba(9, 22, 41, 0.99), rgba(4, 11, 23, 0.99));
    box-shadow: 24px 0 60px rgba(0, 0, 0, 0.42);
    transform: translateX(-102%);
    transition: transform 240ms cubic-bezier(0.22, 0.7, 0.2, 1);
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .portal-body.portal-product-v2.portal-mobile-drawer-open .portal-mobile-drawer-backdrop {
    opacity: 1;
    pointer-events: auto;
  }
  .portal-body.portal-product-v2.portal-mobile-drawer-open .portal-mobile-drawer { transform: translateX(0); }
  .portal-mobile-drawer-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 4px 2px 18px;
    border-bottom: 1px solid var(--line);
  }
  .portal-mobile-drawer-head > div { display: grid; gap: 4px; }
  .portal-mobile-drawer-kicker,
  .portal-mobile-drawer-foot > span {
    color: var(--gold);
    font-size: 0.62rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
  }
  .portal-mobile-drawer-head strong { color: var(--text); font-size: 0.96rem; }
  .portal-mobile-drawer-close {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    flex: 0 0 auto;
    border: 1px solid var(--line);
    border-radius: 11px;
    color: var(--muted-strong);
    background: rgba(255, 255, 255, 0.035);
    cursor: pointer;
  }
  .portal-mobile-drawer-close svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
  .portal-mobile-drawer-nav { display: grid; gap: 16px; padding: 18px 0; }
  .portal-mobile-drawer-nav .axr-group { display: grid; gap: 5px; }
  .portal-mobile-drawer-nav .axr-group-label {
    padding: 0 10px 4px;
    color: var(--muted);
    font-size: 0.61rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
  }
  .portal-mobile-drawer-nav .axr-link {
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 44px;
    padding: 9px 10px;
    border-radius: 10px;
    color: var(--muted-strong);
    text-decoration: none;
    font-size: 0.84rem;
    font-weight: 650;
  }
  .portal-mobile-drawer-nav .axr-link.is-active { color: var(--cyan); background: rgba(121, 223, 246, 0.08); }
  .portal-mobile-drawer-nav .axr-glyph { display: grid; place-items: center; width: 20px; height: 20px; flex: 0 0 auto; color: currentColor; }
  .portal-mobile-drawer-nav .axr-glyph svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
  .portal-mobile-drawer-foot { display: grid; gap: 10px; margin-top: auto; padding: 14px 2px 0; border-top: 1px solid var(--line); }
  .portal-mobile-drawer-signout {
    min-height: 44px;
    border: 1px solid var(--line);
    border-radius: 10px;
    color: var(--muted-strong);
    background: rgba(255, 255, 255, 0.035);
    font-weight: 700;
    cursor: pointer;
  }

  /* Route hierarchy: compact metadata, readable titles, and two-column data. */
  .portal-body.portal-product-v2 .portal-main .pfx-eyebrow,
  .portal-body.portal-product-v2 .portal-main .eyebrow,
  .portal-body.portal-product-v2 .portal-main .pfx-panel-eyebrow,
  .portal-body.portal-product-v2 .portal-main .cbk-group-eyebrow { font-size: 0.64rem; letter-spacing: 0.12em; }
  .portal-body.portal-product-v2 .portal-main .pfx h1,
  .portal-body.portal-product-v2 .portal-main .pfx-hero h1 { font-size: clamp(1.65rem, 7vw, 1.9rem); line-height: 1.1; }
  .portal-body.portal-product-v2 .portal-main .pfx-primary strong,
  .portal-body.portal-product-v2 .portal-main .cbk-hero-available strong { font-size: clamp(2rem, 10vw, 2.75rem); }
  .portal-body.portal-product-v2 .portal-main .pfx-instruments,
  .portal-body.portal-product-v2 .portal-main .pfx-split,
  .portal-body.portal-product-v2 .portal-main .cbk-progress-grid,
  .portal-body.portal-product-v2 .portal-main .cbk-payout-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .portal-body.portal-product-v2 .portal-main .pfx-panel,
  .portal-body.portal-product-v2 .portal-main .portal-chart-card { padding: 14px; }
  .portal-body.portal-product-v2 .portal-main .pfx-rank,
  .portal-body.portal-product-v2 .portal-main .pfx-chart,
  .portal-body.portal-product-v2 .portal-main .cbk-request-card,
  .portal-body.portal-product-v2 .portal-main .cashback-history-card { grid-column: 1 / -1; }
  .portal-body.portal-product-v2 .portal-main .pfx-scope { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; }
  .portal-body.portal-product-v2 .portal-main .pfx-scope-btn { min-height: 44px; padding: 8px 4px; }
  .portal-body.portal-product-v2 .portal-main .pfx-reward-actions,
  .portal-body.portal-product-v2 .portal-main .cbk-ecosystem-actions { display: grid; gap: 8px; }
  .portal-body.portal-product-v2 .portal-main .pfx-reward-actions > *,
  .portal-body.portal-product-v2 .portal-main .cbk-ecosystem-actions > * { width: 100%; min-height: 44px; justify-content: center; }
  .portal-body.portal-product-v2 .portal-main .cbk-payout-list,
  .portal-body.portal-product-v2 .portal-main .portal-history-list { max-height: 300px; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; }
  .portal-body.portal-product-v2 .portal-main .cbk-payout-row,
  .portal-body.portal-product-v2 .portal-main .portal-history-row { min-width: 0; }
  .portal-body.portal-product-v2 .portal-main .cbf-stage { grid-template-columns: 28px 1fr auto; }
  .portal-body.portal-product-v2 .portal-main .pov .pfx-split { grid-template-columns: 1fr; }
  .portal-body.portal-product-v2 .portal-main .pov .pfx-instruments { grid-template-columns: 1fr 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .portal-body.portal-product-v2 .portal-mobile-drawer,
  .portal-body.portal-product-v2 .portal-mobile-drawer-backdrop { transition: none; }
}

/* ==============================================================
   AUREX -- Mobile Client Terminal.
   Not a reflow of desktop. Mobile gets its own information
   hierarchy: each page leads with the DECISION, then progression,
   then context. Achieved with CSS `order` over the existing
   sections, so every value, hook, handler and route is the exact
   same markup desktop uses -- nothing is re-rendered or duplicated.
   Breakpoint 820px matches where .portal-sidebar already hides.
   Append-only.
   ============================================================== */

@media (max-width: 820px) {

  /* ==================================================
     PRIMARY NAV -- 5 destinations, thumb-reachable
     ================================================== */
  .portal-body:not(.portal-secure-gated) .portal-bottom-nav {
    display: grid; grid-template-columns: repeat(5, 1fr); gap: 0;
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid rgba(140, 178, 214, 0.14);
    background: rgba(5, 11, 21, 0.97);
    backdrop-filter: blur(18px);
  }
  .portal-body .portal-bottom-nav .portal-tab {
    display: grid; justify-items: center; align-content: center; gap: 4px;
    min-height: 52px; padding: 6px 2px; border: 0; background: none; border-radius: 10px;
    color: rgba(150, 176, 208, 0.62);
    transition: color 160ms ease, background-color 160ms ease;
  }
  .portal-body .portal-bottom-nav .portal-tab svg { width: 21px; height: 21px; }
  .portal-body .portal-bottom-nav .portal-tab span {
    font-size: 0.575rem; font-weight: 700; letter-spacing: 0.05em;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%;
  }
  .portal-body .portal-bottom-nav .portal-tab.is-active {
    color: #eafaff; background: rgba(103, 232, 249, 0.09);
  }
  .portal-body .portal-bottom-nav .portal-tab.is-active svg { color: #7fd8f7; }
  .portal-body .portal-bottom-nav .portal-tab:focus-visible { outline: 2px solid rgba(103, 232, 249, 0.55); outline-offset: -2px; }

  /* Route content clears the fixed nav + safe area */
  .portal-body.portal-product-v2 .portal-route-content {
    padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px));
  }

  /* ==================================================
     MOBILE COMPOSITION -- OVERVIEW
     Decision first: what needs doing, then position, then context.
     ================================================== */
  .pov { display: grid; gap: 12px; }
  .pov > .pfx-hero { order: 1; }
  .pov > .pov-actions { order: 2; }
  .pov > .pfx-instruments { order: 3; }
  .pov > .pov-recommendation { order: 4; }
  .pov > .pfx-split { order: 5; }
  .pov > .pov-services { order: 6; }
  .pov > .pov-chain { order: 7; }
  .pov > .portal-journey-strip { order: 8; }

  /* Instruments read as a 2-up ledger, not 6 stacked cards */
  .pov .pfx-instruments { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pov .pfx-instruments .pfx-inst { min-height: 70px; padding: 12px 13px; }
  .pov .pfx-instruments .pfx-inst strong { font-size: 1.16rem; }

  /* ==================================================
     MOBILE COMPOSITION -- CASHBACK
     Money you can act on first, then progression, then the ledger.
     ================================================== */
  .cashback-experience.pfx { display: grid; gap: 12px; }
  .cashback-experience > .pfx-hero { order: 1; }
  .cashback-experience > .cbk-group-payout { order: 2; }
  .cashback-experience > .cbk-group-progression { order: 3; }
  .cashback-experience > .cbk-bridges { order: 4; }
  .cashback-experience > .cbk-group-money { order: 5; }
  .cashback-experience > .cbk-month-select { order: 6; }
  .cashback-experience > .portal-journey-strip { order: 7; }

  /* Claim is the page's primary action on mobile */
  .cashback-experience .cbk-request-card .primary-button {
    width: 100%; min-height: 50px; justify-content: center; font-size: 0.92rem;
  }
  .cashback-experience .cbk-payout-grid { grid-template-columns: 1fr; }

  /* ==================================================
     MOBILE COMPOSITION -- LEADERBOARD
     Your standing first; the podium is context, not the headline.
     ================================================== */
  .pfl { display: grid; gap: 12px; }
  .pfl > .pfx-hero { order: 1; }
  .pfl > .pfl-you-card { order: 2; }
  .pfl > .pfl-podium { order: 3; }
  .pfl > .pfl-table-panel { order: 4; }
  .pfl > .leaderboard-identity-panel { order: 5; }
  .pfl > .pfl-nav { order: 6; }

  /* ==================================================
     MOBILE COMPOSITION -- PERFORMANCE
     ================================================== */
  .pfx > .pfx-hero { order: 1; }
  .pfx > .pfx-instruments { order: 2; }
  .pfx > .pfx-split { order: 3; }
  .pfx .pfx-instruments { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* Scope control becomes a full-width segmented bar */
  .pfx .pfx-scope { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); }
  .pfx .pfx-scope-btn { min-height: 40px; padding: 0 6px; }

  /* ==================================================
     SHARED MOBILE SURFACE RULES
     ================================================== */
  .portal-body .portal-main .pfx-hero { padding: 20px 17px 18px; }
  .portal-body .portal-main .pfx-panel { padding: 16px 15px; }
  .portal-body .portal-main .pfx-primary strong { font-size: clamp(2.1rem, 11vw, 2.9rem); }

  /* Sheets sit above the nav and respect the safe area */
  .portal-body .portal-more-sheet {
    padding-bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  }
  .portal-body .portal-more-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
}

/* ==================================================
   NARROW PHONES
   ================================================== */
@media (max-width: 430px) {
  .portal-body .portal-bottom-nav .portal-tab span { font-size: 0.545rem; letter-spacing: 0.02em; }
  .portal-body .portal-bottom-nav .portal-tab svg { width: 20px; height: 20px; }
  .pov .pfx-instruments .pfx-inst strong { font-size: 1.06rem; }
  .portal-body .portal-more-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  .portal-body .portal-bottom-nav .portal-tab { transition: none; }
}

/* ==============================================================
   Mobile order fix (live-verified at 768px): the Overview page
   carries BOTH `.pov` and `.pfx`, so `.pfx > .pfx-instruments`
   (order:2) tied with `.pov > .pfx-instruments` (order:3) at equal
   0,2,0 specificity and won on source order -- collapsing the
   intended Overview hierarchy (actions before instruments).
   Raising Overview to 0,3,0 makes it deterministic.
   ============================================================== */
@media (max-width: 820px) {
  .pov.pfx > .pfx-hero { order: 1; }
  .pov.pfx > .pov-actions { order: 2; }
  .pov.pfx > .pfx-instruments { order: 3; }
  .pov.pfx > .pov-recommendation { order: 4; }
  .pov.pfx > .pfx-split { order: 5; }
  .pov.pfx > .pov-services { order: 6; }
  .pov.pfx > .pov-chain { order: 7; }
}

/* ==============================================================
   AUREX -- MOBILE FINAL PREMIUM EXPERIENCE PASS
   Presentation only. No markup, hook, route, handler or financial
   value is produced here -- these rules restyle elements that the
   existing renderers already emit.
   The drawer nav is a live clone of the sidebar's .axr-nav, so it
   already carries the corporate glyph family and the per-service
   --axr-accent tokens; it simply had no .axr ancestor to match on.
   Append-only.
   ============================================================== */

/* ==================================================
   1. MOBILE DRAWER -- a navigation surface, not a link list
   ================================================== */
@media (max-width: 820px) {

  .portal-body .portal-mobile-drawer {
    display: flex; flex-direction: column;
    padding-bottom: env(safe-area-inset-bottom, 0px);
    background:
      radial-gradient(120% 60% at 0% 0%, rgba(103, 232, 249, 0.07), transparent 62%),
      linear-gradient(180deg, #071324 0%, #050b15 58%, #04080f 100%);
    border-right: 1px solid rgba(140, 178, 214, 0.16);
    box-shadow: 26px 0 60px -28px rgba(0, 0, 0, 0.85);
  }

  /* ---- Drawer header ---- */
  .portal-body .portal-mobile-drawer-head {
    display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
    padding: calc(16px + env(safe-area-inset-top, 0px)) 16px 14px;
    border-bottom: 1px solid rgba(140, 178, 214, 0.12);
  }
  .portal-body .portal-mobile-drawer-kicker {
    display: block; font-size: 0.56rem; font-weight: 700;
    letter-spacing: 0.22em; text-transform: uppercase;
    color: rgba(150, 176, 208, 0.66); margin-bottom: 5px;
  }
  .portal-body .portal-mobile-drawer-head strong {
    display: block; font-size: 1.02rem; font-weight: 650;
    letter-spacing: -0.01em; color: #f2f5f8; line-height: 1.25;
  }
  .portal-body .portal-mobile-drawer-close {
    flex: 0 0 auto; width: 38px; height: 38px; display: grid; place-items: center;
    border-radius: 10px; border: 1px solid rgba(140, 178, 214, 0.18);
    background: rgba(255, 255, 255, 0.03); color: rgba(210, 226, 242, 0.9);
    transition: background-color 160ms ease, border-color 160ms ease;
  }
  .portal-body .portal-mobile-drawer-close svg {
    width: 17px; height: 17px; fill: none; stroke: currentColor;
    stroke-width: 1.7; stroke-linecap: round;
  }
  .portal-body .portal-mobile-drawer-close:active { background: rgba(255, 255, 255, 0.07); }

  /* ---- Drawer nav shell ---- */
  .portal-body .portal-mobile-drawer-nav {
    flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch;
    padding: 14px 12px 18px; display: grid; align-content: start; gap: 16px;
  }

  /* Group rhythm -- the drawer reads as departments, not 11 flat links */
  .portal-body .portal-mobile-drawer-nav.axr .axr-group { display: grid; gap: 3px; }
  .portal-body .portal-mobile-drawer-nav.axr .axr-group-label {
    font-size: 0.55rem; font-weight: 700; letter-spacing: 0.2em;
    text-transform: uppercase; color: rgba(150, 176, 208, 0.5);
    padding: 0 10px 6px; margin: 0;
  }

  /* Touch-grade rows: 52px, generous glyph, per-service accent */
  .portal-body .portal-mobile-drawer-nav.axr .axr-link {
    display: grid; grid-template-columns: 36px minmax(0, 1fr); align-items: center;
    gap: 12px; min-height: 52px; padding: 0 10px; border-radius: 12px;
    position: relative; isolation: isolate;
    transition: background-color 170ms ease, transform 170ms cubic-bezier(0.22, 1, 0.36, 1);
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-glyph {
    width: 36px; height: 36px; display: grid; place-items: center;
    border-radius: 10px; border: 1px solid rgba(var(--axr-accent, 150, 176, 208), 0.2);
    background: rgba(var(--axr-accent, 150, 176, 208), 0.08);
    transition: background-color 170ms ease, border-color 170ms ease;
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-glyph svg {
    width: 19px; height: 19px;
    color: rgba(var(--axr-accent, 150, 176, 208), 0.92);
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-label {
    font-size: 0.9rem; font-weight: 560; letter-spacing: -0.005em;
    color: rgba(224, 235, 246, 0.86); line-height: 1.3;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-link:active { transform: scale(0.985); }

  /* Active destination -- accent rail + tinted field */
  .portal-body .portal-mobile-drawer-nav.axr .axr-link.is-active {
    background: rgba(var(--axr-accent, 150, 176, 208), 0.1);
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-link.is-active::before {
    content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
    width: 3px; height: 24px; border-radius: 0 3px 3px 0;
    background: rgb(var(--axr-accent, 150, 176, 208));
    box-shadow: 0 0 14px rgba(var(--axr-accent, 150, 176, 208), 0.55);
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-link.is-active .axr-glyph {
    background: rgba(var(--axr-accent, 150, 176, 208), 0.17);
    border-color: rgba(var(--axr-accent, 150, 176, 208), 0.42);
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-link.is-active .axr-label {
    color: #ffffff; font-weight: 660;
  }

  /* ---- Drawer footer ---- */
  .portal-body .portal-mobile-drawer-foot {
    flex: 0 0 auto; display: flex; align-items: center; justify-content: space-between;
    gap: 12px; padding: 13px 16px calc(14px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid rgba(140, 178, 214, 0.12);
    background: rgba(4, 8, 15, 0.6);
  }
  .portal-body .portal-mobile-drawer-foot > span {
    font-size: 0.62rem; letter-spacing: 0.12em; text-transform: uppercase;
    color: rgba(150, 176, 208, 0.56);
  }
  .portal-body .portal-mobile-drawer-signout {
    min-height: 38px; padding: 0 14px; border-radius: 9px;
    border: 1px solid rgba(140, 178, 214, 0.22); background: rgba(255, 255, 255, 0.03);
    color: rgba(224, 235, 246, 0.88); font-size: 0.78rem; font-weight: 600;
  }

  /* ---- Drawer entrance: rows resolve in sequence ---- */
  .portal-body.portal-mobile-drawer-open .portal-mobile-drawer-nav.axr .axr-group {
    animation: axDrawerGroupIn 380ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }
  .portal-body.portal-mobile-drawer-open .portal-mobile-drawer-nav.axr .axr-group:nth-child(1) { animation-delay: 40ms; }
  .portal-body.portal-mobile-drawer-open .portal-mobile-drawer-nav.axr .axr-group:nth-child(2) { animation-delay: 84ms; }
  .portal-body.portal-mobile-drawer-open .portal-mobile-drawer-nav.axr .axr-group:nth-child(3) { animation-delay: 128ms; }
  .portal-body.portal-mobile-drawer-open .portal-mobile-drawer-nav.axr .axr-group:nth-child(4) { animation-delay: 172ms; }
  .portal-body.portal-mobile-drawer-open .portal-mobile-drawer-nav.axr .axr-group:nth-child(5) { animation-delay: 216ms; }
}

@keyframes axDrawerGroupIn {
  from { opacity: 0; transform: translateX(-14px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ==================================================
   2. MOBILE TOP BAR -- brand-grade chrome
   ================================================== */
@media (max-width: 820px) {
  .portal-body .portal-mobile-topbar {
    padding: calc(8px + env(safe-area-inset-top, 0px)) 12px 8px;
    background: rgba(5, 11, 21, 0.9);
    backdrop-filter: saturate(150%) blur(20px);
    -webkit-backdrop-filter: saturate(150%) blur(20px);
    border-bottom: 1px solid rgba(140, 178, 214, 0.13);
  }
  .portal-body .portal-mobile-menu,
  .portal-body .portal-mobile-bell {
    width: 40px; height: 40px; display: grid; place-items: center;
    border-radius: 11px; border: 1px solid transparent;
    background: none; color: rgba(210, 226, 242, 0.86);
    transition: background-color 160ms ease;
  }
  .portal-body .portal-mobile-menu:active,
  .portal-body .portal-mobile-bell:active { background: rgba(255, 255, 255, 0.06); }
  .portal-body .portal-mobile-menu svg,
  .portal-body .portal-mobile-bell svg {
    width: 20px; height: 20px; fill: none; stroke: currentColor;
    stroke-width: 1.7; stroke-linecap: round;
  }
  /* The bell is a filled pictogram in source -- keep it filled, not outlined */
  .portal-body .portal-mobile-bell svg { fill: currentColor; stroke: none; }

  .portal-body .portal-mobile-brand {
    display: inline-flex; align-items: center; gap: 9px; text-decoration: none;
  }
  .portal-body .portal-mobile-mark {
    width: 27px; height: 27px; display: grid; place-items: center;
    color: #e7c76a; /* gold reserved for the brand mark */
  }
  .portal-body .portal-mobile-mark svg { width: 100%; height: 100%; }
  .portal-body .portal-mobile-wordmark {
    display: inline-flex; align-items: baseline; gap: 6px;
    font-size: 0.98rem; font-weight: 700; letter-spacing: 0.13em;
    color: #f4f7fa; line-height: 1;
  }
  .portal-body .portal-mobile-wordmark small {
    font-size: 0.53rem; font-weight: 600; letter-spacing: 0.16em;
    text-transform: uppercase; color: rgba(150, 176, 208, 0.7);
  }
  .portal-body .portal-mobile-avatar {
    width: 34px; height: 34px; display: grid; place-items: center;
    border-radius: 50%; border: 1px solid rgba(140, 178, 214, 0.28);
    background: rgba(103, 232, 249, 0.1);
    font-size: 0.68rem; font-weight: 700; letter-spacing: 0.05em; color: #d6ecff;
  }
  .portal-body .portal-mobile-actions { display: inline-flex; align-items: center; gap: 4px; }
}

/* ==================================================
   3. CASHBACK PROGRESSION -- signature horizontal rail
   Replaces the narrow vertical Bronze -> Gold tower.
   The authoritative inline width:<real>% on .portal-progress > span
   is never touched; the reveal animates transform only.
   ================================================== */
@media (max-width: 820px) {

  .cashback-experience .cbk-rank-rail {
    display: grid; gap: 9px; width: 100%;
    margin: 16px 0 12px; padding: 0;
  }
  .cashback-experience .cbk-rank-rail .portal-progress {
    width: 100%; height: 8px; border-radius: 99px; overflow: hidden;
    background: rgba(140, 178, 214, 0.13);
    border: 1px solid rgba(140, 178, 214, 0.14);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.35);
  }
  .cashback-experience .cbk-rank-rail .portal-progress > span {
    display: block; height: 100%; border-radius: 99px;
    background: linear-gradient(90deg, #c8a96a 0%, #e7c76a 55%, #ffd28a 100%);
    box-shadow: 0 0 14px rgba(231, 199, 106, 0.5);
    transform-origin: left center;
    animation: axRailReveal 900ms cubic-bezier(0.22, 1, 0.36, 1) 160ms both;
  }
  /* Endpoints read as tier destinations, full rail width */
  .cashback-experience .cbk-rank-rail-anchors {
    display: flex; align-items: center; justify-content: space-between; gap: 12px;
  }
  .cashback-experience .cbk-rail-anchor {
    font-size: 0.62rem; font-weight: 700; letter-spacing: 0.16em;
    text-transform: uppercase; line-height: 1;
  }
  .cashback-experience .cbk-rail-anchor.cbk-rail-current { color: rgba(224, 235, 246, 0.92); }
  .cashback-experience .cbk-rail-anchor.cbk-rail-next { color: #e7c76a; }

  /* The remaining-lots sentence is the rail's caption, not a stray line */
  .cashback-experience .cbk-rank-remaining {
    margin: 0 0 14px; font-size: 0.82rem; line-height: 1.45;
    color: rgba(186, 205, 226, 0.82);
  }
  .cashback-experience .cbk-rank-remaining strong { color: #f2f5f8; font-weight: 680; }

  /* ---- Kill the tower: tier ladder becomes a compact scannable list ---- */
  .cashback-experience .cbk-rank-row {
    grid-template-columns: 22px minmax(0, 1fr) auto;
    align-items: center; gap: 10px;
    min-height: 46px; padding: 8px 10px; border-radius: 10px;
  }
  /* Benefit strings are the tower's height driver -- the modal already owns them */
  .cashback-experience .cbk-rank-row > small { display: none; }
  .cashback-experience .cbk-rank-row span strong { font-size: 0.85rem; font-weight: 620; }
  .cashback-experience .cbk-rank-row span small {
    display: block; font-size: 0.66rem; line-height: 1.35;
    color: rgba(150, 176, 208, 0.72);
  }
  .cashback-experience .cbk-rank-row span br { display: none; }
  .cashback-experience .cbk-rank-row > strong:last-of-type {
    font-size: 0.6rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
  }
  .cashback-experience .cbk-rank-icon { width: 22px; height: 22px; }

  /* Next unlock is the payoff -- give it presence */
  .cashback-experience .cbk-rank-next-unlock {
    padding: 14px 14px 13px; border-radius: 13px;
    border: 1px solid rgba(231, 199, 106, 0.24);
    background: linear-gradient(160deg, rgba(231, 199, 106, 0.09), rgba(231, 199, 106, 0.02) 70%);
  }
  .cashback-experience .cbk-rank-next-eyebrow {
    font-size: 0.55rem; font-weight: 700; letter-spacing: 0.2em;
    text-transform: uppercase; color: rgba(231, 199, 106, 0.85);
  }
  .cashback-experience .cbk-rank-next-head {
    display: flex; align-items: baseline; justify-content: space-between;
    gap: 10px; margin-top: 7px; flex-wrap: wrap;
  }
  .cashback-experience .cbk-rank-next-head strong { font-size: 1.05rem; font-weight: 680; color: #f6f0dc; }
  .cashback-experience .cbk-rank-next-head b { font-size: 0.86rem; font-weight: 650; color: #e7c76a; }
  .cashback-experience .cbk-rank-uplift {
    margin: 5px 0 0; font-size: 0.74rem; color: rgba(186, 205, 226, 0.8);
  }
  .cashback-experience .cbk-rank-explore { min-height: 44px; }
}

@keyframes axRailReveal { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ==================================================
   4. LEADERBOARD PODIUM -- cinematic on a phone
   ================================================== */
@media (max-width: 820px) {
  .pfl .pfl-podium {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: end; gap: 7px; padding: 16px 10px 14px;
  }
  .pfl .pfl-pod {
    padding: 12px 7px 11px; border-radius: 12px; min-width: 0;
    animation: axPodRise 520ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }
  /* Rank 1 is physically taller -- the hierarchy is spatial, not just colour */
  .pfl .pfl-pod-1 { padding-top: 20px; padding-bottom: 15px; }
  .pfl .pfl-pod-1 { animation-delay: 60ms; }
  .pfl .pfl-pod-2 { animation-delay: 170ms; }
  .pfl .pfl-pod-3 { animation-delay: 240ms; }
  .pfl .pfl-pod-rank { font-size: 0.62rem; letter-spacing: 0.12em; }
  .pfl .pfl-pod-name {
    font-size: 0.74rem; font-weight: 640; line-height: 1.25;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .pfl .pfl-pod-1 .pfl-pod-name { font-size: 0.82rem; }
  .pfl .pfl-pod-lots { font-size: 0.66rem; }
  .pfl .pfl-pod-reward { font-size: 0.68rem; font-weight: 680; }
}

@keyframes axPodRise {
  from { opacity: 0; transform: translateY(16px) scale(0.965); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

/* ==================================================
   5. TYPOGRAPHY DISCIPLINE + TOUCH + RETINA
   ================================================== */
@media (max-width: 820px) {
  /* Every interactive control clears a comfortable touch target */
  .portal-body .portal-main .primary-button,
  .portal-body .portal-main .secondary-button,
  .portal-body .portal-main .text-button,
  .portal-body .portal-main select,
  .portal-body .portal-main input[type="text"],
  .portal-body .portal-main input[type="number"],
  .portal-body .portal-main input[type="email"] { min-height: 44px; }

  /* iOS refuses to zoom-lock below 16px -- prevents focus zoom jumps */
  .portal-body .portal-main select,
  .portal-body .portal-main input,
  .portal-body .portal-main textarea { font-size: 16px; }

  /* Crisp edges on high-DPI panels */
  .portal-body .portal-main .pfx-panel,
  .portal-body .portal-main .pfx-hero { -webkit-font-smoothing: antialiased; }

  /* Section headings share one scale across every page */
  .portal-body .portal-main .pfx-panel-eyebrow {
    font-size: 0.55rem; letter-spacing: 0.2em; text-transform: uppercase;
  }
  .portal-body .portal-main .pfx-hero-eyebrow {
    font-size: 0.57rem; letter-spacing: 0.22em; text-transform: uppercase;
  }

  /* Long tabular content scrolls in its own box -- the page never does */
  .portal-body .portal-main table { min-width: 0; }
}

/* ==================================================
   6. PAGE TRANSITION -- routes arrive, they don't blink in
   ================================================== */
@media (max-width: 820px) {
  .portal-body .portal-route-content > * {
    animation: axRouteIn 420ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }
}

@keyframes axRouteIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ==================================================
   7. REDUCED MOTION -- clear animation only, never layout
   ================================================== */
@media (prefers-reduced-motion: reduce) {
  .portal-body .portal-mobile-drawer-nav.axr .axr-group,
  .portal-body .portal-route-content > *,
  .pfl .pfl-pod,
  .cashback-experience .cbk-rank-rail .portal-progress > span {
    animation: none !important;
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-link,
  .portal-body .portal-mobile-menu,
  .portal-body .portal-mobile-bell,
  .portal-body .portal-mobile-drawer-close { transition: none !important; }
}

/* --------------------------------------------------
   Narrow-phone type scale applied down to 430px, but a
   430pt Pro Max has ~86px columns and does not need it.
   Restore the standard scale above 400px.
   -------------------------------------------------- */
@media (min-width: 400px) and (max-width: 820px) {
  .portal-body .portal-bottom-nav .portal-tab span { font-size: 0.575rem; letter-spacing: 0.05em; }
  .portal-body .portal-bottom-nav .portal-tab svg { width: 21px; height: 21px; }
  .pov .pfx-instruments .pfx-inst strong { font-size: 1.16rem; }
  .portal-body .portal-more-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* --------------------------------------------------
   Drawer footer: the kicker and the sign-out control
   both wrapped to two lines at 390pt. Keep them on one
   line and let the kicker take the remaining space.
   -------------------------------------------------- */
@media (max-width: 820px) {
  .portal-body .portal-mobile-drawer-foot > span {
    font-size: 0.56rem; letter-spacing: 0.1em; line-height: 1.2;
    min-width: 0; flex: 1 1 auto;
  }
  .portal-body .portal-mobile-drawer-signout {
    flex: 0 0 auto; white-space: nowrap; padding: 0 13px;
  }
}

/* --------------------------------------------------
   390pt and 393pt (iPhone 14/15/16) give ~77px columns
   -- wide enough for the standard tab scale. Keep the
   narrow scale for 375pt (SE / mini) only.
   -------------------------------------------------- */
@media (min-width: 385px) and (max-width: 820px) {
  .portal-body .portal-bottom-nav .portal-tab span { font-size: 0.575rem; letter-spacing: 0.05em; }
  .portal-body .portal-bottom-nav .portal-tab svg { width: 21px; height: 21px; }
  .pov .pfx-instruments .pfx-inst strong { font-size: 1.16rem; }
}

/* ==============================================================
   AUREX MOBILE V4 -- major recomposition.
   Root cause of the "compressed desktop" look, measured live at
   390px: .portal-chart-grid and .pfx-split were still resolving to
   two ~178px columns, squeezing whole modules (and the Bronze->Gold
   rail down to 148px / 38% of the viewport). Everything below is
   inside a mobile media query; desktop rules are untouched.
   Presentation only -- same renderers, same values, same handlers.
   Append-only.
   ============================================================== */

@media (max-width: 820px) {

  /* ==================================================
     V4-0. UNCOMPRESS -- no desktop 2-col grid survives on a phone
     ================================================== */
  .portal-body .portal-main .portal-chart-grid,
  .portal-body .portal-main .pfx-split,
  .portal-body .portal-main .cbk-progress-grid,
  .portal-body .portal-main .cbk-payout-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 12px;
  }
  /* Metric tiles stay 2-up on purpose -- they are designed to pair */
  .portal-body .portal-main .pfx-instruments {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
  }
  .portal-body .portal-main .portal-chart-card { min-width: 0; }

  /* ==================================================
     V4-1. CASHBACK -- full-width tier progression
     The 148px tower becomes a real rail across the viewport.
     The authoritative inline width:<real>% is never rewritten;
     only transform is animated.
     ================================================== */
  .cashback-experience .cbk-rank-rail {
    display: flex; flex-direction: column; gap: 10px;
    width: 100%; margin: 4px 0 12px;
  }
  /* Tier endpoints read ABOVE the track, like a route */
  .cashback-experience .cbk-rank-rail-anchors {
    order: 1; display: flex; align-items: baseline;
    justify-content: space-between; gap: 12px; width: 100%;
  }
  .cashback-experience .cbk-rank-rail .portal-progress {
    order: 2; position: relative; width: 100%; height: 10px;
    border-radius: 99px; overflow: visible;
    background: rgba(140, 178, 214, 0.14);
    border: 1px solid rgba(140, 178, 214, 0.16);
  }
  .cashback-experience .cbk-rank-rail .portal-progress > span {
    display: block; height: 100%; border-radius: 99px;
    background: linear-gradient(90deg, #b98f4a 0%, #e7c76a 62%, #ffd9a0 100%);
    box-shadow: 0 0 16px rgba(231, 199, 106, 0.45);
    transform-origin: left center;
    animation: axV4Rail 780ms cubic-bezier(0.22, 1, 0.36, 1) 180ms both;
  }
  /* Start and target nodes on the rail */
  .cashback-experience .cbk-rank-rail .portal-progress::before,
  .cashback-experience .cbk-rank-rail .portal-progress::after {
    content: ""; position: absolute; top: 50%; width: 12px; height: 12px;
    border-radius: 50%; transform: translateY(-50%);
  }
  .cashback-experience .cbk-rank-rail .portal-progress::before {
    left: -1px; background: #e7c76a; box-shadow: 0 0 0 3px rgba(231, 199, 106, 0.18);
  }
  .cashback-experience .cbk-rank-rail .portal-progress::after {
    right: -1px; background: rgba(9, 16, 28, 0.95);
    border: 2px solid rgba(231, 199, 106, 0.55);
  }
  .cashback-experience .cbk-rail-anchor {
    font-size: 0.78rem; font-weight: 700; letter-spacing: 0.14em;
    text-transform: uppercase; line-height: 1.1;
  }
  .cashback-experience .cbk-rail-anchor.cbk-rail-current { color: #f2f5f8; }
  .cashback-experience .cbk-rail-anchor.cbk-rail-next {
    color: #e7c76a; text-align: right;
  }
  .cashback-experience .cbk-rank-remaining {
    margin: 0 0 14px; font-size: 0.84rem; line-height: 1.45;
    color: rgba(186, 205, 226, 0.84);
  }
  .cashback-experience .cbk-rank-remaining strong {
    color: #ffd9a0; font-weight: 700;
    font-variant-numeric: tabular-nums;
  }
  /* Identity block reads as a tier statement, not a squeezed card */
  .cashback-experience .cbk-rank-identity {
    display: flex; align-items: center; gap: 12px; width: 100%;
  }
  .cashback-experience .cbk-rank-lifetime { width: 100%; }

  /* ==================================================
     V4-2. CASHBACK -- reduce initial vertical footprint
     Measured 5039px (5.97 screens) before this block.
     Nothing is deleted; deep context collapses.
     ================================================== */
  .cashback-experience .cashback-formula-strip,
  .cashback-experience .cbk-ecosystem-bridge,
  .cashback-experience .portal-journey-strip {
    contain-intrinsic-size: auto 300px;
  }
  /* The formula explainer is reference material, not a first-run need */
  .cashback-experience .cashback-formula-strip { padding: 14px 14px 12px; }
  .cashback-experience .cashback-formula-strip .cbk-formula-step { min-height: 0; padding: 10px 12px; }
  .cashback-experience .cashback-hero.cashback-signature { padding: 16px 15px; }
  .cashback-experience .portal-journey-strip { padding: 14px 14px 12px; }

  /* ---- Capital flow: a vertical state journey, not six squeezed cards ---- */
  .cashback-experience .cashback-flow-rail.cashback-lifecycle {
    display: grid; grid-template-columns: minmax(0, 1fr); gap: 0;
    padding: 14px 14px 10px; position: relative;
  }
  .cashback-experience .cashback-lifecycle > * {
    position: relative; padding-left: 30px; padding-bottom: 14px; min-height: 0;
  }
  /* Connector spine + node per stage */
  .cashback-experience .cashback-lifecycle > *::before {
    content: ""; position: absolute; left: 8px; top: 16px; bottom: -2px;
    width: 1px; background: rgba(140, 178, 214, 0.2);
  }
  .cashback-experience .cashback-lifecycle > *:last-child::before { display: none; }
  .cashback-experience .cashback-lifecycle > *::after {
    content: ""; position: absolute; left: 4px; top: 8px;
    width: 9px; height: 9px; border-radius: 50%;
    background: rgba(9, 16, 28, 0.95);
    border: 2px solid rgba(140, 178, 214, 0.4);
  }
  .cashback-experience .cashback-lifecycle > .is-complete::after,
  .cashback-experience .cashback-lifecycle > .is-current::after {
    background: #67e8f9; border-color: #67e8f9;
    box-shadow: 0 0 10px rgba(103, 232, 249, 0.6);
  }

  /* ==================================================
     V4-3. LEADERBOARD -- champion composition
     #1 takes the full width on its own row; #2 and #3 sit beneath.
     Source order stays #2,#1,#3 (untouched) -- grid areas re-place them.
     ================================================== */
  .pfl .pfl-podium {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas: "champ champ" "second third";
    gap: 10px; padding: 16px 12px 14px; align-items: stretch;
  }
  .pfl .pfl-podium .pfl-pod-1 { grid-area: champ; }
  .pfl .pfl-podium .pfl-pod-2 { grid-area: second; }
  .pfl .pfl-podium .pfl-pod-3 { grid-area: third; }

  .pfl .pfl-pod {
    min-width: 0; padding: 14px 12px; border-radius: 14px;
    animation: axV4PodIn 420ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }
  .pfl .pfl-pod-1 {
    padding: 20px 16px 18px; text-align: center;
    border: 1px solid rgba(231, 199, 106, 0.34);
    background:
      radial-gradient(120% 130% at 50% 0%, rgba(231, 199, 106, 0.16), transparent 66%),
      rgba(255, 255, 255, 0.02);
    animation-delay: 90ms;
  }
  .pfl .pfl-pod-2 { animation-delay: 220ms; }
  .pfl .pfl-pod-3 { animation-delay: 290ms; }

  /* Names must never truncate to "cah..." */
  .pfl .pfl-pod-name {
    white-space: normal; overflow-wrap: anywhere; text-overflow: clip;
    font-size: 0.82rem; font-weight: 640; line-height: 1.25;
  }
  .pfl .pfl-pod-1 .pfl-pod-name {
    font-size: 1.24rem; font-weight: 700; letter-spacing: -0.01em; color: #fff6e2;
  }
  .pfl .pfl-pod-1 .pfl-pod-rank {
    font-size: 1.05rem; font-weight: 800; color: #e7c76a; letter-spacing: 0.1em;
  }
  .pfl .pfl-pod-1 .pfl-pod-lots {
    font-size: 0.95rem; font-weight: 650; color: #f2f5f8;
    font-variant-numeric: tabular-nums;
  }
  .pfl .pfl-pod-lots, .pfl .pfl-pod-reward { font-variant-numeric: tabular-nums; }
  .pfl .pfl-pod-rank { font-size: 0.68rem; letter-spacing: 0.12em; }

  /* Pursuit rail endpoints stay readable */
  .pfl .pfl-gap-rail { width: 100%; }
  .pfl .pfl-you-card { padding: 16px 15px; }

  /* ==================================================
     V4-4. PERFORMANCE -- chart before the metric wall
     ================================================== */
  .pfx > .pfx-hero { order: 1; }
  .pfx > .pfx-split { order: 2; }
  .pfx > .pfx-instruments { order: 3; }
  .portal-body .portal-main .pfx-chart { min-width: 0; }
  .portal-body .portal-main .pfx-chart svg { width: 100%; height: auto; display: block; }

  /* ==================================================
     V4-5. OVERVIEW -- four metrics, then the next action
     The 5th and 6th instruments follow the action, they do not
     lead the screen. Nothing is removed.
     ================================================== */
  .pov.pfx > .pfx-hero { order: 1; }
  .pov.pfx > .pfx-instruments { order: 2; }
  .pov.pfx > .pov-actions { order: 3; }
  .pov.pfx > .pov-recommendation { order: 4; }
  .pov.pfx > .pfx-split { order: 5; }
  .pov.pfx > .pov-services { order: 6; }
  .pov.pfx > .pov-chain { order: 7; }
  .pov .pfx-instruments .pfx-inst { min-height: 74px; padding: 12px 13px; }
  .pov .pfx-instruments .pfx-inst strong {
    font-size: 1.2rem; font-variant-numeric: tabular-nums;
  }

  /* ==================================================
     V4-6. BUTTON SYSTEM -- one authoritative mobile control
     ================================================== */
  .portal-body .portal-main .primary-button,
  .portal-body .portal-main .secondary-button {
    -webkit-appearance: none; appearance: none;
    min-height: 48px; padding: 0 18px; border-radius: 12px;
    font-size: 0.9rem; font-weight: 650; letter-spacing: 0.01em;
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    transition: transform 120ms ease, background-color 150ms ease, border-color 150ms ease;
  }
  .portal-body .portal-main .primary-button {
    border: 1px solid rgba(103, 232, 249, 0.5);
    background: linear-gradient(180deg, rgba(103, 232, 249, 0.2), rgba(103, 232, 249, 0.1));
    color: #eafaff;
  }
  .portal-body .portal-main .secondary-button {
    border: 1px solid rgba(140, 178, 214, 0.24);
    background: rgba(255, 255, 255, 0.03);
    color: rgba(224, 235, 246, 0.9);
  }
  .portal-body .portal-main .primary-button:active,
  .portal-body .portal-main .secondary-button:active { transform: scale(0.978); }
  .portal-body .portal-main .primary-button:focus-visible,
  .portal-body .portal-main .secondary-button:focus-visible {
    outline: 2px solid rgba(103, 232, 249, 0.65); outline-offset: 2px;
  }
  .portal-body .portal-main .primary-button[disabled],
  .portal-body .portal-main .secondary-button[disabled] {
    opacity: 0.45; transform: none;
  }
  .portal-body .portal-main .text-button { min-height: 44px; }

  /* ==================================================
     V4-7. SEGMENTED CONTROLS -- application-grade
     ================================================== */
  .portal-body .portal-main .pfx-scope {
    width: 100%; display: grid; grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr); gap: 4px; padding: 4px;
    border-radius: 13px; border: 1px solid rgba(140, 178, 214, 0.18);
    background: rgba(255, 255, 255, 0.025);
  }
  .portal-body .portal-main .pfx-scope-btn {
    -webkit-appearance: none; appearance: none;
    min-height: 44px; padding: 0 8px; border: 0; border-radius: 10px;
    background: none; color: rgba(186, 205, 226, 0.78);
    font-size: 0.8rem; font-weight: 620; letter-spacing: 0.01em;
    text-transform: none;
    transition: background-color 180ms ease, color 180ms ease;
  }
  .portal-body .portal-main .pfx-scope-btn.is-active,
  .portal-body .portal-main .pfx-scope-btn[aria-pressed="true"] {
    background: rgba(103, 232, 249, 0.14); color: #eafaff;
  }

  /* ==================================================
     V4-8. NUMERIC INTEGRITY -- financial figures align
     ================================================== */
  .portal-body .portal-main .pfx-primary strong,
  .portal-body .portal-main .pfx-inst strong,
  .portal-body .portal-main .cbk-amount,
  .portal-body .portal-main td { font-variant-numeric: tabular-nums; }
}

@keyframes axV4Rail { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes axV4PodIn {
  from { opacity: 0; transform: translateY(18px) scale(0.96); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .cashback-experience .cbk-rank-rail .portal-progress > span,
  .pfl .pfl-pod { animation: none !important; }
  .portal-body .portal-main .primary-button,
  .portal-body .portal-main .secondary-button,
  .portal-body .portal-main .pfx-scope-btn { transition: none !important; }
}

/* ==============================================================
   AUREX MOBILE V4.1 -- vertical footprint correction.
   Measured live at 390px against the real cashbackPage() output:
     .cfs-op operators were stretching to 336px each (3 of them)
     because a horizontal desktop formula row became a stacked
     column; the money hero stacked 5 metrics to 669px; and the
     lifecycle stacked 6 stages to 827px.
   Nothing is removed -- density is corrected.
   ============================================================== */
@media (max-width: 820px) {

  /* ---- Formula strip: operators are glyphs, not columns ---- */
  .cashback-experience .cashback-formula-strip {
    display: grid; grid-template-columns: minmax(0, 1fr);
    gap: 0; align-items: stretch; padding: 14px;
  }
  .cashback-experience .cashback-formula-strip .cfs-op {
    height: 22px; min-height: 0; max-height: 22px;
    display: grid; place-items: center; padding: 0; margin: 2px 0;
    font-size: 0.82rem; line-height: 1;
    color: rgba(150, 176, 208, 0.6);
  }
  .cashback-experience .cashback-formula-strip .cfs-term {
    min-height: 0; padding: 11px 13px; border-radius: 11px;
  }
  .cashback-experience .cashback-formula-strip .cfs-term.cfs-result { padding: 13px;
  }

  /* ---- Money hero: 5 stacked blocks become a 2-up ledger ---- */
  .cashback-experience .cashback-hero.cashback-signature {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px;
  }
  /* Available cashback is the headline -- it keeps the full row */
  .cashback-experience .cashback-signature .cbk-hero-available { grid-column: 1 / -1; }
  .cashback-experience .cashback-signature .cbk-hero-next { grid-column: 1 / -1; }
  .cashback-experience .cashback-signature .cbk-hero-metric {
    min-height: 0; padding: 12px 13px; border-radius: 12px;
  }
  .cashback-experience .cashback-signature .cbk-hero-metric strong {
    font-variant-numeric: tabular-nums;
  }
  .cashback-experience .cashback-signature .cbk-hero-next-progress { grid-column: 1 / -1; }

  /* ---- Lifecycle: compact stages on the journey spine ---- */
  .cashback-experience .cashback-lifecycle > .cbf-stage {
    min-height: 0; padding: 9px 12px 11px 30px; border-radius: 10px;
  }
  .cashback-experience .cashback-lifecycle > .cbf-stage strong {
    font-size: 0.95rem; font-variant-numeric: tabular-nums;
  }
  /* Empty stages are context, not content -- they stay, quieter and tighter */
  .cashback-experience .cashback-lifecycle > .cbf-stage.is-empty { padding-top: 7px; padding-bottom: 8px; opacity: 0.62; }
  .cashback-experience .cashback-lifecycle > .cbf-stage.is-empty strong { font-size: 0.85rem; }

  /* ---- Deep reference sections keep everything, in less space ---- */
  .cashback-experience .portal-journey-strip { padding: 13px; }
  .cashback-experience .portal-journey-strip > * { min-height: 0; }
  .cashback-experience .cbk-ecosystem-bridge { padding: 14px; }
}

/* ==============================================================
   AUREX MOBILE V4.2 -- capital flow + journey density.
   Measured: each .cbf-stage was a 1-col grid stacking
   node/label/value/note to 129px (note alone wrapped to 61px).
   On mobile a stage is a ROW on the spine, not a stack.
   All four parts remain visible.
   ============================================================== */
@media (max-width: 820px) {

  /* The real .cbf-node becomes the spine node; drop the pseudo-node */
  .cashback-experience .cashback-lifecycle > .cbf-stage::after { display: none; }
  .cashback-experience .cashback-lifecycle > .cbf-stage::before { left: 15px; top: 30px; }

  .cashback-experience .cashback-lifecycle > .cbf-stage {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr) auto;
    grid-template-areas: "node label value" "node note note";
    align-items: center; gap: 2px 10px;
    padding: 8px 12px 10px 0; min-height: 0;
  }
  .cashback-experience .cashback-lifecycle > .cbf-stage > .cbf-node {
    grid-area: node; align-self: center; justify-self: center;
    width: 22px; height: 22px; min-width: 0; margin: 0;
    display: grid; place-items: center; border-radius: 50%;
    font-size: 0.66rem; position: relative; z-index: 1;
  }
  .cashback-experience .cashback-lifecycle > .cbf-stage > span {
    grid-area: label; font-size: 0.72rem; line-height: 1.3;
    color: rgba(150, 176, 208, 0.86);
  }
  .cashback-experience .cashback-lifecycle > .cbf-stage > strong {
    grid-area: value; justify-self: end; font-size: 1rem; font-weight: 680;
    font-variant-numeric: tabular-nums; color: #f2f5f8;
  }
  .cashback-experience .cashback-lifecycle > .cbf-stage > .cbf-note {
    grid-area: note; font-size: 0.66rem; line-height: 1.35; font-style: normal;
    color: rgba(150, 176, 208, 0.6);
  }
  .cashback-experience .cashback-lifecycle > .cbf-stage.is-empty > strong { color: rgba(186, 205, 226, 0.55); }

  /* ---- Journey strip: rail reads as a compact route ---- */
  .cashback-experience .portal-journey-strip .pjs-rail {
    display: grid; grid-auto-flow: column; grid-auto-columns: minmax(96px, 1fr);
    gap: 8px; overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
  }
  .cashback-experience .portal-journey-strip .pjs-rail > * {
    scroll-snap-align: start; min-height: 0; min-width: 0;
  }
  .cashback-experience .portal-journey-strip .pjs-rail::-webkit-scrollbar { height: 3px; }
  .cashback-experience .portal-journey-strip .pjs-rail::-webkit-scrollbar-thumb {
    background: rgba(140, 178, 214, 0.28); border-radius: 99px;
  }
  .cashback-experience .portal-journey-strip .pjs-continue { min-height: 0; padding: 12px 13px; }
}

/* ==============================================================
   AUREX MOBILE V4.3 -- remaining density.
   Money hero paired its metrics unevenly (earned sat alone on a
   row); the progression card's identity and next-unlock blocks
   were still desktop-height.
   ============================================================== */
@media (max-width: 820px) {
  /* Let earned + next target pair up instead of each taking a row */
  .cashback-experience .cashback-signature .cbk-hero-next { grid-column: auto; }
  .cashback-experience .cashback-signature .cbk-hero-metric span {
    font-size: 0.64rem; letter-spacing: 0.12em; text-transform: uppercase;
    color: rgba(150, 176, 208, 0.72);
  }
  .cashback-experience .cashback-signature .cbk-hero-available strong { font-size: 2rem; line-height: 1.05; }
  .cashback-experience .cashback-signature .cbk-hero-metric strong { font-size: 1.12rem; line-height: 1.15; }

  /* Progression card density */
  .cashback-experience .cbk-rank-identity { padding: 0; gap: 11px; }
  .cashback-experience .cbk-rank-emblem, .cashback-experience .cbk-rank-badge { flex: 0 0 auto; }
  .cashback-experience .cbk-rank-lifetime { padding: 10px 12px; border-radius: 11px; }
  .cashback-experience .cbk-rank-next-unlock { padding: 13px; }
  .cashback-experience .cbk-rank-benefits { margin: 8px 0 0; padding-left: 16px; }
  .cashback-experience .cbk-rank-benefits li { font-size: 0.72rem; line-height: 1.4; }
  .cashback-experience .portal-tier-progress { padding: 15px 14px; }

  /* Payout column */
  .cashback-experience .cbk-payout-grid > * { min-height: 0; }
  .cashback-experience .cbk-request-card { padding: 15px 14px; }
}

/* ==============================================================
   AUREX MOBILE V4.4 -- shell surfaces.
   New AX monogram (square caps, mitred joins, 32-unit grid so the
   strokes land on device pixels at 24-30px), terminal identity
   wordmark, drawer account-control surface, floating bottom nav.
   ============================================================== */
@media (max-width: 820px) {

  /* ---- Topbar identity ---- */
  .portal-body .portal-mobile-mark { width: 26px; height: 26px; color: #e7c76a; }
  .portal-body .portal-mobile-mark svg { width: 100%; height: 100%; shape-rendering: geometricPrecision; }
  .portal-body .portal-mobile-wordmark {
    display: inline-grid; align-items: center; gap: 1px;
    font-size: 0.95rem; font-weight: 700; letter-spacing: 0.15em;
    color: #f4f7fa; line-height: 1.05;
  }
  .portal-body .portal-mobile-wordmark small {
    font-size: 0.5rem; font-weight: 600; letter-spacing: 0.17em;
    text-transform: uppercase; color: rgba(150, 176, 208, 0.68);
  }

  /* ---- Drawer account-control surface ---- */
  .portal-body .portal-mobile-drawer-foot {
    display: grid; grid-template-columns: minmax(0, 1fr) auto;
    align-items: center; gap: 10px;
  }
  .portal-body .portal-mobile-account {
    display: inline-flex; align-items: center; gap: 10px; min-width: 0;
  }
  .portal-body .portal-mobile-account-mark {
    flex: 0 0 auto; width: 32px; height: 32px; display: grid; place-items: center;
    border-radius: 50%; border: 1px solid rgba(231, 199, 106, 0.34);
    background: rgba(231, 199, 106, 0.1);
    font-size: 0.64rem; font-weight: 700; letter-spacing: 0.05em; color: #e7c76a;
  }
  .portal-body .portal-mobile-account-meta {
    display: grid; gap: 1px; min-width: 0;
  }
  .portal-body .portal-mobile-account-meta b {
    font-size: 0.76rem; font-weight: 640; color: #eaf1f8; line-height: 1.2;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .portal-body .portal-mobile-account-meta small {
    font-size: 0.58rem; letter-spacing: 0.1em; text-transform: uppercase;
    color: rgba(150, 176, 208, 0.6); line-height: 1.2;
  }

  /* ---- Bottom nav: a floating terminal bar, not a browser chrome strip ---- */
  .portal-body:not(.portal-secure-gated) .portal-bottom-nav {
    left: 8px; right: 8px; bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    width: auto; border-radius: 18px;
    padding: 5px 5px;
    border: 1px solid rgba(140, 178, 214, 0.16);
    background: rgba(7, 14, 26, 0.94);
    backdrop-filter: saturate(160%) blur(22px);
    -webkit-backdrop-filter: saturate(160%) blur(22px);
    box-shadow: 0 14px 34px -14px rgba(0, 0, 0, 0.9), 0 0 0 1px rgba(255, 255, 255, 0.02) inset;
  }
  .portal-body .portal-bottom-nav .portal-tab {
    min-height: 50px; gap: 3px; border-radius: 13px;
    color: rgba(150, 176, 208, 0.6);
  }
  .portal-body .portal-bottom-nav .portal-tab span {
    font-size: 0.535rem; font-weight: 660; letter-spacing: 0.045em;
    text-transform: uppercase;
  }
  .portal-body .portal-bottom-nav .portal-tab.is-active {
    background: rgba(103, 232, 249, 0.11); color: #eafaff;
  }
  .portal-body .portal-bottom-nav .portal-tab.is-active svg { color: #7fd8f7; }
  /* Content clears the floating bar */
  .portal-body.portal-product-v2 .portal-route-content {
    padding-bottom: calc(96px + env(safe-area-inset-bottom, 0px));
  }
}

/* Longer labels (Performance / Leaderboard) need the wider phones' room */
@media (min-width: 385px) and (max-width: 820px) {
  .portal-body .portal-bottom-nav .portal-tab span { font-size: 0.55rem; letter-spacing: 0.03em; }
}
@media (max-width: 384px) {
  .portal-body .portal-bottom-nav .portal-tab span { font-size: 0.5rem; letter-spacing: 0.01em; }
}

/* ==============================================================
   AUREX MOBILE V4.5 -- density recovery.
   Un-compressing the 2-col desktop splits made Performance and
   Overview slightly taller (correctly -- content is no longer
   squeezed). Recover the height through panel density instead of
   re-compressing the layout.
   ============================================================== */
@media (max-width: 820px) {
  .portal-body .portal-main .pfx-panel { padding: 15px 14px; }
  .portal-body .portal-main .pfx-panel + .pfx-panel { margin-top: 0; }
  .portal-body .portal-main .pfx-panel-eyebrow { margin-bottom: 8px; }
  .portal-body .portal-main .pfx-hero { padding: 18px 16px 16px; }
  .portal-body .portal-main .pfx-inst { min-height: 68px; padding: 11px 12px; }
  .portal-body .portal-main .pfx-split { gap: 10px; }
  .portal-body .portal-main .pfx { gap: 10px; }
  .pov.pfx, .pfl, .cashback-experience.pfx { gap: 10px; }

  /* Recent-activity and history tables scroll internally instead of
     extending the page; every row remains reachable. */
  .portal-body .portal-main .pfx-panel .portal-table-scroll,
  .portal-body .portal-main .cbk-history-scroll {
    max-height: 340px; overflow-y: auto; -webkit-overflow-scrolling: touch;
  }

  /* Ecosystem / continuation panels are closing context, not headline */
  .portal-body .portal-main .portal-ecosystem-panel { padding: 14px; }
  .portal-body .portal-main .portal-ecosystem-panel > * { min-height: 0; }
}

/* ==============================================================
   AUREX MOBILE V5 -- native application layer at <= 560px.
   This is not a density pass. It changes what the phone shows
   first, what it collapses, and what it removes entirely.
   Presentation only: no value is recomputed, no handler moves,
   no authoritative figure is animated.
   Append-only.
   ============================================================== */

/* The wallet block only exists as a phone surface. */
.cashback-experience .cbk-wallet { display: none; }

/* Desktop keeps the benefits list open and un-chromed, exactly as before.
   The <details> element is only an interaction on the phone. */
@media (min-width: 561px) {
  .cashback-experience .cbk-rank-benefits-disclosure > summary { display: none; }
  .cashback-experience .cbk-rank-benefits-disclosure::details-content {
    content-visibility: visible; block-size: auto;
  }
  .cashback-experience .cbk-rank-benefits-disclosure > .cbk-rank-benefits { display: block; }
}

@media (max-width: 560px) {

  /* ==================================================
     V5-1. ONE NAVIGATION SYSTEM
     The ecosystem journey strip is 8 links to carlos, chart-reader,
     strategy-lab, activity, cashback and membership -- every one of
     them already reachable from the bottom nav and the drawer. It
     carries no data hook and no unique action, so on a phone it is
     a second persistent navigation and is removed.
     ================================================== */
  .portal-body .portal-main .portal-journey-strip,
  .portal-body .portal-main .cbk-ecosystem-bridge { display: none; }

  /* ==================================================
     V5-2. TYPOGRAPHY -- one system
     Uppercase micro-labels are reserved for section eyebrows.
     ================================================== */
  .portal-body .portal-main { font-size: 14px; line-height: 1.5; }
  .portal-body .portal-main .pfx-hero-label { font-size: 1.6rem; line-height: 1.2; letter-spacing: -0.015em; }
  .portal-body .portal-main .pfx-primary strong { font-size: 1.9rem; letter-spacing: -0.02em; }
  .portal-body .portal-main .pfx-sub { font-size: 0.85rem; line-height: 1.5; }
  .portal-body .portal-main .pfx-inst strong { font-size: 1.32rem; letter-spacing: -0.01em; }
  .portal-body .portal-main .pfx-inst span { font-size: 0.76rem; letter-spacing: 0; text-transform: none; }
  /* Institutional uppercase stays only on true section eyebrows */
  .portal-body .portal-main .pfx-panel-eyebrow,
  .portal-body .portal-main .pfx-eyebrow,
  .portal-body .portal-main .cbk-group-eyebrow {
    font-size: 0.63rem; letter-spacing: 0.14em; text-transform: uppercase;
  }
  /* Everything else drops the shouting */
  .portal-body .portal-main .cbk-hero-metric span,
  .portal-body .portal-main .cbf-stage > span,
  .portal-body .portal-main .pfl-pod-rank,
  .portal-body .portal-main .cbk-rank-next-eyebrow {
    text-transform: none; letter-spacing: 0.01em; font-size: 0.78rem;
  }
  .portal-body .portal-main strong,
  .portal-body .portal-main .cbk-wallet-balance,
  .portal-body .portal-main td { font-variant-numeric: tabular-nums; }

  /* ==================================================
     V5-3. BUTTONS -- primary / secondary / ghost
     ================================================== */
  .portal-body .portal-main .primary-button,
  .portal-body .portal-main .secondary-button,
  .portal-body .portal-main .text-button {
    -webkit-appearance: none; appearance: none;
    min-height: 48px; border-radius: 13px; font-size: 0.94rem; font-weight: 640;
    letter-spacing: 0; display: inline-flex; align-items: center; justify-content: center;
    gap: 8px; padding: 0 18px; text-transform: none;
    transition: transform 110ms ease, background-color 150ms ease, border-color 150ms ease;
  }
  .portal-body .portal-main .primary-button {
    border: 1px solid rgba(103, 232, 249, 0.55);
    background: linear-gradient(180deg, rgba(103, 232, 249, 0.24), rgba(103, 232, 249, 0.11));
    color: #f2fdff; font-weight: 680;
  }
  .portal-body .portal-main .secondary-button {
    border: 1px solid rgba(140, 178, 214, 0.26);
    background: rgba(255, 255, 255, 0.035); color: rgba(228, 238, 248, 0.92);
  }
  .portal-body .portal-main .text-button {
    border: 0; background: none; color: #7fd8f7; padding: 0 6px;
  }
  .portal-body .portal-main .primary-button:active,
  .portal-body .portal-main .secondary-button:active { transform: scale(0.975); }
  .portal-body .portal-main .primary-button:focus-visible,
  .portal-body .portal-main .secondary-button:focus-visible,
  .portal-body .portal-main .text-button:focus-visible {
    outline: 2px solid rgba(103, 232, 249, 0.7); outline-offset: 2px;
  }
  .portal-body .portal-main .primary-button[disabled] { opacity: 0.42; transform: none; }

  /* ==================================================
     V5-4. CASHBACK WALLET -- the first screen
     ================================================== */
  .cashback-experience .cbk-wallet {
    display: block; order: 1; text-align: left;
    padding: 26px 18px 22px; border-radius: 18px;
    border: 1px solid rgba(103, 232, 249, 0.18);
    background:
      radial-gradient(130% 110% at 0% 0%, rgba(103, 232, 249, 0.14), transparent 62%),
      linear-gradient(180deg, rgba(12, 22, 38, 0.9), rgba(7, 13, 24, 0.9));
    animation: axV5Wallet 420ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }
  .cashback-experience .cbk-wallet-label {
    margin: 0 0 6px; font-size: 0.72rem; font-weight: 600;
    letter-spacing: 0.02em; color: rgba(160, 186, 214, 0.9);
  }
  .cashback-experience .cbk-wallet-balance {
    margin: 0; font-size: clamp(2.6rem, 13.5vw, 3.2rem); font-weight: 700;
    line-height: 1.02; letter-spacing: -0.03em; color: #ffffff;
    font-variant-numeric: tabular-nums;
  }
  .cashback-experience .cbk-wallet-meta {
    margin: 10px 0 0; font-size: 0.82rem; line-height: 1.45;
    color: rgba(170, 194, 220, 0.86);
  }

  /* Mobile reading order: balance -> claim -> progression -> status -> ledger */
  .cashback-experience.pfx { display: grid; gap: 12px; }
  .cashback-experience > .cbk-wallet { order: 1; }
  .cashback-experience > .cbk-group-payout { order: 2; }
  .cashback-experience > .cbk-group-progression { order: 3; }
  .cashback-experience > .cbk-month-select { order: 4; }
  .cashback-experience > .cbk-group-money { order: 5; }
  .cashback-experience > .cbk-bridges { order: 6; }
  .cashback-experience > .pfx-hero { order: 7; }

  /* The page hero is redundant once the wallet leads -- keep it as a
     quiet closing context block rather than a second headline. */
  .cashback-experience > .pfx-hero { padding: 16px; }
  .cashback-experience > .pfx-hero .pfx-hero-label { font-size: 1.05rem; }
  .cashback-experience > .pfx-hero .pfx-signals { display: none; }

  /* Claim is the primary financial action */
  .cashback-experience .cbk-request-card .primary-button {
    width: 100%; min-height: 52px; font-size: 1rem; font-weight: 700;
  }

  /* Month becomes a chip row, not a standalone block */
  .cashback-experience .cbk-month-select {
    padding: 0; border: 0; background: none;
    display: flex; align-items: center; gap: 8px;
    overflow-x: auto; -webkit-overflow-scrolling: touch;
  }
  .cashback-experience .cbk-month-select > * { flex: 0 0 auto; }
  .cashback-experience .cbk-month-select select {
    min-height: 40px; border-radius: 99px; padding: 0 14px;
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(140, 178, 214, 0.22);
    font-size: 0.82rem; color: #e6eef7;
  }

  /* ==================================================
     V5-5. CASHBACK STATUS -- horizontal step timeline
     Six states remain; they stop owning the screen.
     ================================================== */
  .cashback-experience .cashback-flow-rail.cashback-lifecycle {
    display: grid; grid-auto-flow: column; grid-auto-columns: 132px;
    gap: 8px; padding: 14px 14px 12px;
    overflow-x: auto; overflow-y: hidden;
    scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch;
  }
  .cashback-experience .cashback-lifecycle > .cbf-stage {
    display: grid; grid-template-columns: minmax(0, 1fr);
    grid-template-areas: "node" "label" "value";
    align-content: start; gap: 5px; scroll-snap-align: start;
    min-height: 0; padding: 11px 12px; border-radius: 12px;
    border: 1px solid rgba(140, 178, 214, 0.14);
    background: rgba(255, 255, 255, 0.022);
  }
  .cashback-experience .cashback-lifecycle > .cbf-stage::before,
  .cashback-experience .cashback-lifecycle > .cbf-stage::after { display: none; }
  .cashback-experience .cashback-lifecycle > .cbf-stage > .cbf-node {
    grid-area: node; width: 22px; height: 22px; margin: 0;
    display: grid; place-items: center; border-radius: 50%; font-size: 0.66rem;
  }
  .cashback-experience .cashback-lifecycle > .cbf-stage > span {
    grid-area: label; font-size: 0.72rem; line-height: 1.3;
    color: rgba(158, 184, 212, 0.9);
  }
  .cashback-experience .cashback-lifecycle > .cbf-stage > strong {
    grid-area: value; justify-self: start; font-size: 1.02rem; font-weight: 700;
    color: #f2f5f8; font-variant-numeric: tabular-nums;
  }
  /* The per-stage explainer is reference detail, not first-screen content */
  .cashback-experience .cashback-lifecycle > .cbf-stage > .cbf-note { display: none; }
  .cashback-experience .cashback-lifecycle > .cbf-stage.is-current {
    border-color: rgba(103, 232, 249, 0.4);
    background: rgba(103, 232, 249, 0.07);
  }
  .cashback-experience .cashback-lifecycle::-webkit-scrollbar { height: 3px; }
  .cashback-experience .cashback-lifecycle::-webkit-scrollbar-thumb {
    background: rgba(140, 178, 214, 0.3); border-radius: 99px;
  }

  /* The formula explainer is reference material -- it moves out of the way */
  .cashback-experience .cashback-formula-strip { display: none; }

  /* ==================================================
     V5-6. TIER PROGRESSION -- full-width rail with tier nodes
     ================================================== */
  .cashback-experience .cbk-rank-rail {
    display: grid; grid-template-columns: 30px minmax(0, 1fr) 30px;
    grid-template-areas: "bnode track gnode" "blabel meta glabel";
    align-items: center; gap: 8px 9px; width: 100%; margin: 6px 0 14px;
  }
  .cashback-experience .cbk-rank-rail .portal-progress {
    grid-area: track; position: relative; width: 100%; height: 8px;
    border-radius: 99px; overflow: visible;
    background: rgba(140, 178, 214, 0.16);
    border: 0;
  }
  .cashback-experience .cbk-rank-rail .portal-progress > span {
    display: block; height: 100%; border-radius: 99px;
    background: linear-gradient(90deg, #c8a96a, #e7c76a 60%, #ffd9a0);
    box-shadow: 0 0 14px rgba(231, 199, 106, 0.4);
    transform-origin: left center;
    animation: axV5Rail 760ms cubic-bezier(0.22, 1, 0.36, 1) 200ms both;
  }
  /* Tier nodes flank the rail */
  .cashback-experience .cbk-rank-rail-anchors {
    display: contents;
  }
  .cashback-experience .cbk-rail-anchor {
    font-size: 0.7rem; font-weight: 700; letter-spacing: 0.06em;
    text-transform: uppercase; line-height: 1;
  }
  .cashback-experience .cbk-rail-anchor.cbk-rail-current { grid-area: blabel; color: #e0e8f2; }
  .cashback-experience .cbk-rail-anchor.cbk-rail-next { grid-area: glabel; color: #e7c76a; text-align: right; }
  .cashback-experience .cbk-rank-rail::before {
    content: ""; grid-area: bnode; width: 26px; height: 26px; border-radius: 50%;
    border: 1.5px solid rgba(231, 199, 106, 0.75); background: rgba(231, 199, 106, 0.16);
  }
  .cashback-experience .cbk-rank-rail::after {
    content: ""; grid-area: gnode; width: 26px; height: 26px; border-radius: 50%;
    border: 1.5px dashed rgba(231, 199, 106, 0.5); background: rgba(231, 199, 106, 0.05);
  }
  .cashback-experience .cbk-rank-remaining {
    grid-area: meta; margin: 0; font-size: 0.76rem; line-height: 1.35;
    text-align: center; color: rgba(178, 200, 224, 0.86);
  }
  .cashback-experience .cbk-rank-remaining strong { color: #ffd9a0; }

  /* Next unlock condenses to one statement line */
  .cashback-experience .cbk-rank-next-unlock { padding: 13px 14px; border-radius: 13px; }
  .cashback-experience .cbk-rank-next-head { gap: 8px; }
  .cashback-experience .cbk-rank-next-head strong { font-size: 1.05rem; }
  .cashback-experience .cbk-rank-next-head b { font-size: 0.9rem; color: #e7c76a; }

  /* Benefits become a disclosure */
  .cashback-experience .cbk-rank-benefits-disclosure { margin-top: 10px; }
  .cashback-experience .cbk-rank-benefits-disclosure > summary {
    list-style: none; cursor: pointer; min-height: 44px;
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    padding: 0 2px; font-size: 0.84rem; font-weight: 620; color: #7fd8f7;
  }
  .cashback-experience .cbk-rank-benefits-disclosure > summary::-webkit-details-marker { display: none; }
  .cashback-experience .cbk-rank-benefits-disclosure > summary::after {
    content: ""; width: 8px; height: 8px; flex: 0 0 auto;
    border-right: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor;
    transform: rotate(45deg) translate(-2px, -2px);
    transition: transform 200ms ease;
  }
  .cashback-experience .cbk-rank-benefits-disclosure[open] > summary::after {
    transform: rotate(-135deg) translate(-3px, -3px);
  }
  .cashback-experience .cbk-rank-benefits-disclosure > .cbk-rank-benefits {
    margin: 6px 0 0; padding-left: 16px;
  }
  .cashback-experience .cbk-rank-benefits li { font-size: 0.78rem; line-height: 1.45; }

  /* ==================================================
     V5-7. LEADERBOARD -- competition first
     ================================================== */
  .pfl { display: grid; gap: 12px; }
  .pfl > .pfl-you-card { order: 1; }
  .pfl > .pfl-podium { order: 2; }
  .pfl > .pfl-table-panel { order: 3; }
  .pfl > .pfx-hero { order: 4; }
  .pfl > .leaderboard-identity-panel { order: 5; }
  .pfl > .pfl-nav { order: 6; }

  .pfl > .pfx-hero { padding: 16px; }
  .pfl > .pfx-hero .pfx-hero-label { font-size: 1.05rem; }

  /* Your rank is the headline */
  .pfl .pfl-you-card {
    padding: 22px 18px 18px; border-radius: 18px;
    animation: axV5You 420ms cubic-bezier(0.22, 1, 0.36, 1) 120ms both;
  }
  .pfl .pfl-you-rank, .pfl .pfl-you-card .pfl-you-position {
    font-size: clamp(2.6rem, 13vw, 3.1rem); font-weight: 700;
    line-height: 1; letter-spacing: -0.03em; color: #ffffff;
    font-variant-numeric: tabular-nums;
  }
  .pfl .pfl-gap-rail { width: 100%; margin-top: 12px; }
  .pfl .pfl-gap-rail .portal-progress > span {
    transform-origin: left center;
    animation: axV5Rail 760ms cubic-bezier(0.22, 1, 0.36, 1) 320ms both;
  }

  /* Podium: champion dominant, signed-in user clearly marked */
  .pfl .pfl-podium {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-areas: "champ champ" "second third";
    gap: 10px; padding: 14px 12px;
  }
  .pfl .pfl-podium .pfl-pod-1 { grid-area: champ; }
  .pfl .pfl-podium .pfl-pod-2 { grid-area: second; }
  .pfl .pfl-podium .pfl-pod-3 { grid-area: third; }
  .pfl .pfl-pod {
    min-width: 0; padding: 14px 12px; border-radius: 14px;
    animation: axV5Pod 420ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }
  .pfl .pfl-pod-1 {
    padding: 20px 16px; text-align: center;
    border: 1px solid rgba(231, 199, 106, 0.36);
    background:
      radial-gradient(120% 130% at 50% 0%, rgba(231, 199, 106, 0.17), transparent 66%),
      rgba(255, 255, 255, 0.02);
    animation-delay: 60ms;
  }
  .pfl .pfl-pod-2 { animation-delay: 240ms; }
  .pfl .pfl-pod-3 { animation-delay: 320ms; }
  .pfl .pfl-pod.is-you {
    border-color: rgba(103, 232, 249, 0.5);
    background: rgba(103, 232, 249, 0.08);
  }
  /* Names never truncate */
  .pfl .pfl-pod-name {
    white-space: normal; overflow-wrap: anywhere; text-overflow: clip;
    font-size: 0.84rem; font-weight: 640; line-height: 1.25;
  }
  .pfl .pfl-pod-1 .pfl-pod-name { font-size: 1.3rem; font-weight: 700; color: #fff6e2; }
  .pfl .pfl-pod-1 .pfl-pod-lots { font-size: 1rem; font-weight: 660; }
  .pfl .pfl-pod-lots, .pfl .pfl-pod-reward { font-variant-numeric: tabular-nums; }
  .pfl .pfl-pod-rank { font-size: 0.72rem; font-weight: 700; }
  .pfl .pfl-pod-1 .pfl-pod-rank { font-size: 0.95rem; color: #e7c76a; }

  /* Ranked list rows resolve after the podium */
  .pfl .pfl-table-panel .leaderboard-row { min-height: 46px; }
}

@keyframes axV5Wallet { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes axV5You    { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes axV5Pod    { from { opacity: 0; transform: translateY(16px) scale(0.965); } to { opacity: 1; transform: none; } }
@keyframes axV5Rail   { from { transform: scaleX(0); } to { transform: scaleX(1); } }

@media (prefers-reduced-motion: reduce) {
  .cashback-experience .cbk-wallet,
  .cashback-experience .cbk-rank-rail .portal-progress > span,
  .pfl .pfl-you-card, .pfl .pfl-pod,
  .pfl .pfl-gap-rail .portal-progress > span { animation: none !important; }
  .cashback-experience .cbk-rank-benefits-disclosure > summary::after,
  .portal-body .portal-main .primary-button,
  .portal-body .portal-main .secondary-button { transition: none !important; }
}

/* ==============================================================
   AUREX MOBILE V5.1 -- grid blowout containment.
   Measured at 390px: .cbk-group-payout computed 730px inside a
   366px grid parent. Grid and flex items default to min-width:auto,
   so a wide min-content child (table/long token) forces the track
   wider than the viewport. This is what produced the truncated
   labels and the 672px-wide claim button.
   ============================================================== */
@media (max-width: 560px) {
  /* Every grid/flex item may shrink below its content */
  .portal-body .portal-main .pfx > *,
  .portal-body .portal-main .cashback-experience > *,
  .portal-body .portal-main .cbk-group > *,
  .portal-body .portal-main .portal-chart-grid > *,
  .portal-body .portal-main .portal-chart-card > *,
  .portal-body .portal-main .pfx-split > *,
  .portal-body .portal-main .pfx-panel > *,
  .portal-body .portal-main .pfl > * { min-width: 0; }

  .portal-body .portal-main .cbk-group,
  .portal-body .portal-main .cbk-group-payout,
  .portal-body .portal-main .cbk-group-money,
  .portal-body .portal-main .cbk-group-progression,
  .portal-body .portal-main .portal-chart-grid,
  .portal-body .portal-main .portal-chart-card,
  .portal-body .portal-main .pfx-panel,
  .portal-body .portal-main .cashback-experience > * {
    min-width: 0; max-width: 100%;
  }

  /* Long unbroken strings wrap instead of widening the track */
  .portal-body .portal-main .cbk-group,
  .portal-body .portal-main .pfx-panel,
  .portal-body .portal-main .cbk-wallet { overflow-wrap: anywhere; }

  /* Wide tables scroll inside their own box, never the page */
  .portal-body .portal-main table { display: block; max-width: 100%; overflow-x: auto; }

  /* Buttons must not be sized by an overflowing track */
  .portal-body .portal-main .primary-button,
  .portal-body .portal-main .secondary-button { max-width: 100%; }

  /* ---- Metadata legibility (no sub-11px text) ---- */
  .portal-body .portal-main .cbk-rank-row > strong:last-of-type,
  .portal-body .portal-main .cbk-rank-next-eyebrow,
  .portal-body .portal-main .pjs-continue,
  .portal-body .portal-main small,
  .portal-body .portal-main em { font-size: 0.72rem; }
  .portal-body .portal-main .cbk-rank-row span small { font-size: 0.72rem; }

  /* ---- Touch: month chip reaches 44px ---- */
  .cashback-experience .cbk-month-select select,
  .cashback-experience .cbk-month-select button { min-height: 44px; }
}

/* ==============================================================
   AUREX MOBILE V5.2 -- promote the real wallet component.
   Measured: the authoritative balance AND the real claim control
   already live together inside .cbk-hero-available. Rather than
   render a second balance, mobile promotes that component to the
   top of the page. The claim button is the existing element with
   its existing handler -- nothing is duplicated or re-bound.
   Also neutralises .portal-chart-card, a 3-column desktop grid
   (125px 0px 162px) that was collapsing the tier rail to 48px.
   ============================================================== */
@media (max-width: 560px) {

  /* Chart cards are single-column on a phone */
  .portal-body .portal-main .portal-chart-card,
  .portal-body .portal-main .portal-tier-progress {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px;
  }

  /* ---- Reading order: money (balance + claim) leads ---- */
  .cashback-experience > .cbk-group-money { order: 1; }
  .cashback-experience > .cbk-wallet-meta { order: 2; }
  .cashback-experience > .cbk-group-progression { order: 3; }
  .cashback-experience > .cbk-group-payout { order: 4; }
  .cashback-experience > .cbk-month-select { order: 5; }
  .cashback-experience > .cbk-bridges { order: 6; }
  .cashback-experience > .pfx-hero { order: 7; }

  /* Inside money: the available-balance block is the wallet */
  .cashback-experience .cbk-group-money > .cbk-group-eyebrow { display: none; }
  .cashback-experience .cashback-hero.cashback-signature {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px;
    padding: 0; border: 0; background: none;
  }
  .cashback-experience .cashback-signature .cbk-hero-available {
    grid-column: 1 / -1; order: -1;
    padding: 24px 18px 20px; border-radius: 18px;
    border: 1px solid rgba(103, 232, 249, 0.2);
    background:
      radial-gradient(130% 110% at 0% 0%, rgba(103, 232, 249, 0.14), transparent 62%),
      linear-gradient(180deg, rgba(12, 22, 38, 0.92), rgba(7, 13, 24, 0.92));
    animation: axV5Wallet 420ms cubic-bezier(0.22, 1, 0.36, 1) both;
  }
  .cashback-experience .cbk-hero-available > span {
    font-size: 0.74rem; font-weight: 600; letter-spacing: 0.01em;
    text-transform: none; color: rgba(162, 188, 216, 0.92);
  }
  .cashback-experience .cbk-hero-available > strong {
    display: block; margin: 4px 0 0;
    font-size: clamp(2.6rem, 13.5vw, 3.2rem); font-weight: 700;
    line-height: 1.02; letter-spacing: -0.03em; color: #ffffff;
    font-variant-numeric: tabular-nums;
  }
  /* The existing claim control becomes the primary financial action */
  .cashback-experience .cbk-hero-available .primary-button {
    display: flex; width: 100%; margin-top: 16px;
    min-height: 52px; font-size: 1rem; font-weight: 700;
  }

  /* The compact secondary line sits directly under the wallet */
  .cashback-experience > .cbk-wallet-meta {
    margin: 0; padding: 0 4px;
    font-size: 0.85rem; line-height: 1.45; color: rgba(172, 196, 222, 0.9);
  }

  /* Remaining hero metrics read as a quiet 2-up ledger below */
  .cashback-experience .cashback-signature .cbk-hero-metric {
    min-height: 0; padding: 12px 13px; border-radius: 12px;
  }
  .cashback-experience .cashback-signature .cbk-hero-next { grid-column: auto; }
}

/* ==============================================================
   AUREX MOBILE V5.3 -- named-area reset.
   .portal-tier-progress places children with grid-template-areas
   ("rail", etc.), so overriding grid-template-columns alone did
   nothing -- the area map kept re-establishing three columns and
   held the tier rail at 76px. Clear the map and the item
   placements so the card stacks in one full-width column.
   ============================================================== */
@media (max-width: 560px) {
  .portal-body .portal-main .portal-tier-progress,
  .portal-body .portal-main .cbk-rank-card {
    grid-template-areas: none !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-auto-flow: row;
  }
  .portal-body .portal-main .portal-tier-progress > * {
    grid-area: auto !important;
    grid-column: 1 / -1 !important;
    min-width: 0;
  }
  /* The rail keeps its own internal area map -- restore it after the reset */
  .cashback-experience .cbk-rank-rail {
    grid-template-areas: "bnode track gnode" "blabel meta glabel" !important;
    grid-template-columns: 30px minmax(0, 1fr) 30px !important;
  }
  .cashback-experience .cbk-rank-rail > .portal-progress { grid-area: track !important; }
  .cashback-experience .cbk-rail-anchor.cbk-rail-current { grid-area: blabel !important; }
  .cashback-experience .cbk-rail-anchor.cbk-rail-next { grid-area: glabel !important; }
  .cashback-experience .cbk-rank-remaining { grid-area: auto !important; }
}

/* Mobile-only caption: must not appear on desktop. (The earlier hide rule
   named .cbk-wallet, which was renamed to .cbk-wallet-meta.) */
.cashback-experience > .cbk-wallet-meta { display: none; }
@media (max-width: 560px) {
  .cashback-experience > .cbk-wallet-meta { display: block; }
}

/* ==============================================================
   AUREX MOBILE V6 -- COMPOSITION, not styling.
   Desktop nests: .cbk-group-money > .cashback-signature > [balance
   + 4 metric tiles], with the formula strip and the 6-stage
   lifecycle as further siblings. That nesting is why the phone's
   first screen could not be cleaned by ordering alone -- the
   balance and the lifecycle were never siblings.
   display:contents flattens those two wrappers on the phone only,
   so every block becomes a direct child of .cashback-experience
   and can be placed independently. No element is duplicated, no
   value re-rendered, no handler moved.
   ============================================================== */
@media (max-width: 560px) {

  /* Flatten desktop's nesting so mobile can compose freely */
  .cashback-experience > .cbk-group-money,
  .cashback-experience .cashback-hero.cashback-signature { display: contents; }

  /* ---- First viewport: balance, action, one summary line ---- */
  .cashback-experience > .cbk-hero-available,
  .cashback-experience .cbk-hero-available { order: 1; }
  .cashback-experience > .cbk-wallet-meta { order: 2; }
  .cashback-experience > .cbk-group-progression { order: 3; }
  .cashback-experience .cashback-flow-rail.cashback-lifecycle { order: 4; }
  .cashback-experience > .cbk-group-payout { order: 5; }
  .cashback-experience > .cbk-month-select { order: 6; }
  .cashback-experience > .cbk-bridges { order: 7; }
  .cashback-experience > .pfx-hero { order: 8; }

  /* The four secondary hero tiles repeat figures shown in the tier
     panel and the status section directly below. They leave the
     first screen rather than competing with the balance. */
  .cashback-experience .cbk-hero-activity,
  .cashback-experience .cbk-hero-rank,
  .cashback-experience .cbk-hero-earned,
  .cashback-experience .cbk-hero-next,
  .cashback-experience .cbk-hero-next-progress { display: none; }

  /* Balance block stands alone -- no nested card chrome */
  .cashback-experience .cbk-hero-available {
    padding: 24px 18px 20px; border-radius: 18px; margin: 0;
    border: 1px solid rgba(103, 232, 249, 0.18);
    background: linear-gradient(180deg, rgba(13, 24, 40, 0.92), rgba(7, 13, 24, 0.92));
  }
}

/* ==============================================================
   AUREX MOBILE V6.1 -- type floor + de-duplication.
   Measured in the 390px first viewport: labels at 10.24 / 11 /
   11.2 / 11.52px, and the current-tier string rendered three
   times (summary line, tier identity, rail anchor).
   ============================================================== */
@media (max-width: 560px) {
  /* Nothing meaningful renders below 12px */
  .portal-body .portal-main .cbk-group-eyebrow,
  .portal-body .portal-main .pfx-panel-eyebrow,
  .portal-body .portal-main .pfx-eyebrow {
    font-size: 0.78rem; letter-spacing: 0.06em;
  }
  .portal-body .portal-main .cbk-rank-identity span,
  .portal-body .portal-main .cbk-rank-lifetime span,
  .portal-body .portal-main .cbk-rank-next-eyebrow,
  .portal-body .portal-main .cbk-hero-available > span,
  .portal-body .portal-main .cbk-rail-anchor,
  .portal-body .portal-main .cbk-rank-uplift,
  .portal-body .portal-main small,
  .portal-body .portal-main em { font-size: 0.82rem; letter-spacing: 0; }
  .portal-body .portal-main .cbk-rank-remaining { font-size: 0.85rem; }

  /* The rail already names both tiers; the identity block repeating the
     current tier is the third copy on one screen. Keep the rail. */
  .cashback-experience .cbk-rank-identity { display: none; }

  /* Rate figures read as values, not footnotes */
  .portal-body .portal-main .cbk-rank-next-head b,
  .portal-body .portal-main .cbk-rank-lifetime strong { font-size: 1.05rem; }
}

/* ==============================================================
   AUREX MOBILE SHELL V7 -- visual system for the new icon family.
   Presentation only. Icon geometry lives in portal/index.html;
   this sizes, spaces and colours the shell around it.
   Accents apply to the glyph, the active rail and the selected
   surface only -- never as a card background.
   ============================================================== */
@media (max-width: 820px) {

  /* ---- HEADER: 58px, 44px controls, breathing room ---- */
  .portal-body .portal-mobile-topbar {
    display: grid; grid-template-columns: 44px auto 1fr auto;
    align-items: center; gap: 10px; min-height: 58px;
    padding: calc(6px + env(safe-area-inset-top, 0px)) 12px 6px;
    background: rgba(6, 12, 22, 0.92);
    backdrop-filter: saturate(150%) blur(20px);
    -webkit-backdrop-filter: saturate(150%) blur(20px);
    border-bottom: 1px solid rgba(140, 178, 214, 0.12);
  }
  .portal-body .portal-mobile-menu {
    width: 44px; height: 44px; border-radius: 12px; border: 0;
    background: none; color: rgba(214, 228, 242, 0.9);
    display: grid; place-items: center;
    transition: background-color 150ms ease;
  }
  .portal-body .portal-mobile-menu:active { background: rgba(255, 255, 255, 0.06); }
  .portal-body .portal-mobile-menu svg { width: 21px; height: 21px; }

  .portal-body .portal-mobile-brand {
    display: inline-grid; grid-template-columns: auto auto; align-items: center;
    gap: 10px; text-decoration: none; min-width: 0;
  }
  .portal-body .portal-mobile-mark { width: 27px; height: 27px; color: #e7c76a; }
  .portal-body .portal-mobile-mark svg {
    width: 100%; height: 100%; display: block; shape-rendering: geometricPrecision;
  }
  .portal-body .portal-mobile-wordmark {
    display: grid; gap: 2px; min-width: 0; line-height: 1;
    font-size: 1.02rem; font-weight: 700; letter-spacing: 0.13em; color: #f5f8fb;
  }
  .portal-body .portal-mobile-wordmark small {
    font-size: 0.62rem; font-weight: 500; letter-spacing: 0.09em;
    text-transform: none; color: rgba(158, 184, 212, 0.78);
  }
  .portal-body .portal-mobile-actions {
    grid-column: 4; display: inline-flex; align-items: center; gap: 6px;
  }
  .portal-body .portal-mobile-bell {
    width: 44px; height: 44px; border-radius: 12px; border: 0; background: none;
    color: rgba(214, 228, 242, 0.9); display: grid; place-items: center;
  }
  .portal-body .portal-mobile-bell svg { width: 20px; height: 20px; }
  .portal-body .portal-mobile-avatar {
    width: 34px; height: 34px; border-radius: 50%;
    display: grid; place-items: center;
    border: 1px solid rgba(140, 178, 214, 0.26);
    background: rgba(255, 255, 255, 0.04);
    font-size: 0.7rem; font-weight: 650; letter-spacing: 0.03em; color: #dbe8f5;
  }

  /* ---- DRAWER: native navigator ---- */
  .portal-body .portal-mobile-drawer {
    width: 86vw; max-width: 340px;
    transition: transform 240ms cubic-bezier(0.22, 0.7, 0.2, 1);
  }
  .portal-body .portal-mobile-drawer-nav { padding: 12px 10px 18px; gap: 22px; }
  .portal-body .portal-mobile-drawer-nav.axr .axr-group { gap: 2px; }
  .portal-body .portal-mobile-drawer-nav.axr .axr-group-label {
    font-size: 0.64rem; font-weight: 650; letter-spacing: 0.16em;
    text-transform: uppercase; color: rgba(146, 172, 202, 0.62);
    padding: 0 12px 8px;
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-link {
    grid-template-columns: 28px minmax(0, 1fr); gap: 14px;
    min-height: 54px; padding: 0 12px; border-radius: 12px;
    transition: background-color 170ms ease;
  }
  /* No tile, no chip -- the glyph sits directly on the surface */
  .portal-body .portal-mobile-drawer-nav.axr .axr-glyph {
    width: 28px; height: 28px; border: 0; background: none; border-radius: 0;
    display: grid; place-items: center;
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-glyph svg {
    width: 20px; height: 20px;
    color: rgba(var(--axr-accent, 150, 176, 208), 0.82);
    transition: color 170ms ease;
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-label {
    font-size: 0.94rem; font-weight: 520; letter-spacing: -0.003em;
    color: rgba(222, 233, 245, 0.88); white-space: nowrap;
    overflow: hidden; text-overflow: ellipsis;
    transition: color 170ms ease;
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-link.is-active {
    background: rgba(var(--axr-accent, 150, 176, 208), 0.09);
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-link.is-active::before {
    content: ""; position: absolute; left: 0; top: 50%;
    transform: translateY(-50%);
    width: 3px; height: 26px; border-radius: 0 3px 3px 0;
    background: rgb(var(--axr-accent, 150, 176, 208));
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-link.is-active .axr-glyph svg {
    color: rgb(var(--axr-accent, 150, 176, 208));
  }
  .portal-body .portal-mobile-drawer-nav.axr .axr-link.is-active .axr-label {
    color: #ffffff; font-weight: 640;
  }

  /* ---- DRAWER FOOTER: account row, quiet sign out ---- */
  .portal-body .portal-mobile-drawer-foot {
    display: grid; grid-template-columns: 36px minmax(0, 1fr) auto;
    align-items: center; gap: 11px;
    padding: 14px 14px calc(14px + env(safe-area-inset-bottom, 0px));
  }
  .portal-body .portal-mobile-account { display: contents; }
  .portal-body .portal-mobile-account-mark {
    grid-column: 1; width: 36px; height: 36px; border-radius: 50%;
    display: grid; place-items: center;
    border: 1px solid rgba(231, 199, 106, 0.3);
    background: rgba(231, 199, 106, 0.09);
    font-size: 0.7rem; font-weight: 650; color: #e7c76a;
  }
  .portal-body .portal-mobile-account-meta {
    grid-column: 2; display: grid; gap: 2px; min-width: 0;
  }
  .portal-body .portal-mobile-account-meta b {
    font-size: 0.86rem; font-weight: 600; color: #eef4fa;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .portal-body .portal-mobile-account-meta small {
    font-size: 0.7rem; letter-spacing: 0; text-transform: none;
    color: rgba(150, 176, 208, 0.66);
  }
  .portal-body .portal-mobile-drawer-signout {
    grid-column: 3; min-height: 40px; padding: 0 12px;
    border: 0; background: none; border-radius: 10px;
    font-size: 0.82rem; font-weight: 560; color: rgba(168, 192, 216, 0.9);
    white-space: nowrap;
  }
  .portal-body .portal-mobile-drawer-signout:active { background: rgba(255, 255, 255, 0.05); }

  /* ---- BOTTOM NAV ---- */
  .portal-body:not(.portal-secure-gated) .portal-bottom-nav {
    left: 0; right: 0; bottom: 0; width: auto; border-radius: 0;
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid rgba(140, 178, 214, 0.13);
    background: rgba(6, 12, 22, 0.95);
    backdrop-filter: saturate(150%) blur(20px);
    -webkit-backdrop-filter: saturate(150%) blur(20px);
    box-shadow: none;
  }
  .portal-body .portal-bottom-nav .portal-tab {
    min-height: 50px; gap: 5px; border-radius: 12px;
    color: rgba(146, 172, 202, 0.72);
    transition: color 170ms ease, background-color 170ms ease;
  }
  .portal-body .portal-bottom-nav .portal-tab svg { width: 22px; height: 22px; }
  .portal-body .portal-bottom-nav .portal-tab span {
    font-size: 0.63rem; font-weight: 560; letter-spacing: 0.01em;
    text-transform: none;
  }
  .portal-body .portal-bottom-nav .portal-tab.is-active {
    color: #eafaff; background: rgba(103, 232, 249, 0.1);
  }
  .portal-body .portal-bottom-nav .portal-tab.is-active svg { color: #7fd8f7; }
}

@media (prefers-reduced-motion: reduce) {
  .portal-body .portal-mobile-drawer,
  .portal-body .portal-mobile-drawer-nav.axr .axr-link,
  .portal-body .portal-bottom-nav .portal-tab { transition: none !important; }
}

/* ==============================================================
   AUREX MOBILE SHELL V7.1 -- measured corrections.
   Live at 390px the V7 block lost four declarations to earlier,
   more specific rules:
     drawer width resolved 286px (73vw) not the 86vw asked for;
     the active row's accent surface computed transparent while
     only its ::before rail applied;
     the "Private Client" subtitle sat at 9.92px;
     group labels at 10.24px.
   Raised to id/body-class specificity so they actually win.
   ============================================================== */
@media (max-width: 820px) {

  /* Drawer width: 86vw with a sane cap */
  .portal-body.portal-product-v2 .portal-mobile-drawer,
  .portal-body #portalMobileDrawer {
    width: 86vw; max-width: 344px;
  }

  /* Active row: accent surface must accompany the rail */
  .portal-body #portalMobileDrawerNav.axr .axr-link.is-active {
    background: rgba(var(--axr-accent, 150, 176, 208), 0.1);
  }
  .portal-body #portalMobileDrawerNav.axr .axr-link.is-active .axr-glyph svg {
    color: rgb(var(--axr-accent, 150, 176, 208));
  }
  .portal-body #portalMobileDrawerNav.axr .axr-link.is-active .axr-label {
    color: #ffffff; font-weight: 640;
  }

  /* Readable supporting type -- nothing in the shell under 11px */
  .portal-body .portal-mobile-topbar .portal-mobile-wordmark small {
    font-size: 0.7rem; letter-spacing: 0.06em;
  }
  .portal-body #portalMobileDrawerNav.axr .axr-group-label {
    font-size: 0.7rem; letter-spacing: 0.13em;
  }
}

@media (max-width: 820px) {
  /* Active-row accent surface. Raised to !important after live testing
     showed the declaration losing despite id-level specificity and last
     source position. */
  .portal-body #portalMobileDrawerNav.axr .axr-link.is-active {
    background: rgba(var(--axr-accent, 150, 176, 208), 0.1) !important;
  }
  .portal-body #portalMobileDrawerNav.axr .axr-link.is-active .axr-glyph svg {
    color: rgb(var(--axr-accent, 150, 176, 208)) !important;
  }
}

/* ==============================================================
   AUREX MOBILE V8 -- first-viewport simplification.
   Composition change (pages.js) replaced the single run-on caption
   with a two-stat row plus one "lots to next tier" line, so the
   first screen can carry exactly the six items in the acceptance
   list and nothing else. Styling here is deliberately minimal.
   Presentation only -- same authoritative values.
   ============================================================== */

/* Phone-only surfaces */
.cashback-experience > .cbk-wallet-summary,
.cashback-experience > .cbk-wallet-next { display: none; }

@media (max-width: 560px) {

  .cashback-experience > .cbk-wallet-summary {
    display: grid; grid-template-columns: 1fr 1fr; gap: 0;
    order: 2; padding: 16px; border-radius: 14px;
    border: 1px solid rgba(140, 178, 214, 0.14);
    background: rgba(255, 255, 255, 0.022);
  }
  .cashback-experience .cbk-wallet-summary > div { display: grid; gap: 3px; min-width: 0; }
  .cashback-experience .cbk-wallet-summary > div + div {
    padding-left: 16px; border-left: 1px solid rgba(140, 178, 214, 0.12);
  }
  .cashback-experience .cbk-wallet-summary strong {
    font-size: 1.4rem; font-weight: 650; letter-spacing: -0.015em; color: #f4f8fc;
    font-variant-numeric: tabular-nums; line-height: 1.15;
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .cashback-experience .cbk-wallet-summary span {
    font-size: 0.8rem; font-weight: 500; letter-spacing: 0;
    text-transform: none; color: rgba(156, 182, 210, 0.86);
  }

  .cashback-experience > .cbk-wallet-next {
    display: block; order: 3; margin: 0; padding: 0 4px;
    font-size: 0.9rem; line-height: 1.4; color: rgba(178, 200, 224, 0.9);
  }

  /* Tier detail, status and everything else sit below the fold */
  .cashback-experience > .cbk-group-progression { order: 4; }
  .cashback-experience .cashback-flow-rail.cashback-lifecycle { order: 5; }
  .cashback-experience > .cbk-group-payout { order: 6; }
  .cashback-experience > .cbk-month-select { order: 7; }
  .cashback-experience > .cbk-bridges { order: 8; }
  .cashback-experience > .pfx-hero { order: 9; }

  /* ---- Duplication removal (section 11) ----
     Lots verified and current tier now appear once, in the summary row
     above. The tier card's own copies are redundant on a phone. */
  .cashback-experience .cbk-rank-lifetime { display: none; }

  /* Balance block: value dominates, one supporting line, one action */
  .cashback-experience .cbk-hero-available > strong {
    font-size: clamp(2.4rem, 12vw, 2.8rem); letter-spacing: -0.03em;
  }

  /* ---- Fewer borders (section 14) ----
     Related information shares one surface instead of nesting. */
  .cashback-experience .cbk-group > .portal-chart-grid,
  .cashback-experience .cbk-group-progression > .portal-chart-grid {
    border: 0; background: none; padding: 0;
  }

  /* ---- Normal phone spacing (section 12) ---- */
  .portal-body .portal-main .cashback-experience.pfx { gap: 20px; }
  .portal-body .portal-main .pfx-panel,
  .portal-body .portal-main .portal-chart-card { padding: 16px; }
}

/* ==============================================================
   AUREX MOBILE V8.1 -- duplication + first-screen clutter.
   Measured at 390px: 20 text nodes in the first viewport, with the
   current tier printed at y=244 and again at y=470, and the
   lots-remaining figure at y=329 and again at y=587. The tier card
   was repeating what the summary row above it already states.
   ============================================================== */
@media (max-width: 560px) {

  /* The summary row owns "current tier" and "lots to next tier".
     The tier card keeps the rail, the rate comparison and benefits. */
  .cashback-experience .cbk-rank-rail-anchors,
  .cashback-experience .cbk-rank-remaining { display: none; }

  /* Rail keeps its endpoints via the nodes; no duplicate labels needed */
  .cashback-experience .cbk-rank-rail {
    grid-template-areas: "bnode track gnode" !important;
    grid-template-columns: 22px minmax(0, 1fr) 22px !important;
    align-items: center; gap: 10px; margin: 4px 0 14px;
  }
  .cashback-experience .cbk-rank-rail::before,
  .cashback-experience .cbk-rank-rail::after { width: 22px; height: 22px; }

  /* Section heading readable (was 10.24px) */
  .cashback-experience .cbk-group-eyebrow,
  .portal-body .portal-main .cbk-group-eyebrow {
    font-size: 0.8rem; letter-spacing: 0.08em; font-weight: 620;
  }

  /* Benefits stay collapsed until asked for */
  .cashback-experience .cbk-rank-benefits-disclosure:not([open]) > .cbk-rank-benefits {
    display: none;
  }
  /* The rank modal must never contribute text to the page flow */
  .cashback-experience .cbk-rank-modal:not([open]),
  .cashback-experience dialog:not([open]) { display: none; }
}

/* ==============================================================
   AUREX MOBILE V9 -- cashback status as a list, not a card rail.
   The horizontal rail was rendering broken: V4.2 set the stage to
   three columns (30px | 1fr | auto) while V5 set single-column
   grid-template-areas. The two disagreed, so label and value
   resolved to 28px and wrapped one character per line
   ("Earn/ed/this/perio/d"), with the numbered badge overlapping.
   Section 7 asks for a plain label -> value list anyway, so the
   rail is replaced rather than repaired. All six authoritative
   states remain; nothing is recalculated.
   ============================================================== */
@media (max-width: 560px) {

  /* Reset every competing layout declaration on the rail and stages */
  .cashback-experience .cashback-flow-rail.cashback-lifecycle {
    display: block !important;
    grid-template-columns: none !important;
    grid-auto-flow: row !important;
    grid-auto-columns: auto !important;
    overflow: visible !important;
    padding: 4px 0 0 !important;
  }
  .cashback-experience .cashback-lifecycle > .cbf-stage {
    display: grid !important;
    grid-template-areas: "label value" !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: baseline;
    gap: 12px !important;
    min-height: 0 !important;
    padding: 13px 2px !important;
    margin: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: none !important;
    box-shadow: none !important;
  }
  .cashback-experience .cashback-lifecycle > .cbf-stage + .cbf-stage {
    border-top: 1px solid rgba(140, 178, 214, 0.1) !important;
  }
  .cashback-experience .cashback-lifecycle > .cbf-stage::before,
  .cashback-experience .cashback-lifecycle > .cbf-stage::after { content: none !important; }

  /* The numbered badge is what overlapped the text -- a list needs no index */
  .cashback-experience .cashback-lifecycle > .cbf-stage > .cbf-node { display: none !important; }

  .cashback-experience .cashback-lifecycle > .cbf-stage > span {
    grid-area: label !important;
    font-size: 0.9rem; font-weight: 500; line-height: 1.35;
    color: rgba(196, 214, 234, 0.92);
    text-transform: none; letter-spacing: 0;
    white-space: normal; overflow-wrap: normal; word-break: normal;
  }
  .cashback-experience .cashback-lifecycle > .cbf-stage > strong {
    grid-area: value !important;
    justify-self: end; white-space: nowrap;
    font-size: 1rem; font-weight: 650; color: #f4f8fc;
    font-variant-numeric: tabular-nums;
  }
  /* Explanations belong in the expanded view, not the summary list */
  .cashback-experience .cashback-lifecycle > .cbf-stage > .cbf-note { display: none !important; }
  .cashback-experience .cashback-lifecycle > .cbf-stage.is-empty { opacity: 1; }
  .cashback-experience .cashback-lifecycle > .cbf-stage.is-empty > strong {
    color: rgba(186, 205, 226, 0.55);
  }

  /* Nothing in the page may break mid-word */
  .portal-body .portal-main .cashback-experience,
  .portal-body .portal-main .cashback-experience * {
    word-break: normal; overflow-wrap: normal; hyphens: none;
  }

  /* ---- Bottom nav: quiet the selected state (no cyan blob) ---- */
  .portal-body .portal-bottom-nav .portal-tab.is-active {
    background: none; color: #eef6fb;
  }
  .portal-body .portal-bottom-nav .portal-tab.is-active svg { color: #e7c76a; }
  .portal-body .portal-bottom-nav .portal-tab.is-active span { font-weight: 640; }

  /* ---- One surface, not card-in-card (section 14) ---- */
  .cashback-experience .cbk-rank-next-unlock {
    border: 0; background: none; padding: 14px 0 0;
    border-top: 1px solid rgba(140, 178, 214, 0.12);
    border-radius: 0;
  }
}

/* ==============================================================
   AUREX MOBILE V10 -- header controls.
   The notification badge carries the `hidden` attribute but an
   earlier rule set display:grid on the class, so a red "0" was
   painted permanently. `hidden` must win.
   The mark is now a filled letterform, so it needs no stroke sizing.
   ============================================================== */

/* An element with [hidden] is hidden. This outranks the class rule. */
.portal-body .portal-mobile-bell-count[hidden],
#portalMobileBellCount[hidden] { display: none !important; }

@media (max-width: 820px) {

  /* Badge, when it genuinely has a count */
  .portal-body #portalMobileBellCount:not([hidden]) {
    position: absolute; top: 6px; right: 6px;
    min-width: 17px; height: 17px; padding: 0 4px;
    display: grid; place-items: center;
    border-radius: 99px; border: 2px solid rgba(6, 12, 22, 1);
    background: #ff6474; color: #0b1420;
    font-size: 0.6rem; font-weight: 700; line-height: 1;
    font-variant-numeric: tabular-nums;
  }
  .portal-body .portal-mobile-bell { position: relative; }

  /* ---- Upper controls: calm, unboxed, evenly weighted ---- */
  .portal-body .portal-mobile-menu,
  .portal-body .portal-mobile-bell {
    width: 42px; height: 42px; border: 0; border-radius: 12px;
    background: none; color: rgba(206, 222, 238, 0.88);
    display: grid; place-items: center;
    -webkit-tap-highlight-color: transparent;
    transition: background-color 120ms ease, color 120ms ease;
  }
  .portal-body .portal-mobile-menu:active,
  .portal-body .portal-mobile-bell:active {
    background: rgba(255, 255, 255, 0.055); color: #ffffff;
  }
  .portal-body .portal-mobile-menu svg,
  .portal-body .portal-mobile-bell svg {
    width: 20px; height: 20px; stroke-width: 1.7;
  }
  /* The bell ships as a filled pictogram; keep it filled, not outlined */
  .portal-body .portal-mobile-bell svg { fill: currentColor; stroke: none; }

  /* Avatar reads as an account chip, not a bordered box */
  .portal-body .portal-mobile-avatar {
    width: 32px; height: 32px; border-radius: 50%;
    border: 0; background: rgba(231, 199, 106, 0.14);
    color: #e7c76a; font-size: 0.72rem; font-weight: 700;
    letter-spacing: 0.02em; display: grid; place-items: center;
  }
  .portal-body .portal-mobile-actions { gap: 2px; }

  /* ---- Solid mark ---- */
  .portal-body .portal-mobile-mark { width: 26px; height: 26px; color: #e7c76a; }
  .portal-body .portal-mobile-mark svg {
    width: 100%; height: 100%; display: block;
    shape-rendering: geometricPrecision;
  }
  .portal-body .axr-mark svg { shape-rendering: geometricPrecision; }

  /* Wordmark: calm, not over-styled */
  .portal-body .portal-mobile-wordmark {
    font-size: 1rem; font-weight: 680; letter-spacing: 0.11em; color: #f6f9fc;
  }
  .portal-body .portal-mobile-wordmark small {
    font-size: 0.7rem; font-weight: 500; letter-spacing: 0.02em;
    text-transform: none; color: rgba(154, 180, 208, 0.8);
  }

  /* Slightly larger glyphs now that the drawings are simpler */
  .portal-body #portalMobileDrawerNav.axr .axr-glyph svg { width: 21px; height: 21px; }
}

/* ==============================================================
   AUREX BRAND MARK V11.
   The supplied artwork is wider than tall (64 x 56), so the mark
   box can no longer be a square or the glyph letterboxes. Sized on
   aspect-ratio and rendered solid in a single colour.
   ============================================================== */

.portal-body .portal-mobile-mark,
.portal-body .axr-mark {
  color: #f4f7fb;                 /* the artwork is a solid white mark */
}
.portal-body .portal-mobile-mark svg,
.portal-body .axr-mark svg {
  display: block; width: 100%; height: auto;
  shape-rendering: geometricPrecision;
}

@media (max-width: 820px) {
  .portal-body .portal-mobile-mark {
    width: 30px; height: auto; aspect-ratio: 64 / 56;
    display: grid; place-items: center;
  }

  /* ---- Account chip, upper right ----
     A bare letter in a flat circle read as cheap. This gives it a
     hairline ring, a darker well and proper optical centring, so it
     reads as an account control rather than a placeholder. */
  .portal-body .portal-mobile-avatar {
    width: 34px; height: 34px; border-radius: 50%;
    display: grid; place-items: center;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.09), rgba(255, 255, 255, 0.035));
    box-shadow: inset 0 0 0 1px rgba(212, 228, 244, 0.22),
                0 1px 2px rgba(0, 0, 0, 0.4);
    border: 0;
    color: #eaf2fa;
    font-size: 0.74rem; font-weight: 650; letter-spacing: 0.04em;
    text-transform: uppercase;
    font-variant-numeric: tabular-nums;
  }
  .portal-body .portal-mobile-avatar:active {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.14), rgba(255, 255, 255, 0.06));
  }

  /* Wordmark sits against a solid mark now -- keep it quiet */
  .portal-body .portal-mobile-wordmark {
    font-size: 1rem; font-weight: 680; letter-spacing: 0.12em; color: #f6f9fc;
  }
  .portal-body .portal-mobile-wordmark small {
    font-size: 0.7rem; font-weight: 500; letter-spacing: 0.03em;
    text-transform: none; color: rgba(154, 180, 208, 0.8);
  }
}

/* Desktop sidebar lockup uses the same artwork */
.portal-body .axr-brand .axr-mark {
  width: 34px; height: auto; aspect-ratio: 64 / 56;
}

/* ==============================================================
   AUREX V12 — brand mark rendering + public first screen.
   The mark is now a SOLID letterform everywhere, so any inherited
   stroke styling has to be cleared or it paints an outline on top
   of the fill (which is what turned it into a blob in the public
   header).
   ============================================================== */

/* Solid mark, one colour, no inherited stroke */
.aurex-mark-svg {
  fill: currentColor !important;
  stroke: none !important;
  display: block;
  shape-rendering: geometricPrecision;
}
.public-brand > span,
.portal-body .portal-mobile-mark,
.portal-body .axr-mark { color: #f4f7fb; }

.portal-body .portal-mobile-mark,
.portal-body .axr-mark { aspect-ratio: 1 / 1; }
.portal-body .portal-mobile-mark { width: 27px; height: 27px; }
.portal-body .axr-brand .axr-mark { width: 32px; height: 32px; }
.portal-body .portal-mobile-mark svg,
.portal-body .axr-mark svg { width: 100%; height: 100%; }

/* ==================================================
   PUBLIC FIRST SCREEN (<= 720px)
   The header stacked four nav links vertically, pushing the
   headline below the fold, and the hero then repeated two of
   those same links as buttons.
   ================================================== */
@media (max-width: 720px) {

  .public-intelligence-body .public-header.pro-conversion-nav {
    display: grid; grid-template-columns: auto 1fr; align-items: center;
    gap: 12px; padding: 12px 16px;
    border-radius: 0; border: 0;
    border-bottom: 1px solid rgba(140, 178, 214, 0.14);
    background: rgba(6, 12, 22, 0.9);
  }
  .public-intelligence-body .public-brand {
    display: inline-flex; align-items: center; gap: 9px; min-width: 0;
  }
  .public-intelligence-body .public-brand > span {
    width: 26px; height: 26px; flex: 0 0 auto;
    border: 0; background: none; padding: 0; border-radius: 0;
  }
  .public-intelligence-body .public-brand strong {
    font-size: 1rem; font-weight: 700; letter-spacing: 0.11em; color: #f6f9fc;
  }
  /* The descriptor is brand furniture, not first-screen information */
  .public-intelligence-body .public-brand small { display: none; }

  /* Nav becomes one compact scrollable row instead of a stack */
  .public-intelligence-body .pro-conversion-nav nav {
    grid-column: 1 / -1;
    display: flex; align-items: center; gap: 6px;
    overflow-x: auto; -webkit-overflow-scrolling: touch;
    margin: 0 -16px; padding: 0 16px 2px;
    scrollbar-width: none;
  }
  .public-intelligence-body .pro-conversion-nav nav::-webkit-scrollbar { display: none; }
  .public-intelligence-body .premium-nav-link {
    flex: 0 0 auto; min-height: 40px; padding: 0 13px;
    display: inline-flex; align-items: center; border-radius: 99px;
    font-size: 0.84rem; font-weight: 550; letter-spacing: 0;
    color: rgba(196, 214, 234, 0.82);
    border: 1px solid transparent; background: none;
  }
  .public-intelligence-body .premium-nav-link.is-active {
    color: #f2f8fd; border-color: rgba(140, 178, 214, 0.26);
    background: rgba(255, 255, 255, 0.045);
  }

  /* ---- Hero: one clear action ---- */
  .public-intelligence-body .ax-hero .eyebrow {
    font-size: 0.74rem; letter-spacing: 0.14em;
  }
  .public-intelligence-body .ax-hero h1 {
    font-size: clamp(1.9rem, 8.6vw, 2.4rem); line-height: 1.16;
    letter-spacing: -0.02em; margin: 10px 0 12px;
  }
  .public-intelligence-body .ax-lede {
    font-size: 0.98rem; line-height: 1.55; color: rgba(186, 205, 226, 0.9);
  }
  .public-intelligence-body .pro-cta-row {
    display: grid; gap: 10px; margin-top: 22px;
  }
  .public-intelligence-body .pro-cta-row .primary-button,
  .public-intelligence-body .pro-cta-row .secondary-button {
    width: 100%; min-height: 52px; border-radius: 13px;
    font-size: 1rem; font-weight: 650; letter-spacing: 0;
    display: inline-flex; align-items: center; justify-content: center;
  }
  /* Restrained, single-hue primary -- the cyan-to-blue gradient read as loud */
  .public-intelligence-body .pro-cta-row .primary-button {
    background: linear-gradient(180deg, #3aa8d8, #2b86c4);
    border: 1px solid rgba(120, 200, 240, 0.45);
    color: #f2fbff;
    box-shadow: 0 6px 18px -10px rgba(43, 134, 196, 0.9);
  }
  .public-intelligence-body .pro-cta-row .secondary-button {
    background: rgba(255, 255, 255, 0.04);
    border: 1px solid rgba(140, 178, 214, 0.24);
    color: rgba(226, 237, 248, 0.94);
  }
  /* Sign-in is a return path, not a third competing button */
  .public-intelligence-body .pro-cta-row .secondary-button.quiet {
    min-height: 44px; background: none; border: 0;
    color: rgba(170, 196, 222, 0.9); font-weight: 550; text-decoration: underline;
    text-underline-offset: 3px;
  }

  .public-intelligence-body .ax-trust-row {
    margin-top: 20px; display: grid; gap: 7px; padding: 0; list-style: none;
  }
  .public-intelligence-body .ax-trust-row li {
    font-size: 0.82rem; line-height: 1.4; color: rgba(150, 176, 208, 0.82);
  }
}

/* Public nav still resolved to a column (an earlier rule sets
   flex-direction), leaving a 180px-tall header before any content.
   Force a single scrollable row on phones. */
@media (max-width: 720px) {
  .public-intelligence-body .pro-conversion-nav nav {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
  }
  .public-intelligence-body .pro-conversion-nav nav > a { flex: 0 0 auto !important; width: auto !important; }
}

/* ==============================================================
   AUREX SIGN-IN — cinematic entry.
   Targets the existing portalClientLoginGate() markup. No markup,
   field name, id, handler or auth behaviour is touched: every rule
   below is presentation on classes that already render.
   ============================================================== */

/* ---- Brand mark on the entry screen ----
   bootstrap.js still emits the old stroked mark here and that file is
   off-limits, so the new solid mark is applied as a mask on the
   existing wrapper and the legacy <svg> is hidden. Same geometry as
   the mark used everywhere else. */
.portal-cinematic-entry .pce-brand-mark > svg { display: none; }
.portal-cinematic-entry .pce-brand-mark {
  width: 34px; height: 34px; display: block; flex: 0 0 auto;
  background-color: #f4f7fb;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='black' fill-rule='evenodd'><path d='M20 3.5 36.5 36.5H3.5z'/><path d='M19 17.5 25.4 30H12.6z'/></svg>") center / contain no-repeat;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40' fill='black' fill-rule='evenodd'><path d='M20 3.5 36.5 36.5H3.5z'/><path d='M19 17.5 25.4 30H12.6z'/></svg>") center / contain no-repeat;
}

/* ---- The scene ----
   Depth comes from two wide, low-opacity pools of light and a fine
   grid, not from glow on the card. */
.portal-body .portal-cinematic-entry {
  position: relative; isolation: isolate;
  min-height: 100svh;
  display: grid; place-items: center;
  padding: 28px 16px calc(28px + env(safe-area-inset-bottom, 0px));
  background:
    radial-gradient(120% 80% at 12% 0%, rgba(103, 232, 249, 0.10), transparent 58%),
    radial-gradient(110% 90% at 92% 8%, rgba(231, 199, 106, 0.07), transparent 55%),
    linear-gradient(180deg, #060d18 0%, #04090f 62%, #03070c 100%);
}
.portal-body .portal-cinematic-entry::before {
  content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background-image:
    linear-gradient(rgba(140, 178, 214, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(140, 178, 214, 0.045) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: radial-gradient(70% 55% at 50% 38%, #000 0%, transparent 78%);
  -webkit-mask-image: radial-gradient(70% 55% at 50% 38%, #000 0%, transparent 78%);
}

.portal-body .portal-cinematic-entry .pce-shell {
  width: 100%; max-width: 420px; margin: 0 auto;
}
.portal-body .portal-cinematic-entry .pce-access {
  width: 100%; border-radius: 20px;
  border: 1px solid rgba(150, 184, 218, 0.14);
  background: linear-gradient(180deg, rgba(16, 27, 44, 0.78), rgba(9, 16, 27, 0.86));
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  box-shadow: 0 28px 70px -34px rgba(0, 0, 0, 0.92),
              inset 0 1px 0 rgba(255, 255, 255, 0.05);
  overflow: hidden;
}
/* A single hairline of brand light along the top edge */
.portal-body .portal-cinematic-entry .pce-access::before {
  content: ""; display: block; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(103, 232, 249, 0.5) 30%, rgba(231, 199, 106, 0.42) 70%, transparent);
}
.portal-body .portal-cinematic-entry .pce-access-inner {
  padding: 26px 22px 24px; display: grid; gap: 0;
}

/* ---- Brand lockup ---- */
.portal-body .portal-cinematic-entry .pce-brand {
  display: flex; align-items: center; gap: 11px; margin-bottom: 22px;
}
.portal-body .portal-cinematic-entry .pce-brand-word {
  font-size: 1.05rem; font-weight: 700; letter-spacing: 0.15em; color: #f5f8fc;
}

/* ---- Heading ---- */
.portal-body .portal-cinematic-entry .pce-heading { margin-bottom: 22px; }
.portal-body .portal-cinematic-entry .pce-heading .eyebrow {
  margin: 0 0 9px; font-size: 0.72rem; font-weight: 600;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: rgba(126, 206, 232, 0.9);
}
.portal-body .portal-cinematic-entry .pce-heading h1 {
  margin: 0 0 9px; font-size: clamp(1.55rem, 6.6vw, 1.85rem);
  line-height: 1.2; letter-spacing: -0.02em; font-weight: 640; color: #ffffff;
}
.portal-body .portal-cinematic-entry .pce-sub {
  margin: 0; font-size: 0.92rem; line-height: 1.5;
  color: rgba(178, 200, 224, 0.86);
}

/* ---- Form ---- */
.portal-body .portal-cinematic-entry .pce-form {
  display: grid; gap: 14px; margin-bottom: 16px;
}
.portal-body .portal-cinematic-entry .pce-form label {
  display: grid; gap: 7px;
  font-size: 0.82rem; font-weight: 550; letter-spacing: 0;
  color: rgba(186, 206, 228, 0.92); text-transform: none;
}
.portal-body .portal-cinematic-entry .pce-form input {
  -webkit-appearance: none; appearance: none;
  width: 100%; min-height: 52px; padding: 0 14px;
  border-radius: 12px;
  border: 1px solid rgba(150, 184, 218, 0.2);
  background: rgba(255, 255, 255, 0.035);
  color: #f2f7fc; font-size: 16px; /* 16px prevents iOS focus zoom */
  transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}
.portal-body .portal-cinematic-entry .pce-form input::placeholder {
  color: rgba(148, 174, 202, 0.55);
}
.portal-body .portal-cinematic-entry .pce-form input:focus {
  outline: none;
  border-color: rgba(103, 232, 249, 0.55);
  background: rgba(103, 232, 249, 0.05);
  box-shadow: 0 0 0 3px rgba(103, 232, 249, 0.14);
}
/* Password field + reveal control */
.portal-body .portal-cinematic-entry .portal-password-field {
  position: relative; display: block;
}
.portal-body .portal-cinematic-entry .portal-password-field input { padding-right: 74px; }
.portal-body .portal-cinematic-entry .portal-password-toggle {
  position: absolute; top: 50%; right: 6px; transform: translateY(-50%);
  min-height: 40px; padding: 0 12px; border-radius: 9px;
  border: 0; background: none;
  color: rgba(126, 206, 232, 0.95);
  font-size: 0.82rem; font-weight: 600; cursor: pointer;
}
.portal-body .portal-cinematic-entry .portal-password-toggle:active {
  background: rgba(255, 255, 255, 0.06);
}

/* ---- Primary action ---- */
.portal-body .portal-cinematic-entry .portal-login-submit {
  -webkit-appearance: none; appearance: none;
  width: 100%; min-height: 54px; margin-top: 2px;
  border-radius: 13px;
  border: 1px solid rgba(120, 200, 240, 0.42);
  background: linear-gradient(180deg, #3aa8d8, #2b86c4);
  color: #f4fcff; font-size: 1rem; font-weight: 680; letter-spacing: 0.01em;
  display: inline-flex; align-items: center; justify-content: center;
  box-shadow: 0 10px 26px -14px rgba(43, 134, 196, 0.95);
  transition: transform 120ms ease, filter 160ms ease;
}
.portal-body .portal-cinematic-entry .portal-login-submit:active {
  transform: scale(0.985); filter: brightness(1.06);
}
.portal-body .portal-cinematic-entry .portal-login-submit:focus-visible {
  outline: 2px solid rgba(103, 232, 249, 0.7); outline-offset: 3px;
}
.portal-body .portal-cinematic-entry .portal-login-submit[aria-busy="true"] {
  opacity: 0.8; pointer-events: none;
}

/* ---- Secondary links ---- */
.portal-body .portal-cinematic-entry .pce-login-links {
  display: flex; align-items: center; justify-content: center;
  flex-wrap: wrap; gap: 8px; margin-bottom: 16px;
  font-size: 0.86rem;
}
.portal-body .portal-cinematic-entry .pce-login-links a {
  min-height: 44px; display: inline-flex; align-items: center;
  color: rgba(150, 200, 226, 0.94); text-decoration: none; font-weight: 550;
}
.portal-body .portal-cinematic-entry .pce-login-links a:hover { text-decoration: underline; }
.portal-body .portal-cinematic-entry .pce-login-links span { color: rgba(140, 170, 200, 0.5); }

/* ---- Status ---- */
.portal-body .portal-cinematic-entry .portal-entry-status {
  display: grid; gap: 4px; padding: 11px 13px; border-radius: 11px;
  border: 1px solid rgba(150, 184, 218, 0.14);
  background: rgba(255, 255, 255, 0.025);
  font-size: 0.84rem; line-height: 1.45; color: rgba(172, 196, 220, 0.9);
  margin-bottom: 14px;
}
.portal-body .portal-cinematic-entry .portal-entry-status.is-error {
  border-color: rgba(255, 118, 132, 0.34);
  background: rgba(255, 118, 132, 0.08);
  color: #ffc2c9;
}

/* ---- Trust line ---- */
.portal-body .portal-cinematic-entry .pce-trust {
  display: flex; align-items: center; gap: 8px; margin: 0 0 16px;
  font-size: 0.78rem; line-height: 1.4; color: rgba(146, 172, 200, 0.8);
}
.portal-body .portal-cinematic-entry .pce-trust-dot {
  width: 7px; height: 7px; border-radius: 50%; flex: 0 0 auto;
  background: #67e8f9; box-shadow: 0 0 8px rgba(103, 232, 249, 0.7);
}

/* ---- Footer actions ---- */
.portal-body .portal-cinematic-entry .pce-actions {
  display: grid; gap: 4px; padding-top: 14px;
  border-top: 1px solid rgba(150, 184, 218, 0.1);
}
.portal-body .portal-cinematic-entry .pce-actions a {
  min-height: 44px; display: flex; align-items: center;
  font-size: 0.85rem; color: rgba(160, 190, 218, 0.9); text-decoration: none;
}
.portal-body .portal-cinematic-entry .pce-actions a:hover { color: #dbeaf7; }
.portal-body .portal-cinematic-entry .pce-help-lead {
  color: rgba(140, 168, 196, 0.72); margin-right: 5px;
}

/* ---- Entrance: the scene resolves once, in order ---- */
.portal-body .portal-cinematic-entry .pce-access {
  animation: axEntryCard 520ms cubic-bezier(0.22, 1, 0.36, 1) both;
}
.portal-body .portal-cinematic-entry .pce-brand    { animation: axEntryUp 460ms cubic-bezier(0.22,1,0.36,1) 120ms both; }
.portal-body .portal-cinematic-entry .pce-heading  { animation: axEntryUp 460ms cubic-bezier(0.22,1,0.36,1) 190ms both; }
.portal-body .portal-cinematic-entry .pce-form     { animation: axEntryUp 460ms cubic-bezier(0.22,1,0.36,1) 260ms both; }
.portal-body .portal-cinematic-entry .pce-login-links,
.portal-body .portal-cinematic-entry .portal-entry-status { animation: axEntryUp 460ms cubic-bezier(0.22,1,0.36,1) 320ms both; }
.portal-body .portal-cinematic-entry .pce-trust,
.portal-body .portal-cinematic-entry .pce-actions { animation: axEntryUp 460ms cubic-bezier(0.22,1,0.36,1) 380ms both; }

@keyframes axEntryCard {
  from { opacity: 0; transform: translateY(16px) scale(0.985); }
  to   { opacity: 1; transform: none; }
}
@keyframes axEntryUp {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}

/* Wider screens get a little more room; the card stays centred */
@media (min-width: 721px) {
  .portal-body .portal-cinematic-entry .pce-shell { max-width: 452px; }
  .portal-body .portal-cinematic-entry .pce-access-inner { padding: 32px 30px 28px; }
}

@media (prefers-reduced-motion: reduce) {
  .portal-body .portal-cinematic-entry .pce-access,
  .portal-body .portal-cinematic-entry .pce-brand,
  .portal-body .portal-cinematic-entry .pce-heading,
  .portal-body .portal-cinematic-entry .pce-form,
  .portal-body .portal-cinematic-entry .pce-login-links,
  .portal-body .portal-cinematic-entry .portal-entry-status,
  .portal-body .portal-cinematic-entry .pce-trust,
  .portal-body .portal-cinematic-entry .pce-actions { animation: none !important; }
  .portal-body .portal-cinematic-entry .pce-form input,
  .portal-body .portal-cinematic-entry .portal-login-submit { transition: none !important; }
}

/* --------------------------------------------------
   Sign-in corrections, measured at 390x844:
   the submit resolved 276px inside a 358px card (an
   earlier rule constrains its width), and the card
   came to 914px against an 844px viewport, so the
   entry scrolled. Tightened to fit one screen.
   -------------------------------------------------- */
.portal-body .portal-cinematic-entry .pce-form .portal-login-submit,
.portal-body .portal-cinematic-entry button.portal-login-submit {
  width: 100% !important; max-width: none !important;
  justify-self: stretch; align-self: stretch;
}
.portal-body .portal-cinematic-entry .pce-access-inner { padding: 22px 20px 20px; }
.portal-body .portal-cinematic-entry .pce-brand { margin-bottom: 18px; }
.portal-body .portal-cinematic-entry .pce-heading { margin-bottom: 18px; }
.portal-body .portal-cinematic-entry .pce-heading h1 { font-size: clamp(1.45rem, 6vw, 1.7rem); }
.portal-body .portal-cinematic-entry .pce-sub { font-size: 0.88rem; }
.portal-body .portal-cinematic-entry .pce-form { gap: 12px; margin-bottom: 12px; }
.portal-body .portal-cinematic-entry .pce-login-links { margin-bottom: 12px; }
.portal-body .portal-cinematic-entry .portal-entry-status { margin-bottom: 12px; padding: 10px 12px; }
.portal-body .portal-cinematic-entry .pce-trust { margin-bottom: 12px; }
.portal-body .portal-cinematic-entry .pce-actions { padding-top: 12px; }
.portal-body .portal-cinematic-entry .pce-actions a { min-height: 40px; font-size: 0.82rem; }

/* The form (not the button) was the constrained element: it resolved
   280px inside a 318px content box, so every field sat short of the
   card edges. */
.portal-body .portal-cinematic-entry .pce-form,
.portal-body .portal-cinematic-entry .pce-access-inner > * {
  width: 100%; max-width: none; justify-self: stretch;
}

/* ==============================================================
   AUREX ACCOUNT SETUP — welcome scene.
   Deliberately shares the sign-in scene language (same light pools,
   same glass card, same hairline, same entrance curve) so entry and
   setup read as one product rather than two templates.
   Presentation only: no field name, id, handler or validation is
   touched.
   ============================================================== */

/* Brand mark: same solid geometry as everywhere else */
.aurex-registration-page .registration-brand .aurex-mark-svg {
  fill: currentColor; stroke: none; width: 30px; height: 30px; display: block;
}
.aurex-registration-page .registration-brand { color: #f4f7fb; }

/* ---- Scene ---- */
body.aurex-registration-page {
  min-height: 100svh;
  background:
    radial-gradient(120% 80% at 12% 0%, rgba(103, 232, 249, 0.10), transparent 58%),
    radial-gradient(110% 90% at 92% 8%, rgba(231, 199, 106, 0.07), transparent 55%),
    linear-gradient(180deg, #060d18 0%, #04090f 62%, #03070c 100%);
  background-attachment: fixed;
}
.aurex-registration-page .registration-shell {
  position: relative; width: 100%; max-width: 460px;
  margin: 0 auto; padding: 26px 16px calc(30px + env(safe-area-inset-bottom, 0px));
  display: grid; gap: 18px;
}

/* ---- Welcome header ---- */
.aurex-registration-page .registration-brand {
  display: flex; align-items: center; gap: 10px;
  font-size: 1.02rem; font-weight: 700; letter-spacing: 0.14em;
  animation: axRegIn 460ms cubic-bezier(0.22, 1, 0.36, 1) 60ms both;
}
.aurex-registration-page .registration-intro {
  animation: axRegIn 460ms cubic-bezier(0.22, 1, 0.36, 1) 130ms both;
}
.aurex-registration-page .registration-intro .eyebrow {
  margin: 0 0 9px; font-size: 0.72rem; font-weight: 600;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: rgba(126, 206, 232, 0.9);
}
.aurex-registration-page #registrationTitle {
  margin: 0 0 10px; font-size: clamp(1.6rem, 7vw, 2rem);
  line-height: 1.18; letter-spacing: -0.022em; font-weight: 650; color: #ffffff;
}
.aurex-registration-page .registration-lede {
  margin: 0; font-size: 0.94rem; line-height: 1.55;
  color: rgba(180, 202, 226, 0.88);
}

/* ---- Steps: a route, not a list ---- */
.aurex-registration-page .registration-steps {
  display: grid; gap: 0; margin: 0; padding: 0; list-style: none;
  animation: axRegIn 460ms cubic-bezier(0.22, 1, 0.36, 1) 200ms both;
}
.aurex-registration-page .registration-steps > * {
  position: relative; padding: 0 0 16px 28px;
  font-size: 0.88rem; line-height: 1.4; color: rgba(178, 200, 224, 0.86);
}
.aurex-registration-page .registration-steps > *::before {
  content: ""; position: absolute; left: 5px; top: 16px; bottom: 0;
  width: 1px; background: rgba(140, 178, 214, 0.2);
}
.aurex-registration-page .registration-steps > *:last-child { padding-bottom: 0; }
.aurex-registration-page .registration-steps > *:last-child::before { display: none; }
.aurex-registration-page .registration-steps > *::after {
  content: ""; position: absolute; left: 0; top: 5px;
  width: 11px; height: 11px; border-radius: 50%;
  background: rgba(9, 16, 28, 0.95);
  border: 2px solid rgba(103, 232, 249, 0.55);
}

/* ---- Card ---- */
.aurex-registration-page .registration-card {
  position: relative; border-radius: 20px; overflow: hidden;
  border: 1px solid rgba(150, 184, 218, 0.14);
  background: linear-gradient(180deg, rgba(16, 27, 44, 0.78), rgba(9, 16, 27, 0.86));
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  box-shadow: 0 28px 70px -34px rgba(0, 0, 0, 0.92),
              inset 0 1px 0 rgba(255, 255, 255, 0.05);
  padding: 0 0 20px;
  animation: axRegCard 520ms cubic-bezier(0.22, 1, 0.36, 1) 260ms both;
}
.aurex-registration-page .registration-card::before {
  content: ""; display: block; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(103, 232, 249, 0.5) 30%, rgba(231, 199, 106, 0.42) 70%, transparent);
}
.aurex-registration-page .registration-card-head {
  padding: 20px 20px 4px;
}
.aurex-registration-page #registrationFormTitle {
  margin: 0 0 6px; font-size: 1.12rem; font-weight: 640;
  letter-spacing: -0.01em; color: #f4f8fc;
}
.aurex-registration-page .registration-card-head p {
  margin: 0; font-size: 0.88rem; line-height: 1.5; color: rgba(170, 194, 220, 0.86);
}

/* ---- Fields ---- */
.aurex-registration-page .registration-field-grid {
  display: grid; grid-template-columns: minmax(0, 1fr); gap: 13px;
  padding: 16px 20px 0;
}
.aurex-registration-page .registration-field-grid label {
  display: grid; gap: 7px;
  font-size: 0.82rem; font-weight: 550; letter-spacing: 0;
  color: rgba(186, 206, 228, 0.92); text-transform: none; min-width: 0;
}
.aurex-registration-page .registration-field-grid input,
.aurex-registration-page .registration-field-grid select {
  -webkit-appearance: none; appearance: none;
  width: 100%; min-height: 52px; padding: 0 14px; border-radius: 12px;
  border: 1px solid rgba(150, 184, 218, 0.2);
  background: rgba(255, 255, 255, 0.035);
  color: #f2f7fc; font-size: 16px; /* no iOS focus zoom */
  transition: border-color 160ms ease, background-color 160ms ease, box-shadow 160ms ease;
}
.aurex-registration-page .registration-field-grid input::placeholder {
  color: rgba(148, 174, 202, 0.55);
}
.aurex-registration-page .registration-field-grid input:focus,
.aurex-registration-page .registration-field-grid select:focus {
  outline: none; border-color: rgba(103, 232, 249, 0.55);
  background: rgba(103, 232, 249, 0.05);
  box-shadow: 0 0 0 3px rgba(103, 232, 249, 0.14);
}
.aurex-registration-page .registration-password-field { position: relative; display: block; }
.aurex-registration-page .registration-password-field input { padding-right: 74px; }
.aurex-registration-page .registration-password-toggle {
  position: absolute; top: 50%; right: 6px; transform: translateY(-50%);
  min-height: 40px; padding: 0 12px; border-radius: 9px; border: 0; background: none;
  color: rgba(126, 206, 232, 0.95); font-size: 0.82rem; font-weight: 600; cursor: pointer;
}

/* ---- Consent ---- */
.aurex-registration-page .registration-check {
  display: grid; grid-template-columns: auto minmax(0, 1fr);
  align-items: start; gap: 11px; margin: 16px 20px 0;
  font-size: 0.85rem; line-height: 1.45; color: rgba(176, 198, 222, 0.88);
}
.aurex-registration-page .registration-check input[type="checkbox"] {
  width: 20px; height: 20px; margin: 1px 0 0; accent-color: #3aa8d8; flex: 0 0 auto;
}

/* ---- Primary action ---- */
.aurex-registration-page .registration-submit {
  -webkit-appearance: none; appearance: none;
  width: calc(100% - 40px); margin: 18px 20px 0;
  min-height: 54px; border-radius: 13px;
  border: 1px solid rgba(120, 200, 240, 0.42);
  background: linear-gradient(180deg, #3aa8d8, #2b86c4);
  color: #f4fcff; font-size: 1rem; font-weight: 680;
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  box-shadow: 0 10px 26px -14px rgba(43, 134, 196, 0.95);
  transition: transform 120ms ease, filter 160ms ease;
}
.aurex-registration-page .registration-submit:active { transform: scale(0.985); filter: brightness(1.06); }
.aurex-registration-page .registration-submit:focus-visible {
  outline: 2px solid rgba(103, 232, 249, 0.7); outline-offset: 3px;
}
.aurex-registration-page .registration-submit[disabled] { opacity: 0.45; }

/* ---- Supporting surfaces ---- */
.aurex-registration-page .registration-alert {
  margin: 16px 20px 0; padding: 11px 13px; border-radius: 11px;
  border: 1px solid rgba(150, 184, 218, 0.16);
  background: rgba(255, 255, 255, 0.025);
  font-size: 0.85rem; line-height: 1.45; color: rgba(176, 198, 222, 0.9);
}
.aurex-registration-page .registration-badge {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 5px 11px; border-radius: 99px;
  border: 1px solid rgba(231, 199, 106, 0.28);
  background: rgba(231, 199, 106, 0.09);
  font-size: 0.74rem; font-weight: 600; color: #e7c76a;
}
.aurex-registration-page .registration-safe-note {
  margin: 14px 20px 0; font-size: 0.79rem; line-height: 1.45;
  color: rgba(146, 172, 200, 0.8);
}
.aurex-registration-page .registration-footer {
  margin: 0; padding: 4px 4px 0; font-size: 0.85rem;
  color: rgba(160, 186, 214, 0.86); text-align: center;
  animation: axRegIn 460ms cubic-bezier(0.22, 1, 0.36, 1) 340ms both;
}
.aurex-registration-page .registration-footer a { color: #8fd4ee; text-decoration: none; font-weight: 550; }
.aurex-registration-page .registration-footer a:hover { text-decoration: underline; }

@keyframes axRegIn   { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes axRegCard { from { opacity: 0; transform: translateY(16px) scale(0.985); } to { opacity: 1; transform: none; } }

@media (min-width: 901px) {
  .aurex-registration-page .registration-shell { max-width: 500px; padding-top: 40px; }
  .aurex-registration-page .registration-field-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .aurex-registration-page .registration-field-grid > label:first-child,
  .aurex-registration-page .registration-password-field { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
  .aurex-registration-page .registration-brand,
  .aurex-registration-page .registration-intro,
  .aurex-registration-page .registration-steps,
  .aurex-registration-page .registration-card,
  .aurex-registration-page .registration-footer { animation: none !important; }
  .aurex-registration-page .registration-field-grid input,
  .aurex-registration-page .registration-submit { transition: none !important; }
}

/* Mark rendered cyan here (inherited colour) while sign-in renders it
   white. One mark, one colour. */
.aurex-registration-page .registration-brand,
.aurex-registration-page .registration-brand .aurex-mark-svg {
  color: #f4f7fb !important; fill: #f4f7fb !important;
}

/* ==============================================================
   PUBLIC LEADERBOARD — podium grid.
   .public-top-three resolved to two columns while holding three
   cards, so the third wrapped to a second row and left an empty
   cell beside it. Three cards, three columns; the centre column
   carries the champion (source order is second/first/third).
   ============================================================== */
.public-top-three {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  grid-template-rows: auto !important;
  align-items: stretch;
  gap: 14px;
}
.public-top-three > .public-ranking-card { min-width: 0; }

/* The champion sits taller than its neighbours */
.public-top-three > .podium.first {
  border-color: rgba(231, 199, 106, 0.34);
  background:
    radial-gradient(120% 130% at 50% 0%, rgba(231, 199, 106, 0.14), transparent 66%),
    rgba(255, 255, 255, 0.02);
}

/* Podium entrance: champion first, then the flanking places */
.public-top-three > .podium.first  { animation: axLbPod 460ms cubic-bezier(0.22, 1, 0.36, 1) 60ms both; }
.public-top-three > .podium.second { animation: axLbPod 460ms cubic-bezier(0.22, 1, 0.36, 1) 200ms both; }
.public-top-three > .podium.third  { animation: axLbPod 460ms cubic-bezier(0.22, 1, 0.36, 1) 280ms both; }

@keyframes axLbPod {
  from { opacity: 0; transform: translateY(18px) scale(0.97); }
  to   { opacity: 1; transform: none; }
}

/* Phones: one card per row, champion first */
@media (max-width: 720px) {
  .public-top-three {
    grid-template-columns: minmax(0, 1fr) !important;
    display: grid !important;
  }
  .public-top-three > .podium.first  { order: 1; }
  .public-top-three > .podium.second { order: 2; }
  .public-top-three > .podium.third  { order: 3; }
}

@media (prefers-reduced-motion: reduce) {
  .public-top-three > .podium.first,
  .public-top-three > .podium.second,
  .public-top-three > .podium.third { animation: none !important; }
}

/* ==============================================================
   REGISTRATION SHELL — column collapse fix.
   The page ships a two-column desktop grid (intro | card). Capping
   the shell at 500px starved column one to 0px, so the headline and
   lede rendered one character per line beside the card.
   The welcome scene is a single centred column at every width.
   ============================================================== */
.aurex-registration-page .registration-shell {
  grid-template-columns: minmax(0, 1fr) !important;
  grid-auto-flow: row !important;
  justify-items: stretch;
}
.aurex-registration-page .registration-shell > * { min-width: 0; grid-column: 1 / -1 !important; }
.aurex-registration-page .registration-intro,
.aurex-registration-page .registration-lede,
.aurex-registration-page #registrationTitle { width: auto; min-width: 0; }

@media (min-width: 721px) {
  .aurex-registration-page .registration-shell { max-width: 560px; }
}

/* ==============================================================
   SIGN-IN — same class of failure.
   Guarantee the entry card's content column can never collapse.
   ============================================================== */
.portal-body .portal-cinematic-entry .pce-access-inner {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  justify-items: stretch;
}
.portal-body .portal-cinematic-entry .pce-access-inner > * {
  grid-column: 1 / -1 !important; min-width: 0;
}
.portal-body .portal-cinematic-entry .pce-shell { min-width: 0; }

/* Footer links must not wrap to one word per line */
.portal-body .portal-cinematic-entry .pce-actions a {
  display: flex; flex-wrap: wrap; gap: 4px; align-items: baseline;
}

/* Entry card measured 845px against an 844px viewport — one pixel of
   scroll. Trim the outer padding so it seats cleanly. */
@media (max-width: 560px) {
  .portal-body .portal-cinematic-entry { padding-top: 22px; padding-bottom: calc(22px + env(safe-area-inset-bottom, 0px)); }
  .portal-body .portal-cinematic-entry .pce-access-inner { padding: 20px 18px 18px; }
}

/* ==============================================================
   SIGN-IN — column sizing fix.
   `place-items: center` on the scene set justify-items:center, which
   sizes the implicit grid column to CONTENT width rather than
   stretching it. The card then collapsed to min-content and every
   line wrapped ("Sign in / to your / private / workspace.").
   Give the scene one explicit full-width column and centre the card
   with auto margins instead.
   ============================================================== */
.portal-body .portal-cinematic-entry {
  grid-template-columns: minmax(0, 1fr) !important;
  justify-items: stretch !important;
  align-items: center;
  place-items: initial;
  align-content: center;
}
.portal-body .portal-cinematic-entry .pce-shell {
  width: 100% !important; margin-inline: auto !important;
  justify-self: stretch !important; min-width: 0;
}
.portal-body .portal-cinematic-entry .pce-access {
  width: 100% !important; min-width: 0;
}

/* Nothing in the entry may size to min-content */
.portal-body .portal-cinematic-entry .pce-form,
.portal-body .portal-cinematic-entry .pce-form label,
.portal-body .portal-cinematic-entry .pce-form input,
.portal-body .portal-cinematic-entry .portal-login-submit,
.portal-body .portal-cinematic-entry .portal-password-field {
  width: 100% !important; min-width: 0; max-width: none !important;
}

/* Very narrow devices: keep the scene usable rather than cramped */
@media (max-width: 360px) {
  .portal-body .portal-cinematic-entry { padding-left: 12px; padding-right: 12px; }
  .portal-body .portal-cinematic-entry .pce-access-inner { padding: 18px 15px 16px; }
  .portal-body .portal-cinematic-entry .pce-heading h1 { font-size: 1.35rem; }
}

/* ==============================================================
   AUREX ENTRY — refinement pass.
   Sign-in and account setup share one motion score and one
   supporting-content hierarchy. Presentation only.
   ============================================================== */

/* ---------- 1. PLACEMENT / HIERARCHY ----------
   After the primary action the sign-in stacked six supporting
   elements at near-equal weight. Three tiers instead:
     tier 1  the two account links
     tier 2  the security line
     tier 3  help + setup, quietest
   ---------------------------------------------- */
.portal-body .portal-cinematic-entry .pce-login-links {
  margin-top: 16px; margin-bottom: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(150, 184, 218, 0.09);
  gap: 4px 10px;
}
.portal-body .portal-cinematic-entry .pce-login-links a {
  font-size: 0.87rem; font-weight: 560; color: #8fd4ee;
}

/* Security line: one quiet row, not a paragraph */
.portal-body .portal-cinematic-entry .pce-trust {
  margin: 0 0 14px; gap: 9px;
  font-size: 0.76rem; line-height: 1.45;
  color: rgba(138, 164, 192, 0.78);
}
.portal-body .portal-cinematic-entry .pce-trust-dot {
  width: 6px; height: 6px; box-shadow: 0 0 7px rgba(103, 232, 249, 0.6);
}

/* Footer: quietest tier, single column, no competing weight */
.portal-body .portal-cinematic-entry .pce-actions {
  gap: 2px; padding-top: 13px;
  border-top: 1px solid rgba(150, 184, 218, 0.09);
}
.portal-body .portal-cinematic-entry .pce-actions a {
  min-height: 38px; font-size: 0.81rem;
  color: rgba(146, 174, 202, 0.86);
}
.portal-body .portal-cinematic-entry .pce-help-lead {
  color: rgba(132, 158, 186, 0.66);
}

/* Status only earns space when it is saying something */
.portal-body .portal-cinematic-entry .portal-entry-status {
  margin-bottom: 14px; padding: 9px 12px; font-size: 0.81rem;
  color: rgba(158, 184, 210, 0.82);
}

/* Heading rhythm: eyebrow tight to title, title tight to sub */
.portal-body .portal-cinematic-entry .pce-heading { margin-bottom: 20px; }
.portal-body .portal-cinematic-entry .pce-heading .eyebrow { margin-bottom: 7px; }
.portal-body .portal-cinematic-entry .pce-heading h1 {
  margin-bottom: 8px; line-height: 1.18; letter-spacing: -0.021em;
}
.portal-body .portal-cinematic-entry .pce-sub { line-height: 1.5; }

/* Labels sit closer to their field */
.portal-body .portal-cinematic-entry .pce-form label,
.aurex-registration-page .registration-field-grid label { gap: 6px; }

/* ---------- 2. MOTION SCORE ----------
   One pass, in order, then still. Card lifts, a single light sweeps
   the top hairline, contents cascade. Nothing loops.
   ------------------------------------- */
.portal-body .portal-cinematic-entry .pce-access,
.aurex-registration-page .registration-card {
  animation: axLift 620ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

/* The hairline is a light that passes once, left to right */
.portal-body .portal-cinematic-entry .pce-access::before,
.aurex-registration-page .registration-card::before {
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(103, 232, 249, 0.15) 22%,
    rgba(160, 240, 255, 0.85) 42%,
    rgba(231, 199, 106, 0.8) 58%,
    rgba(231, 199, 106, 0.15) 78%,
    transparent 100%);
  background-size: 220% 100%;
  animation: axSweep 1500ms cubic-bezier(0.4, 0, 0.2, 1) 240ms both;
}

/* Contents cascade behind the card */
.portal-body .portal-cinematic-entry .pce-brand   { animation: axRise 520ms cubic-bezier(0.16,1,0.3,1) 200ms both; }
.portal-body .portal-cinematic-entry .pce-heading { animation: axRise 520ms cubic-bezier(0.16,1,0.3,1) 280ms both; }
.portal-body .portal-cinematic-entry .pce-form label:nth-of-type(1) { animation: axRise 480ms cubic-bezier(0.16,1,0.3,1) 360ms both; }
.portal-body .portal-cinematic-entry .pce-form label:nth-of-type(2) { animation: axRise 480ms cubic-bezier(0.16,1,0.3,1) 420ms both; }
.portal-body .portal-cinematic-entry .portal-login-submit { animation: axRise 480ms cubic-bezier(0.16,1,0.3,1) 490ms both; }
.portal-body .portal-cinematic-entry .pce-login-links,
.portal-body .portal-cinematic-entry .portal-entry-status { animation: axFade 520ms ease 570ms both; }
.portal-body .portal-cinematic-entry .pce-trust,
.portal-body .portal-cinematic-entry .pce-actions { animation: axFade 520ms ease 640ms both; }

/* Account setup runs the same score */
.aurex-registration-page .registration-brand { animation: axRise 520ms cubic-bezier(0.16,1,0.3,1) 90ms both; }
.aurex-registration-page .registration-intro { animation: axRise 520ms cubic-bezier(0.16,1,0.3,1) 170ms both; }
.aurex-registration-page .registration-steps { animation: axRise 520ms cubic-bezier(0.16,1,0.3,1) 250ms both; }
.aurex-registration-page .registration-card  { animation-delay: 320ms; }
.aurex-registration-page .registration-footer { animation: axFade 520ms ease 700ms both; }

/* The scene itself resolves out of black */
/* Base state is invisible on purpose: if the animation never runs
   (reduced motion, or animations disabled) this must not leave a
   black sheet over the page. */
.portal-body .portal-cinematic-entry::after,
body.aurex-registration-page::after {
  content: ""; position: fixed; inset: 0; z-index: 2; pointer-events: none;
  background: #03060b;
  opacity: 0; visibility: hidden;
  animation: axCurtain 720ms cubic-bezier(0.4, 0, 0.2, 1) both;
}

/* Field focus: a deliberate settle, not a flash */
.portal-body .portal-cinematic-entry .pce-form input,
.aurex-registration-page .registration-field-grid input,
.aurex-registration-page .registration-field-grid select {
  transition: border-color 200ms cubic-bezier(0.16, 1, 0.3, 1),
              background-color 200ms cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 240ms cubic-bezier(0.16, 1, 0.3, 1);
}
/* Primary action: presses in, releases clean */
.portal-body .portal-cinematic-entry .portal-login-submit,
.aurex-registration-page .registration-submit {
  transition: transform 140ms cubic-bezier(0.16, 1, 0.3, 1),
              filter 200ms ease, box-shadow 200ms ease;
}
.portal-body .portal-cinematic-entry .portal-login-submit:active,
.aurex-registration-page .registration-submit:active {
  transform: translateY(1px) scale(0.99);
  box-shadow: 0 4px 12px -8px rgba(43, 134, 196, 0.9);
}

@keyframes axLift {
  from { opacity: 0; transform: translateY(22px) scale(0.982); }
  to   { opacity: 1; transform: none; }
}
@keyframes axRise {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: none; }
}
@keyframes axFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes axSweep {
  from { background-position: 120% 0; }
  to   { background-position: -20% 0; }
}
@keyframes axCurtain {
  from { opacity: 1; }
  to   { opacity: 0; visibility: hidden; }
}

@media (prefers-reduced-motion: reduce) {
  .portal-body .portal-cinematic-entry .pce-access,
  .portal-body .portal-cinematic-entry .pce-access::before,
  .portal-body .portal-cinematic-entry .pce-brand,
  .portal-body .portal-cinematic-entry .pce-heading,
  .portal-body .portal-cinematic-entry .pce-form label,
  .portal-body .portal-cinematic-entry .portal-login-submit,
  .portal-body .portal-cinematic-entry .pce-login-links,
  .portal-body .portal-cinematic-entry .portal-entry-status,
  .portal-body .portal-cinematic-entry .pce-trust,
  .portal-body .portal-cinematic-entry .pce-actions,
  .portal-body .portal-cinematic-entry::after,
  .aurex-registration-page .registration-card,
  .aurex-registration-page .registration-card::before,
  .aurex-registration-page .registration-brand,
  .aurex-registration-page .registration-intro,
  .aurex-registration-page .registration-steps,
  .aurex-registration-page .registration-footer,
  body.aurex-registration-page::after { animation: none !important; }
}

/* ==============================================================
   CORRECTION — remove the curtain, repair the sweep.
   Live check: the ::after curtain computed opacity:1 / visible with
   animationName:none, i.e. a full-screen black sheet over the entry
   if the animation never binds. A decorative flourish is not worth
   that failure mode, so it is removed outright.
   The hairline ::before was inheriting axLift from the card rule;
   the sweep is re-declared with the specificity to win.
   ============================================================== */
.portal-body .portal-cinematic-entry::after,
body.aurex-registration-page::after {
  content: none !important;
  animation: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}

.portal-body .portal-cinematic-entry .pce-access::before,
.aurex-registration-page .registration-card::before {
  content: "" !important;
  display: block !important;
  height: 1px !important;
  background-image: linear-gradient(90deg,
    transparent 0%,
    rgba(103, 232, 249, 0.15) 22%,
    rgba(160, 240, 255, 0.85) 42%,
    rgba(231, 199, 106, 0.8) 58%,
    rgba(231, 199, 106, 0.15) 78%,
    transparent 100%) !important;
  background-size: 220% 100% !important;
  background-repeat: no-repeat !important;
  animation: axSweep 1500ms cubic-bezier(0.4, 0, 0.2, 1) 240ms both !important;
}

/* Footer is the quietest tier — it was reading larger than the security line */
.portal-body .portal-cinematic-entry .pce-actions a { font-size: 0.76rem; }

@media (prefers-reduced-motion: reduce) {
  .portal-body .portal-cinematic-entry .pce-access::before,
  .aurex-registration-page .registration-card::before { animation: none !important; }
}

/* ==============================================================
   ENTRY SCENES — solid ground under the gradients.
   html and body both computed background-color: transparent; the
   scene was gradient IMAGES only, all background-attachment:fixed.
   Anywhere those failed to paint, the browser's white canvas showed
   through — which is the washed-out band above the card.
   A solid base colour goes under every scene layer.
   ============================================================== */
html:has(body.aurex-registration-page),
body.aurex-registration-page { background-color: #04090f; }

html:has(body.portal-body),
body.portal-body { background-color: #04090f; }

.portal-body .portal-cinematic-entry { background-color: #04090f; }

/* Fallback for engines without :has() */
body.aurex-registration-page,
body.portal-body { background-color: #04090f !important; }

/* ---- Step hierarchy: the title must outrank its description ---- */
.aurex-registration-page .registration-steps strong,
.aurex-registration-page .registration-steps h3,
.aurex-registration-page .registration-steps > * > strong {
  color: #f2f7fc; font-weight: 640; font-size: 0.95rem;
  letter-spacing: -0.005em; display: block; margin-bottom: 3px;
}
.aurex-registration-page .registration-steps p,
.aurex-registration-page .registration-steps small {
  color: rgba(168, 192, 216, 0.82); font-size: 0.85rem; line-height: 1.45;
}
/* The index stays a quiet marker, not a headline */
.aurex-registration-page .registration-steps b {
  color: rgba(126, 206, 232, 0.85); font-size: 0.74rem; font-weight: 650;
  letter-spacing: 0.06em;
}

/* Referral row sat wider than the card in the capture */
.aurex-registration-page .registration-field-grid > *,
.aurex-registration-page .registration-card > * { max-width: 100%; min-width: 0; }

/* ==============================================================
   REGISTER — referral row alignment.
   The referral field is a bare <span> placed directly in the form,
   outside .registration-field-grid, so it inherited none of the
   grid's 20px inset and ran edge to edge across the card while
   every other field sat inset. Measured: insetLeft/Right 1px vs
   21px on the consent row.
   ============================================================== */
.aurex-registration-page .registration-card form > span,
.aurex-registration-page .registration-card form > label:not(.registration-check) {
  display: block;
  padding-left: 20px; padding-right: 20px;
  margin-top: 14px;
  box-sizing: border-box; width: 100%;
}
.aurex-registration-page .registration-card form > span > input,
.aurex-registration-page .registration-card form > span > label {
  display: block; width: 100%; box-sizing: border-box;
}
/* The "Optional" qualifier reads as part of the label, not a value */
.aurex-registration-page .registration-card form > span {
  font-size: 0.82rem; font-weight: 550; color: rgba(186, 206, 228, 0.92);
}
.aurex-registration-page .registration-card form > span > input {
  margin-top: 7px; min-height: 52px; padding: 0 14px; border-radius: 12px;
  border: 1px solid rgba(150, 184, 218, 0.2);
  background: rgba(255, 255, 255, 0.035);
  color: #f2f7fc; font-size: 16px;
}