/* ═════════════════ TOWERS — стройка небоскрёба ═════════════════
   Крупные этажи-здания, длинный трос и широкое качание, точная укладка, камера с параллаксом.
   Отдельное пространство имён tb-, анимации — только transform/opacity. */

#screen-towers { padding:0 0 10px; }
.game-card.towers { background:linear-gradient(120deg, #ffcf4d 0%, #f29a2e 55%, #c8601a 100%); }

.tb-stage {
  --fw:168px; --fh:86px; --base-h:112px; --ground:58px;
  position:relative; height:clamp(380px, calc(100dvh - 300px), 640px); overflow:hidden; isolation:isolate;
  contain:layout paint; border-radius:0 0 26px 26px; user-select:none; -webkit-user-select:none;
  box-shadow:0 10px 24px #02122455;
}

/* ── Небо: высокий градиент, уезжает вниз при подъёме (к космосу) ── */
.tb-sky { position:absolute; left:0; right:0; bottom:0; height:calc(100% + 1100px); z-index:-5; will-change:transform;
  background:linear-gradient(to top, #bfe6ff 0, #8fd0ff 380px, #5aa8ef 800px, #2f6fc4 1150px, #17336f 1400px, #0b1638 100%); }
.tb-stars { position:absolute; inset:0 0 auto 0; height:520px; opacity:.9;
  background:
    radial-gradient(1.5px 1.5px at 12% 20%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 30% 60%, #fff 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 55% 35%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 72% 12%, #fff 50%, transparent 51%),
    radial-gradient(2px 2px at 88% 48%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 20% 85%, #fff 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 64% 78%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 42% 8%, #fff 50%, transparent 51%);
  background-size:180px 160px; }
.tb-sun { position:absolute; right:12%; top:9%; width:84px; height:84px; border-radius:50%; z-index:-4; will-change:transform;
  background:radial-gradient(circle, #fffbea 0%, #ffe9a0 38%, #ffd66a55 60%, transparent 72%); }

.tb-clouds { position:absolute; left:0; right:0; bottom:0; height:1400px; z-index:-3; will-change:transform; pointer-events:none; }
.tb-clouds i { position:absolute; border-radius:0; background:center / contain no-repeat; box-shadow:none; animation:tbCloud 70s linear infinite; }
.tb-clouds .c1 { width:250px; height:136px; background-image:url('assets/towers-v2/cloud-2.png?v=1'); bottom:250px; left:52%; animation-duration:80s; animation-delay:-18s; }
.tb-clouds .c2 { width:280px; height:152px; background-image:url('assets/towers-v2/cloud-2.png?v=1'); bottom:620px; left:-30%; animation-duration:75s; animation-delay:-30s; }
.tb-clouds .c3 { width:300px; height:190px; background-image:url('assets/towers-v2/cloud-3.png?v=1'); bottom:340px; left:-8%; animation-duration:90s; animation-delay:-40s; }
.tb-clouds .c4 { width:220px; height:126px; background-image:url('assets/towers-v2/cloud-1.png?v=1'); bottom:980px; left:18%; animation-duration:70s; animation-delay:-12s; }
.tb-clouds .c5 { width:200px; height:114px; background-image:url('assets/towers-v2/cloud-1.png?v=1'); bottom:160px; left:6%; animation-duration:85s; animation-delay:-8s; }
@keyframes tbCloud { to { translate:190vw 0; } }

.tb-hills { position:absolute; left:0; bottom:calc(var(--ground) - 6px); width:100%; height:120px; z-index:-2; will-change:transform; }

/* ── Мир: земля и башня, камера двигает его вниз ── */
.tb-world { position:absolute; inset:0; will-change:transform; }
.tb-ground { position:absolute; left:0; right:0; bottom:0; height:var(--ground); z-index:1;
  background:linear-gradient(#7dd36a 0 9px, #5bb24d 9px 14px, #a26b3d 14px, #7b4c28); box-shadow:0 -2px 0 #9fe486 inset; }
.tb-ground::after { content:""; position:absolute; left:0; right:0; top:100%; height:2000px; background:#7b4c28; }
.tb-palm { position:absolute; bottom:calc(100% - 10px); font-style:normal; font-size:64px; line-height:1; }
.tb-palm::before { content:"🌴"; }
.tb-palm.p1 { left:-6px; } .tb-palm.p2 { right:-4px; font-size:76px; scale:-1 1; }
.tb-bush { position:absolute; bottom:calc(100% - 8px); font-style:normal; font-size:30px; }
.tb-bush::before { content:"🌿"; }
.tb-bush.b1 { left:26%; } .tb-bush.b2 { right:22%; scale:-1 1; }
.tb-dino { position:absolute; bottom:calc(100% - 10px); left:calc(50% - var(--fw) / 2 - 78px); width:72px; z-index:3;
  transform-origin:bottom center; animation:tbDinoIdle 3.4s ease-in-out infinite; }
@keyframes tbDinoIdle { 50% { transform:translateY(-3px) rotate(-2deg); } }
.tb-bricks { position:absolute; bottom:calc(100% - 6px); right:calc(50% - var(--fw) / 2 - 58px); font-style:normal; font-size:26px; z-index:3; }
.tb-bricks::before { content:"🧱🧱"; letter-spacing:-8px; }

.tb-tower { position:absolute; left:50%; bottom:calc(var(--ground) - 4px); width:var(--fw); height:0; translate:-50% 0; z-index:2; }
.tb-tower > .tb-block { position:absolute; left:0; }
.tb-base { position:absolute; left:50%; bottom:0; width:calc(var(--fw) + 24px); height:var(--base-h); translate:-50% 0; border-radius:6px 6px 0 0;
  background:linear-gradient(#4fb3ec, #2b86c9); box-shadow:inset 0 -8px 0 #1f6aa3, 0 4px 0 #0003; }
.tb-base::before { content:""; position:absolute; left:-8px; right:-8px; top:-10px; height:14px; border-radius:5px; background:#e9f6ff; box-shadow:0 3px 0 #9cc9e8; }
.tb-base-sign { position:absolute; left:50%; top:10px; translate:-50% 0; padding:2px 12px; border-radius:6px; font-size:16px; font-weight:900; letter-spacing:3px;
  color:#063a5f; background:linear-gradient(#ffe27a, #f5b52e); box-shadow:0 2px 0 #b07a12; }
.tb-base-awning { position:absolute; left:6px; right:6px; top:40px; height:16px; border-radius:0 0 8px 8px;
  background:repeating-linear-gradient(90deg, #ff6b5a 0 14px, #fff 14px 28px); box-shadow:0 3px 0 #0002; }
.tb-base-door { position:absolute; left:50%; bottom:0; width:34px; height:46px; translate:-50% 0; border-radius:8px 8px 0 0; background:#174d78; box-shadow:inset 0 0 0 3px #e9f6ff; }
.tb-base-win { position:absolute; bottom:12px; width:46px; height:36px; border-radius:5px; background:linear-gradient(#ffe9a8, #ffc85a); box-shadow:inset 0 0 0 3px #e9f6ff; }
.tb-base-win.l { left:12px; } .tb-base-win.r { right:12px; }

/* ── Этажи-здания ── */
.tb-block { position:relative; width:var(--fw); height:var(--fh); border-radius:4px; --frame:#fff; --ledge:#e9eef5;
  box-shadow:inset 0 -7px 0 #0000002b, 0 4px 0 #00000024; }
.tb-block::before { content:""; position:absolute; left:-6px; right:-6px; top:-8px; height:12px; border-radius:5px; background:var(--ledge); box-shadow:0 3px 0 #0002; z-index:1; }
.tb-block .w { position:absolute; top:36%; width:19%; height:40%; border-radius:4px; background:linear-gradient(#fff2c4, #ffcb5c);
  box-shadow:inset 0 0 0 3px var(--frame), inset 0 -6px 0 #e9a53a55; }
.tb-block .w:nth-of-type(1) { left:10%; } .tb-block .w:nth-of-type(2) { left:40.5%; } .tb-block .w:nth-of-type(3) { left:71%; }
.tb-block .sg { position:absolute; left:50%; top:8px; translate:-50% 0; z-index:2; padding:1px 8px; border-radius:5px; white-space:nowrap;
  font-size:11px; font-weight:900; letter-spacing:1.5px; font-style:normal; }
.tb-block .dc { position:absolute; inset:0; pointer-events:none; }

.tb-block.k-hut { --frame:#6e4a22; --ledge:#e3b84f;
  background:repeating-linear-gradient(90deg, #c98d4b 0 11px, #b07535 11px 13px); }
.tb-block.k-hut::before { top:-14px; height:20px; border-radius:10px 10px 4px 4px;
  background:repeating-linear-gradient(100deg, #f0c85e 0 6px, #cf9d36 6px 9px); }
.tb-block.k-hut .w { border-radius:50%; height:36%; background:radial-gradient(circle at 50% 60%, #ffe9a0, #f2a93b); }
.tb-block.k-hut .dc { background:radial-gradient(14px 10px at 8% 8%, #3fae4d 60%, transparent 62%), radial-gradient(12px 9px at 92% 10%, #2f9a40 60%, transparent 62%); }
.tb-block.k-hut .sg { color:#fff; background:#2f9a40; }

.tb-block.k-brick { --frame:#fbe9d6; --ledge:#f2e2cf;
  background:
    repeating-linear-gradient(0deg, #9c3b28 0 2px, transparent 2px 13px),
    repeating-linear-gradient(90deg, #9c3b28 0 2px, transparent 2px 26px),
    linear-gradient(#cf5a3f, #b84a33); }
.tb-block.k-brick .w { border-radius:12px 12px 3px 3px; }
.tb-block.k-brick .dc { background:repeating-linear-gradient(90deg, #2bb3a6 0 13px, #fff 13px 26px) 0 22px / 100% 13px no-repeat; border-radius:0; }
.tb-block.k-brick .sg { color:#7a2414; background:#ffe6c9; }

.tb-block.k-glass { --frame:#bfe2ff; --ledge:#cfd8e3;
  background:linear-gradient(115deg, transparent 0 30%, #ffffff40 30% 38%, transparent 38% 60%, #ffffff26 60% 64%, transparent 64%),
    linear-gradient(#59b6ff, #2a73cf); }
.tb-block.k-glass .w { background:linear-gradient(160deg, #d8f0ff, #7cc4ff); height:44%; top:30%; border-radius:2px; }

.tb-block.k-temple { --frame:#b98a2e; --ledge:#e2b14a;
  background:repeating-linear-gradient(90deg, #f0dfb4 0 14px, #e1c993 14px 18px); }
.tb-block.k-temple::before { top:-22px; height:26px; left:-8px; right:-8px; border-radius:2px; clip-path:polygon(0 100%, 50% 0, 100% 100%);
  background:linear-gradient(#f5c95a, #d89a2b); box-shadow:none; }
.tb-block.k-temple .w { border-radius:20px 20px 2px 2px; background:linear-gradient(#ffd27a, #e98a2a); }
.tb-block.k-temple .dc { background:linear-gradient(90deg, #ff8a3c 0 14px, transparent 14px calc(100% - 14px), #ff8a3c calc(100% - 14px)) 0 4px / 100% 22px no-repeat; }
.tb-block.k-temple .sg { color:#fff6dc; background:#b35a1e; top:10px; }

.tb-block.k-ice { --frame:#ffffff; --ledge:#ffffff;
  background:linear-gradient(#cdeeff, #8acdf2); }
.tb-block.k-ice::before { top:-12px; height:18px; border-radius:12px;
  background:radial-gradient(14px 12px at 15% 70%, #fff 60%, transparent 62%), radial-gradient(18px 14px at 45% 60%, #fff 60%, transparent 62%),
    radial-gradient(14px 12px at 78% 70%, #fff 60%, transparent 62%), linear-gradient(transparent 50%, #fff 50%); box-shadow:none; }
.tb-block.k-ice .dc { background:conic-gradient(from 160deg at 50% 0, #fff 0 40deg, transparent 40deg) 6px 2px / 22px 12px repeat-x; opacity:.9; }
.tb-block.k-ice .w { background:linear-gradient(#e7f7ff, #9fd8ff); }

.tb-block.k-neon { --frame:#ff5fd2; --ledge:#6b4bd6;
  background:linear-gradient(#3a2a6e, #261a4f); }
.tb-block.k-neon .w { background:linear-gradient(#ffd6f5, #c57bff); box-shadow:inset 0 0 0 3px var(--frame), 0 0 10px #ff5fd288; }
.tb-block.k-neon .sg { color:#fff; background:none; font-size:14px; text-shadow:0 0 6px #ff5fd2, 0 0 12px #ff5fd2; top:5px; }

.tb-block.k-fossil { --frame:#7d6a4b; --ledge:#efe2c6;
  background:repeating-linear-gradient(0deg, #bfae8c 0 2px, transparent 2px 20px), linear-gradient(#e2d2ae, #cdb98f); }
.tb-block.k-fossil .w { background:linear-gradient(#4b5d70, #2e3c4b); }
.tb-block.k-fossil .sg { color:#5a4527; background:#fff3d6; }

/* ── Кран: трос из-за кадра, этаж на крюке ── */
.tb-crane { position:absolute; left:50%; top:-170px; width:0; height:0; z-index:6; will-change:transform; }
.tb-rope { position:absolute; left:-1.5px; top:0; width:3px; height:250px; background:linear-gradient(90deg, #3d4d5c, #6f8396 60%, #3d4d5c); }
.tb-hook { position:absolute; left:-11px; top:242px; width:22px; height:14px; border-radius:4px 4px 8px 8px; background:linear-gradient(#ffd25a, #e0a020); box-shadow:0 2px 0 #9a6a10; }
.tb-hanging { position:absolute !important; left:calc(var(--fw) / -2); top:262px; }
.tb-falling { position:absolute; z-index:7; will-change:transform; }

/* пыль при приземлении */
.tb-dust { position:absolute; z-index:3; width:26px; height:26px; border-radius:50%; background:#fff; opacity:0; pointer-events:none; }

/* ── Шкала множителей ── */
.tb-ladder { position:absolute; left:8px; top:22%; height:48%; width:74px; z-index:8; overflow:hidden; pointer-events:none;
  mask-image:linear-gradient(transparent, #000 22%, #000 100%); -webkit-mask-image:linear-gradient(transparent, #000 22%, #000 100%); }
.tb-ladder::before { content:""; position:absolute; left:10px; top:0; bottom:0; width:6px; border-radius:6px; background:#ffffff59; box-shadow:0 0 0 1px #0002; }
.tb-ladder-track { position:absolute; left:0; right:0; bottom:0; transition:transform .7s cubic-bezier(.45,.05,.25,1); }
.tb-rung { position:absolute; left:0; height:40px; display:flex; align-items:center; gap:6px; }
.tb-rung i { width:12px; height:12px; margin-left:7px; border-radius:50%; background:#fff; box-shadow:0 0 0 2px #0003; flex:none; transition:background .4s ease, scale .4s ease; }
.tb-rung b { font-size:14px; font-weight:900; font-style:italic; color:#fff; letter-spacing:-.3px;
  text-shadow:-1.5px -1.5px 0 #10325a, 1.5px -1.5px 0 #10325a, -1.5px 1.5px 0 #10325a, 1.5px 1.5px 0 #10325a; transition:color .4s ease; }
.tb-rung.done i { background:#ffcf3d; }
.tb-rung.next i { background:#3ddc84; scale:1.25; }
.tb-rung.next b { color:#b8ffd6; }

/* ── Множитель ── */
.tb-mult { transition:top .85s cubic-bezier(.45,.05,.25,1), opacity .35s ease; position:absolute; left:50%; top:calc(var(--hang-bottom, 180px) + (var(--top-y, 330px) - var(--hang-bottom, 180px)) * .2); translate:-50% -50%; z-index:8; pointer-events:none; white-space:nowrap;
  font-size:46px; font-weight:900; font-style:italic; color:#fff; letter-spacing:-1px;
  text-shadow:-2px -2px 0 #10325a, 2px -2px 0 #10325a, -2px 2px 0 #10325a, 2px 2px 0 #10325a, 0 5px 0 #10325a, 0 8px 14px #0006; }
.tb-sub { position:absolute; left:50%; top:calc(var(--hang-bottom, 180px) + (var(--top-y, 330px) - var(--hang-bottom, 180px)) * .2 + 30px); translate:-50% 0; z-index:8; pointer-events:none; white-space:nowrap;
  font-size:12px; font-weight:900; color:#fff; padding:3px 10px; border-radius:20px; background:#10325a99; }
.tb-sub:empty { display:none; }
.tb-sub { transition:opacity .35s ease; }

.tb-banner { position:absolute; left:50%; top:44%; translate:-50% -50%; z-index:9; text-align:center; pointer-events:none; white-space:nowrap;
  padding:12px 22px; border-radius:20px; font-size:20px; font-weight:900; color:#fff; box-shadow:0 10px 30px #0007; }
.tb-banner b { display:block; font-size:26px; }
.tb-banner small { display:block; font-size:13px; opacity:.8; }
.tb-banner.win { background:linear-gradient(#2fcf86f2, #149a5ef2); }
.tb-banner.lose { background:linear-gradient(#e2576ef2, #a62a40f2); }

/* ── Панель ── */
.tb-panel { position:relative; margin:-14px 10px 0; padding:10px 10px 12px; z-index:2; border-radius:20px;
  background:linear-gradient(#173a5e, #0d2541); border:1px solid #6fa6d955; box-shadow:0 8px 20px #0006; }
.tb-cash { width:100%; height:42px; border-radius:12px; border:0; font-family:inherit; font-size:15px; font-weight:900; letter-spacing:.5px;
  color:#4a3100; background:linear-gradient(#ffe066, #f5b80f); box-shadow:inset 0 2px #fff5c4, 0 3px #b07a00;
  transition:opacity .35s ease, filter .35s ease, transform .15s ease; }
.tb-cash b { font-size:17px; }
.tb-cash:disabled { opacity:.38; filter:grayscale(.6); }
.tb-cash:active:not(:disabled) { transform:translateY(2px); }
.tb-row { display:grid; grid-template-columns:minmax(0, 1fr) 88px minmax(0, 1fr); align-items:center; gap:8px; margin-top:10px; }
.tb-box { position:relative; height:62px; border-radius:14px; background:#0a1e35; border:1px solid #2f557d; padding:6px 30px 6px 10px;
  display:flex; flex-direction:column; justify-content:center; min-width:0; transition:opacity .3s ease; }
.tb-box.off { opacity:.5; pointer-events:none; }
.tb-lbl { font-size:10px; font-weight:900; letter-spacing:1px; color:#7fa8cf; }
.tb-box input { width:100%; min-width:0; border:0; outline:0; background:none; padding:0; font-family:inherit; font-size:20px; font-weight:900; color:#fff; }
.tb-box > b { font-size:16px; font-weight:900; color:#fff; line-height:1.15; }
.tb-box > small { font-size:11px; font-weight:800; color:#9cc3e6; }
.tb-arrows { position:absolute; right:4px; top:4px; bottom:4px; width:24px; display:flex; flex-direction:column; gap:3px; }
.tb-arrows button { flex:1; border:0; border-radius:7px; background:#1b3a5c; color:#cfe6ff; font-size:9px; padding:0; cursor:pointer;
  transition:background .25s ease; -webkit-tap-highlight-color:transparent; }
.tb-arrows button:active { background:#27507c; }
.tb-go { width:88px; height:88px; margin-top:0; border-radius:50%; border:5px solid #0d2541; cursor:pointer; padding:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; font-family:inherit; color:#fff;
  background:radial-gradient(circle at 50% 35%, #5cf09a, #1fbf63 55%, #12924a); box-shadow:0 0 0 3px #3ddc8455, 0 6px 14px #0007, inset 0 -5px 0 #0c7a3b;
  transition:transform .2s cubic-bezier(.22,.61,.36,1), filter .3s ease; -webkit-tap-highlight-color:transparent; touch-action:none; }
.tb-go b { font-size:15px; font-weight:900; letter-spacing:.5px; text-shadow:0 2px 0 #0a6a33; }
.tb-go small { font-size:9px; font-weight:800; opacity:.85; }
.tb-go:active, .tb-go.held { transform:scale(.95); }
.tb-go.auto { background:radial-gradient(circle at 50% 35%, #ffd76a, #f5a524 55%, #c57a0a); box-shadow:0 0 0 3px #ffcf3d66, 0 6px 14px #0007, inset 0 -5px 0 #8a5600; }
.tb-go.auto b { text-shadow:0 2px 0 #8a5600; }
.tb-go:disabled { filter:grayscale(.5) brightness(.85); }

@media (max-width:360px) { .tb-stage { --fw:150px; --fh:78px; } .tb-mult { font-size:40px; } }
@media (prefers-reduced-motion:reduce) { .tb-clouds i, .tb-dino { animation:none; } .tb-ladder-track { transition:none; } }

/* ═════ Нарисованная графика (assets/games-v1): городок, отель в основании, этажи-фасады ═════ */
.tb-stage { --fw:176px; --fh:59px; --base-h:calc(var(--fw) * .958); --ground:34px; }
.tb-sky { background:linear-gradient(to top, #57aef3 0, #3f97ea 420px, #2a6fca 900px, #17336f 1300px, #0b1638 100%); }
.tb-sun, .tb-hills, .tb-palm, .tb-bush, .tb-bricks { display:none; }
.tb-town { position:absolute; left:50%; bottom:0; width:max(100%, 420px); aspect-ratio:2 / 3; translate:-50% 0; z-index:0; pointer-events:none;
  background:url('assets/games-v1/town.webp?v=3') center bottom / 100% 100% no-repeat;
  mask-image:linear-gradient(transparent 0, #000 22%); -webkit-mask-image:linear-gradient(transparent 0, #000 22%); }
.tb-ground { background:none; box-shadow:none; }
.tb-ground::after { background:linear-gradient(#e2b77d, #c79a62); }
.tb-dino { left:calc(50% - var(--fw) / 2 - 70px); width:66px; bottom:4px; filter:drop-shadow(0 4px 3px #0005); }
/* основание — нижние два этажа отеля из спрайта */
.tb-base { width:var(--fw); height:var(--base-h); border-radius:0; box-shadow:none;
  background:url('assets/games-v1/tower.webp?v=3') no-repeat; background-size:calc(var(--fw) * 1.789) auto;
  background-position:calc(var(--fw) * -.398) calc(var(--fw) * -1.144); filter:drop-shadow(0 6px 6px #0004); }
.tb-base::before, .tb-base > * { display:none; }
/* этаж — фасад 3:1, оттенки для разнообразия */
.tb-block, .tb-block[class*="k-"] { border-radius:0; background:url('assets/games-v1/tower-floor.webp?v=3') center / 100% 100% no-repeat;
  box-shadow:0 3px 4px #0000004d; }
.tb-block::before, .tb-block::after { display:none; }
.tb-block > * { display:none; }
.tb-block.k-teal { filter:hue-rotate(160deg) saturate(.9); }
.tb-block.k-gold { filter:hue-rotate(28deg) brightness(1.08); }
.tb-block.k-violet { filter:hue-rotate(250deg) saturate(.85); }
.tb-block.k-green { filter:hue-rotate(95deg) saturate(.8); }
.tb-block.k-blue { filter:hue-rotate(195deg); }
.tb-hook { top:246px; }

/* Квадратные блоки: каждый — дом из трёх этажей фасада */
.tb-stage { --fw:150px; --fh:150px; }
.tb-block, .tb-block[class*="k-"] { background-size:100% 33.334%; background-repeat:repeat-y; background-position:center top;
  box-shadow:0 4px 6px #00000059, inset 0 -3px 0 #0000002e; }
.tb-rope { height:222px; }
.tb-hook { top:214px; }
.tb-hanging { top:230px; }
@media (max-width:360px) { .tb-stage { --fw:132px; --fh:132px; } }

/* Постамент: первый дом стоит на каменной площадке, на него и кидаем блоки */
.tb-stage { --podium:30px; }
.tb-podium { position:absolute; left:50%; bottom:calc(var(--ground) - 4px); width:calc(var(--fw) * 1.75); height:var(--podium); translate:-50% 0; z-index:2;
  border-radius:6px 6px 0 0; background:
    repeating-linear-gradient(90deg, transparent 0 38px, #a07a4e 38px 40px),
    linear-gradient(#f3d9a8 0 7px, #d9b27a 7px, #b98d58);
  box-shadow:0 -2px 0 #fff1cf inset, 0 6px 10px #0005; }
.tb-podium i { position:absolute; left:8px; right:8px; top:12px; height:2px; background:#a07a4e66; }
.tb-tower { bottom:calc(var(--ground) + var(--podium) - 4px); }
.tb-dino { bottom:calc(var(--podium) - 2px); z-index:3; }

/* ═════ Размеры как в MegaBlock Empire (экран 390×844) ═════
   сцена — вся высота между шапкой и меню; блок 145×140; первый дом ~142×132 на площадке 330×55;
   шкала множителей слева с шагом 64px; множитель 38px; панель лежит поверх сцены внизу. */
#screen-towers { padding:0; }
.tb-stage { --fw:145px; --fh:140px; --ground:160px; --podium:55px; border-radius:0; box-shadow:none; }
.tb-dino { left:calc(50% - var(--fw) / 2 - 64px); bottom:calc(var(--ground) + var(--podium) - 8px); width:60px; }
.tb-ground { overflow:visible; }
.tb-podium { width:min(330px, calc(100% - 30px)); height:var(--podium); border-radius:4px 4px 0 0;
  background:
    repeating-linear-gradient(90deg, transparent 0 46px, #9b7449 46px 48px) 0 16px / 100% 100% no-repeat,
    repeating-linear-gradient(0deg, transparent 0 18px, #9b744966 18px 20px) 0 16px / 100% 100% no-repeat,
    linear-gradient(#f6dfb2 0 12px, #e2bd87 12px 16px, #d4a970 16px, #b88a55);
  box-shadow:0 -2px 0 #fff3d6 inset, 0 8px 12px #0006; }
.tb-podium i { display:none; }

.tb-mult { font-size:38px; top:calc(var(--hang-bottom, 180px) + (var(--top-y, 330px) - var(--hang-bottom, 180px)) * .62); }
.tb-sub { top:calc(var(--hang-bottom, 180px) + (var(--top-y, 330px) - var(--hang-bottom, 180px)) * .62 + 26px); font-size:11px; }
.tb-rope { height:197px; }
.tb-hook { top:189px; }
.tb-hanging { top:205px; }

/* шкала множителей: круглые кнопки сверху и снизу, деления через 64px */
.tb-ladder { left:4px; top:138px; height:332px; width:92px; z-index:8;
  mask-image:linear-gradient(transparent, #000 14%, #000 100%); -webkit-mask-image:linear-gradient(transparent, #000 14%, #000 100%); }
.tb-ladder::before { left:31px; width:8px; background:#ffffff8c; }
.tb-ladder-track { bottom:20px; }
.tb-rung { height:64px; align-items:center; }
.tb-rung i { width:16px; height:16px; margin-left:27px; border:2px solid #9fb6cc; background:#f4f8fc; }
.tb-rung b { position:absolute; left:4px; top:8px; font-size:17px;
  text-shadow:-2px -2px 0 #10325a, 2px -2px 0 #10325a, -2px 2px 0 #10325a, 2px 2px 0 #10325a, 0 3px 0 #10325a; }
.tb-rung.done i { background:#ffcf3d; border-color:#fff3c4; }
.tb-rung.next i { background:#3ddc84; border-color:#d6ffe8; }
.tb-lad-btn { position:absolute; left:17px; width:38px; height:38px; z-index:9; border-radius:50%; pointer-events:none;
  background:#c9d6e3e6; box-shadow:inset 0 0 0 2px #fff, 0 2px 4px #0004; }
.tb-lad-btn::after { content:""; position:absolute; left:50%; top:50%; width:10px; height:10px; translate:-50% -30%; rotate:45deg;
  border-left:3px solid #fff; border-top:3px solid #fff; }
.tb-lad-btn.up { top:100px; }
.tb-lad-btn.down { top:468px; }
.tb-lad-btn.down::after { rotate:225deg; translate:-50% -70%; }

/* панель поверх сцены */
.tb-panel { position:absolute; left:8px; right:8px; bottom:10px; margin:0; z-index:10; padding:6px; border-radius:14px;
  background:#121a28e6; border:1px solid #ffffff1f; box-shadow:0 6px 18px #0007; }
.tb-cash { height:36px; border-radius:9px; font-size:14px; }
.tb-cash b { font-size:15px; }
.tb-row { grid-template-columns:minmax(0, 1fr) 76px minmax(0, 1fr); gap:6px; margin-top:6px; }
.tb-box { height:56px; border-radius:10px; background:#1d2636; border-color:#ffffff14; padding:5px 28px 5px 10px; }
.tb-box input { font-size:18px; }
.tb-box > b { font-size:15px; }
.tb-go { width:76px; height:76px; margin:-10px 0 -10px; border:4px solid #0f1622;
  box-shadow:0 0 0 3px #ffffffcc, 0 6px 14px #0008, inset 0 -5px 0 #0c7a3b; }
.tb-go b { font-size:12px; }
.tb-go small { font-size:8px; }
.tb-go.auto { box-shadow:0 0 0 3px #ffffffcc, 0 6px 14px #0008, inset 0 -5px 0 #8a5600; }
.tb-banner { top:40%; }
@media (max-width:360px) { .tb-stage { --fw:130px; --fh:126px; } }

/* City construction: distinct shop facades, stone foundation and compact controls. */
.tb-block, .tb-block[class*="k-"] {
  background:url('assets/towers-city/coral.svg') center / 100% 100% no-repeat;
  filter:none; border-radius:2px;
  box-shadow:0 3px 3px #10263255;
}
.tb-block.k-teal { background-image:url('assets/towers-city/teal.svg'); }
.tb-block.k-gold { background-image:url('assets/towers-city/gold.svg'); }
.tb-block.k-violet { background-image:url('assets/towers-city/violet.svg'); }
.tb-block.k-green { background-image:url('assets/towers-city/green.svg'); }
.tb-block.k-blue { background-image:url('assets/towers-city/blue.svg'); }
.tb-base { height:112px; width:var(--fw); background:linear-gradient(90deg,#bd9b6f,#f0d6a4 45%,#ceb27e); border-radius:2px; filter:none; box-shadow:inset -5px 0 #0002; }
.tb-base > * { display:block; }
.tb-base::before { display:block; height:8px; top:-5px; left:-4px; right:-4px; border-radius:1px; background:#f8e6c3; box-shadow:0 3px #8e744f; }
.tb-base-sign { top:8px; font-size:12px; letter-spacing:2px; background:#254339; color:#fff1c4; border:2px solid #c99c54; border-radius:2px; box-shadow:0 2px #0003; }
.tb-base-awning { top:35px; left:4px; right:4px; height:15px; background:repeating-linear-gradient(90deg,#bc4938 0 12px,#fff1d4 12px 24px); border-radius:0 0 3px 3px; }
.tb-base-door { width:30px; height:54px; border-radius:2px 2px 0 0; background:linear-gradient(90deg,#193736,#37625a); box-shadow:inset 0 0 0 3px #886944; }
.tb-base-win { width:34px; bottom:16px; height:36px; background:linear-gradient(135deg,#557574,#172f35); border-radius:1px; box-shadow:inset 0 0 0 3px #fff0d0; }
.tb-base-win.l { left:10px; } .tb-base-win.r { right:10px; }
.tb-dino { display:none; }
.tb-town { filter:saturate(.75); }
.tb-podium { background:repeating-linear-gradient(90deg,transparent 0 46px,#75878355 46px 48px),linear-gradient(#e7e4ce 0 10px,#a3b1a5 10px 14px,#8a9b91 14px,#647b76); box-shadow:0 3px 0 #405853,0 8px 12px #0003; }
.tb-panel { background:#262a29f5; border-color:#c1c3a944; border-radius:12px; box-shadow:0 5px 16px #0005; }
.tb-box { background:#353a36; border-color:#ffffff18; }
.tb-lbl { color:#aeb5a1; }
.tb-arrows button { background:#494e44; color:#e5e7d3; }
.tb-cash { background:linear-gradient(#f9db5b,#dfb630); color:#3e3518; box-shadow:inset 0 1px #fff7b4,0 2px #8c711c; }
.tb-cash:disabled { opacity:.5; filter:none; }
.tb-go { border-color:#adb7a1; background:radial-gradient(circle at 40% 25%,#98c956,#58952f 65%,#397822); box-shadow:0 0 0 2px #4a613a,0 4px 7px #0005,inset 0 2px 2px #dbf2a9; }
.tb-go b { text-shadow:0 2px #345720; }
.tb-mult { color:#fff7dc; text-shadow:0 3px 0 #36576a,-1px -1px #36576a,1px -1px #36576a,0 5px 8px #19344166; }
.tb-lad-btn { background:#dce6d7cc; width:30px; height:30px; left:21px; box-shadow:inset 0 0 0 2px #fff9,0 2px 3px #26453855; }
.tb-ladder::before { width:5px; background:#e7edddaa; }
.tb-rung i { width:13px; height:13px; margin-left:28px; }

/* Generated illustrated city and eight individually painted building modules. */
.game-card.towers { background:linear-gradient(105deg,#183f58ed,#36798cb3),url('assets/towers-v2/city.webp?v=4') center 70% / cover; }
.gc-towers { color:transparent !important; height:110px; width:100px; background:url('assets/towers-v2/hotel.webp?v=4') center / contain no-repeat; }
.tb-stage { background:#3f97ea; }
.tb-sky, .tb-clouds, .tb-sun { visibility:visible; }
.tb-hills { visibility:hidden; }
.tb-town { visibility:visible; left:0; width:100%; height:125%; bottom:-8%; aspect-ratio:auto; translate:none;
  background:url('assets/towers-v2/city.webp?v=4') center bottom / cover no-repeat;
  mask-image:linear-gradient(transparent 0, #000 26%); -webkit-mask-image:linear-gradient(transparent 0, #000 26%); }
.tb-block, .tb-block[class*="k-"] {
  background:url('assets/towers-v2/cafe.webp?v=4') center / 100% 100% no-repeat;
  box-shadow:none; border-radius:0; filter:drop-shadow(0 3px 2px #26352d40);
}
.tb-block.k-bank { background-image:url('assets/towers-v2/bank.webp?v=4'); }
.tb-block.k-hotel { background-image:url('assets/towers-v2/hotel.webp?v=4'); }
.tb-block.k-books { background-image:url('assets/towers-v2/books.webp?v=4'); }
.tb-block.k-garden { background-image:url('assets/towers-v2/garden.webp?v=4'); }
.tb-block.k-bakery { background-image:url('assets/towers-v2/bakery.webp?v=4'); }
.tb-block.k-studio { background-image:url('assets/towers-v2/studio.webp?v=4'); }
.tb-block.k-palace { background-image:url('assets/towers-v2/palace.webp?v=4'); }
.tb-base { height:var(--fh); background:url('assets/towers-v2/bakery.webp?v=4') center / 100% 100% no-repeat; box-shadow:none; }
.tb-base::before, .tb-base > * { display:none; }
.tb-mult { text-shadow:0 3px 0 #284859,-1px -1px #284859,1px -1px #284859,0 5px 8px #19344166; }

/* Readable jewel-like multiplier badges against the illustrated city. */
.tb-mult {
  padding:3px 20px 6px; min-width:132px; text-align:center;
  font-size:40px; line-height:1.12; font-style:normal; letter-spacing:-1px;
  font-variant-numeric:tabular-nums; color:#ffe79a;
  background:linear-gradient(160deg,#294c59f5,#142b39f5 65%);
  border:1px solid #f2d68a; border-radius:16px;
  box-shadow:inset 0 2px 0 #ffffff24,inset 0 -3px 0 #091c2f,0 3px 0 #94703d,0 7px 16px #12304740;
  text-shadow:0 1px 0 #fff1c455,0 3px 0 #835423,0 5px 6px #0006;
}
.tb-sub {
  margin-top:7px; padding:4px 11px; border:1px solid #fff3;
  color:#eaf6ff; background:#193b50ed; box-shadow:0 2px 6px #163e4d26;
  font-size:10px; font-weight:800; letter-spacing:.1px;
}
.tb-rung b {
  left:2px; top:3px; min-width:65px; padding:4px 6px;
  border:1px solid #e1edf475; border-radius:8px;
  background:linear-gradient(145deg,#34566aec,#19364aef);
  color:#eef8ff; font-size:13px; font-style:normal; line-height:1.1;
  letter-spacing:0; text-align:center; font-variant-numeric:tabular-nums;
  text-shadow:0 1px 2px #071e32; box-shadow:inset 0 1px #ffffff20,0 2px 3px #18384d40;
}
.tb-rung.done b {
  color:#ffecae; border-color:#d9ba6c; background:linear-gradient(145deg,#665533f5,#423b2bf5);
}
.tb-rung.next b {
  color:#f0ffda; border-color:#d0e798; background:linear-gradient(145deg,#6d983ef5,#365e35f5);
  box-shadow:inset 0 1px #efffc950,0 2px 0 #244929,0 0 10px #c4f18a35;
}
.tb-rung i { margin-top:14px; }
@media(max-width:360px) { .tb-mult { font-size:34px; min-width:118px; padding-inline:14px; } }

/* ═════ Адаптация под телефон: размеры приходят из tbFit() через переменные ═════ */
.tb-rope { height:calc(var(--rope, 205px) - 8px); }
.tb-hook { top:calc(var(--rope, 205px) - 16px); }
.tb-hanging { top:var(--rope, 205px); }
.tb-ladder { top:var(--lad-top, 138px); height:var(--lad-h, 332px); }
.tb-lad-btn.up { top:calc(var(--lad-top, 138px) - 36px); }
.tb-lad-btn.down { top:calc(var(--lad-top, 138px) + var(--lad-h, 332px) + 10px); }
.tb-rung { height:var(--rung, 64px); }
.tb-podium { height:var(--podium, 55px); }
.tb-mult { font-size:var(--mult-size, 40px);
  top:calc(var(--hang-bottom, 180px) + (var(--top-y, 330px) - var(--hang-bottom, 180px)) * .4); }
.tb-sub { top:calc(var(--hang-bottom, 180px) + (var(--top-y, 330px) - var(--hang-bottom, 180px)) * .4 + var(--mult-size, 40px) * .72); }
.tb-stage.tb-compact .tb-mult { min-width:0; padding:2px 14px 4px; border-radius:12px; }
.tb-stage.tb-compact .tb-sub { font-size:9px; padding:3px 9px; }
.tb-stage.tb-compact .tb-rung b { font-size:11px; min-width:54px; padding:3px 5px; }
.tb-stage.tb-compact .tb-ladder { width:78px; }
.tb-stage.tb-compact .tb-cash { height:32px; font-size:13px; }
.tb-stage.tb-compact .tb-box { height:50px; }
.tb-stage.tb-compact .tb-go { width:68px; height:68px; }
.tb-stage.tb-compact .tb-row { grid-template-columns:minmax(0, 1fr) 68px minmax(0, 1fr); }
.tb-stage.tb-compact .tb-banner { font-size:15px; padding:8px 16px; }
.tb-stage.tb-compact .tb-banner b { font-size:20px; }
@media (max-width:360px) { .tb-box { padding:5px 26px 5px 8px; } .tb-box input { font-size:16px; } .tb-box > b { font-size:13px; } .tb-lbl { font-size:9px; } }
@media (max-width:340px) { #tbModeSub { display:none; } }

/* Множитель по центру экрана убран — текущий и следующие иксы видны на шкале слева и на кнопке «Забрать» */
.tb-mult, .tb-sub { display:none !important; }

/* Падающий дом без тяжёлых фильтров — плавнее на телефонах */
.tb-falling { filter:none !important; will-change:transform; backface-visibility:hidden; }
