.wpg-app--horsle .wpg-horsle-top { display: flex; justify-content: center; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 8px; }
.wpg-horsle-badge { font-size: 12.5px; font-weight: 800; color: var(--accent); padding: 4px 10px; border-radius: 999px; border: 1.5px dashed color-mix(in srgb, var(--accent) 55%, transparent); }
.wpg-horsle-track { position: relative; max-width: 100%; height: 38px; margin: 0 auto 10px; }
.wpg-horsle-lane {
    position: absolute; left: 0; right: 0; bottom: 4px; height: 22px;
    border-bottom: 3px solid color-mix(in srgb, var(--accent) 45%, var(--line));
}
.wpg-horsle-shoe { position: absolute; top: 2px; display: block; width: 18px; height: 18px; color: color-mix(in srgb, var(--ink) 45%, var(--surface)); transition: color .3s, transform .3s; }
.wpg-horsle-shoe svg { width: 100%; height: 100%; display: block; }
.wpg-horsle-shoe.is-on { color: var(--accent); transform: rotate(180deg); }
.wpg-horsle-shoe.is-win { color: var(--ok); }
.wpg-horsle-flag { position: absolute; top: 0; font-style: normal; font-size: 18px; line-height: 1; width: 22px; text-align: center; }
.wpg-horsle-horse {
    position: absolute; left: 0; bottom: 8px; width: 34px; height: 30px; font-size: 24px; line-height: 30px; text-align: center;
    font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif; transition: left .55s cubic-bezier(.3, .7, .4, 1);
}
.wpg-horsle-horse span { display: inline-block; transform: scaleX(-1); }
.wpg-horsle-horse.is-trot span { animation: wpg-horsle-trot .55s ease; }
.wpg-horsle-track.is-win .wpg-horsle-horse span { animation: wpg-horsle-jump .7s ease .4s; }
.wpg-horsle-track.is-lose .wpg-horsle-horse { filter: grayscale(1); opacity: .6; }
.wpg-horsle-note { text-align: center; font-size: 13px; color: var(--ink-soft); margin: -4px 0 10px; }
@keyframes wpg-horsle-trot {
    0%, 100% { transform: scaleX(-1) translateY(0); }
    25% { transform: scaleX(-1) translateY(-4px); }
    50% { transform: scaleX(-1) translateY(0); }
    75% { transform: scaleX(-1) translateY(-3px); }
}
@keyframes wpg-horsle-jump {
    0%, 100% { transform: scaleX(-1) translateY(0); }
    40% { transform: scaleX(-1) translateY(-12px); }
    70% { transform: scaleX(-1) translateY(-3px); }
}
@media (prefers-reduced-motion: reduce) { .wpg-horsle-horse { transition: none; } .wpg-horsle-horse span { animation: none !important; } }