:root{
  --primary:#2563eb; --primary-dark:#1d4ed8; --bg:#f4f6f9; --card:#ffffff;
  --text:#1f2937; --muted:#6b7280; --border:#e5e7eb;
  --success:#16a34a; --warning:#d97706; --danger:#dc2626;
}
*{box-sizing:border-box;}
body{margin:0;font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:var(--bg);color:var(--text);}
a{color:var(--primary);text-decoration:none;}
a:hover{text-decoration:underline;}

.topbar{background:var(--card);border-bottom:1px solid var(--border);}
.topbar-admin{background:#111827;}
.topbar-admin .brand, .topbar-admin .nav a{color:#f9fafb;}
.topbar-inner{max-width:1100px;margin:0 auto;padding:14px 20px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;}
.brand{font-weight:700;font-size:1.2rem;color:var(--primary);}
.nav a{margin-left:16px;font-size:.92rem;color:var(--text);}

.container{max-width:1100px;margin:0 auto;padding:24px 20px;}

.card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:20px;margin-bottom:20px;}
.grid{display:grid;gap:16px;}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-2{grid-template-columns:repeat(2,1fr);}
@media(max-width:700px){.grid-3,.grid-2{grid-template-columns:1fr;}}

.stat{text-align:left;}
.stat .value{font-size:1.8rem;font-weight:700;color:var(--primary);}
.stat .label{color:var(--muted);font-size:.85rem;}

table{width:100%;border-collapse:collapse;background:var(--card);}
th,td{padding:10px 12px;border-bottom:1px solid var(--border);text-align:left;font-size:.92rem;}
th{background:#f9fafb;font-weight:600;}

form label{display:block;margin:12px 0 4px;font-weight:600;font-size:.9rem;}
input[type=text],input[type=email],input[type=password],input[type=number],
input[type=date],input[type=file],select,textarea{
  width:100%;padding:9px 10px;border:1px solid var(--border);border-radius:6px;font-size:.95rem;
}
textarea{min-height:90px;}
button,.btn{
  display:inline-block;background:var(--primary);color:#fff;border:none;padding:10px 18px;
  border-radius:6px;font-size:.95rem;cursor:pointer;margin-top:14px;
}
button:hover,.btn:hover{background:var(--primary-dark);text-decoration:none;}
.btn-danger{background:var(--danger);}
.btn-secondary{background:#6b7280;}
.btn-sm{padding:6px 12px;font-size:.82rem;margin-top:0;}

.badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:.78rem;font-weight:600;}
.badge-pending{background:#fef3c7;color:#92400e;}
.badge-approved{background:#dbeafe;color:#1e40af;}
.badge-live{background:#dcfce7;color:#166534;}
.badge-paused{background:#e5e7eb;color:#374151;}
.badge-rejected{background:#fee2e2;color:#991b1b;}
.badge-completed{background:#ede9fe;color:#5b21b6;}

.alert{padding:12px 16px;border-radius:6px;margin-bottom:16px;font-size:.9rem;}
.alert-success{background:#dcfce7;color:#166534;}
.alert-error{background:#fee2e2;color:#991b1b;}
.alert-info{background:#dbeafe;color:#1e40af;}

.footer{text-align:center;color:var(--muted);font-size:.8rem;padding:20px;}
.auth-box{max-width:400px;margin:60px auto;}
.text-muted{color:var(--muted);}

/* Ad detail page */
.grid-5{grid-template-columns:repeat(5,1fr);}
@media(max-width:900px){.grid-5{grid-template-columns:repeat(2,1fr);}}
.ad-hero{padding:28px;}
.ad-hero-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;}
.ad-hero-eyebrow{color:var(--muted);font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;}
.ad-hero-title{margin:4px 0 0;font-size:1.6rem;}
.ad-hero-desc{color:#374151;margin:16px 0;line-height:1.55;}
.badge-lg{padding:6px 16px;font-size:.85rem;}
.ad-meta-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:18px;padding-top:18px;border-top:1px solid var(--border);}
@media(max-width:800px){.ad-meta-grid{grid-template-columns:repeat(2,1fr);}}
.ad-meta-label{color:var(--muted);font-size:.78rem;font-weight:600;text-transform:uppercase;letter-spacing:.03em;margin-bottom:4px;}
.ad-meta-value{font-size:.95rem;font-weight:600;word-break:break-word;}
.insight-stats .stat .value{font-size:1.5rem;}
.chart-head{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px;margin-bottom:14px;}
.chart-head h3{margin:0;}
.chart-wrap{position:relative;height:300px;}
.chart-wrap-sm{height:220px;}
