/* Eigene Stile, die Tailwind ergänzen. */
html { -webkit-text-size-adjust: 100%; }

/* Subtiles Punktraster im Hintergrund */
.bg-grid {
    background-image:
        radial-gradient(circle at 1px 1px, rgb(99 102 241 / 0.07) 1px, transparent 0);
    background-size: 24px 24px;
}

/* Diagonales Streifenmuster für den Hero-Banner */
.bg-hero-pattern {
    background-image:
        repeating-linear-gradient(
            -45deg,
            rgba(255, 255, 255, 0.06) 0,
            rgba(255, 255, 255, 0.06) 1px,
            transparent 1px,
            transparent 14px
        );
}

/* Smooth scroll für Anker-Links innerhalb der Seite */
html { scroll-behavior: smooth; }

/* Badge für Platz/Startposition */
.platz-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.75rem;
    height: 1.75rem;
    padding: 0 0.5rem;
    border-radius: 9999px;
    font-weight: 700;
    font-size: 0.8125rem;
    font-variant-numeric: tabular-nums;
    box-shadow: 0 1px 2px 0 rgb(15 23 42 / 0.08);
}

/* Standard (Startnummern, Platz >= 4) */
.platz-x {
    background: rgb(238 242 255);
    color: rgb(67 56 202);
    box-shadow: none;
}

/* Podestplätze (nur Ergebnisse) */
.platz-gold   { background: linear-gradient(135deg, #fde68a 0%, #f59e0b 60%, #d97706 100%); color: #422006; }
.platz-silber { background: linear-gradient(135deg, #f1f5f9 0%, #cbd5e1 60%, #94a3b8 100%); color: #1e293b; }
.platz-bronze { background: linear-gradient(135deg, #fed7aa 0%, #fb923c 60%, #ea580c 100%); color: #431407; }

/* Hintergrund-Hervorhebung der Podest-Zeile */
.row-gold   { background: linear-gradient(90deg, rgb(254 243 199 / 0.7), rgb(254 243 199 / 0.15) 50%, transparent 100%); }
.row-silber { background: linear-gradient(90deg, rgb(226 232 240 / 0.8), rgb(226 232 240 / 0.2) 50%, transparent 100%); }
.row-bronze { background: linear-gradient(90deg, rgb(254 215 170 / 0.6), rgb(254 215 170 / 0.15) 50%, transparent 100%); }