/* Towers (Tower Rush), Plinko, Ракетка + общие эффекты.
   Анимации — только transform/opacity (плавно, без пересчёта раскладки); сцены изолированы через contain. */

#screen-towers, #screen-plinko, #screen-crash { padding:4px 12px 12px; }
.game-card.towers { background:linear-gradient(120deg, #ffcf4d 0%, #f29a2e 55%, #c8601a 100%); }
.m-presets .chip:disabled { opacity:.45; }
.ico { width:100%; height:100%; display:block; }

/* Всплывающая надпись «+X» */
.float-text { position:absolute; left:50%; top:38%; z-index:20; pointer-events:none; white-space:nowrap;
  font-size:20px; font-weight:900; color:#fff; text-shadow:0 2px 0 #0006, 0 0 14px #0008; }
.float-text.gold { color:#ffe27a; }
.float-text.dim { color:#cfe6ff; font-size:14px; }

/* ═════════════════ TOWER RUSH ═════════════════ */
.tr-stage {
  --sky-shift:0px; position:relative; height:min(56vh, 470px); overflow:hidden; border-radius:22px;
  contain:layout paint; isolation:isolate; box-shadow:0 8px 24px #02122466, inset 0 0 0 1px #ffffff30;
}
.tr-sky { position:absolute; inset:0; background:linear-gradient(#69bdf0 0%, #9fd6f6 45%, #e4f4fd 82%, #fff5dd 100%); }
.tr-sun { position:absolute; right:14%; top:12%; width:70px; height:70px; border-radius:50%;
  background:radial-gradient(circle, #fffbe6 0%, #ffe48a 40%, #ffd04d00 72%);
  transform:translateY(calc(var(--sky-shift) * .3)); transition:transform .8s cubic-bezier(.45,.05,.25,1); }
.tr-cloud { position:absolute; width:110px; height:36px; border-radius:40px; background:#ffffffd9;
  box-shadow:28px -14px 0 4px #ffffffd9, 58px -4px 0 0 #ffffffcc; animation:trCloud 46s linear infinite; }
.tr-cloud.c1 { top:14%; left:-30%; }
.tr-cloud.c2 { top:30%; left:-60%; scale:.75; animation-duration:62s; animation-delay:-20s; opacity:.85; }
.tr-cloud.c3 { top:6%; left:-45%; scale:.55; animation-duration:80s; animation-delay:-48s; opacity:.7; }
@keyframes trCloud { to { translate:180vw 0; } }

.tr-world { position:absolute; inset:0; will-change:transform; }
.tr-skyline { position:absolute; left:0; right:0; bottom:40px; height:150px; opacity:.55;
  background:
    linear-gradient(#8fb6d4, #8fb6d4) 4% 100%/12% 70% no-repeat,
    linear-gradient(#9cc1dc, #9cc1dc) 15% 100%/9% 92% no-repeat,
    linear-gradient(#8fb6d4, #8fb6d4) 26% 100%/14% 58% no-repeat,
    linear-gradient(#a5c8e1, #a5c8e1) 70% 100%/10% 100% no-repeat,
    linear-gradient(#8fb6d4, #8fb6d4) 82% 100%/13% 66% no-repeat,
    linear-gradient(#9cc1dc, #9cc1dc) 96% 100%/9% 84% no-repeat; }
.tr-bld { position:absolute; bottom:40px; width:28%; border-radius:4px 4px 0 0; box-shadow:inset 0 0 0 2px #00000014; }
.tr-bld.left { left:-4%; height:205px; background:linear-gradient(#cfb998, #b39b79); }
.tr-bld.right { right:-4%; height:175px; background:linear-gradient(#e2ae7c, #c98f5a); }
.tr-bld i { position:absolute; inset:18px 12px 30px;
  background:repeating-linear-gradient(90deg, transparent 0 6px, #8fc4e6 6px 20px, transparent 20px 26px);
  -webkit-mask:repeating-linear-gradient(#000 0 16px, #0000 16px 30px); mask:repeating-linear-gradient(#000 0 16px, #0000 16px 30px); }
.tr-bld.right i { top:84px; }
.tr-bld.right::before { content:''; position:absolute; left:-6px; right:-6px; top:58px; height:16px; border-radius:4px;
  background:repeating-linear-gradient(90deg, #e04a3a 0 14px, #fff1e6 14px 28px); box-shadow:0 3px 0 #0000001f; }
.tr-bld.left::before { content:''; position:absolute; left:-4px; right:-4px; top:-8px; height:10px; border-radius:3px; background:#8a7458; }
.tr-lamp { position:absolute; bottom:40px; left:27%; width:4px; height:92px; background:#3c4552; border-radius:2px; }
.tr-lamp::before { content:''; position:absolute; top:-6px; left:-6px; width:16px; height:12px; border-radius:6px 6px 3px 3px; background:#3c4552; }
.tr-lamp::after { content:''; position:absolute; top:4px; left:-14px; width:32px; height:32px; border-radius:50%; background:radial-gradient(#fff2b388, transparent 70%); }
.tr-street { position:absolute; left:0; right:0; bottom:0; height:40px;
  background:linear-gradient(#cdbfa8 0 9px, #8f8473 9px 11px, #4a4f58 11px); }
.tr-street::after { content:''; position:absolute; left:0; right:0; top:24px; height:3px;
  background:repeating-linear-gradient(90deg, #f3d46b 0 24px, transparent 24px 46px); opacity:.8; }

/* Башня: этажи складываются снизу вверх */
.tr-tower { position:absolute; bottom:40px; left:50%; translate:-50% 0; width:160px;
  display:flex; flex-direction:column-reverse; align-items:center; transform-origin:50% 100%; }
.tr-base { position:relative; width:156px; height:126px; border-radius:6px 6px 0 0;
  background:linear-gradient(#5aa57c, #3f7f5d); box-shadow:inset 0 0 0 3px #2e6046, 0 4px 0 #0000002e; }
.tr-sign { position:absolute; top:8px; left:12px; right:12px; height:22px; border-radius:5px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(#3b2a1d, #23170f); color:#ffd76a; font-size:12px; font-weight:900; letter-spacing:1.5px; box-shadow:0 0 12px #ffd76a55, inset 0 0 0 2px #8a5a2e; }
.tr-awning { position:absolute; top:36px; left:-6px; right:-6px; height:18px; border-radius:3px 3px 8px 8px;
  background:repeating-linear-gradient(90deg, #e04a3a 0 13px, #fff6ea 13px 26px); box-shadow:0 4px 0 #00000026; }
.tr-door { position:absolute; bottom:0; left:50%; width:28px; height:46px; translate:-50% 0; border-radius:4px 4px 0 0; z-index:1;
  background:linear-gradient(#8a5a2e, #6a4220); box-shadow:inset 0 0 0 2px #4a2e14; }
.tr-shopwin { position:absolute; bottom:12px; left:12px; right:12px; height:38px; border-radius:4px;
  background:linear-gradient(90deg, #fff2b3 0 36%, transparent 36% 64%, #fff2b3 64%); box-shadow:0 0 18px #ffe48a88; opacity:.95; }

.tr-floor {
  --wall1:#d9573d; --wall2:#b03d27; --trim:#7a2716; --win:#bfe6fb;
  position:relative; width:144px; height:46px; flex:0 0 auto; display:flex; align-items:center; justify-content:space-evenly; padding:6px 12px 4px;
  transform:translateX(var(--dx, 0px)); border-radius:4px;
  background:
    repeating-linear-gradient(0deg, transparent 0 9px, #0000001c 9px 10px),
    repeating-linear-gradient(90deg, transparent 0 18px, #00000012 18px 19px),
    linear-gradient(var(--wall1), var(--wall2));
  box-shadow:inset 0 0 0 2px var(--trim), inset 0 4px 0 #ffffff2e, 0 3px 0 #0000002e;
}
.tr-floor.k-brick  { --wall1:#de6247; --wall2:#b4412a; --trim:#7a2716; }
.tr-floor.k-blue   { --wall1:#5f95c9; --wall2:#3f6f9f; --trim:#2c4f73; background:repeating-linear-gradient(0deg, #ffffff10 0 2px, transparent 2px 8px), linear-gradient(var(--wall1), var(--wall2)); }
.tr-floor.k-yellow { --wall1:#f4c25a; --wall2:#d99a2c; --trim:#9a6716; }
.tr-floor.k-mint   { --wall1:#6cc7a8; --wall2:#3f9a7c; --trim:#2b6d57; }
.tr-floor.k-ice    { --wall1:#9bb3c9; --wall2:#6f8aa5; --trim:#4c6680; --win:#e2f6ff; }
.tr-floor.k-temple { --wall1:#83409f; --wall2:#561f6e; --trim:#d8a93c; --win:#ffd76a;
  box-shadow:inset 0 0 0 3px var(--trim), inset 10px 0 0 -5px #e6be5a, inset -10px 0 0 -5px #e6be5a, 0 3px 0 #0000002e; }
.tr-floor.k-frozen { --wall1:#a3a9b3; --wall2:#6f7783; --trim:#4b525c; --win:#e9f7ff; }
.tr-win { width:22px; height:22px; border-radius:3px 3px 2px 2px; position:relative;
  background:linear-gradient(135deg, #ffffff 0 18%, var(--win) 18% 100%); box-shadow:0 0 0 2px #f6efe2, inset 0 -3px #0000001a; }
.tr-win::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg, transparent 45%, #f6efe2 45% 55%, transparent 55%),
  linear-gradient(transparent 45%, #f6efe2 45% 55%, transparent 55%); }
.tr-floor.k-temple .tr-win { border-radius:11px 11px 2px 2px; box-shadow:0 0 0 2px #e6be5a; }
.tr-fsign { position:absolute; top:-1px; left:50%; translate:-50% 0; font-size:7px; font-weight:900; letter-spacing:1px;
  color:#fff7d6; text-shadow:0 1px 0 #0007; white-space:nowrap; z-index:2; }
.tr-floor.k-temple .tr-fsign { color:#ffe08a; }
.tr-floor.k-ice::before, .tr-floor.k-frozen::before {
  content:''; position:absolute; left:-5px; right:-5px; top:-6px; height:10px; border-radius:8px;
  background:linear-gradient(#fff, #e3f4ff); box-shadow:0 2px 3px #5c9ccf44; z-index:1; }
.tr-floor.k-ice::after, .tr-floor.k-frozen::after {
  content:''; position:absolute; left:4px; right:4px; bottom:-7px; height:8px; z-index:1; pointer-events:none;
  background:linear-gradient(135deg, #e8f7ff 30%, transparent 30%) 0 0/11px 8px, linear-gradient(225deg, #e8f7ff 30%, transparent 30%) 0 0/11px 8px; }

/* Кран */
.tr-crane { position:absolute; top:-8px; left:50%; width:0; height:0; z-index:4; transform-origin:0 0;
  animation:trSwing 2.4s cubic-bezier(.45,.05,.55,.95) infinite alternate; }
.tr-crane.paused { animation-play-state:paused; }
@keyframes trSwing { from { transform:rotate(-12deg); } to { transform:rotate(12deg); } }
.tr-rope { position:absolute; left:-1.5px; top:0; width:3px; height:72px; background:linear-gradient(90deg, #5a4630, #3a2c1d); }
.tr-hook { position:absolute; left:-9px; top:68px; width:18px; height:12px; border-radius:3px; background:linear-gradient(#ffcf4d, #d99a14); box-shadow:inset 0 -2px #0003; }
.tr-hanging { position:absolute !important; top:80px; left:-72px; transform:none !important; }
.tr-falling { position:absolute; z-index:6; margin:0; will-change:transform; }

/* HUD */
.tr-hud { position:absolute; top:10px; left:10px; z-index:7; padding:8px 12px; border-radius:14px;
  background:#0b2442b3; backdrop-filter:blur(4px); box-shadow:0 4px 12px #0003; }
.tr-mult { font-size:26px; font-weight:900; color:#ffe27a; line-height:1; font-variant-numeric:tabular-nums; text-shadow:0 2px 0 #0005; }
.tr-sub { margin-top:3px; font-size:11px; font-weight:800; color:#d9eeff; }
.tr-banner { position:absolute; left:50%; top:46%; transform:translate(-50%,-50%); z-index:8; min-width:210px; padding:14px 20px; border-radius:18px;
  text-align:center; font-size:16px; font-weight:900; color:#fff; box-shadow:0 12px 30px #0007; pointer-events:none; }
.tr-banner[hidden] { display:none; }
.tr-banner b { display:block; font-size:28px; margin-top:4px; }
.tr-banner small { display:block; font-size:13px; opacity:.85; }
.tr-banner.win { background:linear-gradient(160deg, #3fcf8eee, #168a5aee); border:1px solid #b9ffd9; }
.tr-banner.lose { background:linear-gradient(160deg, #ef6a4eee, #9e2a17ee); border:1px solid #ffc2ae; }

/* Панель в стиле стройки */
.tr-panel { margin-top:10px; padding:10px; border-radius:18px; background:linear-gradient(#26313f, #161d27); position:relative; overflow:hidden;
  box-shadow:0 6px 18px #0005, inset 0 1px #ffffff14; }
.tr-panel::before { content:''; position:absolute; left:0; right:0; top:0; height:6px; background:repeating-linear-gradient(45deg, #ffcf3a 0 10px, #20262f 10px 20px); }
.tr-modes { display:grid; grid-template-columns:repeat(4, 1fr); gap:6px; margin:6px 0 8px; }
.tr-mode { padding:6px 2px; border-radius:10px; background:#2f3b4b; border:1px solid #4b5b70; color:#cfe0f2; text-align:center; }
.tr-mode b { display:block; font-size:12px; font-weight:900; }
.tr-mode small { display:block; font-size:9px; font-weight:800; opacity:.7; margin-top:1px; }
.tr-mode.active { background:linear-gradient(#ffd65a, #f0a722); border-color:#fff1b8; color:#3b2400; }
.tr-mode:disabled:not(.active) { opacity:.5; }
.tr-controls { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px; }
.tr-left { display:flex; flex-direction:column; gap:6px; }
.tr-bet { display:flex; align-items:center; height:42px; border-radius:12px; background:#0e141c; border:1px solid #3e4b5c; overflow:hidden; }
.tr-bet button { width:38px; height:100%; font-size:20px; font-weight:900; color:#e6eef7; background:#2a3442; }
.tr-bet input { flex:1; min-width:0; height:100%; text-align:center; background:none; border:0; outline:none; color:#fff; font:900 17px var(--font-app); }
.tr-quick { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:6px; }
.tr-quick button { height:34px; border-radius:10px; font-size:12px; font-weight:900; color:#fff; background:linear-gradient(#3d8be0, #2563b0); border:1px solid #79b4f2; }
.tr-bet button:disabled, .tr-quick button:disabled, .tr-bet input:disabled { opacity:.45; }
.tr-right { display:flex; flex-direction:column; gap:6px; }
.tr-build { flex:1; min-height:82px; border-radius:14px; padding:5px;
  background:repeating-linear-gradient(45deg, #ffcf3a 0 10px, #22272e 10px 20px); box-shadow:0 5px 0 #8a6a12, 0 8px 18px #0006; }
.tr-build span { display:flex; align-items:center; justify-content:center; height:100%; border-radius:10px; text-align:center; padding:0 4px;
  background:linear-gradient(#ffe066, #ffb820); color:#3b2400; font-size:18px; font-weight:900; letter-spacing:1px; text-shadow:0 1px 0 #fff6; line-height:1.1; }
.tr-build:not(:disabled):active { transform:translateY(3px); box-shadow:0 2px 0 #8a6a12, 0 4px 10px #0006; }
.tr-build:disabled { filter:saturate(.6) brightness(.85); }
.tr-cash { height:42px; border-radius:12px; font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 6px; font-weight:900; color:#073c22; background:linear-gradient(#7af2b4, #2cc47e); border:1px solid #c6ffe0; box-shadow:0 4px 0 #157a4a; }
.tr-cash[hidden] { display:none; }
.tr-cash:not(:disabled):active { transform:translateY(2px); box-shadow:0 2px 0 #157a4a; }

/* ═════════════════ PLINKO ═════════════════ */
.pl-recent { display:flex; gap:6px; overflow:hidden; min-height:26px; margin-bottom:6px; }
.pl-res { flex:0 0 auto; font-size:12px; font-weight:900; padding:4px 8px; border-radius:8px; color:#fff; animation:chipIn .4s var(--ease-out-soft, ease); }
@keyframes chipIn { from { opacity:0; transform:translateX(-8px) scale(.9); } }
.pl-board {
  --peg:7px; --ball:13px; position:relative; height:min(50vh, 420px); border-radius:22px; overflow:hidden; margin-bottom:2px; contain:layout paint;
  background:
    radial-gradient(ellipse at 50% -10%, #5b5fd655, transparent 55%),
    radial-gradient(ellipse at 50% 120%, #2aa7e833, transparent 60%),
    linear-gradient(170deg, #17204a, #0b1430 60%, #081028);
  border:1px solid #6d78d466; box-shadow:0 8px 24px #02122466, inset 0 2px 14px #00000050;
}
.pl-glow { position:absolute; left:50%; top:-40px; width:160px; height:120px; translate:-50% 0; border-radius:50%;
  background:radial-gradient(#9fd6ff55, transparent 70%); pointer-events:none; }
.pl-peg { position:absolute; width:var(--peg); height:var(--peg); margin:calc(var(--peg) / -2) 0 0 calc(var(--peg) / -2); border-radius:50%;
  background:radial-gradient(circle at 35% 35%, #ffffff, #c9e6ff 55%, #7aa8e0); box-shadow:0 0 5px #9fd6ff77;
  transition:transform .35s var(--ease-out-soft, ease), box-shadow .35s ease; }
.pl-peg.hit { transform:scale(1.7); box-shadow:0 0 10px #ffd34d, 0 0 20px #ffd34d88; transition-duration:.06s; }
.pl-bins { position:absolute; left:0; right:0; top:88.5%; height:9%; }
.pl-bin { position:absolute; top:0; height:100%; translate:-50% 0; border-radius:7px; display:flex; align-items:center; justify-content:center;
  font-size:9px; font-weight:900; color:#fff; box-shadow:inset 0 -3px #00000040, 0 2px 6px #0004; transition:transform .35s var(--ease-out-soft, ease), filter .35s ease; }
.pl-bin.hit { transform:translateY(4px) scale(1.08); filter:brightness(1.25); transition-duration:.1s; }
.b-hot { background:linear-gradient(#ff6a5c, #c5221a); }
.b-high { background:linear-gradient(#ffa64a, #d9631a); }
.b-mid { background:linear-gradient(#ffd85c, #d79a14); color:#3d2a00; }
.b-low { background:linear-gradient(#6fcdf7, #2b84c4); }
.b-loss { background:linear-gradient(#4b5fa6, #2b3a72); color:#d6e0ff; }
.pl-ball { position:absolute; width:var(--ball); height:var(--ball); margin:calc(var(--ball) / -2) 0 0 calc(var(--ball) / -2); border-radius:50%; z-index:3;
  background:radial-gradient(circle at 32% 28%, #fffbe6, #ffd23f 50%, #e08a00); box-shadow:0 0 12px #ffcf3acc, 0 2px 4px #0006; }

/* ═════════════════ РАКЕТКА ═════════════════ */
.cr-history { display:flex; gap:6px; overflow:hidden; min-height:26px; margin-bottom:6px; }
.cr-h { flex:0 0 auto; font-size:12px; font-weight:900; padding:4px 8px; border-radius:8px; color:#fff; animation:chipIn .4s var(--ease-out-soft, ease); }
.cr-h.low { background:#3b5a8a; } .cr-h.mid { background:#21a06a; } .cr-h.high { background:linear-gradient(#ffcf4d, #e09a12); color:#3b2400; }
.crash-sky {
  position:relative; height:min(48vh, 380px); border-radius:22px; overflow:hidden; margin-bottom:2px; contain:layout paint; isolation:isolate;
  background:linear-gradient(#040a1c 0%, #0a1d40 45%, #17497d 85%, #2a6aa6 100%);
  box-shadow:0 8px 24px #02122466, inset 0 0 0 1px #4f86bb55; transition:box-shadow .5s ease;
}
.cr-stars { position:absolute; inset:-200px; pointer-events:none; will-change:transform; }
.cr-stars.s1 { background-image:radial-gradient(1px 1px at 20px 30px, #fff, transparent), radial-gradient(1px 1px at 120px 80px, #ffffffcc, transparent),
  radial-gradient(1px 1px at 70px 150px, #fff, transparent), radial-gradient(1px 1px at 170px 170px, #ffffffaa, transparent); background-size:200px 200px; opacity:.7; }
.cr-stars.s2 { background-image:radial-gradient(2px 2px at 50px 60px, #fff, transparent), radial-gradient(1.5px 1.5px at 150px 120px, #cfe8ff, transparent); background-size:200px 200px; opacity:.85; }
.cr-planet { position:absolute; right:-40px; top:18%; width:120px; height:120px; border-radius:50%; opacity:.5;
  background:radial-gradient(circle at 35% 35%, #8f7bff, #3b2a8f 60%, #1b1450); box-shadow:0 0 30px #6f5cff55; }
.cr-clouds { position:absolute; left:-10%; right:-10%; bottom:-14px; height:80px; pointer-events:none; will-change:transform;
  background:radial-gradient(ellipse 60px 26px at 10% 70%, #e6f3ffdd, transparent 70%), radial-gradient(ellipse 80px 30px at 32% 80%, #f2f8ffdd, transparent 70%),
    radial-gradient(ellipse 70px 26px at 58% 75%, #e6f3ffcc, transparent 70%), radial-gradient(ellipse 90px 32px at 84% 82%, #f2f8ffdd, transparent 70%); }
.crash-graph { position:absolute; inset:0; width:100%; height:100%; }
.cr-line { fill:none; stroke:#8fd9ff; stroke-width:2; vector-effect:non-scaling-stroke; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 4px #5fc4ff); }
.cr-smoke { position:absolute; inset:0; pointer-events:none; }
.cr-puff { position:absolute; width:12px; height:12px; margin:-6px 0 0 -6px; border-radius:50%; background:radial-gradient(#ffffffaa, #ffffff00 70%);
  animation:crPuff 1.2s ease-out forwards; }
@keyframes crPuff { from { opacity:.75; transform:scale(.5); } to { opacity:0; transform:translate(-14px, 18px) scale(3); } }
.crash-rocket { position:absolute; left:12%; top:84%; width:44px; height:44px; z-index:3; transform:translate(-50%,-50%) rotate(35deg); }
.crash-rocket svg { position:relative; z-index:1; width:100%; height:100%; filter:drop-shadow(0 3px 6px #0007); }
.cr-flame { position:absolute; left:50%; top:76%; width:14px; height:26px; margin-left:-7px; border-radius:50% 50% 50% 50% / 30% 30% 70% 70%;
  background:radial-gradient(ellipse at 50% 25%, #fffbe0 0%, #ffd23f 35%, #ff7a1a 65%, #ff3d0000 85%); transform-origin:50% 0;
  animation:crFlame .11s ease-in-out infinite alternate; opacity:0; transition:opacity .3s ease; }
.crash-sky.flying .cr-flame, .crash-sky.won .cr-flame { opacity:1; }
@keyframes crFlame { from { transform:scaleY(.82) scaleX(.95); } to { transform:scaleY(1.18) scaleX(1.05); } }
.crash-mult { position:absolute; left:50%; top:30%; transform:translate(-50%,-50%); font-size:52px; font-weight:900; color:#fff; z-index:2;
  text-shadow:0 4px 22px #000a, 0 0 18px #ffffff30; font-variant-numeric:tabular-nums; transition:color .4s ease; }
.crash-note { position:absolute; left:50%; top:47%; transform:translateX(-50%); font-size:13px; font-weight:800; color:#cfe8ff; white-space:nowrap; z-index:2; }
.crash-note b { color:#fff; }
.crash-sky.won { box-shadow:0 8px 24px #02122466, inset 0 0 0 2px #7fe0a8, inset 0 0 40px #3ddc8433; }
.crash-sky.boom { box-shadow:0 8px 24px #02122466, inset 0 0 0 2px #ff7a5c, inset 0 0 50px #ff5a3a44; }
.crash-sky.boom .cr-line { stroke:#ff8a6a; filter:drop-shadow(0 0 4px #ff6a4a); }
.cr-boom { position:absolute; width:12px; height:12px; margin:-6px 0 0 -6px; border-radius:50%; z-index:4; pointer-events:none; opacity:0; }
.cr-boom.on { animation:crBoom .8s cubic-bezier(.2,.7,.3,1) forwards; }
@keyframes crBoom {
  0% { opacity:1; transform:scale(1); background:radial-gradient(#fff, #ffd23f 40%, #ff5a1a 70%, transparent 72%); }
  40% { opacity:1; transform:scale(7); background:radial-gradient(#fff6d6, #ffb02e 35%, #ff4a1a 60%, transparent 70%); }
  100% { opacity:0; transform:scale(11); background:radial-gradient(#ff8a4a00, transparent); }
}

/* ═════════════════ MINES: вектор вместо эмодзи ═════════════════ */
.tile .ico { width:66%; height:66%; filter:drop-shadow(0 3px 4px #0006); }
.tile.gem .ico { animation:gemPop .45s cubic-bezier(.2,.9,.3,1.25); }
@keyframes gemPop { from { transform:scale(.2) rotate(-25deg); opacity:0; } }
.tile.boom .ico { animation:bombHit .5s ease-out; }
@keyframes bombHit { 0% { transform:scale(.4); } 60% { transform:scale(1.18); } 100% { transform:scale(1); } }
.tile.dim .ico { width:52%; height:52%; filter:saturate(.6); }
.tile.boom::after { content:''; position:absolute; inset:-4px; border-radius:16px; border:3px solid #ffb08a; animation:boomRing .6s ease-out forwards; pointer-events:none; }
@keyframes boomRing { from { opacity:1; transform:scale(.8); } to { opacity:0; transform:scale(1.5); } }
.mines-banner .ico { display:inline-block; width:22px; height:22px; vertical-align:-5px; }
@media (hover:hover) { .tile:not(:disabled):hover { transform:translateY(-2px); box-shadow:inset 0 2px #ffffff40, 0 5px #0a2846, 0 0 14px #5fc4ff55; } }

@media (max-height:700px) { .tr-stage { height:50vh; } .pl-board { height:44vh; } .crash-sky { height:42vh; } .tr-build { min-height:72px; } }
@media (prefers-reduced-motion: reduce) { .tr-crane, .tr-cloud, .cr-flame, .cr-puff { animation:none !important; } }

/* Главная кнопка вывода — яркая и заметная во всех играх */
#screen-crash .btn-cashout, #screen-mines .btn-cashout {
  background:linear-gradient(#7af2b4, #2cc47e); color:#073c22; border:1px solid #c6ffe0; box-shadow:0 4px 0 #157a4a, 0 6px 16px #2cc47e44;
  font-weight:900; justify-content:center; align-items:center;
}
#screen-crash .btn-cashout b, #screen-mines .btn-cashout b { margin:0 4px; }
#crCashoutAmount { font-variant-numeric:tabular-nums; }
#screen-crash .btn-cashout:not(:disabled):active, #screen-mines .btn-cashout:not(:disabled):active { transform:translateY(2px); box-shadow:0 2px 0 #157a4a; }
#screen-crash .btn-cashout:disabled, #screen-mines .btn-cashout:disabled { filter:saturate(.5) brightness(.8); }

/* Plinko: кнопка серии шаров */
#plDrop { gap:8px; align-items:center; justify-content:center; transition:background .35s ease, color .35s ease, box-shadow .35s ease; }
#plDrop small { font-size:13px; font-weight:800; opacity:.75; }
#plDrop.stop { background:linear-gradient(#ff8c9d, #e2475f 60%, #c2324a); border-color:#ffc3cc; color:#fff; box-shadow:inset 0 2px #ffe1e6aa, 0 3px #8f2337; }

/* Ракетка: общий раунд — отсчёт приёма ставок и список игроков */
.cr-count { position:absolute; left:50%; top:56%; z-index:3; width:min(70%, 240px); translate:-50% 0; text-align:center;
  font-size:12px; font-weight:900; letter-spacing:.4px; color:#cfe8ff; opacity:0; transition:opacity .4s ease; pointer-events:none; }
.cr-count.on { opacity:1; }
.cr-count i { display:block; height:6px; margin-top:6px; border-radius:6px; background:#ffffff22; overflow:hidden; }
.cr-count b { display:block; height:100%; border-radius:6px; transform-origin:left center;
  background:linear-gradient(90deg, #7fd0ff, #3aa6f2); box-shadow:0 0 8px #3aa6f2aa; }
.crash-sky.idle .crash-mult { font-size:44px; color:#e6f5ff; }
.crash-sky.boom .cr-count b { background:linear-gradient(90deg, #ffb08a, #ff7a5c); box-shadow:none; }

#crStart { flex-direction:column; align-items:center; justify-content:center; gap:0; line-height:1.1;
  transition:background .35s ease, color .35s ease, opacity .3s ease; }
#crStart small { font-size:11px; font-weight:800; opacity:.75; }
#crStart.queued { background:linear-gradient(#3c5f86, #2b4a6e); border-color:#7fb4e699; color:#e6f5ff; box-shadow:inset 0 2px #ffffff22, 0 3px #182f4a; }
#crStart:disabled { opacity:1; }

.cr-bets-wrap { margin-top:10px; border-radius:18px; overflow:hidden;
  background:var(--panel-bottom, #0a2442f2); border:1px solid var(--panel-border, #7fb4e699); }
.cr-bets-head { display:flex; justify-content:space-between; padding:9px 12px; font-size:12px; font-weight:800; color:#9cc3e6;
  border-bottom:1px solid var(--panel-inner-border, #6f9fcf55); }
.cr-bets-head b { color:#fff; }
.cr-bets { max-height:220px; overflow-y:auto; }
.cr-bet { display:grid; grid-template-columns:minmax(0, 1fr) auto minmax(0, 1fr); gap:8px; align-items:center; padding:7px 12px;
  font-size:13px; font-weight:800; color:#d9eeff; transition:background .4s ease, color .4s ease; }
.cr-bet + .cr-bet { border-top:1px solid #ffffff0d; }
.cr-bet .cb-name { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cr-bet .cb-res { text-align:right; white-space:nowrap; }
.cr-bet.me { background:#3aa6f214; }
.cr-bet.won { color:#8ff0bd; background:#1fa56e1a; }
.cr-bet.lost { color:#ff9aa8; opacity:.75; }
.cr-bets-empty { padding:14px 12px; text-align:center; font-size:13px; font-weight:700; color:#7fa3c6; }

/* ═══ Ракетка: светящийся след роста от старта к ракете + искры ═══
   Кривая = график множителя (crPath/crGlow), к хвосту прозрачная, у ракеты — ярко-голубая; при взрыве — красная. */
#screen-crash .crash-graph { display:block !important; z-index:1; pointer-events:none; }
#screen-crash .cr-glow { fill:none; stroke:url(#crTrailGrad); stroke-width:14; opacity:.42; vector-effect:non-scaling-stroke;
  stroke-linecap:round; stroke-linejoin:round; filter:blur(5px); }
#screen-crash .cr-line { stroke:url(#crTrailGrad) !important; stroke-width:3.5; filter:drop-shadow(0 0 3px #7fd0ff) drop-shadow(0 0 9px #2f7bff) !important; }
#screen-crash #crFill { opacity:.28; }
#screen-crash .crash-sky.boom .cr-line { stroke:#ff7a5c !important; filter:drop-shadow(0 0 4px #ff5a3a) !important; }
#screen-crash .crash-sky.boom .cr-glow { stroke:#ff5a3a; opacity:.3; }
#screen-crash .crash-sky.boom #crFill { opacity:.12; }

#screen-crash .cr-sparks { position:absolute; inset:0; pointer-events:none; z-index:2; overflow:hidden; }
#screen-crash .cr-sparks i { position:absolute; left:-2px; top:-2px; width:4px; height:4px; border-radius:50%;
  background:#d6f3ff; box-shadow:0 0 5px #6cc4ff, 0 0 11px #2f7bff; }
#screen-crash .cr-sparks i.lg { left:-3px; top:-3px; width:6px; height:6px; background:#fff; }
