*{
  box-sizing:border-box;
}

body{
  margin:0;
  font-family:Arial,sans-serif;
  background:#07101d;
  color:#fff;
}

.muted{
  color:#8390a3;
}

.admin-body{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    radial-gradient(circle at top,#13243c,#060b13 60%);
}

.login-wrap{
  width:100%;
  max-width:430px;
  padding:20px;
}

.login-card{
  background:#0c1624;
  border:1px solid #1d2b3e;
  padding:32px;
  border-radius:22px;
}

.brand-logo{
  width:60px;
  height:60px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:18px;
  background:#ffc107;
  color:#111;
  font-size:32px;
  font-weight:bold;
}

.login-card input{
  width:100%;
  padding:15px;
  margin:8px 0 18px;
  border-radius:10px;
  border:1px solid #26364a;
  background:#08111d;
  color:white;
}

button{
  border:0;
  cursor:pointer;
}

.login-card button{
  width:100%;
  padding:15px;
  border-radius:10px;
  background:#ffc107;
  font-weight:bold;
}

.error-box{
  background:#501b25;
  padding:12px;
  margin:15px 0;
  border-radius:8px;
}

.dashboard{
  display:flex;
  min-height:100vh;
}

.sidebar{
  width:220px;
  background:#081320;
  padding:25px 15px;
}

.admin-brand{
  font-size:20px;
  font-weight:bold;
  margin-bottom:30px;
}

.admin-brand span{
  color:#ffc107;
}

.sidebar a{
  display:block;
  text-decoration:none;
  color:#9daabd;
  padding:12px 15px;
  margin:5px 0;
  border-radius:9px;
}

.sidebar a.active{
  color:#fff;
  background:#11253c;
}

.dashboard-main{
  flex:1;
  padding:30px;
}

.dashboard-title{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.online{
  color:#20d976;
}

.stat-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:16px;
  margin:25px 0;
}

.stat-card,
.panel{
  background:#0d1928;
  border:1px solid #1b2b3d;
  border-radius:15px;
  padding:20px;
}

.stat-card small{
  color:#8291a5;
  display:block;
}

.stat-card strong{
  font-size:25px;
  display:block;
  margin-top:10px;
}

.panel-title{
  font-size:18px;
  font-weight:bold;
  margin-bottom:15px;
}

.package-row{
  display:grid;
  grid-template-columns:2fr 1fr 1fr 1fr;
  gap:15px;
  padding:15px;
  border-bottom:1px solid #1b2938;
}

.package-row small{
  display:block;
  color:#75879e;
}

.miniapp-body{
  background:#040a12;
}

.miniapp{
  max-width:520px;
  margin:auto;
  min-height:100vh;
  padding:20px 18px 100px;
}

.topbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.topbar small{
  color:#8797ab;
}

.topbar h1{
  margin:6px 0;
  color:#ffc107;
  font-size:36px;
}

.status-pill{
  padding:8px 14px;
  background:#123a28;
  color:#2ee487;
  border-radius:30px;
}

.miner-card{
  text-align:center;
  margin:25px 0;
  padding:30px 20px;
  border-radius:24px;
  background:
    radial-gradient(circle at top,#1b314c,#0b1624 65%);
  border:1px solid #23364b;
}

.miner-icon{
  width:110px;
  height:110px;
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:50%;
  background:#ffc107;
  color:#312100;
  font-size:60px;
  font-weight:bold;
  box-shadow:0 0 35px rgba(255,193,7,.25);
}

.mining-speed{
  color:#2ee487;
  margin:15px 0;
}

.miner-card button{
  width:100%;
  padding:16px;
  border-radius:12px;
  background:#ffc107;
  font-weight:bold;
  font-size:16px;
}

.section-title{
  font-size:18px;
  font-weight:bold;
  margin:25px 0 12px;
}

.mini-package{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:17px;
  background:#0c1623;
  border:1px solid #1b2a3d;
  margin-bottom:10px;
  border-radius:15px;
}

.mini-package h3{
  margin:8px 0 4px;
}

.mini-package small{
  color:#8392a6;
}

.package-badge{
  color:#ffc107;
  font-size:11px;
}

.package-price{
  color:#2ee487;
  font-weight:bold;
}

.bottom-nav{
  position:fixed;
  bottom:0;
  left:50%;
  transform:translateX(-50%);
  width:min(520px,100%);
  display:flex;
  justify-content:space-around;
  background:#08111d;
  border-top:1px solid #1c2939;
  padding:13px 5px;
}

.bottom-nav span{
  text-align:center;
  color:#748398;
}

.bottom-nav small{
  display:block;
  margin-top:5px;
}

.bottom-nav .selected{
  color:#ffc107;
}

@media(max-width:800px){
  .sidebar{
    width:170px;
  }

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

  .package-row{
    grid-template-columns:1fr 1fr;
  }
}

.settings-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  margin-top:25px;
}

.settings-grid label,
.package-form label{
  display:block;
  color:#9aa9bb;
  margin:14px 0 7px;
}

.settings-grid input,
.settings-grid select,
.package-form input,
.package-form select,
.package-editor input,
.package-editor select{
  width:100%;
  border:1px solid #25364b;
  background:#08121f;
  color:white;
  border-radius:10px;
  padding:13px;
  outline:none;
}

.settings-save{
  grid-column:1/-1;
}

.settings-save button,
.package-form button,
.package-editor button,
.admin-table button{
  background:#ffc107;
  color:#161000;
  padding:12px 18px;
  border-radius:9px;
  font-weight:bold;
}

.success-box{
  background:#113d2a;
  border:1px solid #1f754d;
  color:#55e89d;
  padding:14px;
  border-radius:10px;
  margin-top:20px;
}

.package-form{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;
}

.package-editor{
  border-top:1px solid #213047;
  padding:20px 0 10px;
}

.package-editor-title{
  display:flex;
  justify-content:space-between;
  margin-bottom:12px;
}

.package-editor-title span{
  color:#718198;
}

.package-editor-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
}

