:root{
  --bg:#06111d; --panel:#0b1a2a; --panel2:#10253a; --text:#f5f7fb;
  --muted:#90a2b7; --blue:#1677ff; --blue2:#005ee8; --line:#1d344b;
  --red:#ff344c; --gold:#f0b83f;
}
*{box-sizing:border-box} body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:radial-gradient(circle at 75% 0,#152942 0,#07111e 42%,#040b13 100%);color:var(--text)}
button,input,select{font:inherit}.app{min-height:100vh;display:grid;grid-template-columns:240px 1fr}
.sidebar{position:sticky;top:0;height:100vh;padding:24px 16px;border-right:1px solid #11263a;background:linear-gradient(180deg,#071524ee,#06101bee);display:flex;flex-direction:column}
.brand{padding:0 8px 24px}.logo{font-size:44px;font-weight:950;font-style:italic;letter-spacing:-4px}.logo span{color:var(--blue);margin-left:4px}.tag{font-size:11px;color:#c7d3df;letter-spacing:.12em}
nav{display:grid;gap:6px}.nav-item{border:0;color:#c9d5e2;background:transparent;text-align:left;padding:13px 15px;border-radius:10px;font-size:15px;cursor:pointer}.nav-item:hover,.nav-item.active{background:#12365f;color:#fff}.nav-item span{margin-left:10px}
.upgrade{margin-top:auto;border:1px solid var(--line);border-radius:14px;padding:16px;background:#0d1d2e}.upgrade small{display:block;color:var(--muted);margin-top:4px}.crown{color:var(--gold);font-size:22px}
.main{padding:22px 28px 48px;min-width:0}header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}h1{font-size:25px;margin:0}.main header p{margin:4px 0 0;color:var(--muted)}
.header-actions{display:flex;align-items:center;gap:10px}.icon-btn{width:40px;height:40px;border:1px solid var(--line);border-radius:10px;background:#0b1a2a;color:white}.profile-chip{display:flex;align-items:center;gap:8px;background:#0b1a2a;border:1px solid var(--line);padding:6px 10px 6px 6px;border-radius:999px}.avatar{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--blue)}
.hero{min-height:315px;border-radius:18px;padding:40px;display:flex;align-items:flex-end;background:linear-gradient(90deg,rgba(2,9,16,.97),rgba(3,13,23,.72) 48%,rgba(5,13,22,.15)),linear-gradient(135deg,#10243e,#761728 55%,#0c326b);border:1px solid #1a3148;overflow:hidden;position:relative}
.hero:after{content:"⚽";position:absolute;right:8%;top:15%;font-size:140px;filter:drop-shadow(0 18px 28px #0008);opacity:.78}.hero-copy{max-width:620px;z-index:1}.badge{display:inline-flex;padding:6px 9px;border-radius:7px;background:var(--red);font-size:12px;font-weight:800}.hero h2{font-size:48px;line-height:1;margin:12px 0 6px}.hero p{font-size:17px;color:#d3dce7}.actions{display:flex;gap:10px;margin-top:18px}.btn{border:0;border-radius:9px;padding:12px 18px;font-weight:800;cursor:pointer}.btn.primary{background:white;color:#07111e}.btn.blue{background:var(--blue);color:white}.btn.secondary{background:#14263a;color:#fff;border:1px solid #2a4058}
.section-head{display:flex;align-items:center;justify-content:space-between;margin:25px 0 12px}.section-head h3{margin:0;font-size:20px}.section-head span{color:var(--muted);font-size:13px}
.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.channel-card,.content-card,.package,.admin-card,.profile-card{background:linear-gradient(180deg,#102135,#0a1725);border:1px solid var(--line);border-radius:13px}
.channel-card{padding:14px;cursor:pointer;min-height:135px}.channel-card:hover{border-color:#346fa9;transform:translateY(-1px)}.channel-logo{height:44px;display:flex;align-items:center;font-size:22px;font-weight:900;color:white}.channel-card .now{margin-top:13px;font-weight:700}.channel-card small{color:var(--muted)}
.live-line{height:3px;background:linear-gradient(90deg,var(--red) 60%,#30465a 60%);border-radius:9px;margin-top:12px}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.content-card{padding:18px;min-height:150px;background:linear-gradient(145deg,#112c4d,#101a29 60%,#321927)}.content-card h4{font-size:22px;margin:46px 0 4px}.content-card p{margin:0;color:#c1cfdb}
.schedule-list{display:grid;gap:9px}.match{display:grid;grid-template-columns:90px 1fr 180px 110px;align-items:center;gap:12px;padding:14px 16px;border:1px solid var(--line);background:#0b1928;border-radius:11px}.match .time{font-weight:900}.match .league{color:var(--muted)}.pill{justify-self:start;padding:5px 8px;border-radius:999px;background:#152a3f;font-size:12px}.pill.live{background:#ad2032}
.packages{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.package{padding:18px;position:relative}.package.popular{border-color:var(--blue)}.package h3{margin:0}.price{font-size:30px;font-weight:900;margin:8px 0}.package ul{padding-left:18px;color:#c7d4e1;line-height:1.8}.tag-pop{position:absolute;right:10px;top:10px;background:var(--blue);padding:5px 8px;border-radius:7px;font-size:11px;font-weight:800}
.toolbar{display:flex;gap:10px;margin-bottom:14px}.search{flex:1;border:1px solid var(--line);background:#091726;color:white;border-radius:10px;padding:11px 13px}.filter{border:1px solid var(--line);background:#0b1a2a;color:white;border-radius:10px;padding:0 12px}
.empty{padding:45px;text-align:center;border:1px dashed #2b425a;border-radius:14px;color:var(--muted)}
.admin-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.admin-card,.profile-card{padding:18px}.form{display:grid;gap:10px}.form input,.form select{width:100%;background:#071421;color:#fff;border:1px solid var(--line);border-radius:9px;padding:11px}
.table{width:100%;border-collapse:collapse}.table th,.table td{padding:10px;border-bottom:1px solid var(--line);text-align:left}.table th{color:#9db0c4;font-size:12px}.danger{background:#4a1420;color:#ffb1bb}
.modal{position:fixed;inset:0;background:#000a;display:grid;place-items:center;padding:20px;z-index:10}.hidden{display:none}.modal-card{width:min(900px,96vw);background:#081522;border:1px solid #29435c;border-radius:16px;padding:18px;position:relative}.close{position:absolute;right:14px;top:10px;background:transparent;border:0;color:white;font-size:28px;cursor:pointer}.player-card video{width:100%;max-height:62vh;background:black;border-radius:10px;margin-top:10px}.muted{color:var(--muted);font-size:13px}.live-dot{font-size:11px;background:var(--red);padding:4px 7px;border-radius:5px;font-weight:900}
.toast{position:fixed;right:24px;bottom:24px;background:#0f253b;border:1px solid #2d4e6e;color:white;padding:12px 16px;border-radius:10px;z-index:20}
@media(max-width:1000px){.grid{grid-template-columns:repeat(2,1fr)}.feature-grid,.packages,.admin-grid{grid-template-columns:1fr}.match{grid-template-columns:70px 1fr}.match .league,.match .pill{display:none}}
@media(max-width:720px){.app{grid-template-columns:1fr}.sidebar{position:static;height:auto;padding:12px}.brand{padding:4px 8px 12px}.logo{font-size:34px}nav{grid-template-columns:repeat(4,1fr)}.nav-item{padding:10px 6px;text-align:center;font-size:18px}.nav-item span{display:none}.upgrade{display:none}.main{padding:15px}.hero{padding:24px;min-height:300px}.hero h2{font-size:36px}.hero:after{font-size:90px;right:2%}.grid{grid-template-columns:1fr 1fr}.feature-grid{grid-template-columns:1fr}.header-actions .icon-btn{display:none}}