.admin-page {
      min-height: 100vh;
      padding: 42px 20px 80px;
      background:
        radial-gradient(
          circle at 10% 10%,
          rgba(255, 22, 91, .10),
          transparent 32%
        ),
        radial-gradient(
          circle at 90% 20%,
          rgba(20, 99, 255, .10),
          transparent 35%
        ),
        #07090e;
      color: #fff;
    }

    .admin-shell {
      width: min(1400px, 100%);
      margin: 0 auto;
    }

    .admin-topbar {
      display: flex;
      justify-content: space-between;
      gap: 20px;
      align-items: center;
      margin-bottom: 32px;
    }

    .admin-topbar h1 {
      margin: 5px 0 8px;
      font-size: 42px;
    }

    .admin-topbar p {
      margin: 0;
      color: #8992a3;
    }

    .admin-eyebrow {
      color: #ff2d67;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: .14em;
    }

    .admin-stats-grid {
      display: grid;
      grid-template-columns:
        repeat(4, minmax(0,1fr));
      gap: 14px;
      margin-bottom: 28px;
    }

    .admin-stat-card {
      border: 1px solid #202633;
      border-radius: 18px;
      padding: 22px;
      background:
        rgba(15,19,27,.82);
    }

    .admin-stat-card span {
      display: block;
      color: #929bad;
      font-size: 13px;
      margin-bottom: 12px;
    }

    .admin-stat-card strong {
      font-size: 28px;
    }

    .admin-users-panel {
      border: 1px solid #202633;
      border-radius: 22px;
      background:
        rgba(15,19,27,.88);
      overflow: hidden;
    }

    .admin-users-header {
      display: flex;
      justify-content: space-between;
      gap: 20px;
      align-items: center;
      padding: 24px;
      border-bottom:
        1px solid #202633;
    }

    .admin-users-header h2 {
      margin: 0 0 4px;
    }

    .admin-users-header p {
      margin: 0;
      color: #8992a3;
      font-size: 13px;
    }

    .admin-search {
      width: min(360px,100%);
      height: 44px;
      border: 1px solid #252c39;
      border-radius: 12px;
      background: #090c12;
      color: #fff;
      padding: 0 14px;
      outline: none;
    }

    .admin-table-wrap {
      overflow-x: auto;
    }

    .admin-table {
      width: 100%;
      border-collapse: collapse;
      min-width: 980px;
    }

    .admin-table th {
      padding: 15px 20px;
      text-align: left;
      color: #778195;
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: .08em;
      border-bottom:
        1px solid #202633;
    }

    .admin-table td {
      padding: 17px 20px;
      border-bottom:
        1px solid #171c26;
      color: #d9deea;
      font-size: 13px;
    }

    .admin-user-cell {
      display: flex;
      gap: 12px;
      align-items: center;
    }

    .admin-user-cell strong {
      display: block;
      color: #fff;
    }

    .admin-user-cell span {
      display: block;
      margin-top: 3px;
      color: #7f899a;
      font-size: 12px;
    }

    .admin-avatar {
      width: 38px;
      height: 38px;
      border-radius: 12px;
      display: grid;
      place-items: center;
      background:
        linear-gradient(
          135deg,
          #ff235d,
          #7036ff
        );
      font-weight: 800;
    }

    .admin-badge {
      display: inline-flex;
      align-items: center;
      padding: 6px 9px;
      border-radius: 999px;
      font-size: 11px;
      font-weight: 700;
    }

    .admin-badge.active {
      color: #46e4a1;
      background:
        rgba(34,197,134,.12);
    }

    .admin-badge.inactive {
      color: #a6afbf;
      background:
        rgba(148,163,184,.10);
    }

    .admin-badge.warning {
      color: #ffc766;
      background:
        rgba(255,190,70,.10);
    }

    .admin-badge.danger {
      color: #ff637f;
      background:
        rgba(255,70,105,.10);
    }

    .admin-badge.purple {
      color: #bc9bff;
      background:
        rgba(127,83,255,.12);
    }

    .admin-manage-btn,
    .admin-action-btn {
      border: 1px solid #293140;
      border-radius: 10px;
      background: #111620;
      color: #fff;
      padding: 9px 12px;
      cursor: pointer;
    }

    .admin-manage-btn:hover,
    .admin-action-btn:hover {
      background: #19202c;
    }

    .admin-action-btn.danger {
      border-color:
        rgba(255,67,101,.35);
      color: #ff6b82;
    }

    .admin-modal {
      position: fixed;
      inset: 0;
      z-index: 5000;
      place-items: center;
      padding: 20px;
      background:
        rgba(0,0,0,.72);
      backdrop-filter:
        blur(8px);
    }

    .admin-modal-card {
      position: relative;
      width: min(580px,100%);
      border: 1px solid #252c39;
      border-radius: 24px;
      padding: 28px;
      background: #0d1119;
      box-shadow:
        0 30px 90px
        rgba(0,0,0,.55);
    }

    .admin-modal-card h2 {
      margin: 8px 0 4px;
      font-size: 30px;
    }

    .admin-modal-card > p {
      margin: 0 0 22px;
      color: #818b9d;
    }

    .admin-modal-close {
      position: absolute;
      top: 16px;
      right: 16px;
      width: 38px;
      height: 38px;
      border: 0;
      border-radius: 10px;
      background: #151b25;
      color: #fff;
      font-size: 22px;
      cursor: pointer;
    }

    .admin-user-details {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 12px;
      margin-bottom: 20px;
    }

    .admin-user-details div {
      border: 1px solid #202633;
      border-radius: 14px;
      padding: 15px;
      background: #090c12;
    }

    .admin-user-details span {
      display: block;
      color: #7e8798;
      font-size: 11px;
      margin-bottom: 6px;
    }

    .admin-action-grid {
      display: grid;
      grid-template-columns:
        repeat(2,1fr);
      gap: 10px;
      margin: 20px 0;
    }

    .admin-modal-card .field {
      margin-top: 18px;
    }

    .admin-modal-card .field label {
      display: block;
      margin-bottom: 7px;
      color: #9aa4b5;
      font-size: 12px;
    }

    .admin-modal-card .field input {
      width: 100%;
      height: 44px;
      border: 1px solid #252c39;
      border-radius: 11px;
      background: #080b11;
      color: #fff;
      padding: 0 12px;
    }

    #adminModalMessage,
    #adminMessage {
      margin: 12px 0;
      font-size: 12px;
    }

    .admin-msg-success {
      color: #45e1a0;
    }

    .admin-msg-error {
      color: #ff637f;
    }

    .admin-msg-loading {
      color: #9fa8b8;
    }

    @media(max-width:1000px) {
      .admin-stats-grid {
        grid-template-columns:
          repeat(2,minmax(0,1fr));
      }
    }

    @media(max-width:650px) {
      .admin-page {
        padding: 24px 12px 60px;
      }

      .admin-topbar,
      .admin-users-header {
        align-items: stretch;
        flex-direction: column;
      }

      .admin-topbar h1 {
        font-size: 32px;
      }

      .admin-stats-grid {
        grid-template-columns: 1fr;
      }

      .admin-search {
        width: 100%;
      }

      .admin-user-details,
      .admin-action-grid {
        grid-template-columns: 1fr;
      }
    }