/* Neon Arcade — visual layer, shared by AD and no AD builds. */
:root { --bg-dark:#080e29; --bg-panel:#151c46; --text-light:#f7f5ff; --text-muted:#b4bce0; --color-accent:#ff617f; --radius-md:16px; --radius-lg:24px; }
body { background:radial-gradient(ellipse at 50% 35%,#151d49,#050819 70%); }
#app { background:transparent; position:relative; z-index:1; }
:root { --cloud-filter:brightness(1.08); }

#decor-layer { opacity:.23; }
.screen { background:transparent; }
.screen:not(#screen-mainmenu):not(#screen-game):not(#screen-loading):not(#screen-splash) { background:transparent; }
button { transition:transform .16s ease,filter .16s ease,box-shadow .16s ease; }
button:focus-visible,.switch input:focus-visible + .switch-track { outline:3px solid #90eaff; outline-offset:4px; }
button:disabled { cursor:not-allowed; }
.neon-icon { width:36px;height:36px;flex:none;overflow:visible;filter:drop-shadow(0 2px 2px #03082680);pointer-events:none; }
.btn { font-weight:800;border-radius:16px;padding:13px 16px;color:#fff; }
.btn-primary { background:linear-gradient(145deg,#ff947b,#ff4475 62%,#df2b83);color:#fff;border:1px solid #ffd7d5;box-shadow:inset 0 2px 1px #ffffff80,inset 0 -4px 2px #b11b6150,0 5px 0 #961850,0 0 24px #ff467e30; }
.btn-secondary,.btn-icon,.btn-buy { background:linear-gradient(145deg,#2e3679,#151c49);border:1px solid #718ada88;color:#fff;box-shadow:inset 0 1px 1px #bbcfff30,0 4px 12px #02061955; }
.btn-ghost,.screen .btn-ghost { background:#101739d9;border-color:#5367a577;color:#cdd4f3; }
.btn-danger {color:#ff879d!important;}
.btn-icon { border-radius:14px;width:44px;height:44px;min-height:44px; }
.btn-icon .neon-icon {width:29px;height:29px;}
.menu-top {display:flex;align-items:center;gap:10px;padding:19px 22px 0;flex:none;}
.currency-bar { padding:12px 22px;gap:12px;justify-content:flex-start; }
.menu-top .currency-bar { flex:1;padding:0;min-width:0; }
.currency-pill {background:linear-gradient(135deg,#242e68e8,#101632ed);border:1px solid #657ec078;border-radius:30px;padding:5px 13px 5px 5px;gap:8px;font-size:17px;box-shadow:inset 0 1px 0 #b0caff30;min-width:72px;}
.icon-currency { width:29px;height:29px; }
.menu-settings {margin-left:auto;}
#screen-mainmenu { overflow-y:auto; }
.menu-logo-zone { padding:12px 2px 0;flex:1;min-height:180px; }
.logo-small {width:100%;max-width:500px;}
.logo-small .logo-image {max-width:none;width:100%;filter:drop-shadow(0 10px 20px #05082644);}
.logo-wrap {margin:0;}
.menu-buttons {align-items:stretch;padding:0 26px 10px;gap:15px;flex:none;}
.btn-play {width:100%;min-height:82px;display:flex;align-items:center;justify-content:center;gap:20px;border-radius:25px;font-size:33px;letter-spacing:1px;text-shadow:0 3px 0 #c53166;}
.btn-play .neon-icon {width:43px;height:43px;}
.menu-tile-row { display:grid;grid-template-columns:1fr 1fr;gap:13px; }
.menu-tile {display:flex;align-items:center;justify-content:center;gap:10px;min-height:78px;font-size:18px;box-shadow:inset 0 1px 2px #ffffff30,0 5px 12px #01051570;background:linear-gradient(135deg,#2b3885,#161c51);border:1px solid #567fd1;}
.menu-tile--scores {background:linear-gradient(135deg,#423572,#1c2050);border-color:#ba9868;}
.menu-tile .neon-icon {width:39px;height:39px;}
.menu-challenge {display:flex;align-items:center;gap:12px;min-height:99px;text-align:left;padding:13px 17px;background:linear-gradient(110deg,#493075e8,#19184ad9),url('../assets/images/neon-clouds.webp?v=0.2.16') center 92% / cover;border:1px solid #c581f0;box-shadow:inset 0 1px 0 #e5b9ff40,0 4px 15px #05061c80;}
.menu-challenge>.neon-icon {width:48px;height:48px;filter:drop-shadow(0 0 9px #ffb42570);}
.menu-challenge strong {font-size:17px;letter-spacing:.6px;display:block;line-height:1.25;}
.menu-challenge small {display:block;color:#d5c7ee;font-size:13px;font-weight:600;margin-top:6px;}
.challenge-arrow {font:32px/1 sans-serif;margin-left:auto;color:#debaff;}
.menu-footer {padding:7px 0 12px;font:10px/1.3 'Segoe UI',sans-serif;letter-spacing:1.5px;color:#909cc9;flex:none;}
.screen-header {padding:20px 22px 14px;gap:14px;}
.screen-title {font-size:27px;letter-spacing:.3px;}
.screen-content {padding:8px 22px 26px;scrollbar-width:thin;scrollbar-color:#465fa0 transparent;}
.btn-menu-size {width:100%;max-width:390px;min-height:48px;}
.setting-row,.shop-item,.stat-row,.lb-row,.achievement-row,.challenge-card {background:linear-gradient(125deg,#20295be8,#111837f0);border:1px solid #687ebb4d;border-radius:18px;box-shadow:inset 0 1px 0 #c1d1ff12,0 4px 12px #03072030;}
.setting-row {padding:17px 19px;}
.switch-track {background:#080d25;border:1px solid #516799;box-shadow:inset 0 2px 4px #0008;}
.switch input:checked + .switch-track {background:linear-gradient(90deg,#5771fd,#9c5afe);}
.switch-thumb {background:linear-gradient(#fff,#c9d2f6);box-shadow:0 1px 4px #0008;}
.shop-item {padding:14px 12px;gap:12px;}
.shop-item-info {flex:1;min-width:0;}
.shop-item-info h4 {font-size:16px;}
.shop-item-info p {line-height:1.5;}
.shop-preview {width:54px;height:58px;display:grid;place-items:center;flex:none;}
.shop-preview .neon-icon {width:45px;height:45px;}
.shop-preview img {width:52px;height:52px;object-fit:contain;}
.preview-bg {width:45px;height:48px;border-radius:10px;border:1px solid #93adf077;background:url('../assets/images/neon-clouds.webp?v=0.2.16') center / cover;}
.preview-bg--sunset {background:linear-gradient(#ff9980,#62458f,#191639);}
.preview-bg--aurora {background:linear-gradient(125deg,#081e35,#1d9a92,#8e5bc5);}
.preview-bg--ocean {background:linear-gradient(#1487b9,#052439);}
.btn-buy {flex:none;border-radius:12px;padding:9px 10px;min-height:43px;display:flex;align-items:center;gap:5px;}
.btn-buy:disabled {opacity:.5;}
.instructions-section-title {color:#cad5ff;font-size:15px;letter-spacing:.6px;margin-top:25px;}
.tabs {gap:7px;}
.tab-btn {background:#111938;border:1px solid #56699c65;color:#b9c4e8;border-radius:12px;}
.tab-btn.active {background:linear-gradient(135deg,#6e5ae6,#3b5fce);border:1px solid #c5bcff;color:#fff;box-shadow:0 0 14px #725eee30;}
.screen .tab-btn:not(.active) {background:#111938;}
.achievement-icon {border:1px solid #798ac565;background:linear-gradient(145deg,#353665,#192443);border-radius:13px;}
.achievement-row--claimable {border-color:#e7b768;}
.achievement-progress {background:#070c23;}
.achievement-progress-fill {background:linear-gradient(90deg,#537ff8,#aa70ef);}
.game-hud {display:grid;grid-template-columns:1fr auto 44px;gap:14px;padding:18px 22px 8px;align-items:start;min-height:96px;}
.hud-pause {grid-column:3;grid-row:1;}
.hud-center {grid-column:1;grid-row:1;align-items:flex-start;gap:0;}
.hud-caption {font:700 11px/1.4 'Segoe UI',sans-serif;letter-spacing:2px;color:#bec9ef;}
.hud-score {font:800 31px/1.2 'Segoe UI',sans-serif;text-shadow:0 0 18px #acb8ff35;}
.hud-combo {margin-top:7px;font-size:12px;color:#ffdf78;min-height:16px;}
.hud-combo:not(:empty) {padding:2px 10px;border:1px solid #bca16c70;background:#151935;border-radius:20px;}
.hud-right {grid-column:2;grid-row:1;padding-top:6px;}
.hud-lives {font-size:25px;gap:4px;filter:drop-shadow(0 0 5px #f5406660);}
.life-heart--on {color:#ff5c7b;text-shadow:0 1px 0 #ffbec8,0 3px 0 #a02356;}
.game-play-area {min-height:0;}
.game-bins-row {padding:9px 13px 14px;gap:4px;background:transparent;align-items:flex-end;}
.bin-btn {aspect-ratio:384/340;max-width:120px;min-height:44px;}
.bin-img {filter:drop-shadow(0 6px 8px #05071c80);}
.bin-btn::before {content:'';position:absolute;inset:auto 8% -4px;height:10px;border-radius:50%;background:var(--bin-fallback-color,#669cff);opacity:.23;filter:blur(8px);pointer-events:none;}
.game-powerups {justify-content:center;gap:14px;padding:10px 28px calc(18px + var(--safe-bottom));}
.powerup-btn {position:relative;flex:1;max-width:106px;min-height:74px;flex-direction:column;gap:3px;padding:8px 5px;background:linear-gradient(145deg,#273a79,#111a43);border:1px solid #7293dd;border-radius:17px;box-shadow:inset 0 1px 1px #c1dbff40,0 3px 9px #01051a65;}
.powerup-btn>.neon-icon {width:34px;height:34px;}
.powerup-label {font:700 10px/1.3 'Segoe UI',sans-serif;letter-spacing:.5px;text-transform:uppercase;color:#bdcff6;}
.powerup-count {position:absolute;right:-5px;bottom:12px;background:#102b5b;border:1px solid #8cceff;color:#fff;min-width:21px;height:21px;font-size:12px;}
.powerup-btn:disabled {opacity:.45;filter:saturate(.7);}
.falling-ball {border:none;box-shadow:none;border-radius:50%;filter:drop-shadow(0 0 5px var(--ball-color,#8f7dff));}
.falling-ball::after {content:'';position:absolute;width:5px;height:28px;bottom:91%;left:calc(50% - 2px);background:linear-gradient(transparent,var(--ball-color,#a3bdff));opacity:.35;border-radius:50%;pointer-events:none;}
.falling-ball--bomb,.falling-ball--heart,.falling-ball--frozen {display:flex;align-items:center;justify-content:center;}
.hazard-symbol {width:25px;height:25px;z-index:2;filter:drop-shadow(0 2px 2px #081127);}
.falling-ball--bomb {border:1px solid #ff8ba4;box-shadow:0 0 7px #f9467160;}
.falling-ball--frozen {border:2px solid #c4f8ff;border-radius:34%;box-shadow:inset 0 0 14px #d4f9ffcc,0 0 9px #8ceeff80;}
.falling-ball--frozen::before {border-radius:28%;background:linear-gradient(145deg,#c6ffff77,transparent,#8cdfff88);}
.falling-ball--rainbow {border:1px solid #fff5;box-shadow:0 0 5px #f5a5ff70;}
/* The changing colour remains visible: the rainbow effect is only on the rim. */
.falling-ball--rainbow::before {content:'';position:absolute;inset:-3px;border-radius:50%;border:2px dashed #fff7;animation:rainbowOrbit 3s linear infinite;pointer-events:none;}
@keyframes rainbowOrbit {to{transform:rotate(360deg);}}
.falling-ball--heart {border:none;}
.ball-symbol {top:-6px;right:-6px;background:#071228;border-color:#d4f6ff;}
.mini-ball,.logo-ball,.decor-ball {border:1px solid #ffffff70;box-shadow:inset 3px 4px 5px #fff5,inset -4px -5px 7px #0005,0 0 9px #788bf033;}
.storm-banner {background:#0d1535da;border:1px solid #e8b64c66;border-radius:16px;padding:9px 15px;left:50%;right:auto;transform:translateX(-50%);width:max-content;max-width:88%;}
.storm-banner-title {font-size:17px;letter-spacing:1px;}
.storm-banner--active {animation:none;color:#ff8797;border-color:#ff6075;}
.overlay {background:#03071bbb;backdrop-filter:blur(9px);padding:16px;overflow-y:auto;}
.overlay-panel {width:100%;max-width:390px;padding:25px 23px;background:linear-gradient(145deg,#262659f5,#101832fa);border:1px solid #948bdf99;box-shadow:inset 0 1px 0 #caccff30,0 20px 70px #0009,0 0 30px #6254bd22;border-radius:26px;}
.overlay-panel h2 {font-size:28px;color:#f3efff;}
.overlay-panel .btn {min-height:46px;}
.difficulty-btn {background:linear-gradient(120deg,#303462,#191e43);border:1px solid #6578b370;color:#fff;}
.difficulty-btn--current {background:linear-gradient(120deg,#4a3c7b,#243d70);border:1px solid #b4a9ff;box-shadow:0 0 12px #a17eff30;}
.difficulty-btn-desc {color:#c4c9e4;}
.result-score {font-size:29px;color:#fff;}
.result-reward {font-size:19px;}
.tutorial-hint {background:linear-gradient(120deg,#252d5cf0,#141c41f5);border:1px solid #8799d690;color:#f5f5ff;box-shadow:0 6px 20px #0005;}
.achievement-toast {background:linear-gradient(135deg,#2a2c60,#101a39);border:1px solid #b5a47e;color:#fff;}
.achievement-toast-icon .neon-icon {width:32px;height:32px;}
@media (min-width:700px) { #app {height:100%;max-height:none;max-width:480px;border-radius:0;box-shadow:none;} }
@media (max-width:380px) { .menu-top{padding:14px 16px 0;gap:7px;}.currency-pill{font-size:15px;padding-right:10px;min-width:60px;}.menu-top .currency-bar{gap:8px;}.menu-buttons{padding:0 17px 8px;gap:12px;}.btn-play{min-height:71px;font-size:29px;}.menu-tile{font-size:15px;gap:7px;min-height:65px;}.menu-tile .neon-icon{width:32px;height:32px;}.menu-challenge{min-height:86px;padding:12px;gap:9px;}.menu-challenge strong{font-size:14px;}.menu-challenge small{font-size:11px;}.menu-challenge>.neon-icon{width:38px;height:38px;}.game-hud{padding:14px 16px 8px;gap:10px;}.hud-score{font-size:27px;}.hud-lives{font-size:22px;}.screen-content{padding:8px 15px 20px;}.shop-preview{width:40px;}.shop-preview img{width:40px;}.shop-item{gap:8px;}.shop-item-info h4{font-size:14px;} }
@media (max-height:700px) { .menu-logo-zone{min-height:130px;}.menu-logo-zone .logo-image{max-height:100%;object-fit:contain;}.btn-play{min-height:64px;padding:10px;font-size:28px;}.menu-tile{min-height:60px;}.menu-challenge{min-height:77px;}.menu-buttons{gap:12px;}.game-hud{min-height:82px;padding-top:12px;}.game-powerups{padding-top:7px;padding-bottom:10px;}.powerup-btn{min-height:64px;}.overlay-panel{padding:20px;gap:10px;}.difficulty-btn{padding:10px 12px;} }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;} }
.menu-tile {padding:12px;gap:9px;font-size:16px;}
.menu-tile .neon-icon {width:34px;height:34px;}
.menu-tile span {white-space:nowrap;}
@media(max-width:350px){.menu-tile{font-size:13px;gap:7px;padding:10px;}.menu-tile .neon-icon{width:29px;height:29px;}}

/* 0.2.1: reference-matched soft 3D icons and visible cloud banks. */
img.neon-icon {display:inline-block;object-fit:contain;vertical-align:middle;}
.icon-currency {width:33px;height:33px;}
.life-heart {width:25px;height:25px;filter:drop-shadow(0 1px 3px #fb49744d);}
.life-heart--off {opacity:.24;filter:grayscale(1);}
.hud-lives {align-items:center;gap:2px;}
.achievement-icon {width:44px;height:44px;background:linear-gradient(145deg,#252d59,#131b3d);}
.achievement-icon .neon-icon {width:34px;height:34px;}
.achievement-row--unlocked .achievement-icon {background:linear-gradient(145deg,#504374,#282f56);}
.rotate-icon .neon-icon {width:56px;height:56px;}
.mini-ball {display:inline-flex;align-items:center;justify-content:center;}
.mini-ball .neon-icon {width:17px;height:17px;}
.menu-challenge .challenge-arrow {width:22px;height:22px;transform:rotate(180deg);margin-left:auto;}
.powerup-btn>.neon-icon {width:40px;height:40px;}
.shop-preview .neon-icon {width:49px;height:49px;}
.menu-tile .neon-icon {width:39px;height:39px;}
.btn-icon .neon-icon {width:32px;height:32px;}
.menu-challenge>.neon-icon:first-child {width:51px;height:51px;}
@media(max-width:380px){.icon-currency{width:29px;height:29px;}.menu-tile .neon-icon{width:33px;height:33px;}.menu-challenge>.neon-icon:first-child{width:39px;height:39px;}.life-heart{width:23px;height:23px;}}
@media(max-width:350px){.menu-tile .neon-icon{width:29px;height:29px;}}

/* Permanent cloud artwork: static base + two slowly drifting layers (back = slower, front = a bit faster).
   Colour theme filters affect these layers only, never UI, balls or bins. */
#cloud-bg { position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden; contain:strict; }
#cloud-bg .cloud-base { position:absolute; inset:0; background:url('../assets/images/neon-clouds.webp?v=0.2.16') center / 100% 100% no-repeat; filter:var(--cloud-filter); }
#cloud-bg .cloud-layer { position:absolute; top:0; bottom:0; left:0; width:200%; background-repeat:repeat-x; background-position:0 0; background-size:calc(50% / var(--cloud-tiles,1)) 100%; filter:var(--cloud-filter); will-change:transform; backface-visibility:hidden; animation:cloudDrift var(--cloud-dur) linear infinite; }
#cloud-bg .cloud-layer--back { background-image:url('../assets/images/cloud-back.webp?v=0.2.16'); opacity:.30; --cloud-dur:190s; }
#cloud-bg .cloud-layer--front { background-image:url('../assets/images/cloud-front.webp?v=0.2.16'); opacity:.40; --cloud-dur:115s; }
@keyframes cloudDrift { from { transform:translate3d(0,0,0); } to { transform:translate3d(-50%,0,0); } }
/* pause / hidden tab -> animation holds its position. */
body.bg-paused #cloud-bg .cloud-layer { animation-play-state:paused !important; }
@media (prefers-reduced-motion:reduce) { #cloud-bg .cloud-layer { animation-duration:var(--cloud-dur) !important; animation-iteration-count:infinite !important; } } /* obláčiky sa hýbu vždy (veľmi pomaly) */
body.theme-bg--space { --cloud-filter:hue-rotate(14deg) saturate(1.1) brightness(.8); }
body.theme-bg--sunset { --cloud-filter:hue-rotate(95deg) saturate(.4) brightness(1.3); }
body.theme-bg--aurora { --cloud-filter:hue-rotate(-75deg) saturate(1.12) brightness(1.08); }
body.theme-bg--ocean { --cloud-filter:hue-rotate(-28deg) saturate(1.12) brightness(1.08); }
.preview-bg,.preview-bg--sunset,.preview-bg--aurora,.preview-bg--ocean { background:url('../assets/images/neon-clouds.webp?v=0.2.16') center / cover; }
.preview-bg--space {filter:hue-rotate(14deg) saturate(1.1) brightness(.8);}
.preview-bg--sunset {filter:hue-rotate(95deg) saturate(.4) brightness(1.3);}
.preview-bg--aurora {filter:hue-rotate(-75deg) saturate(1.12) brightness(1.08);}
.preview-bg--ocean {filter:hue-rotate(-28deg) saturate(1.12) brightness(1.08);}

/* Kombo ukazovateľ v HUD: séria, násobič a postup k ďalšiemu stupňu. */
.hud-combo:not(:empty) {display:flex;flex-direction:column;align-items:stretch;gap:3px;padding:4px 10px 5px;min-width:112px;max-width:150px;}
.hud-combo .combo-line {display:flex;align-items:baseline;justify-content:space-between;gap:8px;}
.hud-combo .combo-label {font-weight:800;letter-spacing:.6px;color:#ffdf78;}
.hud-combo .combo-mult {font-weight:800;font-size:14px;color:#cfd6f5;}
.hud-combo .combo-mult--on {color:#ff9fb2;text-shadow:0 0 8px #ff617f90;}
.hud-combo .combo-bar {display:block;height:4px;border-radius:3px;background:#070c23;overflow:hidden;}
.hud-combo .combo-bar i {display:block;height:100%;border-radius:3px;background:linear-gradient(90deg,#ffdf78,#ff7a9b);transition:width .18s ease-out;}
.hud-combo .combo-next {font-size:10px;color:#aab4dc;letter-spacing:.3px;}
.hud-combo--bump {animation:comboBump .45s ease-out;}
@keyframes comboBump {0%{transform:scale(1);}35%{transform:scale(1.14);box-shadow:0 0 14px #ffdf7890;}100%{transform:scale(1);}}
.result-combo {margin:0;color:#ffdf78;font-weight:700;}

/* ===== Výsledková obrazovka (Game over) ===== */
.result-panel {gap:10px;align-items:stretch;text-align:center;max-height:100%;}
.result-head {display:flex;align-items:center;justify-content:space-between;gap:10px;}
.result-head h2 {margin:0;font-size:22px;letter-spacing:1.5px;color:#cdd4f7;}
.result-mode {font-size:12px;font-weight:800;letter-spacing:.8px;padding:3px 10px;border-radius:12px;background:#111a43;border:1px solid #7288d8aa;color:#cfe0ff;}
.result-hero {position:relative;display:flex;flex-direction:column;align-items:center;gap:0;padding:6px 0 4px;}
.result-score-label {font:700 11px/1.4 'Segoe UI',sans-serif;letter-spacing:3px;color:#aab4dc;}
.result-score {font-size:58px;line-height:1.05;font-weight:800;color:#fff;text-shadow:0 0 22px #a9b8ff55,0 3px 0 #1b2060;}
.result-score--best {color:#ffe27a;text-shadow:0 0 24px #ffc83d80,0 3px 0 #7a4a00;}
.result-newbest {display:inline-flex;align-items:center;gap:7px;position:relative;margin-top:6px;padding:4px 14px 4px 8px;border-radius:20px;font-weight:800;letter-spacing:1.5px;color:#3b2400;background:linear-gradient(135deg,#ffe58a,#ffb73b);box-shadow:0 0 16px #ffbc3d70,inset 0 1px 0 #fff9;}
.result-newbest .neon-icon {width:26px;height:26px;}
.result-newbest--celebrate {animation:newBestPop .7s cubic-bezier(.3,1.5,.5,1) both,newBestGlow 1.6s ease-in-out .7s 2;}
@keyframes newBestPop {0%{transform:scale(.4);opacity:0;}100%{transform:scale(1);opacity:1;}}
@keyframes newBestGlow {50%{box-shadow:0 0 28px #ffd04fb0,inset 0 1px 0 #fff9;}}
.result-sparkle {position:absolute;left:50%;top:50%;width:6px;height:6px;margin:-3px;border-radius:50%;background:#ffe27a;box-shadow:0 0 6px #ffd04f;opacity:0;pointer-events:none;animation:sparkleOut .9s ease-out .35s 1 both;}
@keyframes sparkleOut {0%{opacity:1;transform:rotate(var(--a)) translateY(0) scale(1);}100%{opacity:0;transform:rotate(var(--a)) translateY(calc(var(--d) * -1)) scale(.3);}}
.result-stats {display:flex;flex-direction:column;gap:6px;}
.result-stat {display:flex;align-items:center;gap:10px;padding:7px 12px;border-radius:14px;background:linear-gradient(125deg,#20295be8,#111837f0);border:1px solid #687ebb4d;text-align:left;animation:resultStatIn .35s ease-out both;animation-delay:calc(var(--i,0) * 90ms + 120ms);}
.result-stat--reward {border-color:#b5a47e66;}
.result-stat-icon {width:28px;height:28px;display:grid;place-items:center;flex:none;}
.result-stat-icon .neon-icon,.result-stat-icon img {width:28px;height:28px;object-fit:contain;}
.result-stat-label {flex:1;min-width:0;font-size:14px;color:#c4cbe9;}
.result-stat-value {font-weight:800;font-size:18px;color:#fff;white-space:nowrap;}
.result-stat-value small {font-size:11px;font-weight:600;color:#aab4dc;margin-left:3px;}
@keyframes resultStatIn {0%{opacity:0;transform:translateY(8px);}100%{opacity:1;transform:none;}}
.result-balance {margin:0;font-size:12px;color:#aab4dc;}
.result-balance strong {color:#ffdf78;}
.result-actions {display:flex;flex-direction:column;gap:8px;margin-top:2px;}
.result-actions .btn {min-height:46px;}
.result-extra {font-size:14px;min-height:40px!important;}
.btn-play-again {display:flex;align-items:center;justify-content:center;gap:12px;min-height:58px!important;font-size:22px;letter-spacing:1px;text-shadow:0 2px 0 #c53166;}
.btn-play-again .neon-icon {width:30px;height:30px;}
.result-panel--instant .result-stat,.result-panel--instant .result-newbest {animation:none;}
@media (max-height:760px),(max-width:360px) {
  .result-panel {gap:7px;padding:16px 14px;}
  .result-score {font-size:44px;}
  .result-stat {padding:5px 10px;}
  .result-stat-icon,.result-stat-icon .neon-icon,.result-stat-icon img {width:22px;height:22px;}
  .result-stat-label {font-size:12px;}.result-stat-value {font-size:15px;}
  .btn-play-again {min-height:50px!important;font-size:19px;}
  .result-actions .btn {min-height:40px;}
  .result-extra {min-height:34px!important;font-size:13px;padding:6px 10px;}
  .result-head h2 {font-size:18px;}
  .result-newbest {margin-top:2px;}
  .result-balance {font-size:11px;}
  #overlay-result {padding:8px;}
}
.overlay > .overlay-panel {margin:auto;}

/* ---- Vzhľady guličiek a košov v shope ---- */
.shop-preview:has(.skin-preview){width:84px;}
.skin-preview{display:flex;align-items:center;justify-content:center;gap:0;flex-wrap:wrap;max-width:84px;}
.shop-preview .skin-preview img{object-fit:contain;}
.skin-preview--balls img{width:25px;height:25px;margin:0 -1px;}
.skin-preview--bins img{width:40px;height:36px;margin:0 -2px;}
.btn-buy .buy-label{font-weight:800;letter-spacing:.5px;margin-right:2px;}
.btn-buy:disabled.btn-buy--equipped{opacity:1;}
@media (max-width:380px){.shop-preview:has(.skin-preview){width:78px;}.shop-preview .skin-preview img{width:23px;height:23px;}.shop-preview .skin-preview--bins img{width:37px;height:33px;}}

/* ---- TIME ATTACK ---- */
.menu-timeattack {display:flex;align-items:center;justify-content:flex-start;gap:12px;min-height:60px;text-align:left;padding:8px 17px;background:linear-gradient(110deg,#17506bf0,#16255fe0);border:1px solid #4fd6f0;box-shadow:inset 0 1px 2px #ffffff30,0 5px 12px #01051570;}
.menu-timeattack .neon-icon {width:38px;height:38px;filter:drop-shadow(0 0 8px #4fd6f070);}
.menu-timeattack strong {display:block;font-size:17px;letter-spacing:.8px;line-height:1.2;}
.menu-timeattack small {display:block;color:#bfeaf5;font-size:12px;font-weight:600;margin-top:2px;}
@media (max-height:700px){.menu-timeattack{min-height:50px;padding:5px 14px;}.menu-timeattack .neon-icon{width:32px;height:32px;}}
.difficulty-mode-hint {margin:-4px 0 8px;font-size:13px;color:#bfeaf5;text-align:center;}
.tabs--mode {padding-top:6px;}
.tabs--mode .tab-btn {flex:1;}
.hud-timer {display:flex;flex-direction:column;align-items:center;line-height:1;min-width:58px;transition:color .3s ease;}
.hud-timer-label {font:700 10px/1.2 'Segoe UI',sans-serif;letter-spacing:2px;color:#bec9ef;}
.hud-timer-value {font:800 30px/1.1 'Segoe UI',sans-serif;color:#fff;font-variant-numeric:tabular-nums;text-shadow:0 0 14px #8fd6ff60;}
.hud-timer--urgent .hud-timer-value {color:#ff8a5c;text-shadow:0 0 14px #ff6a3d90;animation:timerPulse 1s ease-in-out infinite;}
.hud-timer--urgent .hud-timer-label {color:#ffb08f;}
@keyframes timerPulse {0%,100%{transform:scale(1);}50%{transform:scale(1.14);}}
@media (prefers-reduced-motion:reduce){.hud-timer--urgent .hud-timer-value{animation:none;}}
.catch-score-popup--penalty {color:#ff7b7b !important;text-shadow:0 0 10px #ff2d4a90;}

/* ---- Úvod do režimu + streak výziev ---- */
.modeintro-panel {max-width:380px;}
.modeintro-rules {list-style:none;margin:6px 0 14px;padding:0;display:flex;flex-direction:column;gap:10px;text-align:left;}
.modeintro-rules li {display:flex;align-items:flex-start;gap:10px;font-size:14px;line-height:1.35;color:#dfe6ff;}
.modeintro-rules .neon-icon {width:30px;height:30px;flex:none;}
.challenge-streak {display:flex;align-items:center;justify-content:center;gap:6px;margin:6px 0 10px;font-weight:700;color:#ffdf78;}
.challenge-streak .neon-icon {width:22px;height:22px;}

/* Tlačidlo Settings v menu: celá plocha (aj spodná časť) musí reagovať — horný pruh je nad ostatným obsahom a má väčšiu dotykovú plochu. */
.menu-top {position:relative;z-index:6;}
.menu-logo-zone {position:relative;z-index:1;}
.menu-settings {position:relative;}
.menu-settings::after {content:'';position:absolute;inset:-6px;}

/* Náhľady v shope: Neon skin a Golden bins musia mať viditeľný efekt (rovnaký ako v hre). */
.skin-preview--neon{gap:6px;flex-wrap:nowrap;}
.shop-preview .skin-preview--neon img{width:26px;height:26px;margin:0;filter:drop-shadow(0 0 3px var(--glow)) drop-shadow(0 0 7px var(--glow));}
.shop-preview:has(.skin-preview--neon){width:96px;}
.shop-preview .skin-preview--gold img{width:50px;height:45px;filter:drop-shadow(0 0 3px #fff3b0) drop-shadow(0 0 8px #ffc83d) drop-shadow(0 0 16px #ff9f1c);}
/* Golden bins v hre: výraznejšia zlatá žiara */
.bins-row--theme-gold .bin-btn {filter:drop-shadow(0 0 3px #fff3b0) drop-shadow(0 0 9px #ffc83d) drop-shadow(0 0 16px rgba(255,159,28,.8));}

/* Ochrana pred omylom po prehre: tlačidlá výsledku sú chvíľu neaktívne (a jemne stlmené) */
.result-actions--locked {pointer-events:none;opacity:.55;}
.result-actions {transition:opacity .25s ease;}

/* Odpočet po revive */
.revive-countdown {position:absolute;left:50%;top:38%;transform:translate(-50%,-50%);z-index:5;pointer-events:none;font:800 96px/1 'Segoe UI',sans-serif;color:#fff;text-shadow:0 0 24px #7aa2ff,0 4px 10px #000a;}
.revive-countdown--tick {animation:reviveTick .9s ease-out both;}
@keyframes reviveTick {0%{transform:translate(-50%,-50%) scale(1.5);opacity:0;}20%{opacity:1;}100%{transform:translate(-50%,-50%) scale(1);opacity:.9;}}

/* ===== Výsledok: kompaktné rozloženie (podrobnosti sa rozklikávajú, tlačidlá vždy na obrazovke) ===== */
.result-panel {max-height:100%;overflow:hidden;display:flex;flex-direction:column;gap:8px;padding:18px 18px 16px;}
.result-score {font-size:52px;}
.result-chips {display:flex;justify-content:center;gap:10px;}
.result-chip {display:inline-flex;align-items:center;gap:6px;padding:4px 14px 4px 8px;border-radius:18px;background:linear-gradient(125deg,#20295be8,#111837f0);border:1px solid #b5a47e66;font-size:18px;}
.result-chip .neon-icon {width:26px;height:26px;}
.result-toggle {align-self:center;background:none;border:0;color:#aab4dc;font:700 13px/1 'Segoe UI',sans-serif;letter-spacing:1px;padding:8px 14px;cursor:pointer;text-transform:uppercase;}
.result-toggle i {display:inline-block;font-style:normal;transition:transform .2s ease;}
.result-panel--open .result-toggle i {transform:rotate(180deg);}
.result-details {display:none;min-height:0;overflow-y:auto;flex:0 1 auto;}
.result-panel--open .result-details {display:block;}
.result-actions {margin-top:0;flex:none;}
.result-row {display:flex;gap:8px;}
.result-row .btn-play-again {flex:1.7;min-height:54px!important;font-size:20px;}
.result-row .btn-home {flex:1;min-height:54px;}
@media (max-height:700px),(max-width:360px) {
  .result-panel {padding:12px 12px 12px;gap:5px;}
  .result-score {font-size:42px;}
  .result-row .btn-play-again,.result-row .btn-home {min-height:46px!important;}
  .result-row .btn-play-again {font-size:17px;}
  .result-chip {font-size:16px;padding:2px 12px 2px 6px;}
}

/* ===== Kompaktnejší HUD a powerup lišta -> dlhšia dráha padajúcich guličiek ===== */
.game-hud {min-height:0;padding:12px 18px 4px;gap:10px;}
.hud-scoreline {display:flex;align-items:center;gap:10px;min-width:0;min-height:44px;}
.hud-scoreline .hud-score {flex:none;line-height:1.1;}
.hud-scoreline .hud-combo {margin:0;min-width:0;min-height:0;}
.hud-scoreline .hud-combo:not(:empty) {min-width:0;max-width:118px;padding:3px 8px 4px;}
.hud-combo .combo-line {font-size:11px;gap:6px;}
.hud-combo .combo-mult {font-size:13px;}
.hud-combo .combo-next {font-size:9px;white-space:nowrap;}
@media (max-width:360px) {
  .game-hud {padding:10px 12px 4px;gap:6px;}
  .hud-scoreline {gap:6px;}
  .hud-scoreline .hud-score {font-size:26px;}
  .hud-scoreline .hud-combo:not(:empty) {max-width:78px;padding:2px 6px 3px;}
  .hud-combo .combo-next {display:none;}
  .hud-combo .combo-line {font-size:10px;gap:4px;}
}
.game-powerups {padding:0 14px 6px;gap:8px;}
.powerup-btn {min-height:46px;flex-direction:row;padding:4px 8px;gap:6px;max-width:130px;border-radius:15px;}
.powerup-btn>.neon-icon {width:30px;height:30px;}
.powerup-count {position:static;margin-left:2px;min-width:20px;height:20px;}

/* Pozadie cez celú obrazovku: na širokých oknách sa obrázok roztiahne (cover) bez rámu; overlaye stmavia celú obrazovku. */
@media (min-width:700px) { #cloud-bg .cloud-base { background-size:cover; } }
.overlay { position:fixed; }

/* Zamrznutý kôš: ľad je obrázok assets/images/bin-frost.png (384×340, priehľadné PNG, rovnaký formát ako bin_*.webp). */
.bin-btn--frozen::after {
  inset:0;
  background:url('../assets/images/bin-frost.png?v=0.2.16') center / 100% 100% no-repeat;
  clip-path:none;
  border-radius:0;
  box-shadow:none;
  filter:drop-shadow(0 0 6px rgba(140,215,255,.65));
  animation:none;
}

/* Malé telefóny (iPhone SE, ~375x550 viditeľnej plochy): kompaktné hlavné menu. */
@media (max-height:640px) {
  .menu-top{padding:10px 14px 0;gap:6px;}
  .currency-pill{font-size:14px;min-height:34px;padding-top:2px;padding-bottom:2px;}
  .menu-settings{transform:scale(.82);transform-origin:right center;}
  .menu-logo-zone{min-height:100px;padding:6px 14px 0;}
  .menu-logo-zone .logo-small{width:min(100%,56vh);margin:0 auto;}
  .menu-logo-zone .logo-image{width:100%;height:auto;max-width:none;}
  .menu-buttons{padding:0 16px 4px;gap:8px;}
  .btn-play{min-height:52px;font-size:24px;border-radius:20px;gap:14px;}
  .btn-play .neon-icon{width:32px;height:32px;}
  .menu-tile{min-height:46px;padding:6px 10px;font-size:15px;}
  .menu-tile .neon-icon{width:27px;height:27px;}
  .menu-tile-row{gap:9px;}
  .menu-timeattack{min-height:44px;padding:4px 12px;}
  .menu-timeattack .neon-icon{width:27px;height:27px;}
  .menu-timeattack strong{font-size:15px;}
  .menu-timeattack small{font-size:11px;margin-top:0;}
  .menu-challenge{min-height:58px;padding:7px 13px;}
  .menu-challenge>.neon-icon:first-child{width:32px;height:32px;}
  .menu-challenge strong{font-size:15px;}
  .menu-challenge small{font-size:12px;margin-top:2px;}
  .menu-footer{padding:3px 0 6px;}
}

.credits {text-align:center;color:#9fb0e0;font-size:12px;line-height:1.5;padding:10px 0 4px;}
.credits-title {font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:#c8d4ff;margin-bottom:2px;}
.credits p {margin:0;}

/* Settings: obsah sa scrolluje, keď sa nezmestí (centrovanie nesmie orezať vrch, riadky sa nesmú zmršťovať). */
.screen-content--centered {justify-content:safe center;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;}
.screen-content--centered>* {flex-shrink:0;}
@supports not (justify-content:safe center) { .screen-content--centered {justify-content:flex-start;} }
@media (max-height:640px) {
  .screen-content--centered {gap:8px;}
  .screen-content--centered .setting-row,.screen-content--centered .btn-menu-size {min-height:42px;padding-top:8px;padding-bottom:8px;}
  .credits {padding:4px 0 0;font-size:11px;}
}