:root {
  --bg: #0b0d12; --surface:#0f141f; --text:#e8eefc; --muted:#9fb0cc; --accent:#0b5cff; --border:#22304a;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Arial;color:var(--text);background:radial-gradient(1200px 600px at 20% -10%, #0b5cff22, transparent 60%),var(--bg)}
.container{max-width:1180px;margin:0 auto;padding:0 18px}
.site-header{position:sticky;top:0;z-index:40;backdrop-filter:saturate(1.1) blur(8px);background:#0b0d12cc;border-bottom:1px solid var(--border)}
.header-inner{display:flex;align-items:center;gap:16px;justify-content:space-between;height:64px}
.brand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-weight:700}
.brand img{display:block}
.search input{width:280px;max-width:45vw;background:#0f141f;border:1px solid var(--border);color:var(--text);border-radius:10px;padding:9px 12px}
.search input:focus{outline:none;border-color:#4060a3;box-shadow:0 0 0 3px #0b5cff33}

.player{margin-top:16px;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:12px}
video{width:100%;max-height:62vh;background:#000;border-radius:10px}
.player-meta{display:flex;align-items:center;gap:12px;margin-top:8px;color:var(--muted)}
.player-meta .spacer{flex:1}
.rate select{background:#0f141f;border:1px solid var(--border);color:var(--text);border-radius:8px;padding:6px}

/* Make sure reCAPTCHA badge stays visible above overlays */
.grecaptcha-badge{z-index:10000;}


.library{padding:22px 0}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0 14px}
.chip{background:#0f141f;border:1px solid var(--border);color:var(--text);padding:8px 10px;border-radius:999px;cursor:pointer}
.chip--active{border-color:#0b46c0;box-shadow:0 0 0 3px #0b5cff33 inset}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.card{display:flex;flex-direction:column;gap:8px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:12px}
.card .meta{display:flex;gap:8px;color:var(--muted);font-size:12px}
.card .title{font-size:14px;line-height:1.3}
.card button{align-self:flex-start;background:linear-gradient(180deg,#0b5cff,#094dd3);border:1px solid #0b46c0;color:var(--text);border-radius:10px;padding:8px 12px;cursor:pointer}
.status{display:block;color:var(--muted);margin-top:8px}

.site-footer{border-top:1px solid var(--border);padding:16px 0;background:#0b0d12;color:var(--muted)}
.footer-inner{display:flex;align-items:center;justify-content:center}

@media (max-width: 1000px){.grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width: 720px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width: 520px){.grid{grid-template-columns:1fr}.search input{width:100%}}