.delete-form{
  margin-bottom:15px;
}

.danger-button{
  background:#501c25!important;
  color:#ff7787!important;
}

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

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

.admin-table th,
.admin-table td{
  padding:14px;
  text-align:left;
  border-bottom:1px solid #1b2a3d;
}

.admin-table th{
  color:#8190a4;
  font-size:13px;
}

.admin-table td small{
  display:block;
  color:#718198;
  margin-top:4px;
}

.user-status{
  display:inline-block;
  padding:5px 10px;
  border-radius:20px;
  font-size:12px;
}

.user-status.active{
  background:#123b29;
  color:#36df8a;
}

.user-status.blocked{
  background:#461c24;
  color:#ff7585;
}

@media(max-width:900px){

  .settings-grid{
    grid-template-columns:1fr;
  }

  .package-form,
  .package-editor-grid{
    grid-template-columns:1fr 1fr;
  }

}

@media(max-width:650px){

  .dashboard{
    display:block;
  }

  .sidebar{
    width:100%;
  }

  .dashboard-main{
    padding:18px;
  }

  .stat-grid,
  .package-form,
  .package-editor-grid{
    grid-template-columns:1fr;
  }

}

.app-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:20px;
}

.app-header small{
  display:block;
  color:#718095;
  margin-bottom:5px;
}

.app-header strong{
  font-size:18px;
}

.avatar,
.profile-avatar{
  background:#152335;
  background-position:center;
  background-size:cover;
  border:2px solid #20d877;
  display:flex;
  align-items:center;
  justify-content:center;
}

.avatar{
  width:44px;
  height:44px;
  border-radius:50%;
}

.balance-card{
  padding:24px;
  border-radius:22px;
  text-align:center;
  background:
    radial-gradient(
      circle at top,
      #18304c,
      #0b1623 70%
    );
  border:1px solid #22364d;
}

.balance-card small,
.wallet-card small{
  letter-spacing:1px;
  color:#8493a7;
}

.balance-card h1,
.wallet-card h1{
  margin:10px 0;
  font-size:35px;
  color:#ffc107;
}

.speed-pill{
  display:inline-flex;
  gap:6px;
  padding:8px 13px;
  border-radius:20px;
  color:#39e88c;
  background:#123729;
}

.mining-machine{
  text-align:center;
  padding:30px 0 20px;
}

.machine-ring{
  width:165px;
  height:165px;
  border-radius:50%;
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:center;
  border:2px solid #58451b;
  background:
    radial-gradient(
      circle,
      #3d321a,
      #101822 68%
    );
}

.machine-core{
  width:115px;
  height:115px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    linear-gradient(
      145deg,
      #ffda39,
      #d98c00
    );
  color:#382200;
  font-weight:900;
  font-size:60px;
  box-shadow:
    0 0 32px
    rgba(255,190,0,.2);
}

.mining-machine h2{
  margin:20px 0 5px;
}

.mining-machine p{
  color:#42e795;
}

