:root{--bg:#0f0f12;--panel:#18181b;--panel-2:#1f1f23;--text:#efeff1;--muted:#a1a1ad;--brand:#9146FF;--brand2:#772ce8;--border:#2a2a2e;--radius:14px}
*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial}
a{color:inherit;text-decoration:none}.container{width:min(1200px,100% - 32px);margin:24px auto}
.nav{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:12px;background:var(--panel);border-bottom:1px solid var(--border);padding:10px 16px}
.nav .logo{display:flex;align-items:center;gap:10px}.nav .logo img{height:28px}
.nav .nav-links{display:flex;gap:14px;margin-left:16px}.nav .right{margin-left:auto;display:flex;align-items:center;gap:10px}
.input{background:#111114;border:1px solid var(--border);color:var(--text);border-radius:10px;padding:8px 10px;min-width:240px}
.btn{background:#2c2c30;border:1px solid var(--border);color:var(--text);padding:8px 12px;border-radius:10px;cursor:pointer}
.btn.primary{background:linear-gradient(180deg,var(--brand),var(--brand2));border:none}
.title{font-size:22px;margin:10px 0 16px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.card{background:var(--panel-2);border:1px solid var(--border);border-radius:var(--radius);padding:12px;display:flex;flex-direction:column;gap:8px}
.thumb{aspect-ratio:16/9;background:#000;border-radius:10px}.muted{color:var(--muted)}
.channel-layout{display:grid;grid-template-columns:1fr 320px;gap:16px}
.video-wrap{background:var(--panel-2);border:1px solid var(--border);border-radius:var(--radius);padding:10px}
#player{width:100%;height:60vh;background:#000;border-radius:10px}.status{margin-top:8px;color:var(--muted)}
.ch-title{font-size:18px;margin:0 0 6px}.sidebar{display:flex;flex-direction:column;gap:10px}
.form .card label{display:flex;flex-direction:column;gap:6px;margin-bottom:10px}
.menu{position:relative}.pfp{width:32px;height:32px;border-radius:50%;overflow:hidden;background:#333}
.menu-btn{display:flex;align-items:center;gap:8px;background:#2c2c30;border:1px solid var(--border);padding:6px 8px;border-radius:10px}
.menu-items{position:absolute;right:0;top:40px;background:#1a1a1d;border:1px solid var(--border);border-radius:12px;min-width:220px;display:none}
.menu-items a,.menu-items button{display:block;width:100%;padding:10px 12px;text-align:left;background:none;border:none;color:var(--text)}
.menu.open .menu-items{display:block}
