:root{
  --red:#d62835;
  --red-dark:#95121d;
  --bg:#0b0d12;
  --panel:rgba(9,11,16,.91);
  --line:rgba(255,255,255,.11);
  --muted:#aeb3bc;
  --white:#f6f7f8;
}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--white);
font-family:Arial,Helvetica,sans-serif}
body{position:relative}
.bg{position:fixed;inset:0;z-index:-3;background:
linear-gradient(120deg,rgba(0,0,0,.78),rgba(8,9,13,.35)),
url("/assets/background.jpg") center/cover no-repeat}
.shade{position:fixed;inset:0;z-index:-2;background:
radial-gradient(circle at 18% 30%,rgba(214,40,53,.16),transparent 34%),
linear-gradient(90deg,rgba(4,5,8,.84),rgba(4,5,8,.38),rgba(4,5,8,.82))}
main{width:100vw;height:100vh;padding:55px 65px 38px}
.top{height:120px;border-left:7px solid var(--red);padding-left:25px;display:flex;justify-content:space-between;align-items:flex-start}
.kicker{font-size:16px;font-weight:800;letter-spacing:4px;color:#e67e86;margin:2px 0 10px}
h1{font-size:46px;line-height:1;margin:0;font-weight:900}
.status{padding-top:15px;font-size:13px;letter-spacing:2px;color:#dfe2e7}
.status span{display:inline-block;width:9px;height:9px;border-radius:50%;background:#46d681;margin-right:8px;box-shadow:0 0 14px #46d681}
.layout{height:790px;display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:22px}
.main-card,.side-card{background:var(--panel);border:1px solid var(--line);box-shadow:0 25px 60px rgba(0,0,0,.36);backdrop-filter:blur(9px)}
.main-card{overflow:hidden}
.card-head{height:100px;padding:20px 28px;display:flex;align-items:center;justify-content:space-between;
background:linear-gradient(90deg,rgba(214,40,53,.2),transparent)}
.label{font-size:13px;letter-spacing:3px;color:#ef8b92;font-weight:900}
h2{margin:6px 0 0;font-size:30px;text-transform:uppercase}
.counter{font-size:13px;color:#c8ccd2;font-weight:800;letter-spacing:2px}
#table{padding:0 12px}
table{width:100%;border-collapse:collapse;table-layout:fixed}
th{height:40px;background:rgba(255,255,255,.055);font-size:12px;letter-spacing:1px;color:#9fa5af;text-transform:uppercase}
td{height:45px;border-bottom:1px solid rgba(255,255,255,.075);font-size:15px;font-weight:700;text-align:center}
td.team{text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
th:first-child,td:first-child{width:50px}
th:nth-child(2){text-align:left}
td.pts{font-size:18px}
.logo{width:25px;height:25px;object-fit:contain;vertical-align:middle;margin-right:8px}
aside{display:flex;flex-direction:column;gap:18px}
.side-card{overflow:hidden}
.side-card:first-child{height:510px}
.next-card{height:262px}
.side-title{height:65px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;
background:linear-gradient(90deg,var(--red-dark),rgba(149,18,29,.15));font-size:15px;font-weight:900;letter-spacing:2px}
.side-title small{font-size:11px;color:#c7cbd1;letter-spacing:1px}
.match{min-height:61px;padding:8px 18px;border-bottom:1px solid rgba(255,255,255,.07);display:grid;grid-template-columns:58px 1fr 55px;align-items:center}
.match:last-child{border-bottom:0}
.match .when{font-size:11px;color:#9da3ad;font-weight:800}
.match .teams{font-size:13px;line-height:1.35}
.match .score{text-align:right;font-size:17px;font-weight:900}
.match .pending{color:#cdd1d6}
footer{height:67px;margin-top:18px;display:grid;grid-template-columns:190px 1fr auto;align-items:center;background:linear-gradient(90deg,var(--red),#b51f2a 55%,rgba(181,31,42,.65))}
footer div:first-child{height:100%;display:flex;align-items:center;padding-left:24px;font-size:14px;font-weight:900;letter-spacing:2px;background:rgba(0,0,0,.15)}
footer strong{padding-left:24px;font-size:21px;text-transform:uppercase}
.keys{padding-right:20px;font-size:10px;letter-spacing:1.5px;color:#f2c9cc}
@media(max-width:1300px){main{padding:35px}.layout{grid-template-columns:minmax(0,1fr) 370px}h1{font-size:38px}}