[hidden]{display:none!important}
body{background:#101012;isolation:isolate}
.player-backdrop{position:fixed;inset:-8px;z-index:-1;pointer-events:none}
.player-backdrop img{width:100%;height:100%;object-fit:cover;object-position:center;filter:grayscale(1) blur(3px)}
.player-user,#category-empty{color:#e3e5e9}
.card h2{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.card{border:0;background:#141414}
.card-body{gap:0;padding:0}
.card .result:not(:empty){margin:0;padding:10px 12px;color:#f1f1f1}
.card button[data-bonus-key]{background:linear-gradient(135deg,#65141c 0%,#28171a 8%,#141414 20%,#141414 80%,#28171a 92%,#65141c 100%);color:#fff;text-transform:uppercase;border-radius:0;min-height:46px;line-height:1.4;transition:filter 160ms ease}
.card button[data-bonus-key]:hover{filter:brightness(1.15)}
.card button[data-bonus-key]:focus-visible{outline:3px solid #ff737d;outline-offset:-3px}
@media(prefers-reduced-motion:reduce){.card button[data-bonus-key]{transition:none}}
.player-brand{height:144px;display:flex;align-items:center;justify-content:center;background:#050505;border-bottom:2px solid #bc1823;padding:24px}
.player-brand img{width:260px;max-width:80%;height:70px;object-fit:contain}
.bonus-navigation{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));max-width:760px;margin:0 auto 16px;border-radius:12px;overflow:hidden;background:#343a40;box-shadow:0 4px 12px #0002}
.bonus-navigation button,.bonus-navigation #history-open{width:100%;margin:0;min-height:64px;padding:14px 12px;border-radius:0;background:#343a40;color:white;font-size:14px;line-height:1.4;text-transform:uppercase;overflow-wrap:anywhere}
.bonus-navigation button:hover{background:#454c54}
.bonus-navigation{padding:5px;gap:4px}
.bonus-navigation button[aria-pressed="true"]{background:#bc1823;box-shadow:inset 0 0 0 2px #ff737d;border-radius:8px}
.bonus-navigation button:focus-visible{outline:3px solid white;outline-offset:-5px}
.player-user{display:none}
.card{position:relative;transition:transform 220ms ease,box-shadow 220ms ease}
.bonus-navigation{overflow:visible}
.bonus-navigation button,.bonus-navigation #history-open{position:relative;border-radius:8px;transition:transform 220ms ease,box-shadow 220ms ease,background-color 220ms ease}
@media(hover:hover) and (pointer:fine){
 .card:hover{transform:scale(1.025);z-index:1;box-shadow:0 0 0 1px #ff687655,0 0 24px #db152d55,0 10px 24px #0006}
 .bonus-navigation button:hover{transform:scale(1.025);z-index:2;box-shadow:0 0 0 1px #ff687655,0 0 20px #db152d66}
 .bonus-navigation button[aria-pressed="true"]:hover{box-shadow:inset 0 0 0 2px #ff737d,0 0 20px #db152d66}
}
@media(prefers-reduced-motion:reduce){
 .card,.bonus-navigation button,.bonus-navigation #history-open{transition:none}
 .card:hover,.bonus-navigation button:hover{transform:none}
}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(max-width:767px){
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .card{min-width:0}
  .card-body{padding:0}
  .card button[data-bonus-key]{min-height:44px;font-size:12px;padding:8px 4px}
  .card .result{font-size:12px;overflow-wrap:anywhere}
}
@media(max-width:560px){.player-brand{height:116px}.player-brand img{width:220px}.bonus-navigation{grid-template-columns:repeat(2,minmax(0,1fr))}.bonus-navigation button,.bonus-navigation #history-open{min-height:58px;font-size:12px}.player-user{text-align:center}}