*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif}
body.dark{background:#0b0c0f;color:#e6e6e6}
a{color:inherit;text-decoration:none}
.topbar{position:sticky;top:0;display:flex;gap:16px;align-items:center;padding:12px 16px;background:linear-gradient(180deg,rgba(0,0,0,.7),rgba(0,0,0,0));z-index:10}
.logo{font-weight:800;letter-spacing:.5px}
.tabs button{background:transparent;border:none;color:#bbb;padding:8px 10px;font-weight:600;cursor:pointer;border-bottom:2px solid transparent}
.tabs button.active{color:#fff;border-color:#fff}
.spacer{flex:1}
.logout{background:#16181d;color:#fff;border:1px solid #2a2f3a;border-radius:10px;padding:8px 12px;cursor:pointer}
.grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(180px,1fr));gap:14px;padding:16px}
.card.item{background:#121419;border-radius:14px;overflow:hidden;border:1px solid #1d222d;display:flex;flex-direction:column}
.poster{aspect-ratio:16/9;object-fit:cover;background:#0f1217}
.meta{display:flex;align-items:center;justify-content:space-between;padding:10px}
.meta .title{font-size:14px;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:70%}
.meta .play{background:#20242c;border:1px solid #2b3140;color:#fff;padding:6px 10px;border-radius:10px;cursor:pointer}
.player-section{position:sticky;top:48px;display:flex;flex-direction:column;gap:6px;padding:10px;background:#0b0c0f;border-bottom:1px solid #181c24;z-index:5}
#video{width:100%;max-height:55vh;background:#000;border-radius:10px}
.hidden{display:none}
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:20px}
.login-wrap .brand{position:fixed;top:14px;left:16px;font-weight:800;letter-spacing:.5px}
form.card{width:min(420px,94vw);padding:18px;display:flex;flex-direction:column;gap:10px;background:#101319;border:1px solid #1b2030;border-radius:12px}
form.card h1{margin:4px 0 8px 0;font-size:20px}
form.card label{display:flex;flex-direction:column;gap:6px;font-size:14px}
form.card input{padding:10px;border-radius:10px;border:1px solid #242a38;background:#0e1015;color:#fff}
form.card button{margin-top:6px;padding:10px;border-radius:10px;background:#20242c;border:1px solid #2b3140;color:#fff;cursor:pointer;font-weight:600}
.error{color:#ff6b6b;font-size:13px;height:16px}
#nowPlaying{font-size:14px;color:#9aa4b2}