@charset "utf-8";
*{margin:0;padding:0;box-sizing:border-box}
:root{--bg:#04080a;--bg2:#0a1418;--ink:#d4f5e8;--mute:#6b8a82;--accent:#00ff9d;--accent2:#00d4ff;--danger:#ff3860;--line:rgba(0,255,157,.15);--card:#0d1a1f}
html,body{background:var(--bg);color:var(--ink);font:14px/1.6 "JetBrains Mono","Consolas","PingFang SC",monospace;min-height:100vh}
a{color:inherit;text-decoration:none} img{max-width:100%;display:block}
.x3239d2-app{display:grid;grid-template-columns:240px 1fr;min-height:100vh}
.x3239d2-side{background:linear-gradient(180deg,var(--bg2) 0%,var(--bg) 100%);border-right:1px solid var(--line);padding:24px 18px;position:sticky;top:0;height:100vh;overflow-y:auto}
.x3239d2-side .x3239d2-logo{font-size:18px;font-weight:900;color:var(--accent);margin-bottom:30px;letter-spacing:.02em}
.x3239d2-side .x3239d2-logo::before{content:"▶ ";color:var(--accent2)}
.x3239d2-side h5{font-size:11px;color:var(--mute);text-transform:uppercase;letter-spacing:.18em;margin:18px 0 10px}
.x3239d2-side a{display:block;padding:9px 12px;font-size:13px;color:var(--ink);border-radius:6px;transition:.2s;border-left:2px solid transparent}
.x3239d2-side a:hover,.x3239d2-side .on{background:rgba(0,255,157,.06);border-color:var(--accent);color:var(--accent)}
.x3239d2-main{padding:30px 36px;max-width:100%;overflow:hidden}
.x3239d2-tbar{display:flex;align-items:center;gap:18px;padding:14px 18px;background:var(--card);border:1px solid var(--line);border-radius:8px;margin-bottom:30px}
.x3239d2-tbar input{flex:1;background:transparent;border:0;color:var(--ink);outline:0;font-family:inherit;font-size:13px}
.x3239d2-tbar .live{display:flex;align-items:center;gap:6px;color:var(--danger);font-size:12px;font-weight:700}
.x3239d2-tbar .live::before{content:"";width:8px;height:8px;background:var(--danger);border-radius:50%;animation:p 1.4s infinite}
@keyframes p{0%,100%{opacity:1}50%{opacity:.3}}
.x3239d2-hud{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:36px}
.x3239d2-hudc{background:var(--card);border:1px solid var(--line);border-radius:8px;padding:18px;position:relative;overflow:hidden}
.x3239d2-hudc::before{content:"";position:absolute;left:0;top:0;width:3px;height:100%;background:var(--accent)}
.x3239d2-hudc small{display:block;font-size:11px;color:var(--mute);text-transform:uppercase;letter-spacing:.12em;margin-bottom:8px}
.x3239d2-hudc b{font-size:24px;font-weight:800;color:var(--accent)}
.x3239d2-hudc:nth-child(2)::before{background:var(--accent2)} .x3239d2-hudc:nth-child(2) b{color:var(--accent2)}
.x3239d2-hudc:nth-child(3)::before{background:#ffb13c} .x3239d2-hudc:nth-child(3) b{color:#ffb13c}
.x3239d2-hudc:nth-child(4)::before{background:var(--danger)} .x3239d2-hudc:nth-child(4) b{color:var(--danger)}
.x3239d2-blk{margin-bottom:48px}
.x3239d2-bh{display:flex;align-items:center;gap:14px;padding:10px 0;border-bottom:1px solid var(--line);margin-bottom:18px}
.x3239d2-bh h2{font-size:16px;font-weight:800;color:var(--ink);text-transform:uppercase;letter-spacing:.04em}
.x3239d2-bh h2::before{content:"[ ";color:var(--accent2)} .x3239d2-bh h2::after{content:" ]";color:var(--accent2)}
.x3239d2-bh .cnt{margin-left:auto;font-size:12px;color:var(--mute)}
/* esports list — featured wide + smaller below */
.x3239d2-list{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:14px}
.x3239d2-itm{background:var(--card);border:1px solid var(--line);border-radius:8px;overflow:hidden;transition:.2s;position:relative}
.x3239d2-itm:hover{border-color:var(--accent);box-shadow:0 0 24px rgba(0,255,157,.12)}
.x3239d2-itm .x3239d2-thumb{position:relative;aspect-ratio:16/9;overflow:hidden}
.x3239d2-itm img{width:100%;height:100%;object-fit:cover;transition:.4s;filter:brightness(.85)}
.x3239d2-itm:hover img{transform:scale(1.04);filter:brightness(1)}
.x3239d2-itm .dur{position:absolute;bottom:8px;right:8px;background:rgba(0,0,0,.85);color:var(--accent);font-size:11px;padding:2px 7px;border:1px solid var(--accent);font-family:inherit}
.x3239d2-itm .x3239d2-info{padding:14px}
.x3239d2-itm h3{font-size:14px;font-weight:700;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:40px}
.x3239d2-itm .x3239d2-met{display:flex;gap:12px;font-size:11px;color:var(--mute);margin-top:8px;text-transform:uppercase;letter-spacing:.05em}
.x3239d2-itm.feat{grid-row:span 2}
.x3239d2-itm.feat h3{font-size:18px;-webkit-line-clamp:3;min-height:auto}
.x3239d2-rev{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.x3239d2-rc{background:var(--card);border:1px solid var(--line);border-left:3px solid var(--accent);padding:16px 18px;border-radius:0 6px 6px 0}
.x3239d2-rc q{font-size:13px;line-height:1.7;color:var(--ink)} .x3239d2-rc footer{margin-top:10px;font-size:11px;color:var(--mute);text-transform:uppercase;letter-spacing:.06em}
.x3239d2-foot{margin-top:60px;padding:30px 0;border-top:1px solid var(--line);color:var(--mute);font-size:12px;text-align:center;letter-spacing:.04em}
.x3239d2-foot a{color:var(--accent2)}
.x3239d2-bc{font-size:12px;color:var(--mute);margin-bottom:18px;letter-spacing:.05em}
.x3239d2-bc a:hover{color:var(--accent)}
@media(max-width:980px){.x3239d2-app{grid-template-columns:1fr}.x3239d2-side{position:relative;height:auto;border-right:0;border-bottom:1px solid var(--line)}.x3239d2-list{grid-template-columns:1fr}.x3239d2-itm.feat{grid-row:auto}.x3239d2-hud{grid-template-columns:repeat(2,1fr)}.x3239d2-rev{grid-template-columns:1fr}}
