@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#0a0e1a;
  --bg-secondary:#111827;
  --card:#141c2b;
  --card-solid:#111827;
  --border:#1e293b;
  --border-hover:#334155;
  --text:#e2e8f0;
  --text-muted:#64748b;
  --accent:#3b82f6;
  --accent-hover:#2563eb;
  --accent-glow:rgba(59,130,246,0.15);
  --accent-bg:rgba(59,130,246,0.08);
  --danger:#ef4444;
  --danger-bg:rgba(239,68,68,0.08);
  --success:#22c55e;
  --success-bg:rgba(34,197,94,0.08);
  --warning:#f59e0b;
  --warning-bg:rgba(245,158,11,0.08);
  --cyan:#06b6d4;
  --purple:#8b5cf6;
  --radius:12px;
  --radius-sm:8px;
  --radius-lg:16px;
  --shadow:0 1px 2px rgba(0,0,0,0.2);
  --shadow-md:0 2px 8px rgba(0,0,0,0.2);
  --shadow-lg:0 4px 16px rgba(0,0,0,0.25);
  --transition:all .2s cubic-bezier(.4,0,.2,1)
}
body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  background:var(--bg);
  color:var(--text);
  min-height:100vh;
  line-height:1.6;
  overflow-x:hidden;
}
.wrap{position:relative;z-index:1;padding:2.5rem;max-width:960px;margin:0 auto}

/* Header */
.header{
  text-align:center;margin-bottom:2rem;padding:2rem 0 1.5rem;
  position:relative;
}
.header::after{
  content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);
  width:60px;height:1px;
  background:var(--border-hover);
}
.logo{
  width:48px;height:48px;margin:0 auto 1rem;
  background:var(--accent);
  border-radius:var(--radius-sm);
  display:flex;align-items:center;justify-content:center;
}
.logo i{font-size:20px;color:#fff}
.title{
  font-size:24px;font-weight:700;
  color:#fff;
  margin-bottom:4px;letter-spacing:-0.3px;
}
.subtitle{font-size:13px;color:var(--text-muted);font-weight:400}

/* Tabs */
.tabs{
  display:flex;gap:0;margin-bottom:2rem;
  border-bottom:1px solid var(--border);
}
.tab{
  padding:10px 20px;font-size:13px;font-weight:500;
  border:none;border-radius:0;
  background:transparent;cursor:pointer;
  color:var(--text-muted);
  transition:var(--transition);
  border-bottom:2px solid transparent;
  margin-bottom:-1px;
}
.tab.active{
  color:var(--accent);
  border-bottom-color:var(--accent);
}
.tab:hover:not(.active){color:var(--text)}

/* Panels */
.panel{display:none}
.panel.active{display:block;animation:panelIn .35s cubic-bezier(.4,0,.2,1)}
@keyframes panelIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}

/* Stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:1.5rem}
.sc{
  background:var(--card);
  border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:18px 16px;text-align:center;
  transition:var(--transition);
}
.sc:nth-child(1){border-left:2px solid var(--accent)}
.sc:nth-child(2){border-left:2px solid var(--success)}
.sc:nth-child(3){border-left:2px solid var(--danger)}
.sc:nth-child(4){border-left:2px solid var(--warning)}
.sc:hover{border-color:var(--border-hover)}
.sc .sc-icon{
  width:36px;height:36px;margin:0 auto 10px;
  border-radius:var(--radius-sm);
  display:flex;align-items:center;justify-content:center;
  font-size:16px;
}
.sc:nth-child(1) .sc-icon{background:var(--accent-bg);color:var(--accent)}
.sc:nth-child(2) .sc-icon{background:var(--success-bg);color:var(--success)}
.sc:nth-child(3) .sc-icon{background:var(--danger-bg);color:var(--danger)}
.sc:nth-child(4) .sc-icon{background:var(--warning-bg);color:var(--warning)}
.sv{font-size:26px;font-weight:700;color:#fff;letter-spacing:-0.3px}
.sl{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-top:2px;font-weight:500}

/* Vault toolbar */
.vault-toolbar{display:flex;gap:10px;margin-bottom:1.25rem;flex-wrap:wrap;align-items:center}
.vault-toolbar input{
  flex:1;min-width:200px;padding:10px 14px 10px 38px;
  border:1px solid var(--border);border-radius:var(--radius);
  background:var(--card-solid);color:var(--text);
  font-size:14px;font-family:inherit;
  transition:var(--transition);
}
.vault-toolbar input:focus{outline:none;border-color:var(--accent)}
.vault-toolbar input::placeholder{color:var(--text-muted)}
.search-wrapper{position:relative;flex:1;min-width:200px}
.search-wrapper i{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--text-muted);font-size:14px;pointer-events:none}
.search-wrapper input{width:100%;padding-left:38px}

