body{
    background:#020617;
    color:white;
    font-family:Arial,Helvetica,sans-serif;
    margin:0;
    padding:0;
}

.container{
    max-width:1600px;
    margin:auto;
    padding:20px;
}

.topbar{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:30px;
    flex-wrap:wrap;
}

.brand h1{
    color:#00ff88;
    font-size:58px;
    margin:0;
}

.brand p{
    color:#94a3b8;
    margin-top:10px;
}

.status-wrap{
    display:flex;
    gap:15px;
}

.status-pill{
    background:#0f172a;
    border:1px solid rgba(255,255,255,0.08);
    border-radius:16px;
    padding:14px 18px;
    min-width:140px;
}

.status-title{
    color:#64748b;
    font-size:12px;
    margin-bottom:8px;
}

.status-value{
    font-size:24px;
    font-weight:bold;
}

.live-dot{
    width:10px;
    height:10px;
    background:#00ff88;
    border-radius:50%;
    display:inline-block;
    margin-right:8px;
}

.hero-grid{
    display:grid;
    grid-template-columns:1fr 360px;
    gap:20px;
    margin-bottom:30px;
}

.hero-card,
.market-card{
    background:#0f172a;
    border-radius:22px;
    padding:24px;
    border:1px solid rgba(255,255,255,0.08);
}

.signal{
    background:#111c31;
    border-radius:16px;
    padding:16px;
    margin-bottom:14px;
}

.signal-top{
    display:flex;
    justify-content:space-between;
    margin-bottom:10px;
}

.signal-badge{
    background:#00ff88;
    color:black;
    padding:6px 10px;
    border-radius:999px;
    font-size:11px;
    font-weight:bold;
}

.signal-market{
    color:#cbd5e1;
    margin-bottom:8px;
}

.move{
    color:#00ff88;
    font-weight:bold;
    font-size:18px;
}

.market-row{
    display:flex;
    justify-content:space-between;
    padding:14px 0;
    border-bottom:1px solid rgba(255,255,255,0.06);
}

.market-number{
    font-weight:bold;
    font-size:22px;
}

.online{
    color:#00ff88;
}

.section-title{
    font-size:34px;
    margin-bottom:20px;
}

.last-updated{
    color:#64748b;
    margin-bottom:20px;
}

.odds-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
    gap:20px;
}

.card{
    background:#0f172a;
    border-radius:22px;
    padding:20px;
    border:1px solid rgba(255,255,255,0.08);
    position:relative;
}

.live-bar{
    position:absolute;
    top:0;
    left:0;
    right:0;
    height:3px;
    background:#00ff88;
}

.game-meta{
    display:flex;
    justify-content:space-between;
    margin-bottom:14px;
    color:#94a3b8;
    font-size:12px;
}

.game-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:18px;
}

.team{
    width:40%;
    text-align:center;
}

.team-logo{
    width:60px;
    height:60px;
    object-fit:contain;
}

.team-name{
    margin-top:8px;
    font-size:20px;
    font-weight:bold;
}

.team-score{
    color:#00ff88;
    font-size:28px;
    font-weight:bold;
    margin-top:6px;
}

.vs{
    color:#64748b;
}

.market{
    background:#111c31;
    border-radius:16px;
    padding:14px;
    margin-bottom:14px;
}

.market strong{
    color:#00ff88;
    display:block;
    margin-bottom:10px;
}

.market-line{
    display:flex;
    justify-content:space-between;
    margin-bottom:8px;
}

.odds{
    font-weight:bold;
    font-size:18px;
}

.footer{
    margin-top:50px;
    text-align:center;
    color:#64748b;
    border-top:1px solid rgba(255,255,255,0.08);
    padding-top:20px;
}

.loading{
    color:#00ff88;
    font-size:22px;
}
