body { font-family: system-ui, Arial, sans-serif; margin: 0; background:#f6f7fb; color:#111; }
.container { max-width: 1200px; margin: 0 auto; padding: 16px; }
.topbar { background: #111; color:#fff; }
.topbar .container { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.brand { font-weight:700; }
.topbar a { color:#fff; margin-left:12px; text-decoration:none; opacity:.9; }
h1,h2 { margin: 12px 0 16px; }

.grid2 { display:grid; grid-template-columns: 1fr 1fr; gap:16px; }
.grid3 { display:grid; grid-template-columns: 1fr 1fr 1fr; gap:16px; }
.card { background:#fff; border-radius:12px; padding:16px; box-shadow: 0 6px 20px rgba(0,0,0,.06); }
.kpi { font-size:24px; font-weight:700; }
.small { opacity:.75; font-size:13px; }
.table { width:100%; border-collapse: collapse; }
.table th, .table td { padding:10px; border-bottom: 1px solid #eee; vertical-align: top; text-align:left; }
.btn { display:inline-block; padding:8px 12px; border-radius:10px; background:#111; color:#fff; text-decoration:none; }
.btn.secondary { background:#444; }
input, select { padding:7px 10px; border:1px solid #ddd; border-radius:10px; }
.shots { display:grid; grid-template-columns: repeat(5, 1fr); gap:10px; }
.shots img { width:100%; border-radius:10px; border:1px solid #eee; }
.badge { display:inline-block; padding:3px 8px; border-radius:999px; background:#eee; font-size:12px; }