.rabbits-game { gap:18px; }
.games-hub[data-active-game="rabbits"] .game-panel[hidden] { display:none!important; }
.rabbits-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.rabbits-heading h2 { margin:0; font-size:28px; letter-spacing:-.8px; line-height:1.15; }
.rabbits-hint,.rabbits-rules { margin:0; color:var(--muted); font-size:12px; line-height:1.65; }
.rabbits-layout { display:grid; grid-template-columns:minmax(200px,.85fr) minmax(0,1.5fr); align-items:start; gap:18px; }
.rabbits-controls { display:grid; gap:15px; min-width:0; }
.rabbits-wager-label { display:grid; gap:9px; color:var(--ink); font-size:11px; font-weight:700; }
.rabbits-wager-label input { width:100%; min-width:0; min-height:44px; font-size:16px; }
.rabbits-bet-field { display:flex; align-items:center; gap:10px; min-width:0; padding:2px 12px; border:1px solid var(--line); border-radius:12px; background:var(--raised); }
.rabbits-bet-field .rabbits-stake-value { flex:1; padding:0; border:0; border-radius:0; background:transparent; color:var(--accent); font-size:23px; font-weight:700; font-variant-numeric:tabular-nums; }
.rabbits-stake-value[aria-invalid="true"] { color:var(--danger); }
.rabbits-bet-field>span { flex:none; color:var(--muted); font-size:11px; }
.rabbits-stake-shortcuts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
.rabbits-stake-shortcuts button,.rabbits-counts button { min-width:0; min-height:44px; padding:8px; border:1px solid var(--line); border-radius:10px; background:var(--raised); color:var(--ink); font-size:13px; font-weight:700; }
.rabbits-count-field { display:grid; gap:9px; padding:0; margin:0; border:0; min-width:0; }
.rabbits-count-field legend { padding:0; margin:0 0 9px; color:var(--ink); font-size:11px; font-weight:700; }
.rabbits-counts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
.rabbits-counts button[aria-pressed="true"] { border-color:var(--accent); background:color-mix(in srgb,var(--accent) 12%,var(--raised)); color:var(--accent); }
.rabbits-summary { display:grid; gap:7px; min-width:0; padding:13px 14px; border:1px solid var(--line); border-radius:14px; background:var(--raised); }
.rabbits-summary label { color:var(--muted); font-size:11px; line-height:1.4; }
.rabbits-summary output { color:var(--ink); font-family:var(--display); font-size:26px; font-weight:800; line-height:1.15; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.rabbits-summary-return { grid-column:1/-1; }
.rabbits-summary-return output { color:var(--positive); }
.rabbits-arena { min-width:0; padding:15px 10px; border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line)); border-radius:20px; background:radial-gradient(ellipse at 50% 0%,color-mix(in srgb,var(--accent) 9%,transparent),transparent 65%),var(--surface); }
.rabbits-burrows { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; min-width:0; }
.rabbits-hole { position:relative; display:block; width:100%; height:115px; min-width:44px; min-height:44px; overflow:hidden; padding:0; border:1px solid transparent; border-radius:13px; background:transparent; color:var(--accent); touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
.rabbits-hole::before { content:""; position:absolute; inset:auto 4% 8px; height:28px; border:2px solid var(--line); border-radius:50%; background:radial-gradient(ellipse at 50% 80%,#123b50,#07121f 75%); box-shadow:0 4px 0 color-mix(in srgb,var(--positive) 15%,var(--surface)); }
.rabbits-hole::after { content:"?"; position:absolute; inset:35% 0 auto; color:var(--muted); font-family:var(--display); font-size:25px; font-weight:700; opacity:.55; text-align:center; }
.rabbits-hole-number { position:absolute; left:7px; bottom:0; color:var(--muted); font-size:10px; font-variant-numeric:tabular-nums; opacity:.65; pointer-events:none; }
.rabbits-rabbit { position:absolute; left:50%; bottom:21px; display:block; width:auto; max-width:94%; height:calc(100% - 25px); object-fit:contain; opacity:0; transform:translate(-50%,35%); transition:transform .2s ease-out,opacity .15s; pointer-events:none; user-select:none; -webkit-user-drag:none; }
.rabbits-hole.is-rabbit .rabbits-rabbit { opacity:1; transform:translate(-50%,0); }
.rabbits-hole.is-revealed::after { content:""; }
.rabbits-hole.is-rabbit::after { content:""; }
.rabbits-hole.is-picked { border-color:var(--accent); background:color-mix(in srgb,var(--accent) 7%,transparent); }
.rabbits-hole.is-win { border-color:var(--positive); background:color-mix(in srgb,var(--positive) 10%,transparent); }
.rabbits-hole.is-loss { border-color:var(--danger); background:color-mix(in srgb,var(--danger) 8%,transparent); }
.rabbits-hole.is-loss::after { content:"×"; color:var(--danger); opacity:1; }
.rabbits-hole.is-pending::after { content:"…"; color:var(--accent); opacity:1; animation:rabbits-pending .7s ease-in-out infinite alternate; }
.rabbits-hole:not(:disabled):focus-visible { outline:2px solid var(--accent); outline-offset:-2px; }
.rabbits-game button:focus-visible,.rabbits-game input:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.rabbits-controls button:disabled { opacity:.45; cursor:default; }
.rabbits-actions { display:grid; gap:10px; }
.rabbits-actions>.button { width:100%; min-height:48px; padding:12px 10px; font-size:13px; }
.rabbits-actions>.button[hidden] { display:none; }
.rabbits-result { min-height:38px; margin:0; color:var(--muted); font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
.rabbits-result.is-win { color:var(--positive); }
.rabbits-result.is-error { color:var(--danger); }
.rabbits-rules { font-size:11px; }
@media(hover:hover) { .rabbits-hole:not(:disabled):hover { border-color:var(--accent); background:color-mix(in srgb,var(--accent) 6%,transparent); } }
@keyframes rabbits-pending { to { opacity:.35; } }
@media(max-width:640px) { .rabbits-game { gap:15px; } .rabbits-layout { grid-template-columns:minmax(0,1fr); gap:15px; } .rabbits-arena { grid-row:1; padding:12px 8px; } .rabbits-burrows { gap:7px; } .rabbits-hole { height:104px; } .rabbits-controls { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .rabbits-wager-label,.rabbits-stake-shortcuts,.rabbits-count-field { grid-column:1/-1; } .rabbits-counts { grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; } .rabbits-counts button { padding:8px 2px; } .rabbits-heading h2 { font-size:25px; } }
@media(max-width:380px) { .rabbits-counts { grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; } .rabbits-hole { height:94px; } .rabbits-burrows { gap:5px; } .rabbits-summary { padding:11px; } .rabbits-summary output { font-size:23px; } }
@media(prefers-reduced-motion:reduce) { .rabbits-rabbit { transition:none; } .rabbits-hole.is-pending::after { animation:none; } }
.rabbits-game[data-reduced-motion="true"] .rabbits-rabbit { transition:none; }
.rabbits-game[data-reduced-motion="true"] .rabbits-hole.is-pending::after { animation:none; }
