/* ─── ADMIN-SPECIFIC OVERRIDES & EXTENSIONS ─── */

    /* Full-bleed admin layout */
    body { background: var(--bg-0); }

    .admin-shell {
      min-height: 100vh;
      padding-top: 68px;
      display: flex;
      align-items: flex-start;
    }

    /* ── ADMIN SIDEBAR ──
       Same floating "bubble" card treatment as the dashboard-shell sidebar
       (.sidebar in style.css) — rounded, elevated, sticky in normal flow —
       instead of a flush-to-the-edge fixed panel, so the Owner's admin
       sidebar matches the look organizers/team members see everywhere else. */
    .admin-sidebar {
      position: sticky;
      top: 88px;
      left: 0;
      width: 240px;
      flex-shrink: 0;
      max-height: calc(100vh - 108px);
      margin: 20px 0 20px 20px;
      background: var(--bg-1);
      border: 1px solid var(--glass-border);
      border-radius: 22px;
      box-shadow: 0 20px 50px rgba(0,0,0,0.35);
      padding: 24px 16px;
      display: flex;
      flex-direction: column;
      gap: 6px;
      overflow-y: auto;
      z-index: 200;
    }

    .admin-sidebar-section {
      margin-bottom: 8px;
    }

    .admin-sidebar-label {
      font-size: 0.68rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.12em;
      color: var(--text-3);
      padding: 0 10px;
      margin-bottom: 6px;
      margin-top: 16px;
      display: block;
    }

    .admin-sidebar-label:first-child { margin-top: 0; }

    .admin-nav-link {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 10px 12px;
      border-radius: var(--radius-md);
      color: var(--text-2);
      font-size: 0.875rem;
      font-weight: 500;
      cursor: pointer;
      transition: var(--transition);
      text-decoration: none;
      border: none;
      background: none;
      width: 100%;
      font-family: var(--font-body);
      position: relative;
    }

    .admin-nav-link:hover {
      background: var(--glass);
      color: var(--text-0);
    }

    .admin-nav-link.active {
      background: rgba(163,230,53,0.12);
      color: var(--text-0);
      border: 1px solid rgba(163,230,53,0.2);
    }

    .admin-nav-link.active::before {
      content: '';
      position: absolute;
      left: 0; top: 50%;
      transform: translateY(-50%);
      width: 3px; height: 18px;
      background: var(--grad-primary);
      border-radius: 0 2px 2px 0;
    }

    .nav-icon { font-size: 1rem; width: 20px; text-align: center; flex-shrink: 0; }

    .nav-badge {
      margin-left: auto;
      font-size: 0.65rem;
      font-weight: 700;
      padding: 2px 7px;
      border-radius: 100px;
      background: rgba(163,230,53,0.25);
      color: #bef264;
    }

    /* ── ADMIN MAIN ── */
    .admin-main {
      flex: 1 1 auto;
      min-width: 0;
      padding: 32px 36px;
      min-height: calc(100vh - 68px);
    }

    /* ── PAGE LOADER ── */
    .page-loader {
      position: fixed;
      inset: 0;
      background: var(--bg-0);
      z-index: 9000;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 16px;
    }

    .loader-logo {
      font-size: 2.5rem;
      animation: spin 1s linear infinite;
      background: var(--grad-text);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    .loader-text {
      font-size: 0.88rem;
      color: var(--text-2);
    }

    /* ── ADMIN WELCOME HEADER ── */
    .admin-welcome {
      background: var(--bg-1);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-xl);
      padding: 32px 36px;
      margin-bottom: 28px;
      position: relative;
      overflow: hidden;
    }

    .admin-welcome::before {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 2px;
      background: var(--grad-primary);
    }

    .admin-welcome-orb {
      position: absolute;
      width: 280px; height: 280px;
      background: radial-gradient(circle, rgba(163,230,53,0.1), transparent 70%);
      border-radius: 50%;
      top: -80px; right: -60px;
      pointer-events: none;
    }

    .admin-welcome-orb-2 {
      position: absolute;
      width: 180px; height: 180px;
      background: radial-gradient(circle, rgba(251,171,3,0.07), transparent 70%);
      border-radius: 50%;
      bottom: -60px; left: 20%;
      pointer-events: none;
    }

    .admin-welcome-inner {
      position: relative;
      z-index: 1;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      flex-wrap: wrap;
    }

    .admin-greeting-text {
      font-size: 0.8rem;
      color: var(--text-2);
      font-weight: 500;
      margin-bottom: 6px;
      text-transform: uppercase;
      letter-spacing: 0.08em;
    }

    .admin-title {
      font-family: var(--font-display);
      font-size: clamp(1.9rem, 3vw, 3.2rem);
      font-weight: 800;
      color: var(--text-0);
      margin-bottom: 8px;
      line-height: 1.1;
    }

    .admin-title span {
      background: var(--grad-text);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
    }

    .admin-desc {
      font-size: 0.88rem;
      color: var(--text-2);
      max-width: 460px;
      line-height: 1.65;
    }

    .admin-welcome-right {
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      gap: 10px;
    }

    .admin-badge {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      padding: 6px 16px;
      background: rgba(251,171,3,0.12);
      border: 1px solid rgba(251,171,3,0.3);
      border-radius: 100px;
      font-size: 0.75rem;
      font-weight: 700;
      color: #fbbf24;
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }

    .admin-badge-dot {
      width: 6px; height: 6px;
      background: #f59e0b;
      border-radius: 50%;
      box-shadow: 0 0 6px #f59e0b;
      animation: pulse 2s infinite;
    }

    .admin-datetime {
      font-size: 0.82rem;
      color: var(--text-2);
      text-align: right;
      line-height: 1.6;
    }

    .admin-datetime strong {
      color: var(--text-0);
      font-weight: 600;
    }

    /* ── SECTION HEADERS ── */
    .admin-section-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 18px;
    }

    .admin-section-title {
      font-family: var(--font-display);
      font-size: 1rem;
      font-weight: 700;
      color: var(--text-0);
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .admin-section-title::before {
      content: '';
      width: 3px; height: 18px;
      background: var(--grad-primary);
      border-radius: 2px;
    }

    /* ── STAT CARDS ── */
    .stat-grid {
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      gap: 16px;
      margin-bottom: 28px;
    }

    .admin-stat-card {
      background: var(--bg-1);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-lg);
      padding: 22px 20px;
      position: relative;
      overflow: hidden;
      transition: var(--transition);
      cursor: default;
    }

    .admin-stat-card:hover {
      transform: translateY(-3px);
      border-color: rgba(163,230,53,0.3);
      box-shadow: var(--shadow-glow);
    }

    .admin-stat-card::after {
      content: '';
      position: absolute;
      bottom: 0; left: 0; right: 0;
      height: 2px;
      border-radius: 0 0 var(--radius-lg) var(--radius-lg);
      opacity: 0;
      transition: opacity 0.3s;
    }

    .admin-stat-card:hover::after { opacity: 1; }

    .stat-pink::after  { background: linear-gradient(90deg, #f59e0b, #fbbf24); }
    .stat-purple::after{ background: linear-gradient(90deg, #84cc16, #a3e635); }
    .stat-blue::after  { background: linear-gradient(90deg, #2563eb, #60a5fa); }
    .stat-cyan::after  { background: linear-gradient(90deg, #06b6d4, #22d3ee); }
    .stat-green::after { background: linear-gradient(90deg, #10b981, #34d399); }
    .stat-amber::after { background: linear-gradient(90deg, #f59e0b, #fbbf24); }

    .admin-stat-icon {
      width: 38px; height: 38px;
      border-radius: 10px;
      display: flex; align-items: center; justify-content: center;
      font-size: 1.1rem;
      margin-bottom: 14px;
    }

    .icon-pink   { background: rgba(251,171,3,0.15);  box-shadow: 0 0 14px rgba(251,171,3,0.2); }
    .icon-purple { background: rgba(163,230,53,0.15);  box-shadow: 0 0 14px rgba(163,230,53,0.2); }
    .icon-blue   { background: rgba(37,99,235,0.15);   box-shadow: 0 0 14px rgba(37,99,235,0.2); }
    .icon-cyan   { background: rgba(6,182,212,0.15);   box-shadow: 0 0 14px rgba(6,182,212,0.2); }
    .icon-green  { background: rgba(16,185,129,0.15);  box-shadow: 0 0 14px rgba(16,185,129,0.2); }
    .icon-amber  { background: rgba(245,158,11,0.15);  box-shadow: 0 0 14px rgba(245,158,11,0.2); }

    .admin-stat-value {
      font-family: var(--font-display);
      font-size: 1.7rem;
      font-weight: 800;
      color: var(--text-0);
      line-height: 1;
      margin-bottom: 4px;
    }

    .admin-stat-label {
      font-size: 0.75rem;
      color: var(--text-2);
      font-weight: 500;
      margin-bottom: 10px;
    }

    .admin-stat-trend {
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: 0.72rem;
      font-weight: 600;
    }

    .trend-up   { color: #34d399; }
    .trend-down { color: #f87171; }
    .trend-flat { color: var(--text-3); }

    /* ── GLASS PANEL (reusable) ── */
    .admin-panel {
      background: var(--bg-1);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-xl);
      overflow: hidden;
      margin-bottom: 28px;
    }

    .admin-panel-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 20px 24px;
      border-bottom: 1px solid var(--glass-border);
    }

    .admin-panel-title {
      font-family: var(--font-display);
      font-size: 0.95rem;
      font-weight: 700;
      color: var(--text-0);
    }

    .admin-panel-body {
      padding: 0;
    }

    /* ── ACTIVITY TABLE ── */
    .activity-table {
      width: 100%;
      border-collapse: collapse;
    }

    .activity-table thead tr {
      border-bottom: 1px solid var(--glass-border);
    }

    .activity-table th {
      padding: 12px 20px;
      text-align: left;
      font-size: 0.7rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: var(--text-3);
    }

    .activity-table td {
      padding: 14px 20px;
      font-size: 0.875rem;
      color: var(--text-1);
      border-bottom: 1px solid rgba(255,255,255,0.03);
    }

    .activity-table tr:last-child td { border-bottom: none; }

    .activity-table tbody tr {
      transition: background var(--transition);
    }

    .activity-table tbody tr:hover {
      background: rgba(255,255,255,0.02);
    }

    .tx-credit { color: #34d399; font-weight: 700; font-family: var(--font-display); }
    .tx-debit  { color: #f87171; font-weight: 700; font-family: var(--font-display); }

    .type-pill {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 3px 10px;
      border-radius: 100px;
      font-size: 0.7rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.05em;
    }

    .type-credit { background: rgba(16,185,129,0.12); color: #34d399; border: 1px solid rgba(16,185,129,0.2); }
    .type-debit  { background: rgba(248,113,113,0.12); color: #f87171; border: 1px solid rgba(248,113,113,0.2); }
    .type-bonus  { background: rgba(163,230,53,0.12);  color: #bef264; border: 1px solid rgba(163,230,53,0.2); }
    .type-event  { background: rgba(6,182,212,0.12);   color: #22d3ee; border: 1px solid rgba(6,182,212,0.2); }

    .email-cell {
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .mini-avatar {
      width: 28px; height: 28px;
      border-radius: 50%;
      background: var(--grad-primary);
      display: flex; align-items: center; justify-content: center;
      font-size: 0.7rem;
      font-weight: 700;
      color: white;
      font-family: var(--font-display);
      flex-shrink: 0;
    }

    /* ── USER MANAGEMENT TABLE ── */
    .search-bar-row {
      display: flex;
      gap: 12px;
      align-items: center;
      padding: 16px 20px;
      border-bottom: 1px solid var(--glass-border);
    }

    .search-type-toggle {
      display: flex;
      gap: 4px;
      background: var(--glass);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-md);
      padding: 4px;
      flex-shrink: 0;
    }

    .search-type-btn {
      appearance: none;
      border: none;
      background: transparent;
      color: var(--text-2);
      font-family: var(--font-body);
      font-size: 0.78rem;
      font-weight: 600;
      padding: 6px 12px;
      border-radius: var(--radius-sm, 8px);
      cursor: pointer;
      transition: var(--transition);
      white-space: nowrap;
    }

    .search-type-btn:hover {
      color: var(--text-0);
    }

    .search-type-btn.active {
      background: var(--grad-primary, #6c5ce7);
      color: #fff;
    }

    @media (max-width: 480px) {
      .search-type-toggle { width: 100%; justify-content: space-between; }
      .search-type-btn { flex: 1; text-align: center; padding: 6px 8px; }
    }

    .admin-search {
      width: 100%;
      box-sizing: border-box;
      padding: 10px 14px 10px 38px;
      background: var(--glass);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-md);
      color: var(--text-0);
      font-family: var(--font-body);
      font-size: 0.875rem;
      outline: none;
      transition: var(--transition);
      position: relative;
    }

    .admin-search:focus {
      border-color: rgba(163,230,53,0.4);
      background: rgba(163,230,53,0.05);
      box-shadow: 0 0 0 3px rgba(163,230,53,0.1);
    }

    .admin-search::placeholder { color: var(--text-3); }

    .search-wrap {
      position: relative;
      flex: 1;
    }

    .search-icon {
      position: absolute;
      left: 12px; top: 50%;
      transform: translateY(-50%);
      color: var(--text-3);
      font-size: 0.9rem;
      pointer-events: none;
    }

    .user-table-actions {
      display: flex;
      gap: 6px;
    }

    .action-btn {
      padding: 5px 12px;
      border-radius: 8px;
      font-size: 0.72rem;
      font-weight: 600;
      cursor: pointer;
      border: 1px solid var(--glass-border);
      background: var(--glass);
      color: var(--text-1);
      font-family: var(--font-display);
      transition: var(--transition);
      white-space: nowrap;
    }

    .action-btn:hover { background: var(--glass-hover); color: var(--text-0); }
    .action-btn.view    { border-color: rgba(37,99,235,0.3);  color: #60a5fa; }
    .action-btn.view:hover { background: rgba(37,99,235,0.1); }
    .action-btn.credits { border-color: rgba(16,185,129,0.3); color: #34d399; }
    .action-btn.credits:hover { background: rgba(16,185,129,0.1); }
    .action-btn.suspend { border-color: rgba(248,113,113,0.3); color: #f87171; }
    .action-btn.suspend:hover { background: rgba(248,113,113,0.1); }

    .gnp-yes { color: #34d399; font-weight: 600; }
    .gnp-no  { color: var(--text-3); }

    .onboard-yes { color: #bef264; }
    .onboard-no  { color: var(--text-3); }

    .role-pill {
      padding: 3px 10px;
      border-radius: 100px;
      font-size: 0.68rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.04em;
    }

    .role-partner { background: rgba(245,158,11,0.12); color: #fbbf24; border: 1px solid rgba(245,158,11,0.2); }
    .role-user    { background: rgba(163,230,53,0.1);  color: #bef264; border: 1px solid rgba(163,230,53,0.2); }
    .role-admin   { background: rgba(251,171,3,0.12); color: #fbbf24; border: 1px solid rgba(251,171,3,0.2); }

    /* ── CREDIT ALLOCATION PANEL ── */
    .credit-form-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 18px;
      padding: 24px;
    }

    .admin-form-group { display: flex; flex-direction: column; gap: 7px; }

    .admin-form-group.full { grid-column: 1 / -1; }

    .admin-label {
      font-size: 0.78rem;
      font-weight: 600;
      color: var(--text-1);
      letter-spacing: 0.025em;
    }

    .admin-input,
    .admin-select,
    .admin-textarea {
      width: 100%;
      min-width: 0;
      box-sizing: border-box;
      padding: 11px 14px;
      background: var(--glass);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-md);
      color: var(--text-0);
      font-family: var(--font-body);
      font-size: 0.875rem;
      outline: none;
      transition: var(--transition);
    }

    .admin-input:focus,
    .admin-select:focus,
    .admin-textarea:focus {
      border-color: rgba(163,230,53,0.5);
      background: rgba(163,230,53,0.06);
      box-shadow: 0 0 0 3px rgba(163,230,53,0.1);
    }

    .admin-input::placeholder,
    .admin-textarea::placeholder { color: var(--text-3); }
    .admin-select option { background: #0f0f1a; }
    .admin-textarea { resize: vertical; min-height: 90px; }

    .credit-form-footer {
      padding: 0 24px 24px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
    }

    .credit-form-note {
      font-size: 0.78rem;
      color: var(--text-2);
      display: flex;
      align-items: center;
      gap: 7px;
    }

    /* ── INSIGHTS GRID ── */
    .insights-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      margin-bottom: 28px;
    }

    .insight-card {
      background: var(--bg-1);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-lg);
      padding: 22px;
      transition: var(--transition);
    }

    .insight-card:hover {
      border-color: rgba(163,230,53,0.25);
      transform: translateY(-2px);
    }

    .insight-title {
      font-size: 0.75rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.08em;
      color: var(--text-2);
      margin-bottom: 16px;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .insight-title-dot {
      width: 6px; height: 6px;
      border-radius: 50%;
    }

    /* Bar chart */
    .bar-chart { display: flex; flex-direction: column; gap: 10px; }

    .bar-row {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 0.8rem;
    }

    .bar-label { width: 110px; color: var(--text-1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex-shrink: 0; }
    .bar-track { flex: 1; height: 6px; background: rgba(255,255,255,0.06); border-radius: 3px; overflow: hidden; }
    .bar-fill  { height: 100%; border-radius: 3px; transition: width 1s cubic-bezier(0.4,0,0.2,1); }
    .bar-val   { width: 42px; text-align: right; color: var(--text-2); font-size: 0.75rem; font-weight: 600; }

    /* Line chart (sparkline) */
    .sparkline-wrap { display: flex; flex-direction: column; gap: 14px; }
    .sparkline-svg { width: 100%; overflow: visible; }

    .growth-number {
      font-family: var(--font-display);
      font-size: 2rem;
      font-weight: 800;
      background: var(--grad-text);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      background-clip: text;
      line-height: 1;
      margin-bottom: 4px;
    }

    .growth-label { font-size: 0.8rem; color: var(--text-2); }
    .growth-trend { font-size: 0.78rem; color: #34d399; font-weight: 600; margin-top: 4px; }

    /* ── EVENTS & PARTNERS CARDS ── */
    .ecosystem-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      margin-bottom: 28px;
    }

    .ecosystem-card {
      background: var(--bg-1);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-lg);
      padding: 24px;
      transition: var(--transition);
      position: relative;
      overflow: hidden;
    }

    .ecosystem-card:hover {
      border-color: rgba(163,230,53,0.3);
      transform: translateY(-3px);
      box-shadow: var(--shadow-glow);
    }

    .ecosystem-logo-area {
      width: 100%;
      height: 80px;
      background: rgba(255,255,255,0.03);
      border-radius: var(--radius-md);
      display: flex;
      align-items: center;
      justify-content: center;
      margin-bottom: 18px;
      border: 1px solid var(--glass-border);
      overflow: hidden;
      font-size: 2.4rem;
    }

    .ecosystem-logo-area img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      padding: 10px;
    }

    .ecosystem-name {
      font-family: var(--font-display);
      font-size: 0.95rem;
      font-weight: 700;
      color: var(--text-0);
      margin-bottom: 4px;
    }

    .ecosystem-meta {
      font-size: 0.78rem;
      color: var(--text-2);
      margin-bottom: 14px;
      line-height: 1.5;
    }

    .ecosystem-stats {
      display: flex;
      gap: 16px;
      padding-top: 14px;
      border-top: 1px solid var(--glass-border);
    }

    .eco-stat { }
    .eco-stat-val {
      font-family: var(--font-display);
      font-size: 1.05rem;
      font-weight: 800;
      color: var(--text-0);
    }
    .eco-stat-label { font-size: 0.68rem; color: var(--text-3); text-transform: uppercase; letter-spacing: 0.06em; }

    .eco-status {
      position: absolute;
      top: 14px; right: 14px;
    }

    /* ── QUICK ACTIONS ── */
    .quick-actions-grid {
      display: grid;
      grid-template-columns: repeat(5, 1fr);
      gap: 14px;
      margin-bottom: 28px;
    }

    .quick-action-card {
      background: var(--bg-1);
      border: 1px solid var(--glass-border);
      border-radius: var(--radius-lg);
      padding: 20px 16px;
      text-align: center;
      cursor: pointer;
      transition: var(--transition);
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
    }

    .quick-action-card:hover {
      border-color: rgba(163,230,53,0.35);
      background: rgba(163,230,53,0.05);
      transform: translateY(-3px);
      box-shadow: 0 8px 24px rgba(0,0,0,0.3);
    }

    .qa-icon {
      width: 44px; height: 44px;
      border-radius: var(--radius-md);
      display: flex; align-items: center; justify-content: center;
      font-size: 1.3rem;
      transition: var(--transition);
    }

    .quick-action-card:hover .qa-icon {
      transform: scale(1.1);
    }

    .qa-label {
      font-size: 0.78rem;
      font-weight: 600;
      color: var(--text-1);
      font-family: var(--font-display);
    }

    /* ── SECURITY NOTICE ── */
    .security-notice {
      background: rgba(251,171,3,0.05);
      border: 1px solid rgba(251,171,3,0.15);
      border-radius: var(--radius-lg);
      padding: 18px 24px;
      display: flex;
      align-items: center;
      gap: 16px;
      margin-bottom: 28px;
    }

    .security-icon {
      width: 40px; height: 40px;
      background: rgba(251,171,3,0.1);
      border-radius: 10px;
      display: flex; align-items: center; justify-content: center;
      font-size: 1.1rem;
      flex-shrink: 0;
    }

    .security-text {
      font-size: 0.82rem;
      color: var(--text-2);
      line-height: 1.6;
    }

    .security-text strong { color: var(--text-1); }

    /* ── CREDIT ALLOCATION SUCCESS ── */
    .alloc-success {
      display: none;
      align-items: center;
      gap: 10px;
      padding: 12px 16px;
      background: rgba(16,185,129,0.1);
      border: 1px solid rgba(16,185,129,0.25);
      border-radius: var(--radius-md);
      font-size: 0.85rem;
      color: #34d399;
      margin: 0 24px 16px;
    }

    /* ── MOBILE COLLAPSE ── */
    /* Floating "Menu" button — top-right of the viewport, styled like a
       small on-brand icon button (gradient ring + glass fill) rather than
       a plain glyph, so it reads as part of the header instead of a
       bolted-on debug button. */
    .mobile-admin-toggle {
      display: none;
      align-items: center;
      justify-content: center;
      position: fixed;
      top: calc(16px + env(safe-area-inset-top));
      right: 16px;
      width: 44px;
      height: 44px;
      padding: 0;
      cursor: pointer;
      color: var(--text-0);
      font-family: var(--font-body);
      z-index: 1010;
      border: none;
      border-radius: 50%;
      /* Clip the ::before glass-fill layer (which uses backdrop-filter) to
         this circle — some browsers don't confine a blurred backdrop-filter
         to the border-radius on its own, so it was bleeding a blue halo out
         past the button's edge. */
      overflow: hidden;
      background: var(--grad-primary);
      box-shadow: 0 8px 24px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.06);
      transition: transform 0.15s ease, box-shadow 0.15s ease;
      /* This is a plain <button>, so it gets the browser's default blue
         focus outline after being tapped/clicked — a square-ish ring that
         pokes out past the circular button. Suppress it and rely on the
         box-shadow ring above (which does respect the circle) instead. */
      outline: none;
      -webkit-tap-highlight-color: transparent;
    }
    .mobile-admin-toggle:focus-visible {
      box-shadow: 0 8px 24px rgba(0,0,0,0.4), 0 0 0 3px rgba(20,151,188,0.5);
    }
    .mobile-admin-toggle::before {
      content: '';
      position: absolute;
      inset: 2px;
      border-radius: 50%;
      background: rgba(12,13,24,0.88);
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
    }
    .mobile-admin-toggle svg {
      position: relative;
      z-index: 1;
      color: var(--text-0);
    }
    .mobile-admin-toggle:active {
      transform: scale(0.92);
      box-shadow: 0 4px 14px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.08);
    }

    /* ── SCROLLBAR ── */
    .admin-sidebar::-webkit-scrollbar { width: 4px; }
    .admin-sidebar::-webkit-scrollbar-track { background: transparent; }
    .admin-sidebar::-webkit-scrollbar-thumb { background: rgba(163,230,53,0.3); border-radius: 2px; }

    /* ── ANIMATIONS ── */
    @keyframes spin { to { transform: rotate(360deg); } }
    @keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }
    @keyframes fadeUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
    @keyframes slideIn { from { opacity: 0; transform: translateX(-10px); } to { opacity: 1; transform: translateX(0); } }

    .admin-welcome   { animation: fadeUp 0.5s 0.1s ease both; }
    .stat-grid       { animation: fadeUp 0.5s 0.2s ease both; }
    .admin-panel     { animation: fadeUp 0.5s 0.3s ease both; }

    /* ── RESPONSIVE ── */
    @media (max-width: 1200px) {
      .stat-grid { grid-template-columns: repeat(3, 1fr); }
      .quick-actions-grid { grid-template-columns: repeat(3, 1fr); }
    }

    @media (max-width: 1024px) {
      .insights-grid { grid-template-columns: 1fr 1fr; }
      .ecosystem-grid { grid-template-columns: 1fr 1fr; }
    }

    @media (max-width: 480px) {
      .stat-grid { grid-template-columns: 1fr; }

      /* Header rows like "Users" + "+ New Reward Code" were a fixed-width
         flex row that clipped the button label on narrow screens. Let it
         wrap onto its own full-width line instead. */
      .admin-panel-header {
        flex-wrap: wrap;
        gap: 10px;
        padding: 16px 18px;
      }
      .admin-panel-header .btn {
        width: 100%;
        justify-content: center;
      }
    }

    @media (max-width: 900px) {
      /* Off-canvas sidebar becomes a floating rounded panel rather than
         a flush rectangle, with a dimmed backdrop behind it that closes
         it on tap — same as the tap-outside-to-close pattern already
         used on dashboard.html. */
      .admin-sidebar {
        position: fixed;
        margin: 0;
        transform: translateX(-100%);
        transition: transform 0.3s ease;
        top: 76px;
        left: 10px;
        max-height: calc(100vh - 96px);
        border-radius: 22px;
        box-shadow: 0 20px 50px rgba(0,0,0,0.5);
      }
      .admin-sidebar.open { transform: translateX(0); }

      .admin-sidebar-backdrop {
        display: none;
        position: fixed;
        inset: 0;
        background: rgba(6,8,20,0.6);
        z-index: 190;
      }
      .admin-sidebar-backdrop.open { display: block; }

      .admin-main { padding: 24px 20px 40px; }
      .admin-shell { display: block; }
      .mobile-admin-toggle { display: flex; align-items: center; justify-content: center; }
      .credit-form-grid { grid-template-columns: 1fr; }
      .exp-modal-overlay { padding: 20px 12px; }
      .credit-form-footer { flex-direction: column; align-items: stretch; padding: 0 20px 20px; }
      .credit-form-footer > div:last-child { display: flex; justify-content: flex-end; }
      .insights-grid { grid-template-columns: 1fr; }
      .ecosystem-grid { grid-template-columns: 1fr; }
      .quick-actions-grid { grid-template-columns: repeat(2, 1fr); }
      .stat-grid { grid-template-columns: repeat(2, 1fr); }
      .manage-grid { grid-template-columns: 1fr; }
      .admin-welcome {
        padding: 28px 22px;
        border-radius: 28px;
      }

      .admin-welcome-inner {
        flex-direction: column;
        align-items: flex-start;
        gap: 22px;
      }

      .admin-title {
        font-size: 1.9rem;
        line-height: 1.05;
        letter-spacing: -0.03em;
        margin-bottom: 14px;
        max-width: 280px;
      }

      .admin-desc {
        font-size: 0.95rem;
        line-height: 1.7;
        max-width: 100%;
      }

      .admin-welcome-right {
        align-items: flex-start;
        width: 100%;
      }

      .admin-datetime {
        text-align: left;
        font-size: 0.92rem;
        line-height: 1.7;
      }

      .admin-badge {
        padding: 10px 16px;
        font-size: 0.76rem;
      }

      .admin-welcome-orb {
        width: 180px;
        height: 180px;
        top: -40px;
        right: -60px;
        opacity: 0.45;
      }

      .admin-welcome-orb-2 {
        opacity: 0.25;
      }
    }
    .future-modules-header{
  margin-top:80px;
  margin-bottom:30px;
  padding:32px;
  border:1px solid rgba(255,255,255,0.08);
  border-radius:28px;
  background:
    linear-gradient(
      135deg,
      rgba(163,230,53,0.08),
      rgba(251,171,3,0.05)
    );
}

.future-modules-kicker{
  font-size:0.72rem;
  letter-spacing:0.18em;
  color:#bef264;
  margin-bottom:12px;
  font-weight:700;
}

.future-modules-title{
  font-size:2rem;
  margin-bottom:12px;
  color:white;
}

.future-modules-desc{
  color:var(--text-2);
  max-width:700px;
  line-height:1.7;
}

.future-module-wrapper{
  opacity:0.6;
  filter:grayscale(0.15);
}

.future-module-wrapper .admin-panel,
.future-module-wrapper .ecosystem-card,
.future-module-wrapper .insight-card,
.future-module-wrapper .quick-action-card{
  position:relative;
  overflow:hidden;
}

.future-module-wrapper .admin-panel::after,
.future-module-wrapper .ecosystem-card::after,
.future-module-wrapper .insight-card::after,
.future-module-wrapper .quick-action-card::after{
  content:"COMING SOON";
  position:absolute;
  top:18px;
  right:18px;
  font-size:0.68rem;
  font-weight:700;
  letter-spacing:0.12em;
  color:#bef264;
  padding:6px 10px;
  border-radius:999px;
  background:rgba(163,230,53,0.12);
  border:1px solid rgba(167,139,250,0.2);
}
.trend-live {
  color: #34d399;
}