.gold-button,
.secondary-button{
  width:100%;
  min-height:50px;
  border-radius:13px;
  font-weight:800;
  font-size:15px;
}

.gold-button{
  background:
    linear-gradient(
      90deg,
      #ffb900,
      #ffdf3b
    );
  color:#251800;
}

.secondary-button{
  background:#142338;
  color:#fff;
  border:1px solid #263a53;
}

.quick-stats,
.profile-stat-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

.quick-stats div,
.profile-stat-grid div{
  background:#0b1624;
  border:1px solid #1c2a3d;
  padding:16px;
  border-radius:14px;
}

.quick-stats small,
.profile-stat-grid small{
  display:block;
  color:#76869a;
  margin-bottom:7px;
}

.app-page{
  display:none;
}

.app-page.active{
  display:block;
}

.page-heading{
  margin-bottom:20px;
}

.page-heading h2{
  margin-bottom:5px;
}

.page-heading p{
  color:#77879b;
  margin-top:0;
}

.premium-package{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:18px;
  border-radius:16px;
  background:#0c1725;
  border:1px solid #1c2c40;
  margin-bottom:12px;
}

.premium-package h3{
  margin:8px 0 4px;
}

.premium-package p{
  color:#42df91;
  margin:0;
  font-size:13px;
}

.pkg-badge{
  color:#ffcb19;
  font-size:11px;
  font-weight:bold;
}

.pkg-buy{
  text-align:right;
}

.pkg-buy strong{
  display:block;
  color:#42df91;
  margin-bottom:9px;
}

.pkg-buy button{
  background:#ffc107;
  padding:8px 18px;
  border-radius:8px;
  font-weight:bold;
}

.feature-card{
  display:flex;
  align-items:center;
  gap:15px;
  padding:18px;
  border:1px solid #1b2b3f;
  background:#0b1624;
  border-radius:16px;
  margin-bottom:12px;
}

.feature-card h3{
  margin:0 0 5px;
}

.feature-card p{
  margin:0;
  color:#76879b;
}

.feature-icon{
  font-size:30px;
}

.wallet-card{
  text-align:center;
  padding:25px;
  border-radius:20px;
  background:
    linear-gradient(
      145deg,
      #30204c,
      #17172c
    );
  border:1px solid #4a3372;
}

.wallet-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:15px 0 20px;
}

.wallet-actions button{
  padding:14px;
  border-radius:11px;
  background:#12283b;
  color:#fff;
  font-weight:bold;
}

.wallet-actions button:first-child{
  background:#18ad5d;
}

.wallet-form{
  background:#0b1624;
  border:1px solid #1c2d40;
  border-radius:15px;
  padding:16px;
  margin-bottom:20px;
}

.wallet-form input,
.wallet-form select{
  width:100%;
  min-height:47px;
  background:#07111d;
  border:1px solid #23344a;
  border-radius:10px;
  color:#fff;
  padding:12px;
  margin-bottom:10px;
  font-size:16px;
}

.transaction-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 3px;
  border-bottom:1px solid #172639;
}

.transaction-row strong{
  text-transform:capitalize;
}

.transaction-row small{
  display:block;
  color:#718297;
  margin-top:5px;
}

.positive{
  color:#32df84;
}

.negative{
  color:#ff6375;
}

.empty-row{
  padding:25px;
  text-align:center;
  color:#78889a;
}

.profile-card{
  text-align:center;
  padding:25px 0;
}

.profile-avatar{
  width:90px;
  height:90px;
  border-radius:50%;
  margin:auto;
  font-size:30px;
}

.profile-card h2{
  margin-bottom:5px;
}

.profile-card p{
  color:#78889c;
}

.premium-bottom-nav{
  position:fixed;
  z-index:100;
  left:50%;
  bottom:0;
  transform:translateX(-50%);
  width:min(520px,100%);
  display:grid;
  grid-template-columns:repeat(5,1fr);
  background:#07111d;
  border-top:1px solid #19283a;
}

.premium-bottom-nav button{
  background:none;
  color:#6f8094;
  min-height:65px;
}

.premium-bottom-nav button span{
  display:block;
  font-size:20px;
}

.premium-bottom-nav button small{
  display:block;
  margin-top:4px;
}

.premium-bottom-nav button.active{
  color:#ffc107;
}

.app-message{
  position:fixed;
  z-index:200;
  left:50%;
  bottom:80px;
  transform:
    translate(-50%,20px);
  width:calc(100% - 40px);
  max-width:480px;
  opacity:0;
  pointer-events:none;
  padding:13px 16px;
  border-radius:12px;
  background:#172536;
  text-align:center;
  transition:.2s;
}