/* Email grid */
.email-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:10px}
.ei{
  background:var(--card);
  border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:12px 16px;
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  transition:var(--transition);
}
.ei:hover{border-color:var(--border-hover)}
.et{font-size:14px;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;font-weight:500}
.cbtn{
  flex-shrink:0;
  border:1px solid var(--border);background:rgba(255,255,255,0.04);
  border-radius:var(--radius-sm);padding:7px 16px;
  font-size:12px;font-weight:600;cursor:pointer;
  color:var(--text);font-family:inherit;
  transition:var(--transition);
  text-transform:uppercase;letter-spacing:.3px;
}
.cbtn:hover:not(:disabled){
  background:var(--accent);border-color:var(--accent);color:#fff;
}
.cbtn.copied{background:var(--success)!important;border-color:var(--success)!important;color:#fff!important}
.cbtn.exhausted{background:var(--danger-bg);border-color:rgba(239,68,68,0.3);color:var(--danger);cursor:not-allowed;opacity:0.8}
.cbtn.daily-limit{background:var(--warning-bg);border-color:rgba(245,158,11,0.3);color:var(--warning);cursor:not-allowed;opacity:0.8}
.badge{
  display:inline-flex;align-items:center;justify-content:center;
  font-size:11px;padding:3px 8px;border-radius:4px;
  font-weight:600;flex-shrink:0;
}
.reset-note{
  font-size:13px;color:var(--text-muted);text-align:center;
  margin-top:1.5rem;padding:1rem 0 0;
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.reset-note i{font-size:12px;color:var(--warning)}

/* Empty state */
.empty-state{
  text-align:center;padding:3rem 1rem;
  color:var(--text-muted);
}
.empty-state i{font-size:48px;margin-bottom:1rem;opacity:0.3;display:block}
.empty-state p{font-size:15px;font-weight:500;margin-bottom:4px}
.empty-state span{font-size:13px;opacity:0.6}

/* Loading */
.loading-bar{
  position:fixed;top:0;left:0;right:0;height:3px;z-index:9999;
  background:linear-gradient(90deg,var(--accent),var(--purple),var(--cyan));
  background-size:200% 100%;
  animation:loadSlide 1.5s ease-in-out infinite;
  opacity:0;transition:opacity .3s;
  pointer-events:none;
}
.loading-bar.active{opacity:1}
@keyframes loadSlide{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* Admin sections */
.admin-section{margin-bottom:2rem}
.section-title{
  font-size:11px;font-weight:700;color:var(--text-muted);
  text-transform:uppercase;letter-spacing:1px;
  margin-bottom:.75rem;
  display:flex;align-items:center;gap:8px;
}
.section-title i{font-size:12px;color:var(--accent)}
.admin-card{
  background:var(--card);
  border:1px solid var(--border);border-radius:var(--radius-sm);
  padding:1.25rem 1.5rem;
}
.admin-card.compact{padding:1.25rem 1.75rem}
.form-row{display:flex;gap:10px;flex-wrap:wrap;align-items:flex-end}
.form-group{display:flex;flex-direction:column;gap:6px;flex:1;min-width:180px}
.form-group label{font-size:12px;font-weight:600;color:var(--text-muted)}
.form-group input{
  padding:10px 14px;
  border:1px solid var(--border);border-radius:var(--radius-sm);
  background:var(--card-solid);color:var(--text);
  font-size:14px;font-family:inherit;
  transition:var(--transition);
}
.form-group input:focus{outline:none;border-color:var(--accent)}

/* Buttons */
.btn-primary{
  padding:9px 18px;border:none;border-radius:var(--radius-sm);
  background:var(--accent);color:#fff;font-size:13px;font-weight:500;
  cursor:pointer;font-family:inherit;
  transition:var(--transition);
}
.btn-primary:hover{background:var(--accent-hover)}
.btn-danger{
  padding:7px 14px;border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:transparent;color:var(--danger);
  font-size:12px;font-weight:500;cursor:pointer;
  font-family:inherit;transition:var(--transition);
}
.btn-danger:hover{background:var(--danger-bg);border-color:var(--danger)}
.btn-sm{
  padding:7px 14px;border:1px solid var(--border);
  border-radius:var(--radius-sm);
  background:transparent;color:var(--text-muted);
  font-size:12px;font-weight:500;cursor:pointer;
  font-family:inherit;transition:var(--transition);
}
.btn-sm:hover{color:var(--text);border-color:var(--border-hover)}
.btn-warning{
  padding:9px 18px;border:none;border-radius:var(--radius-sm);
  background:var(--warning);color:#fff;font-size:13px;font-weight:500;
  cursor:pointer;font-family:inherit;transition:var(--transition);
}
.btn-warning:hover{opacity:.9}
.btn-primary.btn-sm{padding:8px 14px;font-size:12px}
.btn-danger.btn-sm{padding:8px 14px;font-size:12px}

/* Settings */
.settings-row{display:flex;gap:2rem;flex-wrap:wrap}
.setting-item{display:flex;flex-direction:column;gap:8px}
.setting-item label{
  font-size:12px;font-weight:600;color:var(--text-muted);
  display:flex;align-items:center;gap:6px;
}
.setting-item label i{font-size:12px;color:var(--accent);opacity:0.7}
.setting-input-row{display:flex;align-items:center;gap:8px}
.setting-input-row input{
  width:64px;padding:8px 10px;
  border:1px solid var(--border);border-radius:var(--radius-sm);
  background:var(--card-solid);color:var(--text);
  font-size:16px;font-family:inherit;
  text-align:center;font-weight:700;
  transition:var(--transition);
}
.setting-input-row input:focus{outline:none;border-color:var(--accent)}
.exhausted-count,.total-count{font-size:24px;font-weight:800;min-width:30px}
.exhausted-count{color:var(--danger)}
.total-count{color:var(--accent)}

/* Admin table */
.admin-table{width:100%;border-collapse:collapse;font-size:13px;table-layout:fixed}
.admin-table th{
  text-align:left;font-size:11px;color:var(--text-muted);
  font-weight:600;padding:12px 14px;
  border-bottom:1px solid var(--border);
  text-transform:uppercase;letter-spacing:.5px;
}
.admin-table td{
  padding:12px 14px;
  border-bottom:1px solid var(--border);
  color:var(--text);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.admin-table tr:last-child td{border-bottom:none}
.admin-table tr{transition:var(--transition)}
.admin-table tr:hover td{background:rgba(255,255,255,0.02)}
.actions-row{display:flex;gap:6px;align-items:center}

/* Toast */
.toast{
  position:fixed;bottom:24px;right:24px;
  background:var(--card-solid);
  border:1px solid var(--border);
  border-radius:var(--radius-sm);
  padding:12px 18px;
  font-size:13px;color:var(--text);
  z-index:9999;
  transition:all .3s ease;
  pointer-events:none;
  font-weight:500;
  transform:translateY(12px);
  opacity:0;
  box-shadow:var(--shadow-md);
  display:flex;align-items:center;gap:10px;
  max-width:340px;
}
.toast.show{opacity:1;transform:translateY(0)}
.toast i{font-size:16px;flex-shrink:0}
.toast.toast-success i{color:var(--success)}
.toast.toast-error i{color:var(--danger)}
.toast.toast-info i{color:var(--accent)}

.err{font-size:12px;color:var(--danger);margin-top:4px;font-weight:500}

/* Pagination */
.pagination{
  display:flex;justify-content:center;align-items:center;gap:16px;
  margin-top:1.5rem;padding-top:1.25rem;
  border-top:1px solid var(--border);
}
.pag-info{font-size:13px;color:var(--text-muted);font-weight:500}
.pag-btns{display:flex;gap:6px}
.pag-btn{
  padding:8px 16px;
  border:1px solid var(--border);border-radius:var(--radius-sm);
  background:rgba(255,255,255,0.04);color:var(--text);
  font-size:12px;font-weight:600;cursor:pointer;
  font-family:inherit;transition:var(--transition);
  text-transform:uppercase;letter-spacing:.3px;
}
.pag-btn:hover:not(:disabled){
  background:var(--accent);border-color:var(--accent);color:#fff;
}
.pag-btn:disabled{opacity:0.3;cursor:not-allowed}

/* Toolbar */
.toolbar{display:flex;gap:8px;margin-bottom:1rem;flex-wrap:wrap;align-items:center}
.search-input{
  padding:8px 12px;
  border:1px solid var(--border);border-radius:var(--radius-sm);
  background:var(--card-solid);color:var(--text);
  font-size:13px;font-family:inherit;width:200px;
  transition:var(--transition);
}
.search-input:focus{outline:none;border-color:var(--accent)}
.bulk-textarea{
  flex:1;min-width:200px;padding:10px 14px;
  border:1px solid var(--border);border-radius:var(--radius-sm);
  background:var(--card-solid);color:var(--text);
  font-size:13px;font-family:inherit;resize:vertical;
  transition:var(--transition);
}
.bulk-textarea:focus{outline:none;border-color:var(--accent)}
.label-sm{font-size:11px;font-weight:600;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px}
.table-footer{font-size:12px;color:var(--text-muted);margin-top:1rem}

/* Scrollbar */
::-webkit-scrollbar{width:6px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(255,255,255,0.1);border-radius:3px}
::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,0.2)}

/* Responsive */
@media(max-width:768px){
  .stats{grid-template-columns:repeat(2,1fr)}
  .wrap{padding:1rem}
  .title{font-size:26px}
  .settings-row{gap:1rem}
  .email-grid{grid-template-columns:1fr}
  .tabs{width:100%}
  .tab{flex:1;text-align:center;padding:10px 16px}
}
@media(max-width:480px){
  .stats{grid-template-columns:1fr 1fr;gap:8px}
  .sc{padding:14px 12px}
  .sv{font-size:24px}
}
