/* Court surface textures — bundled locally, no external requests.
   Image layer and tint layer sized independently so the surface always
   fills the viewport (no half-rendered bands). */

.court-grass,
.court-clay,
.court-hard {
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover, cover;
}

.court-grass {
    background-color: #0c2e20;
    background-image:
        linear-gradient(rgba(8, 41, 31, 0.35), rgba(8, 41, 31, 0.5)),
        url('grass.jpg');
}

.court-clay {
    background-color: #7a4630;
    background-image:
        linear-gradient(rgba(122, 62, 38, 0.28), rgba(94, 46, 27, 0.45)),
        url('clay.jpg');
}

.court-hard {
    background-color: #2c4d7c;
    background-image:
        linear-gradient(rgba(35, 65, 110, 0.32), rgba(24, 47, 82, 0.5)),
        url('hard.jpg');
}