.app-message.show{
  opacity:1;
  transform:
    translate(-50%,0);
}

.app-message.success{
  background:#123d2a;
  color:#5bf09e;
}

.app-message.error{
  background:#48202a;
  color:#ff8391;
}

.referral-hero{
  padding:24px 18px;
  text-align:center;
  border-radius:20px;
  background:
    radial-gradient(
      circle at top,
      #34205a,
      #131527 70%
    );
  border:1px solid #49346e;
}

.referral-gift{
  font-size:48px;
  margin-bottom:10px;
}

.referral-hero small{
  color:#968cad;
  letter-spacing:1px;
}

.referral-hero h1{
  color:#ffc107;
  font-size:32px;
  margin:8px 0;
}

.referral-hero p{
  color:#8c91a2;
  margin-bottom:0;
}

.ref-level-grid{
  display:grid;
  grid-template-columns:
    repeat(3,1fr);
  gap:9px;
  margin:14px 0;
}

.ref-level-grid div{
  text-align:center;
  padding:14px 6px;
  border-radius:13px;
  background:#0c1725;
  border:1px solid #1d2c40;
}

.ref-level-grid span,
.ref-level-grid small{
  display:block;
  color:#8190a5;
}

.ref-level-grid strong{
  display:block;
  font-size:23px;
  margin:6px 0;
}

.ref-level-grid small{
  color:#35df89;
}

.ref-link-card{
  padding:17px;
  background:#0b1624;
  border:1px solid #1c2d40;
  border-radius:15px;
}

.ref-link-card label{
  display:block;
  margin-bottom:9px;
  color:#8998aa;
}

.ref-link-box input{
  width:100%;
  padding:13px;
  margin-bottom:12px;
  border-radius:10px;
  border:1px solid #25364c;
  background:#07111d;
  color:#fff;
  font-size:14px;
}

.inline-action{
  display:flex;
  gap:6px;
  margin:5px 0;
}

.inline-action input{
  min-width:150px;
  padding:8px;
  border-radius:7px;
  border:1px solid #26384c;
  background:#08131f;
  color:#fff;
}

.mining-progress-wrap{
  margin:18px 0;
  padding:13px;
  border-radius:13px;
  background:#09131f;
  border:1px solid #1b2b3e;
}

.mining-time-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:12px;
  color:#7f8ea2;
  margin-bottom:9px;
}

.mining-time-row strong{
  color:#fff;
}

.mining-progress{
  height:8px;
  overflow:hidden;
  border-radius:10px;
  background:#172334;
}

.mining-progress-bar{
  width:0%;
  height:100%;
  border-radius:10px;
  background:linear-gradient(
    90deg,
    #d99200,
    #ffd43b
  );
  transition:width .5s linear;
}

.admin-user-link{
  color:#fff;
  text-decoration:none;
}

.admin-user-link:hover{
  text-decoration:underline;
}

.back-link{
  display:inline-block;
  margin-bottom:15px;
  color:#9bb0c8;
  text-decoration:none;
}

.user-status.pending{
  background:#493810;
  color:#ffd35b;
}

.user-status.approved{
  background:#113d2a;
  color:#4ce395;
}

.user-status.rejected{
  background:#471e27;
  color:#ff7c8b;
}

@media(max-width:900px){

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

}

.settings-grid textarea{
  width:100%;
  border:1px solid #25364b;
  background:#08121f;
  color:#fff;
  border-radius:10px;
  padding:13px;
  resize:vertical;
  font-family:inherit;
  font-size:15px;
}

.payment-info{
  margin-bottom:14px;
  padding:14px;
  border-radius:12px;
  background:#091520;
  border:1px solid #1c3042;
}

.pay-detail{
  padding:10px 0;
  border-bottom:1px solid #1b2a39;
}

.pay-detail small{
  display:block;
  color:#8293a7;
  margin-bottom:5px;
}

.pay-detail strong{
  display:block;
  color:#fff;
  word-break:break-all;
  font-size:13px;
}

.pay-instruction{
  color:#91a0b2;
  font-size:13px;
  line-height:1.5;
}

.pay-minimum{
  color:#40e18f;
  font-weight:bold;
  margin-bottom:0;
}

.wallet-form button:disabled{
  opacity:.5;
  cursor:not-allowed;
}

