:root{
  --ink: #14171C; --surface: #1C2027; --surface-2: #242933; --line: #2E3440;
  --coral: #FF6B4A; --cyan: #5EEAD4; --warm: #F5F3EE; --muted: #9AA1AC;
  --display: "Fraunces", serif; --body: "Inter", sans-serif; --mono: "IBM Plex Mono", monospace;
}
*{ box-sizing: border-box; }
body{ margin:0; background: var(--ink); color: var(--warm); font-family: var(--body); }
.wrap{ max-width: 1000px; margin: 0 auto; padding: 0 24px; }
.hidden{ display:none; }
.eyebrow{ font-family: var(--mono); font-size: 12px; letter-spacing:.1em; text-transform: uppercase; color: var(--cyan); margin:0 0 8px; }

.btn{ font-family: var(--body); font-weight:600; font-size:14px; border-radius:999px; padding:12px 22px; border:1px solid transparent; cursor:pointer; }
.btn-primary{ background: var(--coral); color:#1A1310; }
.btn-primary:hover{ background:#ff7d60; }
.btn-ghost{ background:transparent; color: var(--warm); border-color: var(--line); }
.btn-ghost:hover{ border-color: var(--cyan); }
.btn-block{ width:100%; }

/* Login */
.login-screen{ min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px; }
.login-card{ background: var(--surface); border:1px solid var(--line); border-radius:18px; padding:32px; width:100%; max-width:360px; }
.login-card h1{ font-family: var(--display); font-size:26px; margin:0 0 20px; }
.login-card label{ display:block; font-size:13px; color:var(--muted); margin-bottom:6px; }
.login-card input{ width:100%; padding:12px 14px; margin-bottom:16px; border-radius:10px; border:1px solid var(--line); background: var(--ink); color: var(--warm); font-size:15px; }
.login-card input:focus{ outline:none; border-color: var(--cyan); }
.login-error{ color: var(--coral); font-size:13px; min-height:16px; margin:-6px 0 14px; }

/* Dashboard */
.admin-header{ border-bottom:1px solid var(--line); padding:16px 0; }
.admin-header-inner{ display:flex; align-items:center; justify-content:space-between; }
.logo{ font-family: var(--display); font-weight:600; font-size:19px; }
.admin-header-right{ display:flex; align-items:center; gap:14px; }
.admin-email{ font-family: var(--mono); font-size:12.5px; color: var(--muted); }

.admin-main{ padding: 40px 24px 80px; }
.admin-stats{ display:grid; grid-template-columns: repeat(3,1fr); gap:16px; margin-bottom:32px; }
.admin-stat{ background: var(--surface); border:1px solid var(--line); border-radius:14px; padding:20px; text-align:center; }
.stat-num{ font-family: var(--mono); font-size:28px; color: var(--cyan); display:block; }
.stat-label{ font-size:12.5px; color: var(--muted); display:block; margin-top:6px; }

.table-wrap{ background: var(--surface); border:1px solid var(--line); border-radius:14px; overflow:hidden; }
table{ width:100%; border-collapse: collapse; }
th, td{ text-align:left; padding:14px 18px; font-size:14px; border-bottom:1px solid var(--line); }
th{ font-family: var(--mono); font-size:11.5px; text-transform:uppercase; letter-spacing:.06em; color: var(--muted); font-weight:500; }
tbody tr:last-child td{ border-bottom:none; }
tbody tr:hover{ background: var(--surface-2); }
.empty-row{ text-align:center; color: var(--muted); padding:32px; }
.type-pill{ font-family: var(--mono); font-size:11.5px; padding:4px 10px; border-radius:999px; border:1px solid var(--line); }
.type-whatsapp{ color:#5EEAD4; border-color:#5EEAD4; }
.type-instagram{ color:#FF6B4A; border-color:#FF6B4A; }

@media (max-width: 640px){
  .admin-stats{ grid-template-columns: 1fr; }
  th:nth-child(4), td:nth-child(4){ display:none; }
}