:root{--bg:#0b0d12;--panel:#141821;--panel2:#1b212d;--line:#262d3b;--fg:#e8edf5;--mut:#90a0b8;--acc:#3b82f6;--acc2:#ef4444;--live:#ff3b30}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
a{color:inherit;text-decoration:none}
.nav{display:flex;align-items:center;gap:22px;padding:12px 20px;background:var(--panel);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:9px;font-weight:800;font-size:18px;letter-spacing:-.3px}
.logo{width:22px;height:22px;border-radius:6px;background:linear-gradient(135deg,var(--acc),var(--acc2));position:relative;display:inline-block}
.logo:after{content:"";position:absolute;left:8px;top:6px;border-left:7px solid #fff;border-top:5px solid transparent;border-bottom:5px solid transparent}
.links{display:flex;gap:15px;flex-wrap:wrap}.links a{color:var(--mut);font-weight:600;font-size:14px}.links a:hover{color:var(--fg)}
.search{margin-left:auto;display:flex}.search input{background:var(--panel2);border:1px solid var(--line);color:var(--fg);padding:8px 12px;border-radius:8px 0 0 8px;width:200px;outline:none}
.search button{background:var(--panel2);border:1px solid var(--line);border-left:0;color:var(--mut);border-radius:0 8px 8px 0;padding:0 12px;cursor:pointer;font-size:18px}
main{max-width:1240px;margin:0 auto;padding:22px 20px 60px}
.hero{padding:46px 28px;border-radius:16px;margin-bottom:28px;background:radial-gradient(120% 140% at 0% 0%,#1d2740,#0e1220)}
.hero.small{padding:28px}.hero h1{margin:0 0 8px;font-size:32px;letter-spacing:-.5px}.hero p{margin:0;color:var(--mut)}
.sec{font-size:18px;margin:28px 0 14px;display:flex;align-items:center;gap:9px}
.ldot,.live .dot{width:9px;height:9px;border-radius:50%;background:var(--live);display:inline-block;box-shadow:0 0 0 0 rgba(255,59,48,.6);animation:pulse 1.8s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,59,48,.5)}70%{box-shadow:0 0 0 7px rgba(255,59,48,0)}100%{box-shadow:0 0 0 0 rgba(255,59,48,0)}}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px}
.card{display:flex;flex-direction:column;gap:9px}
.thumb{position:relative;display:block;border-radius:12px;overflow:hidden;aspect-ratio:16/9;background:var(--panel2)}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.live{position:absolute;left:8px;top:8px;display:flex;align-items:center;gap:5px;background:rgba(0,0,0,.55);color:#fff;font-size:11px;font-weight:800;letter-spacing:.4px;padding:3px 8px;border-radius:5px}
.live .dot{width:7px;height:7px}
.vw{position:absolute;right:8px;bottom:8px;background:rgba(0,0,0,.78);color:#fff;font-size:12px;padding:1px 7px;border-radius:5px}
.meta{display:flex;flex-direction:column;gap:3px}
.vtitle{font-weight:600;font-size:14.5px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sub{color:var(--mut);font-size:13px}
.watch{display:grid;grid-template-columns:1fr 340px;gap:26px;align-items:start}
@media(max-width:900px){.watch{grid-template-columns:1fr}}
.player{width:100%;aspect-ratio:16/9;background:#000;border-radius:14px;display:block}
.wtop{display:flex;align-items:center;gap:12px;margin:16px 0 6px;flex-wrap:wrap}
.live.big{font-size:12px;padding:5px 10px;background:var(--live)}
.wtitle{font-size:21px;margin:0}.wmeta{color:var(--mut);font-size:14px}
.vwlive{color:var(--live);font-weight:600}
.actions{display:flex;gap:10px;margin:14px 0}
.btn{background:var(--panel2);border:1px solid var(--line);color:var(--fg);padding:8px 14px;border-radius:20px;cursor:pointer;font-weight:600;font-size:13px}
.btn:hover{border-color:var(--acc)}
.desc{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-top:14px;color:#cdd6e4}
.related h3{font-size:15px;margin:0 0 12px}.related .card{flex-direction:row;gap:10px;margin-bottom:12px}
.related .thumb{width:150px;flex:0 0 150px}
.page{max-width:760px;margin:10px auto;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:34px}
.page.center{text-align:center}.page h1{margin-top:0}
.foot{border-top:1px solid var(--line);background:var(--panel);margin-top:40px}
.cols{max-width:1240px;margin:0 auto;padding:34px 20px;display:grid;grid-template-columns:2fr 1fr 1fr;gap:24px}
@media(max-width:700px){.cols{grid-template-columns:1fr}}
.cols h4{margin:0 0 10px;font-size:14px}.cols a{display:block;color:var(--mut);font-size:13px;padding:3px 0}.cols a:hover{color:var(--fg)}
.cols p{color:var(--mut);font-size:13px;margin:6px 0 0}
.copy{text-align:center;color:var(--mut);font-size:12px;padding:16px;border-top:1px solid var(--line)}