.wallet-form textarea{
  width:100%;
  min-height:80px;
  background:#07111d;
  border:1px solid #23344a;
  border-radius:10px;
  color:#fff;
  padding:12px;
  margin-bottom:10px;
  font-size:16px;
  resize:vertical;
  font-family:inherit;
}

.my-package-card{
  padding:18px;
  margin-bottom:16px;
  border-radius:16px;
  background:
    linear-gradient(
      145deg,
      #17283e,
      #0b1624
    );
  border:1px solid #24384f;
}

.my-package-card > small{
  color:#7e8fa4;
  letter-spacing:1px;
}

.my-package-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:15px;
  margin-top:10px;
}

.my-package-row h3{
  margin:0 0 5px;
  color:#ffc107;
}

.my-package-row p{
  margin:0;
  color:#7e8ea2;
  font-size:12px;
}

.my-package-row strong{
  color:#3fe28d;
  font-size:13px;
}

.package-modal{
  position:fixed;
  z-index:500;
  inset:0;
  background:rgba(0,0,0,.72);
  align-items:center;
  justify-content:center;
  padding:20px;
}

.package-modal-card{
  width:100%;
  max-width:390px;
  background:#0c1725;
  border:1px solid #293c54;
  border-radius:20px;
  padding:22px;
}

.package-modal-card h3{
  margin-top:0;
  font-size:22px;
}

.package-modal-card p{
  color:#8a99aa;
  line-height:1.5;
}

.package-modal-price{
  font-size:32px;
  font-weight:900;
  color:#ffc107;
  margin:18px 0;
}

.package-modal-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.package-modal-actions button{
  min-height:48px;
}

.panel > form > label{
  display:block;
  color:#91a1b5;
  margin:14px 0 7px;
}

.panel > form > input,
.panel > form > textarea,
.panel > form > select{
  width:100%;
  padding:13px;
  border-radius:10px;
  border:1px solid #25364b;
  background:#08121f;
  color:#fff;
  font-size:15px;
}

.panel > form > textarea{
  resize:vertical;
}

.announcement-banner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:16px;
  margin-bottom:16px;
  border-radius:15px;
  background:#261e3d;
  border:1px solid #49366d;
}

.announcement-banner small{
  color:#b39bd4;
}

.announcement-banner h3{
  margin:4px 0;
}

.announcement-banner p{
  margin:0;
  color:#9f96ad;
  font-size:13px;
}

.announcement-banner button{
  padding:10px 14px;
  border-radius:9px;
  background:#ffc107;
  font-weight:bold;
}

.daily-card{
  display:flex;
  align-items:center;
  gap:14px;
  padding:17px;
  border-radius:16px;
  background:
    linear-gradient(
      145deg,
      #2e2049,
      #171529
    );
  border:1px solid #4c3771;
}

.daily-icon{
  font-size:37px;
}

.daily-content{
  flex:1;
}

.daily-content small{
  color:#a496b8;
}

.daily-content h3{
  color:#ffc107;
  margin:5px 0;
}

.daily-content p{
  margin:0;
  color:#9690a0;
  font-size:13px;
}

.daily-card button{
  padding:10px 15px;
  border-radius:9px;
  background:#8e4bea;
  color:#fff;
  font-weight:bold;
}

.daily-card button:disabled{
  opacity:.5;
}

.task-row{
  display:flex;
  align-items:center;
  gap:12px;
  padding:14px;
  margin-bottom:10px;
  border-radius:14px;
  background:#0b1624;
  border:1px solid #1c2c3f;
}

.task-icon{
  width:42px;
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:11px;
  background:#142237;
  font-size:23px;
}

.task-info{
  flex:1;
  min-width:0;
}

.task-info strong{
  display:block;
}

.task-info small{
  display:block;
  color:#7f8ea1;
  margin:4px 0;
}

.task-info span{
  color:#37df89;
  font-size:12px;
}

.task-row button{
  padding:9px 13px;
  border-radius:8px;
  background:#173b2c;
  color:#43e590;
  font-weight:bold;
}

.task-row button:disabled{
  opacity:.45;
}

.leader-row{
  display:flex;
  align-items:center;
  gap:11px;
  padding:13px 5px;
  border-bottom:1px solid #172638;
}

.leader-rank{
  width:34px;
  font-weight:bold;
  color:#ffc107;
}

.leader-user{
  flex:1;
}

.leader-user strong{
  display:block;
}

.leader-user small{
  color:#77879a;
}

.leader-row > span{
  color:#39e08a;
  font-weight:bold;
  font-size:13px;
}