:root{
  --bg:#0A0A0F;
  --panel:#121119;
  --panel-2:#16151f;
  --line:rgba(255,255,255,0.08);
  --text:#F4F2EF;
  --muted:#9290A0;
  --cyan:#2DD9FF;
  --violet:#7B5CFA;
  --magenta:#FF2E97;
  --grad: linear-gradient(120deg, var(--cyan), var(--violet) 55%, var(--magenta));
}
*{box-sizing:border-box;}
body{margin:0; background:var(--bg); color:var(--text); font-family:'Inter',sans-serif; min-height:100vh;}
.btn{display:inline-flex; align-items:center; justify-content:center; padding:11px 18px; border-radius:10px; font-weight:600; font-size:13.5px; cursor:pointer; border:1px solid transparent;}
.btn--primary{background:var(--grad); color:#0A0A0F;}
.btn--ghost{border-color:var(--line); color:var(--text); background:rgba(255,255,255,0.03);}
.btn--ghost:hover{border-color:rgba(255,255,255,0.25);}
.btn--full{width:100%;}
.btn--small{padding:7px 12px; font-size:12px; border-radius:8px;}

/* login screen */
.login-screen{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px;
  background:radial-gradient(circle at 20% 10%, rgba(255,46,151,0.15), transparent 40%),
             radial-gradient(circle at 80% 90%, rgba(45,217,255,0.15), transparent 40%);
}
.login-card{
  width:100%; max-width:380px; background:var(--panel); border:1px solid var(--line); border-radius:20px;
  padding:36px; display:flex; flex-direction:column; gap:14px;
}
.login-brand{font-family:'Unbounded'; font-weight:600; font-size:20px;}
.login-brand span{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;}
.login-sub{color:var(--muted); font-size:13.5px; margin-bottom:8px;}
.login-card label{font-size:12.5px; color:var(--muted); margin-top:6px;}
.login-card input{
  background:var(--panel-2); border:1px solid var(--line); border-radius:10px; padding:12px 13px;
  color:var(--text); font-size:14px; outline:none;
}
.login-card input:focus{border-color:var(--cyan);}
.login-error{color:var(--magenta); font-size:13px; min-height:16px;}

/* admin shell */
.admin-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 28px; border-bottom:1px solid var(--line); position:sticky; top:0; background:rgba(10,10,15,0.85); backdrop-filter:blur(10px); z-index:10;
}
.admin-brand{font-family:'Unbounded'; font-weight:600; font-size:17px;}
.admin-brand span{background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent;}
.admin-user{display:flex; align-items:center; gap:14px; font-size:13.5px; color:var(--muted);}
.admin-main{padding:28px; max-width:1280px; margin:0 auto;}

.stats-row{display:grid; grid-template-columns:repeat(6,1fr); gap:14px; margin-bottom:24px;}
.stat-card{
  background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:16px 18px;
}
.stat-card__num{font-family:'JetBrains Mono'; font-size:22px; font-weight:600;}
.stat-card__label{font-size:12px; color:var(--muted); margin-top:4px; text-transform:capitalize;}

.toolbar{display:flex; gap:12px; margin-bottom:18px; flex-wrap:wrap;}
.toolbar input, .toolbar select{
  background:var(--panel-2); border:1px solid var(--line); border-radius:10px; padding:11px 13px;
  color:var(--text); font-size:13.5px; outline:none;
}
.toolbar input{flex:1; min-width:220px;}
.toolbar input:focus, .toolbar select:focus{border-color:var(--cyan);}

.table-wrap{background:var(--panel); border:1px solid var(--line); border-radius:16px; overflow:auto;}
.apps-table{width:100%; border-collapse:collapse; font-size:13.5px; min-width:980px;}
.apps-table th{
  text-align:left; padding:14px 16px; color:var(--muted); font-weight:600; font-size:12px;
  text-transform:uppercase; letter-spacing:0.04em; border-bottom:1px solid var(--line); white-space:nowrap;
}
.apps-table td{padding:14px 16px; border-bottom:1px solid var(--line); vertical-align:top;}
.apps-table tr:last-child td{border-bottom:none;}
.apps-table tr:hover td{background:rgba(255,255,255,0.015);}
.mono{font-family:'JetBrains Mono'; font-size:12.5px; color:var(--muted);}

.status-select{
  background:var(--panel-2); border:1px solid var(--line); border-radius:8px; padding:7px 9px;
  color:var(--text); font-size:12.5px;
}
.status-pill{display:inline-block; padding:4px 10px; border-radius:999px; font-size:11.5px; font-weight:600; background:rgba(255,255,255,0.08); color:var(--text);}
.status-pill--new{background:rgba(45,217,255,0.15); color:var(--cyan);}
.status-pill--in_review{background:rgba(255,200,87,0.15); color:#FFC857;}
.status-pill--approved{background:rgba(95,224,161,0.15); color:#5FE0A1;}
.status-pill--rejected{background:rgba(255,46,151,0.15); color:var(--magenta);}
.status-pill--sent{background:rgba(123,92,250,0.15); color:var(--violet);}
.status-pill--standard{background:rgba(146,144,160,0.15); color:var(--muted);}
.status-pill--premium{background:rgba(45,217,255,0.15); color:var(--cyan);}
.status-pill--black{background:rgba(255,255,255,0.1); color:var(--text);}

.comment-input{
  background:var(--panel-2); border:1px solid var(--line); border-radius:8px; padding:7px 9px;
  color:var(--text); font-size:12.5px; width:160px;
}
.empty-state{padding:40px; text-align:center; color:var(--muted);}

@media (max-width:900px){
  .stats-row{grid-template-columns:repeat(2,1fr);}
}
