/* Rush Crush - spielspezifisch, Praefix g-rc- (Spielfeld wird per Canvas gezeichnet) */
.g-rc-legend { text-align: left; max-width: 460px; margin: 0 auto 14px; font-size: .88rem; color: var(--g-muted); line-height: 1.5; }
.g-rc-legend div { padding: 3px 0 3px 14px; position: relative; }
.g-rc-legend div::before { content: "\25C6"; position: absolute; left: 0; color: var(--g-gold); font-size: .7rem; top: 7px; }
.g-rc-prog { position: relative; height: 8px; border-radius: 6px; background: rgba(0,0,0,.3); max-width: 520px; margin: 4px auto 14px; }
.g-rc-prog > i { display: block; height: 100%; width: 0; border-radius: 6px; background: linear-gradient(90deg, var(--g-gold), var(--g-gold-l)); transition: width .3s; }
.g-rc-mark { position: absolute; top: 9px; transform: translateX(-100%); font-style: normal; font-size: .62rem; color: var(--g-gold-l); letter-spacing: 1px; line-height: 1; }
.g-rc-goals { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; max-width: 520px; margin: 6px auto 4px; }
.g-rc-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: rgba(0,0,0,.28); border: 1px solid var(--g-line); font-size: .85rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.g-rc-chip.g-ok { border-color: var(--g-ok); color: var(--g-ok); }
.g-rc-ico { color: var(--g-gold-l); font-size: 1rem; line-height: 1; }
.g-rc-ico.g-jl { color: #8fe9ff; } .g-rc-ico.g-cr { color: #d9a441; }
.g-rc-mini { display: inline-block; width: 16px; height: 16px; background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.85) 0, var(--c) 42%, var(--cd) 100%); }
.g-t0 { --c: #ff3d77; --cd: #a3103f; } .g-t0.g-rc-mini { clip-path: path('M8 15 C-3 8 2 -1 8 4 C14 -1 19 8 8 15 Z'); }
.g-t1 { --c: #ffd21f; --cd: #c98a00; } .g-t1.g-rc-mini { clip-path: polygon(50% 0, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%); }
.g-t2 { --c: #2fd96b; --cd: #0a7a3a; } .g-t2.g-rc-mini { clip-path: path('M8 0 C9 4 14 6 14 10 A6 6 0 0 1 2 10 C2 6 7 4 8 0 Z'); }
.g-t3 { --c: #2f9bff; --cd: #1243a8; } .g-t3.g-rc-mini { border-radius: 50%; }
.g-t4 { --c: #a855ff; --cd: #5a1aa8; } .g-t4.g-rc-mini { border-radius: 26%; }
.g-t5 { --c: #ff8a1f; --cd: #b24a00; } .g-t5.g-rc-mini { clip-path: path('M0 8 Q8 -3 16 8 Q8 19 0 8 Z'); }
.g-rc-board { position: relative; width: 100%; max-width: 520px; aspect-ratio: 1 / 1; margin: 6px auto; border-radius: 14px; border: 1px solid var(--g-line); overflow: hidden; touch-action: none; -webkit-user-select: none; user-select: none; outline: none; background: linear-gradient(135deg, #ffb3dc, #c79bff 50%, #8fb4ff); border: 2px solid rgba(255,255,255,.6); box-shadow: 0 8px 26px rgba(120,40,140,.35), inset 0 0 0 1px rgba(255,255,255,.25); }
.g-rc-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; touch-action: none; cursor: pointer; }
.g-rc-combo { position: absolute; left: 0; right: 0; top: 5%; text-align: center; font-family: var(--g-head); font-weight: 700; font-size: clamp(1.2rem, 6vw, 2.2rem); color: #fff; text-shadow: 0 2px 0 #7a2a9c, 0 0 10px rgba(110,20,130,.9), 0 3px 12px rgba(0,0,0,.5); pointer-events: none; opacity: 0; z-index: 3; padding: 0 8px; }
.g-rc-combo.g-show { animation: g-rc-float 1.1s ease-out; }
.g-rc-veil { position: absolute; inset: 0; display: none; align-items: center; justify-content: center; background: rgba(10,31,25,.82); font-family: var(--g-head); font-size: 1.8rem; color: var(--g-gold-l); z-index: 5; }
.g-rc-board.g-paused .g-rc-veil { display: flex; }
.g-rc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(66px, 1fr)); gap: 8px; max-width: 560px; margin: 8px auto 12px; }
.g-rc-lv { font: inherit; color: #fff; cursor: pointer; border: 1px solid var(--g-line); background: rgba(255,255,255,.08); border-radius: 14px; padding: 8px 4px; min-height: 58px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; touch-action: manipulation; }
.g-rc-lv b { font-size: 1.1rem; font-variant-numeric: tabular-nums; }
.g-rc-lv small { color: var(--g-gold-l); font-size: .7rem; letter-spacing: 1px; min-height: 1em; }
.g-rc-lv:hover:not(.g-lock) { background: rgba(255,255,255,.16); }
.g-rc-lv.g-cur { border-color: var(--g-gold); box-shadow: 0 0 0 2px rgba(212,175,55,.35); }
.g-rc-lv.g-bonus { border-color: var(--g-gold); background: rgba(212,175,55,.14); }
.g-rc-pager { display: flex; align-items: center; justify-content: center; gap: 10px; max-width: 560px; margin: 4px auto 8px; flex-wrap: wrap; }
.g-rc-pageno { font-variant-numeric: tabular-nums; color: var(--g-gold-l); font-weight: 600; min-width: 110px; text-align: center; }
.g-rc-pager .g-btn[disabled] { opacity: .4; cursor: not-allowed; }
.g-rc-lv.g-lock { opacity: .45; cursor: not-allowed; }
@keyframes g-rc-float { 0% { opacity: 0; transform: translateY(14px) scale(.8); } 20% { opacity: 1; transform: translateY(0) scale(1.1); } 80% { opacity: 1; } 100% { opacity: 0; transform: translateY(-26px) scale(1); } }
@media (prefers-reduced-motion: reduce) {
  .g-rc-combo.g-show { animation: g-rc-fade 1.4s linear; }
  .g-rc-prog > i { transition: none; }
}
@keyframes g-rc-fade { 0%, 80% { opacity: 1; } 100% { opacity: 0; } }