/* SEO Lizards - TimeCamp-like UI (Tailwind-inspired, vanilla CSS) */
:root{
  --bg:#f7f7f8;
  --panel:#ffffff;
  --text:#0f172a;
  --muted:#6b7280;
  --line:#e5e7eb;
  --brand:#16a34a;
  --brand-600:#128a3f;
  --chip:#eef6f0;
  --shadow:0 10px 30px rgba(16,24,40,.06), 0 2px 4px rgba(16,24,40,.03);
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);font-family:Inter,ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial}
a{text-decoration:none;color:inherit}
img{max-width:100%}
/* App shell */
.app{display:flex;min-height:100vh}
.sidebar{width:260px;background:#fcfcfd;border-right:1px solid var(--line);padding:18px;position:sticky;top:0;height:100vh}
.sidebar .brand{display:flex;align-items:center;gap:10px;margin-bottom:12px}
.sidebar .brand img{height:28px}
.sidebar .nav{margin-top:14px}
.sidebar .nav a{display:flex;align-items:center;gap:10px;padding:10px 12px;color:#334155;border-radius:10px;margin-bottom:6px}
.sidebar .nav a.active,.sidebar .nav a:hover{background:var(--chip);color:#14532d;border:1px solid #d7eadf}
.main{flex:1;display:flex;flex-direction:column}
.header{display:flex;align-items:center;justify-content:space-between;background:var(--panel);border-bottom:1px solid var(--line);padding:16px 22px;position:sticky;top:0;z-index:10}
.header .title{font-weight:800;color:#111827}
.content{padding:22px}
/* Controls */
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;border:1px solid var(--line);background:#fff;font-weight:600;color:#111827}
.btn.primary{background:var(--brand);color:#fff;border-color:var(--brand)}
.btn.primary:hover{background:var(--brand-600)}
.btn.ghost{background:#fff}
.input{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff}
.select{padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff}
.search{display:flex;gap:10px}
/* Cards & Tables */
.card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow);margin-bottom:16px}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:12px 14px;border-bottom:1px solid var(--line)}
.table thead th{font-size:12px;text-transform:uppercase;color:#64748b;letter-spacing:.03em}
.table tr:hover{background:#fafafa}
.badge{padding:6px 10px;border-radius:999px;font-size:12px;font-weight:700}
.badge.present{background:#dcfce7;color:#166534}
.badge.half{background:#fef9c3;color:#854d0e}
.badge.absent{background:#fee2e2;color:#991b1b}
.grid{display:grid;gap:16px}
.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.footer{padding:14px 22px;color:#64748b}
.small{font-size:12px;color:#6b7280}
.alert {
  padding: 10px 15px;
  border-radius: 6px;
  font-size: 14px;
}
.alert.success { background: #d4edda; color: #155724; }
.alert.error   { background: #f8d7da; color: #721c24; }
.alert.warning { background: #fff3cd; color: #856404; }

.btn.small{padding:6px 10px;font-size:12px}