*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#0f172a;color:#e5e7eb}
.container{max-width:1280px;margin:0 auto;padding:24px}
.hero{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:24px}
.hero h1{margin:0 0 6px;font-size:34px}
.hero p{margin:0;color:#94a3b8}
.hero-badges{display:flex;gap:10px;flex-wrap:wrap}
.badge{background:#2563eb;padding:10px 14px;border-radius:999px;font-weight:bold}
.badge.subtle{background:#1e293b}
.filters{display:grid;grid-template-columns:minmax(260px,1fr) 180px 200px 120px;gap:12px;margin-bottom:24px}
.filters input,.filters select,.filters button{padding:12px 14px;border-radius:12px;border:1px solid #334155;background:#111827;color:#e5e7eb}
.filters button{cursor:pointer;background:#2563eb;border:none;font-weight:bold}
.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:18px}
.card{background:#111827;border:1px solid #1f2937;border-radius:18px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.15)}
.thumb-wrap{background:#020617;aspect-ratio:16/9;display:flex;align-items:center;justify-content:center}
.thumb-video{width:100%;height:100%;object-fit:cover;background:#000}
.card-body{padding:16px}
.meta-row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}
.camera-pill,.size-pill{display:inline-block;padding:6px 10px;border-radius:999px;font-size:12px;font-weight:bold}
.camera-pill{background:#1d4ed8;color:#fff}
.size-pill{background:#1f2937;color:#cbd5e1}
.card-title{margin:0 0 8px;font-size:20px}
.file-name{margin:0 0 14px;color:#94a3b8;word-break:break-word;font-size:14px}
.actions{display:flex;gap:10px;flex-wrap:wrap}
.btn{display:inline-block;text-decoration:none;padding:10px 14px;border-radius:10px;background:#2563eb;color:#fff;font-weight:bold}
.btn.secondary{background:#334155}
.empty-state{background:#111827;border:1px solid #1f2937;border-radius:18px;padding:36px;text-align:center}
.hidden{display:none}
@media (max-width:900px){.filters{grid-template-columns:1fr}.hero{flex-direction:column;align-items:flex-start}}