/* Frontend-only responsive refinements. Does not change backend styling. */
html,body{max-width:100%;overflow-x:clip}
.wrap{width:100%;min-width:0}
.grid,.card,.scroll,.fixture,.side{min-width:0}
.card{overflow:hidden}
.scroll{max-width:100%;overflow-x:visible}
.scroll table{min-width:0;width:100%;table-layout:fixed}
.scroll th,.scroll td{overflow-wrap:anywhere;word-break:normal;vertical-align:middle}
.scroll th:nth-child(1),.scroll td:nth-child(1){width:34px}
.scroll th:last-child,.scroll td:last-child{width:56px;text-align:right}
.scroll .avatar{width:29px;height:29px;margin-right:5px}
.scroll .logo{width:26px;height:26px;margin-right:5px}
.fixture{grid-template-columns:minmax(0,1fr) minmax(86px,auto) minmax(0,1fr)}
.fixture .side{overflow-wrap:anywhere}
.fixture .side strong,.fixture .side small{display:block}
.fixture .side small{line-height:1.45}
@media(max-width:750px){
 .wrap{padding:12px}
 .nav{gap:9px}
 .navlinks{width:100%;display:flex;flex-wrap:nowrap;gap:0;justify-content:space-between}
 .navlinks a{font-size:12px;padding:5px 3px;white-space:nowrap}
 .hero{padding:18px 0}
 .hero h1{font-size:clamp(23px,6vw,32px);line-height:1.2}
 .hero p{font-size:13px}
 .stats{gap:7px}
 .stat{padding:10px 6px;text-align:center}
 .stat strong{font-size:22px}
 .stat span{font-size:11px}
 .grid{grid-template-columns:minmax(0,1fr);gap:0}
 .card{padding:12px;border-radius:14px;margin-bottom:12px}
 .card h2{font-size:17px;line-height:1.3}
 .scroll th,.scroll td{padding:10px 4px;font-size:12px}
 .scroll th:nth-child(1),.scroll td:nth-child(1){width:24px}
 .scroll th:last-child,.scroll td:last-child{width:43px}
 .scroll .avatar{width:24px;height:24px;margin-right:4px}
 .scroll .logo{width:23px;height:23px;margin-right:4px}
 .fixture{grid-template-columns:minmax(0,1fr) 82px minmax(0,1fr);gap:5px;padding:14px 0}
 .fixture .side strong{font-size:12px;line-height:1.35}
 .fixture .side small{font-size:11px;margin-top:4px}
 .fixture .score{font-size:20px}
 .fixture .btn{font-size:11px!important;padding:7px 5px;max-width:82px;white-space:normal;line-height:1.25;text-align:center}
 .pill{font-size:11px}
}
@media(max-width:360px){
 .navlinks a{font-size:11px}
 .scroll th,.scroll td{font-size:11px;padding:9px 3px}
 .fixture{grid-template-columns:minmax(0,1fr) 70px minmax(0,1fr)}
 .fixture .btn{max-width:70px}
 .fixture .side strong{font-size:11px}
 .fixture .side small{font-size:10px}
}
