:root{
  --bg:#04030d;--bg2:#071326;--panel:rgba(11,17,39,.76);--panel2:rgba(24,34,72,.72);--glass:rgba(255,255,255,.07);--line:rgba(255,255,255,.13);
  --txt:#f8fbff;--muted:#a9b9db;--pink:#ff2fd7;--cyan:#22f7ff;--gold:#ffd166;--green:#48ffb0;--red:#ff5576;--orange:#ff9b3d;
  --shadow:0 28px 90px rgba(0,0,0,.48);--radius:28px;--blur:blur(18px);
}
*{box-sizing:border-box}html,body{min-height:100%}body{margin:0;color:var(--txt);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background:radial-gradient(circle at 9% 5%,rgba(255,47,215,.28),transparent 28%),radial-gradient(circle at 82% 10%,rgba(34,247,255,.22),transparent 26%),radial-gradient(circle at 48% 90%,rgba(255,209,102,.10),transparent 34%),linear-gradient(135deg,#04030d,#071326 48%,#190724);overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;background:linear-gradient(rgba(255,255,255,.026) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.026) 1px,transparent 1px);background-size:38px 38px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.95),transparent 85%);pointer-events:none;z-index:-1}
body:after{content:"";position:fixed;inset:-30%;background:conic-gradient(from 180deg,transparent,rgba(255,47,215,.07),transparent,rgba(34,247,255,.07),transparent,rgba(255,209,102,.05),transparent);animation:aurora 22s linear infinite;z-index:-2}@keyframes aurora{to{transform:rotate(360deg)}}
button,input{font:inherit}.wrap{width:min(1880px,calc(100% - 24px));margin:0 auto;padding:16px 0 34px}.card{border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.045));box-shadow:var(--shadow);backdrop-filter:var(--blur);overflow:hidden;position:relative}.card.pad{padding:18px}.card:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.10),transparent 28%,rgba(34,247,255,.05));opacity:.65}.sectionTitle{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 12px;position:relative;z-index:1}.sectionTitle h2,.sectionTitle h3{margin:0;font-size:18px;letter-spacing:-.03em}.sectionTitle span{color:var(--muted);font-size:12px}.sub{color:var(--muted);font-size:13px}.muted{color:var(--muted)}
.btn{border:0;border-radius:18px;padding:12px 16px;color:#fff;font-weight:1000;letter-spacing:.01em;background:linear-gradient(135deg,rgba(255,47,215,.95),rgba(34,247,255,.88));box-shadow:0 14px 38px rgba(34,247,255,.16),0 0 32px rgba(255,47,215,.22);cursor:pointer;transition:.18s transform,.18s filter,.18s opacity;position:relative;overflow:hidden}.btn:hover{transform:translateY(-2px);filter:saturate(1.18)}.btn:disabled{opacity:.48;cursor:not-allowed;transform:none}.btn.ghost{background:rgba(255,255,255,.07);border:1px solid var(--line);box-shadow:none}.btn.gold{background:linear-gradient(135deg,#ffae00,#ff3d9a)}.btn.green{background:linear-gradient(135deg,#10f085,#22f7ff);color:#04121a}.btn.red{background:linear-gradient(135deg,#ff5576,#ff2fd7)}.btn.tiny{padding:8px 10px;border-radius:13px;font-size:12px}.btn.shine:after{content:"";position:absolute;inset:-80% -30%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.30),transparent);transform:rotate(20deg);animation:shine 2.6s linear infinite}@keyframes shine{to{translate:180% 0}}
.toast{position:fixed;right:18px;bottom:18px;z-index:9999;display:grid;gap:10px;pointer-events:none}.toastItem{border:1px solid var(--line);background:rgba(8,12,28,.92);backdrop-filter:blur(14px);border-radius:18px;padding:13px 15px;box-shadow:var(--shadow);max-width:380px;animation:toastIn .25s ease;will-change:opacity,transform}.toastItem:nth-last-child(n+6){display:none}.toastItem.good{border-color:rgba(72,255,176,.35)}.toastItem.bad{border-color:rgba(255,85,118,.45)}@keyframes toastIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.loginShell{min-height:100vh;display:grid;place-items:center;padding:24px}.loginBox{width:min(1120px,100%);display:grid;grid-template-columns:1.15fr .85fr;gap:18px}.heroPanel{padding:38px;isolation:isolate}.heroPanel:after{content:"";position:absolute;right:-60px;bottom:-70px;width:260px;height:260px;border-radius:50%;background:radial-gradient(circle,rgba(34,247,255,.28),transparent 66%);z-index:-1}.brand{display:flex;gap:13px;align-items:center}.logo{width:58px;height:58px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(135deg,var(--pink),var(--cyan));box-shadow:0 0 36px rgba(255,47,215,.45),inset 0 0 20px rgba(255,255,255,.25);font-size:29px}.brand h1{margin:0;font-size:clamp(25px,3vw,42px);letter-spacing:-.05em}.heroPanel .headline{font-size:clamp(40px,6.3vw,86px);line-height:.88;margin:24px 0 18px;letter-spacing:-.08em}.heroPanel p{color:#d4e2ff;line-height:1.72;margin:0 0 22px;max-width:720px}.features{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.feature{padding:14px;border-radius:20px;border:1px solid var(--line);background:rgba(0,0,0,.20);font-weight:800}.authPanel{padding:24px}.tabs{display:flex;background:rgba(255,255,255,.06);border:1px solid var(--line);border-radius:19px;padding:5px;margin-bottom:16px}.tab{flex:1;border:0;background:transparent;color:#fff;padding:12px;border-radius:14px;cursor:pointer;font-weight:1000}.tab.active{background:linear-gradient(135deg,var(--pink),var(--cyan));color:#fff}.form{display:grid;gap:12px}.input{width:100%;border:1px solid var(--line);background:rgba(4,9,24,.78);border-radius:18px;color:#fff;padding:15px 14px;outline:none}.input:focus{border-color:rgba(34,247,255,.62);box-shadow:0 0 0 4px rgba(34,247,255,.10)}.hint{font-size:13px;color:var(--muted);line-height:1.55}
.topbar{display:flex;gap:14px;align-items:center;justify-content:space-between;margin-bottom:14px}.pillrow{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.pill{padding:9px 13px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.07);box-shadow:inset 0 0 20px rgba(255,255,255,.035);font-weight:900}.pill b{color:var(--cyan)}.topOnline{position:relative;display:inline-flex;align-items:center;gap:8px;max-width:310px;padding:9px 15px;border-radius:999px;border:1px solid rgba(72,255,176,.30);background:linear-gradient(135deg,rgba(72,255,176,.12),rgba(34,247,255,.07));box-shadow:inset 0 0 18px rgba(72,255,176,.05);font-weight:1000;white-space:nowrap;overflow:visible;cursor:default}.topOnline b{color:#c7ffd9}.onlineDotMini{width:9px;height:9px;border-radius:50%;background:var(--green);box-shadow:0 0 14px rgba(72,255,176,.9);flex:0 0 auto}.topOnlineDrop{position:absolute;right:0;top:calc(100% + 10px);min-width:230px;max-width:min(320px,calc(100vw - 28px));max-height:310px;overflow:auto;padding:10px;border-radius:20px;border:1px solid rgba(72,255,176,.28);background:linear-gradient(180deg,rgba(14,24,44,.98),rgba(6,10,25,.98));box-shadow:0 24px 70px rgba(0,0,0,.55),0 0 30px rgba(72,255,176,.14);opacity:0;transform:translateY(-6px);pointer-events:none;transition:.16s ease;z-index:9999}.topOnline:hover .topOnlineDrop,.topOnline:focus-within .topOnlineDrop{opacity:1;transform:translateY(0);pointer-events:auto}.topOnlineDrop:before{content:"";position:absolute;right:22px;top:-7px;width:12px;height:12px;transform:rotate(45deg);background:rgba(14,24,44,.98);border-left:1px solid rgba(72,255,176,.22);border-top:1px solid rgba(72,255,176,.22)}.topOnlineHead{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 5px 9px;color:#c7ffd9;font-size:12px;text-transform:uppercase;letter-spacing:.08em}.topOnlineRow{display:grid;grid-template-columns:auto 1fr auto;gap:9px;align-items:center;padding:9px 10px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);margin-top:6px;color:#eef6ff}.topOnlineRow .onlineDotMini{width:8px;height:8px}.topOnlineRow b{display:block;font-size:13px;color:#fff;max-width:118px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.topOnlineRow small{display:block;color:#aebbd5;font-size:11px;font-weight:800}.topOnlineMoney{color:#c7ffd9;font-weight:1000;font-size:12px;white-space:nowrap}.topOnlineEmpty{padding:10px;border-radius:14px;background:rgba(255,255,255,.05);color:#b8c6df;font-size:13px}.quickNav{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 14px}.quickNav button{border:1px solid var(--line);background:rgba(255,255,255,.06);color:#fff;border-radius:15px;padding:9px 12px;font-weight:900;cursor:pointer}.quickNav button:hover{background:rgba(255,255,255,.11)}
.gameGrid{display:grid;grid-template-columns:390px minmax(560px,1fr) 410px;gap:16px;align-items:start}.sideLeft,.sideRight,.centerStack{display:grid;gap:16px}.statGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.stat{padding:13px;border-radius:19px;border:1px solid var(--line);background:rgba(255,255,255,.06);position:relative;z-index:1}.stat small{display:block;color:var(--muted);font-weight:800}.stat strong{display:block;margin-top:4px;font-size:22px;letter-spacing:-.03em}.progress{height:10px;border-radius:999px;background:rgba(255,255,255,.10);overflow:hidden}.progress>i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--pink),var(--cyan),var(--gold));border-radius:999px;box-shadow:0 0 18px rgba(34,247,255,.45)}
.cityCard{padding:18px;background:linear-gradient(180deg,rgba(255,47,215,.10),rgba(34,247,255,.06))}.villageStage{height:238px;border-radius:26px;border:1px solid rgba(255,255,255,.13);background:linear-gradient(180deg,rgba(26,40,88,.82),rgba(6,9,26,.94));position:relative;overflow:hidden;margin:8px 0 13px;box-shadow:inset 0 -35px 70px rgba(0,0,0,.35)}.villageStage:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 8%,rgba(255,255,255,.18),transparent 25%),linear-gradient(180deg,transparent 0 60%,rgba(255,47,215,.10));opacity:.85}.villageStage:after{content:"";position:absolute;left:0;right:0;bottom:0;height:46px;background:linear-gradient(180deg,rgba(34,247,255,.12),rgba(4,8,20,.88));box-shadow:0 -10px 35px rgba(34,247,255,.10)}.vBuild{position:absolute;bottom:35px;width:54px;border-radius:10px 10px 4px 4px;background:linear-gradient(180deg,rgba(255,255,255,.24),rgba(34,247,255,.18));border:1px solid rgba(255,255,255,.16);box-shadow:0 0 24px rgba(34,247,255,.15);display:grid;place-items:end center;color:#fff;font-size:22px;padding-bottom:4px;transition:.25s}.vBuild small{position:absolute;top:-23px;font-size:11px;color:#dce9ff;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.12);border-radius:99px;padding:2px 7px}.vBuild.l0{opacity:.35;filter:grayscale(.6)}.vBuild.l5{box-shadow:0 0 35px rgba(255,209,102,.35),0 0 24px rgba(34,247,255,.18)}.vBuild:nth-child(1){left:26px;height:74px}.vBuild:nth-child(2){left:92px;height:118px}.vBuild:nth-child(3){left:164px;height:92px}.vBuild:nth-child(4){right:92px;height:142px}.vBuild:nth-child(5){right:26px;height:104px}.vBuild.vSlot0{left:8%;height:78px}.vBuild.vSlot1{left:25%;height:122px}.vBuild.vSlot2{left:43%;height:96px}.vBuild.vSlot3{right:25%;height:146px}.vBuild.vSlot4{right:8%;height:108px}.bigStage .vBuild.vSlot0{left:10%;height:130px}.bigStage .vBuild.vSlot1{left:27%;height:190px}.bigStage .vBuild.vSlot2{left:45%;height:155px}.bigStage .vBuild.vSlot3{right:26%;height:220px}.bigStage .vBuild.vSlot4{right:10%;height:170px}.vRoad{position:absolute;left:20px;right:20px;bottom:16px;height:14px;border-radius:99px;background:linear-gradient(90deg,rgba(255,47,215,.30),rgba(34,247,255,.35));box-shadow:0 0 26px rgba(34,247,255,.25)}.cityBadge{display:flex;gap:9px;align-items:center;margin-top:12px;flex-wrap:wrap}.wanted{display:inline-flex;gap:4px;vertical-align:middle}.wanted i{width:15px;height:15px;border-radius:5px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.14)}.wanted i.on{background:linear-gradient(135deg,var(--red),var(--gold));box-shadow:0 0 12px rgba(255,85,118,.45)}
.machine{padding:18px;background:linear-gradient(180deg,rgba(255,47,215,.15),rgba(34,247,255,.07) 55%,rgba(255,255,255,.045));min-height:500px}.machineTop{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:14px}.machineName{font-size:24px;font-weight:1000;letter-spacing:-.05em}.jackpotMeter{min-width:200px}.jackpotMeter .meterHead{display:flex;justify-content:space-between;color:#dce8ff;font-size:12px;font-weight:900;margin-bottom:7px}.slotBody{position:relative;border-radius:34px;padding:24px;background:linear-gradient(135deg,rgba(255,47,215,.28),rgba(34,247,255,.22));border:1px solid rgba(255,255,255,.24);box-shadow:inset 0 0 42px rgba(255,255,255,.09),0 0 52px rgba(255,47,215,.17)}.slotLights{position:absolute;inset:10px;border-radius:28px;pointer-events:none;background:repeating-linear-gradient(90deg,rgba(255,209,102,.22) 0 10px,transparent 10px 34px);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);padding:3px;opacity:.8;animation:blink 1.1s steps(2,end) infinite}@keyframes blink{50%{opacity:.28}}.payline{position:absolute;left:22px;right:22px;top:50%;height:3px;background:linear-gradient(90deg,transparent,var(--gold),transparent);box-shadow:0 0 18px rgba(255,209,102,.7);z-index:4}.reels{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;position:relative;z-index:2}.reel{height:188px;border-radius:25px;background:radial-gradient(circle at 50% 18%,rgba(255,255,255,.20),transparent 35%),linear-gradient(180deg,#121d48,#050817 70%);border:1px solid rgba(255,255,255,.17);display:grid;place-items:center;overflow:hidden;box-shadow:inset 0 18px 36px rgba(0,0,0,.58),0 18px 30px rgba(0,0,0,.18)}.reelStrip{display:grid;gap:7px;transition:.26s ease;transform:translateY(0)}.reelCell{height:52px;min-width:90px;display:grid;place-items:center;border-radius:18px;background:rgba(255,255,255,.055);font-size:42px;filter:drop-shadow(0 0 15px rgba(255,255,255,.20))}.reel.spin .reelStrip{animation:slotRoll .15s linear infinite;filter:blur(1.4px)}@keyframes slotRoll{from{transform:translateY(-58px)}to{transform:translateY(58px)}}.leverWrap{display:grid;grid-template-columns:1fr 112px;gap:14px;align-items:center;margin-top:18px}.lever{height:132px;border-radius:999px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.04));position:relative;display:grid;place-items:center;cursor:pointer}.lever:before{content:"";width:18px;height:80px;border-radius:99px;background:linear-gradient(180deg,var(--gold),#ff2f7a);box-shadow:0 0 28px rgba(255,47,215,.45);transform-origin:bottom;transition:.24s}.lever:after{content:"";position:absolute;top:12px;width:50px;height:50px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff,var(--gold) 32%,#ff2f7a 72%);box-shadow:0 0 30px rgba(255,209,102,.62);transition:.24s}.lever.pulled:before{transform:rotate(25deg) translateY(13px)}.lever.pulled:after{transform:translate(20px,42px)}.resultBox{margin-top:14px;padding:15px;border-radius:20px;background:rgba(0,0,0,.20);border:1px solid var(--line);min-height:58px;color:#e1ebff;line-height:1.45}.coinBurst{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:var(--radius)}.coinBurst span{position:absolute;left:50%;top:50%;font-size:24px;animation:coinFly .9s ease-out forwards}@keyframes coinFly{to{transform:translate(var(--x),var(--y)) scale(.65) rotate(280deg);opacity:0}}
.buildings{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}.building{padding:15px;border-radius:24px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.04));min-height:220px;display:flex;flex-direction:column;gap:8px;position:relative;z-index:1;overflow:hidden}.building:before{content:'';position:absolute;inset:0;background:radial-gradient(circle at top right,rgba(34,247,255,.10),transparent 32%),radial-gradient(circle at bottom left,rgba(255,47,215,.08),transparent 30%);pointer-events:none}.building .ico{font-size:34px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.10)}.building .ico .subIco{font-size:20px;opacity:.9;filter:drop-shadow(0 0 10px rgba(34,247,255,.25))}.building h4{margin:0;font-size:16px}.stars{letter-spacing:1px;color:var(--gold);font-size:13px}.cost{color:var(--muted);font-size:12px}.building .btn{padding:10px;margin-top:auto;font-size:12px;border-radius:14px}.building:hover{border-color:rgba(34,247,255,.32);box-shadow:0 0 30px rgba(34,247,255,.08);transform:translateY(-2px)}.villageStatsGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:14px}.vStatCard{padding:12px 14px;border-radius:18px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));display:grid;gap:4px}.vStatCard small{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.vStatCard b{font-size:16px}.vStatCard span{font-size:12px;color:#d7e6ff}.villageHintBar{margin:10px 0 2px;padding:11px 13px;border-radius:16px;border:1px solid rgba(34,247,255,.24);background:linear-gradient(90deg,rgba(255,47,215,.10),rgba(34,247,255,.10));font-weight:800;color:#eef7ff}.buildMetaRow{display:flex;gap:6px;flex-wrap:wrap}.miniPill{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);font-size:11px;color:#dbe8ff}.chatLayout{grid-template-columns:minmax(0,1fr) 320px;height:100%;min-height:0}.chatCasino,.chatSide .card{height:100%;min-height:0;display:flex;flex-direction:column}.chatComposer{display:grid;grid-template-columns:1fr auto;gap:10px;margin:10px 0 14px}.chatRows{flex:1;min-height:0;overflow:auto;padding-right:6px;padding-bottom:38px}.chatMsg{display:grid;grid-template-columns:auto 1fr;gap:10px;padding:12px;border-radius:18px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03));margin-bottom:10px}.chatAvatar{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(255,47,215,.25),rgba(34,247,255,.18));font-size:22px;border:1px solid rgba(255,255,255,.10)}.chatHead{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:4px}.chatHead b{font-size:14px}.chatHead small{color:var(--muted);font-size:11px}.chatText{font-size:14px;line-height:1.45;color:#eef7ff}.chatSide{display:grid;gap:14px;min-height:0}.onlineChip{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border-radius:16px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);margin-bottom:8px}.onlineChip b{display:block;font-size:13px}.onlineChip small{display:block;color:var(--muted);font-size:11px}.vBuild{position:absolute;bottom:35px;width:60px;border-radius:16px 16px 6px 6px;background:linear-gradient(180deg,rgba(255,255,255,.28),rgba(34,247,255,.14));border:1px solid rgba(255,255,255,.16);box-shadow:0 0 24px rgba(34,247,255,.15);display:flex;align-items:flex-end;justify-content:center;color:#fff;font-size:26px;padding-bottom:12px;transition:.25s}.vBuild .vEmoji{position:relative;z-index:2;filter:drop-shadow(0 0 12px rgba(255,255,255,.20))}.vBuild .vBadge{position:absolute;top:-20px;font-size:11px;color:#dce9ff;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.12);border-radius:99px;padding:2px 7px}.vBuild .vName{position:absolute;left:6px;right:6px;bottom:6px;font-size:9px;line-height:1.1;text-align:center;color:#dff4ff;opacity:.82}.vBuild.emptyPlot .vName{color:#fff;opacity:1}.deluxeVillage:before{background:radial-gradient(circle at 50% 8%,rgba(255,255,255,.18),transparent 25%),linear-gradient(180deg,transparent 0 60%,rgba(255,47,215,.10)),radial-gradient(circle at 20% 40%,rgba(34,247,255,.10),transparent 18%),radial-gradient(circle at 82% 34%,rgba(255,209,102,.12),transparent 16%)}
.cardsGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.miniCard{border:1px solid var(--line);border-radius:18px;padding:10px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.035));min-height:100px;position:relative;z-index:1}.miniCard .ci{font-size:25px}.miniCard b{font-size:12px;display:block;margin-top:4px}.miniCard small{display:block;color:var(--muted);font-size:11px}.miniCard.owned{border-color:rgba(34,247,255,.38);box-shadow:0 0 22px rgba(34,247,255,.09)}
.rows{display:grid;gap:9px;position:relative;z-index:1}.leaderRows,.logRows,.eventRows{max-height:370px;overflow:auto;padding-right:2px}.leader{display:grid;grid-template-columns:32px 1fr auto;gap:10px;align-items:center;padding:11px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.055)}.rank{width:30px;height:30px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.09);font-weight:1000}.leader b{display:block}.leader small{color:var(--muted)}.leaderName{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.statusBadge{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 8px;font-size:11px;font-weight:1000;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06)}.statusBadge:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--muted)}.statusBadge.on{color:#b8ffd8;border-color:rgba(72,255,176,.36);background:rgba(72,255,176,.10)}.statusBadge.on:before{background:var(--green);box-shadow:0 0 12px rgba(72,255,176,.8)}.statusBadge.off{color:#bbc6dc}.statusBadge.off:before{background:#7b8497}.logItem,.eventItem{padding:11px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.055);font-size:13px;color:#dce8ff;line-height:1.42}.eventItem time{color:var(--cyan);font-weight:1000;margin-right:6px}.mission,.shopItem{display:grid;grid-template-columns:42px 1fr auto;gap:10px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.055)}.missionIcon,.shopIcon{width:42px;height:42px;border-radius:15px;display:grid;place-items:center;background:rgba(255,255,255,.08);font-size:23px}.mission b,.shopItem b{display:block}.mission small,.shopItem small{display:block;color:var(--muted);line-height:1.35}.mission .progress{margin-top:7px;height:7px}.mission.done{border-color:rgba(72,255,176,.32)}.mission.claimed{opacity:.64}.passTrack{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.passNode{border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.055);padding:10px;text-align:center;min-height:86px}.passNode .emoji{font-size:25px}.passNode b{display:block;font-size:12px}.passNode small{color:var(--muted)}
.modal{position:fixed;inset:0;background:rgba(1,3,10,.74);backdrop-filter:blur(11px);display:none;align-items:center;justify-content:center;z-index:1000;padding:16px}.modal.show{display:flex}.modalBox{width:min(740px,100%);border:1px solid var(--line);border-radius:32px;background:linear-gradient(180deg,rgba(20,28,60,.97),rgba(6,9,24,.97));box-shadow:0 35px 120px rgba(0,0,0,.68);padding:24px}.vaults{display:grid;grid-template-columns:repeat(6,1fr);gap:13px;margin:18px 0}.vault{aspect-ratio:1/1;border-radius:26px;border:1px solid rgba(255,255,255,.17);background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.045));display:grid;place-items:center;cursor:pointer;position:relative;overflow:hidden}.vault:before{content:"🔒";font-size:48px;filter:drop-shadow(0 0 18px rgba(255,209,102,.35))}.vault.opened{cursor:default;background:linear-gradient(135deg,rgba(255,209,102,.24),rgba(34,247,255,.17))}.vault.opened:before{content:attr(data-value);font-size:24px;font-weight:1000;color:var(--gold)}.attackTargets{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:18px 0}.attackTarget{border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.07);color:#fff;padding:14px;cursor:pointer;min-height:130px;display:grid;gap:5px;place-items:center;text-align:center}.attackTarget:hover{border-color:rgba(255,85,118,.45);transform:translateY(-2px)}.attackTarget .big{font-size:34px}.attackTarget small{color:var(--muted)}.setGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}.setCard{border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.055);padding:12px}.setCard.done{border-color:rgba(255,209,102,.40);box-shadow:0 0 22px rgba(255,209,102,.10)}.setCard b{display:block}.setCard small{display:block;color:var(--muted);line-height:1.35}.bossBox{display:grid;gap:9px}.bossName{font-weight:1000;font-size:16px}.bossMeta{display:flex;justify-content:space-between;gap:10px;color:var(--muted);font-size:12px;font-weight:800}
.eventBanner{margin-top:8px;border:1px solid rgba(255,209,102,.30);background:linear-gradient(135deg,rgba(255,209,102,.14),rgba(255,47,215,.10),rgba(34,247,255,.10));border-radius:16px;padding:10px 12px;font-weight:1000;color:#fff;position:relative;z-index:1}.shieldSlots{display:flex;gap:6px;margin:10px 0;flex-wrap:wrap}.shieldSlot{width:29px;height:29px;border-radius:11px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.07);filter:grayscale(1);opacity:.45}.shieldSlot.full{filter:none;opacity:1;background:rgba(34,247,255,.13);box-shadow:0 0 18px rgba(34,247,255,.22)}.building.damaged{border-color:rgba(255,85,118,.42);box-shadow:0 0 28px rgba(255,85,118,.12)}.damageTag{display:inline-flex;margin:6px 0;padding:4px 8px;border-radius:999px;background:rgba(255,85,118,.16);border:1px solid rgba(255,85,118,.35);font-size:12px;font-weight:1000;color:#ffd6df}.chestGrid,.petGrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:14px}.chestCard,.petCard,.mapNode{border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.055);padding:12px;position:relative;z-index:1}.chestCard b,.petCard b{display:block}.chestCard small,.petCard small{display:block;color:var(--muted);line-height:1.35}.petCard.active{border-color:rgba(34,247,255,.45);box-shadow:0 0 24px rgba(34,247,255,.12)}.petTop{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;margin-bottom:12px}.empireMap{display:grid;grid-template-columns:repeat(25,minmax(26px,1fr));gap:6px;max-height:calc(100vh - 210px);overflow:auto;padding-right:4px}.mapNode{min-height:32px;padding:5px;text-align:center;font-size:12px;border-radius:10px;color:var(--muted)}.mapNode.done{background:rgba(72,255,176,.12);color:#b8ffd8}.mapNode.current{background:linear-gradient(135deg,var(--pink),var(--cyan));color:#fff;box-shadow:0 0 22px rgba(34,247,255,.25)}.mapNode.boss:after{content:'🐉';display:block;font-size:10px}.gangBox{display:grid;grid-template-columns:1fr auto auto;gap:10px;margin-bottom:12px}.miniLine{margin-top:10px}.recentSpin{display:inline-flex;gap:4px;align-items:center;border:1px solid var(--line);border-radius:999px;padding:5px 9px;background:rgba(255,255,255,.06);font-size:12px;margin:3px}.vault span{font-size:12px;color:var(--muted);position:absolute;bottom:8px;left:6px;right:6px;text-align:center;font-weight:900}.vault.opened span{display:none}
@media(max-width:1360px){.gameGrid{grid-template-columns:1fr}.sideLeft,.sideRight{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.buildings{grid-template-columns:repeat(5,minmax(140px,1fr));overflow-x:auto}.villageStage{height:220px}}@media(max-width:860px){.wrap{width:min(100% - 14px,720px);padding-top:10px}.loginBox{grid-template-columns:1fr}.heroPanel{padding:25px}.features{grid-template-columns:1fr}.topbar{align-items:flex-start;flex-direction:column}.pillrow{width:100%}.pill{flex:1;text-align:center}.sideLeft,.sideRight{grid-template-columns:1fr}.machine{min-height:auto}.machineTop{flex-wrap:wrap}.reel{height:142px}.reelCell{height:44px;font-size:34px}.leverWrap{grid-template-columns:1fr 86px}.lever{height:104px}.buildings{grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible}.cardsGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.statGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.vaults,.attackTargets,.setGrid{grid-template-columns:repeat(2,1fr)}.mission,.shopItem{grid-template-columns:40px 1fr}.mission button,.shopItem button{grid-column:1/-1}.passTrack{grid-template-columns:repeat(3,1fr)}}@media(max-width:480px){.brand h1{font-size:25px}.logo{width:48px;height:48px}.pillrow{display:grid;grid-template-columns:1fr 1fr}.buildings{grid-template-columns:1fr}.reels{gap:8px}.reel{height:118px;border-radius:19px}.reelCell{min-width:70px}.machineName{font-size:19px}.jackpotMeter{min-width:0}.slotBody{padding:18px}.quickNav button{flex:1}.passTrack{grid-template-columns:repeat(2,1fr)}}

/* --- Next level tab layout --- */
.tabNav button.active{background:linear-gradient(135deg,var(--pink),var(--cyan));box-shadow:0 0 28px rgba(34,247,255,.18);color:#fff}
.appTabs{display:block}
.tabPanel{display:none;gap:16px;min-height:0}
.tabPanel.active{display:grid}
.slotLayout{grid-template-columns:minmax(620px,1fr) 390px}
.panelStack{display:grid;gap:16px;min-height:0}
.villageLayout{grid-template-columns:430px minmax(640px,1fr)}
.cardsLayout,.leaderLayout,.shopLayout{grid-template-columns:1fr}
.passLayout,.eventsLayout{grid-template-columns:1fr 1fr}
.bigStage{height:520px}.compactStage{height:230px}.villageFull .cityBadge{margin-top:12px}
.leverOnly{grid-template-columns:120px 1fr;align-items:center}
.autoSpinBtn{height:82px;border-radius:27px;font-size:22px;text-transform:uppercase;background:linear-gradient(135deg,#ff9b3d,#ff2fd7,#22f7ff)}
.autoSpinBtn.active{background:linear-gradient(135deg,#48ffb0,#22f7ff);color:#021016;box-shadow:0 0 42px rgba(72,255,176,.28)}.spinBetPanel{display:grid;grid-template-columns:1fr 190px;gap:12px;margin:16px 0 0}.betBox,.spinBank{border:1px solid var(--line);border-radius:22px;background:rgba(0,0,0,.22);padding:10px;display:flex;align-items:center;gap:8px;min-height:56px}.betBox span,.spinBank span{font-size:12px;color:var(--muted);font-weight:1000;text-transform:uppercase;letter-spacing:.06em}.betBtn{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.075);color:#eaf2ff;border-radius:15px;padding:10px 13px;font-weight:1000;cursor:pointer;transition:.18s}.betBtn:hover{transform:translateY(-1px);border-color:rgba(34,247,255,.35)}.betBtn.active{background:linear-gradient(135deg,var(--pink),var(--cyan));box-shadow:0 0 24px rgba(34,247,255,.26);color:#fff}.betBtn:disabled{opacity:.34;cursor:not-allowed;filter:grayscale(1);transform:none}.spinBank{justify-content:center;font-size:18px}.spinBank b{font-size:20px;color:var(--cyan);text-shadow:0 0 18px rgba(34,247,255,.42)}.spinPopup{position:fixed;inset:0;z-index:9000;display:none;place-items:center;pointer-events:none;background:radial-gradient(circle at 50% 35%,rgba(34,247,255,.12),transparent 34%)}.spinPopup.show{display:grid}.spinPopupBox{width:min(460px,calc(100vw - 28px));border-radius:32px;border:1px solid rgba(255,255,255,.20);background:linear-gradient(180deg,rgba(21,30,66,.96),rgba(7,10,28,.96));box-shadow:0 34px 110px rgba(0,0,0,.68),0 0 50px rgba(255,47,215,.20);padding:24px;text-align:center;pointer-events:auto;position:relative}.spinPopupClose{position:absolute;right:14px;top:12px;width:34px;height:34px;border-radius:999px;border:1px solid var(--line);background:rgba(255,255,255,.08);color:#fff;font-size:20px;cursor:pointer}.spinPopupSymbols{font-size:48px;letter-spacing:6px;filter:drop-shadow(0 0 18px rgba(34,247,255,.28));margin-bottom:8px}.spinPopupBox h2{margin:0;font-size:30px}.spinPopupBox p{color:var(--muted);font-weight:800}.spinPopupReward{margin-top:12px;font-size:24px;font-weight:1000;color:var(--gold)}@media(max-width:820px){.spinBetPanel{grid-template-columns:1fr}.betBox{flex-wrap:wrap}.spinBank{justify-content:flex-start}}
.vBuild{width:46px;bottom:35px;transform:translateX(-50%);z-index:3}
.vBuild.vSlot0{left:10%;height:78px}.vBuild.vSlot1{left:28%;height:118px}.vBuild.vSlot2{left:46%;height:98px}.vBuild.vSlot3{left:64%;height:142px}.vBuild.vSlot4{left:82%;height:108px}
.bigStage .vBuild{width:74px;font-size:34px;border-radius:16px 16px 7px 7px;padding-bottom:8px}
.bigStage .vBuild.vSlot0{height:170px}.bigStage .vBuild.vSlot1{height:250px}.bigStage .vBuild.vSlot2{height:205px}.bigStage .vBuild.vSlot3{height:310px}.bigStage .vBuild.vSlot4{height:235px}
.vBuild.tier6,.vBuild.tier7,.vBuild.tier8,.vBuild.tier9,.vBuild.tier10{box-shadow:0 0 40px rgba(255,47,215,.22),0 0 38px rgba(34,247,255,.16)}
.rarity{display:inline-flex;align-self:flex-start;padding:4px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.14);font-size:11px;color:#dce8ff;background:rgba(255,255,255,.06)}
.rarity.Epic{color:#e6d3ff;border-color:rgba(190,120,255,.35)}.rarity.Legendary{color:#ffe3a0;border-color:rgba(255,209,102,.45)}.rarity.Mythic,.rarity.Celestial{color:#bdfcff;border-color:rgba(34,247,255,.45);box-shadow:0 0 18px rgba(34,247,255,.12)}
.cardsBig{grid-template-columns:repeat(8,minmax(0,1fr));max-height:calc(100vh - 180px);overflow:auto;padding-right:4px}
.passBig{grid-template-columns:repeat(10,minmax(0,1fr));margin-bottom:12px}
.leaderBig,.eventBig,.logBig{max-height:calc(100vh - 190px)}
.liveCard .eventRows{max-height:240px}
@media(min-width:861px){
  html,body{height:100%;overflow:hidden}
  .wrap{height:100vh;padding:10px 0 12px;display:flex;flex-direction:column}
  .topbar{margin-bottom:10px;flex:0 0 auto}.quickNav{flex:0 0 auto}
  .gameGrid.appTabs{flex:1;min-height:0;overflow:hidden}
  .tabPanel{height:100%;overflow:hidden}
  .card{min-height:0}.machine{min-height:0}.slotBody{min-height:0}
  .reel{height:210px}
  .rows{min-height:0;overflow:auto}
  .buildings{grid-template-columns:repeat(5,minmax(120px,1fr));align-content:start}
}
.eventBanner{margin-top:8px;border:1px solid rgba(255,209,102,.30);background:linear-gradient(135deg,rgba(255,209,102,.14),rgba(255,47,215,.10),rgba(34,247,255,.10));border-radius:16px;padding:10px 12px;font-weight:1000;color:#fff;position:relative;z-index:1}.shieldSlots{display:flex;gap:6px;margin:10px 0;flex-wrap:wrap}.shieldSlot{width:29px;height:29px;border-radius:11px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.07);filter:grayscale(1);opacity:.45}.shieldSlot.full{filter:none;opacity:1;background:rgba(34,247,255,.13);box-shadow:0 0 18px rgba(34,247,255,.22)}.building.damaged{border-color:rgba(255,85,118,.42);box-shadow:0 0 28px rgba(255,85,118,.12)}.damageTag{display:inline-flex;margin:6px 0;padding:4px 8px;border-radius:999px;background:rgba(255,85,118,.16);border:1px solid rgba(255,85,118,.35);font-size:12px;font-weight:1000;color:#ffd6df}.chestGrid,.petGrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:14px}.chestCard,.petCard,.mapNode{border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.055);padding:12px;position:relative;z-index:1}.chestCard b,.petCard b{display:block}.chestCard small,.petCard small{display:block;color:var(--muted);line-height:1.35}.petCard.active{border-color:rgba(34,247,255,.45);box-shadow:0 0 24px rgba(34,247,255,.12)}.petTop{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;margin-bottom:12px}.empireMap{display:grid;grid-template-columns:repeat(25,minmax(26px,1fr));gap:6px;max-height:calc(100vh - 210px);overflow:auto;padding-right:4px}.mapNode{min-height:32px;padding:5px;text-align:center;font-size:12px;border-radius:10px;color:var(--muted)}.mapNode.done{background:rgba(72,255,176,.12);color:#b8ffd8}.mapNode.current{background:linear-gradient(135deg,var(--pink),var(--cyan));color:#fff;box-shadow:0 0 22px rgba(34,247,255,.25)}.mapNode.boss:after{content:'🐉';display:block;font-size:10px}.gangBox{display:grid;grid-template-columns:1fr auto auto;gap:10px;margin-bottom:12px}.miniLine{margin-top:10px}.recentSpin{display:inline-flex;gap:4px;align-items:center;border:1px solid var(--line);border-radius:999px;padding:5px 9px;background:rgba(255,255,255,.06);font-size:12px;margin:3px}.vault span{font-size:12px;color:var(--muted);position:absolute;bottom:8px;left:6px;right:6px;text-align:center;font-weight:900}.vault.opened span{display:none}
@media(max-width:1360px) and (min-width:861px){
  .slotLayout{grid-template-columns:1fr 340px}.villageLayout{grid-template-columns:420px 1fr}.chatLayout{grid-template-columns:minmax(0,1fr) 320px}.cardsBig{grid-template-columns:repeat(6,1fr)}.passBig{grid-template-columns:repeat(5,1fr)}
  .bigStage{height:430px}.bigStage .vBuild{width:60px}
}
@media(max-width:860px){
  html,body{overflow:auto}
  .tabPanel.active{display:grid}.slotLayout,.villageLayout,.passLayout,.eventsLayout,.chatLayout{grid-template-columns:1fr}
  .cardsBig{grid-template-columns:repeat(2,minmax(0,1fr));max-height:none}.passBig{grid-template-columns:repeat(2,1fr)}
  .bigStage{height:280px}.leverOnly{grid-template-columns:92px 1fr}
}



/* --- Luxury casino polish + no clipped tabs --- */
.quickNav.tabNav{padding:8px;border:1px solid rgba(255,255,255,.12);border-radius:24px;background:linear-gradient(180deg,rgba(10,15,38,.72),rgba(20,28,62,.58));box-shadow:0 18px 50px rgba(0,0,0,.25),inset 0 0 28px rgba(255,255,255,.04)}
.quickNav.tabNav button{position:relative;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.10);padding:10px 14px;border-radius:16px;box-shadow:inset 0 0 20px rgba(255,255,255,.03)}
.quickNav.tabNav button.active{background:linear-gradient(135deg,rgba(255,47,215,.92),rgba(34,247,255,.88));border-color:rgba(255,255,255,.22);box-shadow:0 16px 34px rgba(34,247,255,.16),0 0 32px rgba(255,47,215,.20)}
.tabPanel>.card{background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.045));box-shadow:0 22px 80px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.05)}
.rows,.cardsGrid,.chestGrid,.setGrid,#shopRows,.eventRows,.logRows,.gangMembersList{scrollbar-gutter:stable;scrollbar-width:auto;scroll-padding-bottom:42px}
.rows::-webkit-scrollbar,.cardsGrid::-webkit-scrollbar,#shopRows::-webkit-scrollbar,.eventRows::-webkit-scrollbar,.logRows::-webkit-scrollbar{width:12px;height:12px}.rows::-webkit-scrollbar-thumb,.cardsGrid::-webkit-scrollbar-thumb,#shopRows::-webkit-scrollbar-thumb,.eventRows::-webkit-scrollbar-thumb,.logRows::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--pink),var(--cyan));border-radius:999px;border:3px solid rgba(4,5,18,.75)}
.eventsLayout .card,#shopCard,.cardsCasino,.petsCasino,.gangCasino{height:100%;min-height:0;display:flex;flex-direction:column}.eventsLayout .rows,#shopRows,.petGrid,.gangMembersList,#gangRows{flex:1;min-height:0;overflow:auto;padding-bottom:44px}.eventBig,.logBig{max-height:none!important}.shopLayout{height:100%}.shopLayout #shopRows{display:grid;gap:10px;align-content:start}
.cardsCasinoGrid{display:grid;grid-template-columns:520px minmax(0,1fr);gap:16px;min-height:0;flex:1}.cardsLeftCol,.cardsRightCol{display:grid;gap:14px;align-content:start;min-height:0}.cardsLeftCol{grid-template-rows:auto minmax(0,1fr)}.cardsMiniCard,.cardsRightCol{border:1px solid rgba(255,255,255,.12);border-radius:22px;padding:14px;background:linear-gradient(180deg,rgba(7,12,32,.72),rgba(14,24,56,.58));box-shadow:inset 0 0 26px rgba(255,255,255,.03);min-height:0}.cardsRightCol{display:flex;flex-direction:column}.cardsGrid.cardsBig{grid-template-columns:repeat(auto-fill,minmax(118px,1fr));max-height:none!important;overflow:auto!important;padding-right:6px;padding-bottom:44px;gap:10px}.setBoxScroll{overflow:auto;padding-bottom:36px}.setGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.chestGrid{grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}.miniCard{min-height:90px;padding:10px;border-radius:16px;display:flex;flex-direction:column;justify-content:center;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025))}.miniCard .ci{font-size:24px;margin-bottom:4px}.miniCard b{font-size:13px;line-height:1.1}.miniCard small{font-size:10px;line-height:1.2}.chestCard{min-height:118px;padding:12px}
.vBuild.emptyPlot{border-style:dashed;background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(34,247,255,.08));box-shadow:0 0 28px rgba(34,247,255,.12);animation:emptyPulse 1.9s ease-in-out infinite}.vBuild.emptyPlot small{color:#fff;background:linear-gradient(135deg,rgba(255,47,215,.55),rgba(34,247,255,.55))}@keyframes emptyPulse{50%{filter:brightness(1.25);transform:translateX(-50%) translateY(-4px)}}
.building.emptyBuilding{border-style:dashed;border-color:rgba(34,247,255,.35);background:linear-gradient(180deg,rgba(34,247,255,.09),rgba(255,47,215,.05))}.building.emptyBuilding .ico{background:linear-gradient(135deg,rgba(255,47,215,.28),rgba(34,247,255,.22));border-radius:18px}.buildDesc{display:block;color:var(--muted);font-size:12px;line-height:1.35;min-height:32px}.buildChoices{display:grid;gap:5px;margin:8px 0}.buildChoices span{font-size:11px;color:#dce8ff;border:1px solid rgba(255,255,255,.10);border-radius:999px;padding:4px 7px;background:rgba(255,255,255,.045);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gangCasino{display:grid;grid-template-rows:auto auto auto 1fr;gap:14px;min-height:0}.gangHero{display:grid;grid-template-columns:1.2fr .8fr;gap:14px;min-height:0}.gangActionCard,.gangChestCard,.gangPerkSection,.gangColumn{border:1px solid rgba(255,255,255,.12);border-radius:24px;padding:14px;background:linear-gradient(180deg,rgba(8,13,34,.72),rgba(18,26,58,.48));box-shadow:inset 0 0 26px rgba(255,255,255,.03)}.gangSelfBanner{min-height:54px;display:flex;align-items:center}.gangStatsGrid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:10px}.gangStat{border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:12px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));display:grid;gap:4px;min-height:92px;align-content:center}.gangStat small{color:var(--muted);font-weight:900}.gangStat b{font-size:20px;letter-spacing:-.03em}.gIcon{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(255,47,215,.22),rgba(34,247,255,.16));box-shadow:inset 0 0 18px rgba(255,255,255,.06)}.gangPerks{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}.gangPerk{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:center;border:1px solid rgba(255,255,255,.10);border-radius:18px;padding:10px 12px;background:rgba(255,255,255,.045)}.gangPerk small,.gangChestHead small{display:block;color:var(--muted)}.gangChestMeta{display:flex;justify-content:space-between;color:#dfeaff;font-weight:900}.gangColumns{display:grid;grid-template-columns:1.12fr .88fr;gap:14px;min-height:0}.gangColumn{display:grid;min-height:0}.statusBadge{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;border:1px solid rgba(255,255,255,.10);font-size:11px;font-weight:1000;margin-left:8px;background:rgba(255,255,255,.06)}.statusBadge.on{background:rgba(72,255,176,.14);border-color:rgba(72,255,176,.26);color:#b8ffd8}.statusBadge.off{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.11);color:#d2d9ea}.leaderName{display:flex;align-items:center;flex-wrap:wrap}
.petActiveBanner{line-height:1.45}.petFoodHint{margin-bottom:12px}.petTimer{margin:8px 0;padding:6px 8px;border-radius:12px;background:rgba(34,247,255,.08);border:1px solid rgba(34,247,255,.18);font-weight:1000;color:#dffcff}.petCard.active{border-color:rgba(72,255,176,.55);box-shadow:0 0 34px rgba(72,255,176,.16), inset 0 0 26px rgba(72,255,176,.05)}
@media(max-width:1520px) and (min-width:861px){.cardsCasinoGrid{grid-template-columns:420px minmax(0,1fr)}.gangStatsGrid{grid-template-columns:repeat(4,minmax(0,1fr))}.gangPerks{grid-template-columns:repeat(3,minmax(0,1fr))}.chestGrid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1180px) and (min-width:861px){.cardsCasinoGrid,.gangHero,.gangColumns{grid-template-columns:1fr}.cardsGrid.cardsBig{grid-template-columns:repeat(auto-fill,minmax(108px,1fr))}}
@media(max-width:860px){.eventsLayout .rows,#shopRows,.cardsGrid.cardsBig{max-height:none;overflow:visible}.cardsCasinoGrid,.gangHero,.gangColumns,.chatLayout{grid-template-columns:1fr}.gangStatsGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.gangPerks{grid-template-columns:repeat(2,minmax(0,1fr))}.chestGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.setGrid{grid-template-columns:1fr}.villageStatsGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}


.villageLayout{height:100%;min-height:0}.villageLayout .card{height:100%;min-height:0;display:flex;flex-direction:column}.villageLayout #buildings{overflow:auto;min-height:0;padding-bottom:44px;scrollbar-gutter:stable}.villageLayout #buildings::-webkit-scrollbar{height:12px;width:12px}.villageLayout #buildings::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--pink),var(--cyan));border-radius:999px;border:3px solid rgba(4,5,18,.75)}


/* ===== FULL INDEX CASINO UI PATCH ===== */
html{scroll-behavior:smooth}body{background-attachment:fixed}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:rgba(255,255,255,.04);border-radius:999px}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--pink),var(--cyan));border-radius:999px;border:2px solid rgba(6,8,22,.7)}
.wrap{position:relative}.topbar{padding:14px 16px;border:1px solid rgba(255,255,255,.12);border-radius:28px;background:linear-gradient(180deg,rgba(13,19,44,.84),rgba(7,10,29,.62));box-shadow:0 24px 80px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.06)}.brand h1{text-shadow:0 0 25px rgba(255,255,255,.09)}.pill{background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));border-color:rgba(255,255,255,.12);box-shadow:inset 0 0 20px rgba(255,255,255,.03),0 10px 24px rgba(0,0,0,.18)}.pill b{font-size:18px}.quickNav.tabNav{position:relative;overflow:hidden}.quickNav.tabNav:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.07),transparent);transform:translateX(-100%);animation:navSweep 5s linear infinite}@keyframes navSweep{to{transform:translateX(100%)}}
.heroRibbon{margin:12px 0 14px;padding:10px;border:1px solid rgba(255,255,255,.11);border-radius:28px;background:radial-gradient(circle at 12% 20%,rgba(255,47,215,.18),transparent 35%),radial-gradient(circle at 88% 12%,rgba(34,247,255,.15),transparent 35%),linear-gradient(180deg,rgba(12,17,43,.82),rgba(7,10,29,.62));box-shadow:0 22px 70px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.05)}.ribbonGrid{display:grid;grid-template-columns:1.25fr .9fr .9fr;gap:10px}.ribbonCard{position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.10);border-radius:22px;padding:14px 16px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03))}.ribbonCard:after{content:"";position:absolute;right:-46px;bottom:-72px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(34,247,255,.14),transparent 62%)}.ribbonKicker{display:inline-flex;padding:6px 9px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.10);font-size:11px;font-weight:1000;text-transform:uppercase;letter-spacing:.08em;color:#dff9ff;margin-bottom:8px}.ribbonTitle{font-size:clamp(20px,2.2vw,31px);line-height:.96;letter-spacing:-.055em;margin:0 0 8px}.ribbonText,.ribbonMini small{color:#cfdcff;line-height:1.45;font-size:13px}.ribbonMini b{display:block;font-size:18px;line-height:1.15;margin-bottom:6px}
.machineCasino{position:relative;padding:20px;background:radial-gradient(circle at 50% 0%,rgba(255,209,102,.13),transparent 20%),radial-gradient(circle at 10% 18%,rgba(255,47,215,.16),transparent 28%),linear-gradient(180deg,rgba(53,14,80,.58),rgba(9,16,46,.88) 48%,rgba(5,7,20,.96));box-shadow:0 34px 110px rgba(0,0,0,.48),0 0 80px rgba(255,47,215,.10),inset 0 1px 0 rgba(255,255,255,.05)}.machineCasino:after{content:"";position:absolute;inset:8px;border-radius:calc(var(--radius) - 8px);border:1px solid rgba(255,255,255,.05);pointer-events:none}.casinoCabinetTop{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;margin-bottom:14px;position:relative;z-index:2}.casinoMarquee{height:42px;border-radius:999px;border:1px solid rgba(255,209,102,.28);background:linear-gradient(180deg,rgba(255,209,102,.15),rgba(255,47,215,.09));box-shadow:inset 0 0 24px rgba(255,209,102,.08),0 0 28px rgba(255,47,215,.12);overflow:hidden;display:flex;align-items:center;position:relative}.casinoMarquee:before,.casinoMarquee:after{content:"";position:absolute;top:0;bottom:0;width:34px;z-index:2;pointer-events:none}.casinoMarquee:before{left:0;background:linear-gradient(90deg,rgba(28,12,47,.96),rgba(28,12,47,0))}.casinoMarquee:after{right:0;background:linear-gradient(270deg,rgba(15,14,42,.96),rgba(15,14,42,0))}.casinoMarqueeTrack{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;padding-right:10px;min-width:max-content;will-change:transform;transform:translate3d(0,0,0);backface-visibility:hidden;animation:marqueeMove 36s linear infinite}.casinoMarquee:hover .casinoMarqueeTrack{animation-play-state:paused}.casinoMarqueeItem{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.06);font-weight:1000;letter-spacing:.03em;color:#fff3bc;text-shadow:0 0 16px rgba(255,209,102,.25)}.casinoMarqueeItem.hot{border-color:rgba(255,209,102,.34);background:linear-gradient(180deg,rgba(255,209,102,.16),rgba(255,47,215,.12));box-shadow:0 0 20px rgba(255,209,102,.12)}.casinoMarqueeItem.clock{border-color:rgba(34,247,255,.38);color:#dffbff;background:linear-gradient(180deg,rgba(34,247,255,.16),rgba(255,209,102,.09));box-shadow:0 0 20px rgba(34,247,255,.13)}@keyframes marqueeMove{from{transform:translateX(0)}to{transform:translateX(-50%)}}.casinoBulbs{display:flex;gap:6px}.casinoBulbs i{width:10px;height:10px;border-radius:50%;background:var(--gold);box-shadow:0 0 14px rgba(255,209,102,.8);animation:bulbPulse .9s steps(2,end) infinite}.casinoBulbs i:nth-child(even){background:var(--cyan);box-shadow:0 0 14px rgba(34,247,255,.75);animation-delay:.28s}.casinoBulbs i:nth-child(3n){background:var(--pink);box-shadow:0 0 14px rgba(255,47,215,.75);animation-delay:.5s}@keyframes bulbPulse{50%{opacity:.35;filter:saturate(.6)}}.machineName{font-size:clamp(24px,2.3vw,36px);text-shadow:0 0 30px rgba(255,255,255,.10);letter-spacing:-.06em}.machineTop{align-items:center}.jackpotMeter{border:1px solid rgba(255,209,102,.16);border-radius:18px;padding:10px;background:rgba(0,0,0,.18);box-shadow:inset 0 0 22px rgba(255,209,102,.04)}
.casinoSlotBody{padding:28px;border-radius:38px;background:linear-gradient(135deg,rgba(255,47,215,.26),rgba(9,21,58,.94) 44%,rgba(34,247,255,.20));box-shadow:inset 0 0 60px rgba(255,255,255,.06),0 0 54px rgba(255,47,215,.18),0 28px 46px rgba(0,0,0,.28);overflow:hidden}.casinoGlass{position:absolute;inset:18px;border-radius:30px;background:linear-gradient(120deg,rgba(255,255,255,.12),transparent 24%,transparent 62%,rgba(255,255,255,.06));pointer-events:none;z-index:5;mix-blend-mode:screen}.casinoSideRail{position:absolute;top:18px;bottom:18px;width:8px;border-radius:999px;background:linear-gradient(180deg,var(--gold),var(--pink),var(--cyan));box-shadow:0 0 18px rgba(255,255,255,.35);z-index:6}.casinoSideRail.left{left:12px}.casinoSideRail.right{right:12px}.payline{height:4px}.payline span{position:absolute;left:33%;top:-13px;transform:translateX(-50%);font-size:10px;letter-spacing:.16em;font-weight:1000;color:#fff3bc;text-shadow:0 0 12px rgba(255,209,102,.9);background:rgba(0,0,0,.45);border:1px solid rgba(255,209,102,.25);border-radius:999px;padding:3px 8px}.reels{gap:18px}.reel{height:222px;border-radius:30px;background:radial-gradient(circle at 50% 10%,rgba(255,255,255,.20),transparent 28%),linear-gradient(180deg,#17245c 0%,#080c22 58%,#030512 100%);box-shadow:inset 0 20px 46px rgba(0,0,0,.68),inset 0 -12px 24px rgba(34,247,255,.05),0 20px 34px rgba(0,0,0,.28);border-color:rgba(255,255,255,.20)}.reel:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.12),transparent 24%,transparent 70%,rgba(0,0,0,.22));pointer-events:none}.reelStrip{gap:8px}.reelCell{height:62px;min-width:106px;border-radius:21px;background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.035));font-size:48px;border:1px solid rgba(255,255,255,.07)}.reel.landing{animation:reelLand .34s ease}@keyframes reelLand{0%{transform:scale(1)}45%{transform:scale(1.04);box-shadow:0 0 40px rgba(255,209,102,.30),inset 0 20px 46px rgba(0,0,0,.68)}100%{transform:scale(1)}}.reel.spin .reelStrip{animation:slotRoll .095s linear infinite;filter:blur(1.8px)}
.casinoPayTable{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;margin:12px 0 2px}.casinoPayTable>div{border:1px solid rgba(255,255,255,.10);border-radius:16px;padding:9px 10px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));text-align:center}.casinoPayTable b{display:block;font-size:12px}.casinoPayTable small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.lever{box-shadow:inset 0 0 25px rgba(255,255,255,.04),0 18px 32px rgba(0,0,0,.25)}.autoSpinBtn,.spinBtn{box-shadow:0 18px 44px rgba(34,247,255,.18),0 0 38px rgba(255,47,215,.22)}.resultBox{background:linear-gradient(180deg,rgba(5,10,28,.75),rgba(255,255,255,.035));border-color:rgba(255,255,255,.12);box-shadow:inset 0 0 28px rgba(255,255,255,.025)}.card{box-shadow:0 26px 88px rgba(0,0,0,.40),inset 0 1px 0 rgba(255,255,255,.04)}.sectionTitle h2,.sectionTitle h3{letter-spacing:-.04em;text-shadow:0 0 20px rgba(255,255,255,.08)}.building,.miniCard,.leader,.logItem,.eventItem,.shopItem,.mission,.chestCard,.petCard{transition:.18s transform,.18s border-color,.18s box-shadow}.building:hover,.miniCard:hover,.leader:hover,.logItem:hover,.eventItem:hover,.shopItem:hover,.mission:hover,.chestCard:hover,.petCard:hover{transform:translateY(-2px);border-color:rgba(34,247,255,.25);box-shadow:0 18px 32px rgba(0,0,0,.20),0 0 0 1px rgba(34,247,255,.08)}.eventRows,.logRows,.leaderRows,.rows{scrollbar-gutter:stable}.eventRows,.logRows,.leaderRows{padding-bottom:14px}.spinPopupBox,.modalBox{box-shadow:0 34px 120px rgba(0,0,0,.70),0 0 70px rgba(255,47,215,.18),0 0 0 1px rgba(255,255,255,.06)}
@media(max-width:1420px){.ribbonGrid{grid-template-columns:1fr}.casinoPayTable{grid-template-columns:repeat(3,minmax(0,1fr))}.reel{height:190px}.reelCell{height:54px;font-size:42px}}@media(max-width:860px){.heroRibbon{padding:8px}.ribbonGrid{grid-template-columns:1fr}.casinoCabinetTop{grid-template-columns:1fr}.casinoBulbs{justify-content:center}.casinoMarquee{height:38px}.casinoPayTable{grid-template-columns:repeat(2,minmax(0,1fr))}.reel{height:142px}.reelCell{height:44px;min-width:74px;font-size:34px}.casinoSlotBody{padding:22px 18px}.payline span{display:none}}


/* --- Spin layout fix: controls always visible and clickable --- */
.machineCasino{min-height:0 !important;padding:16px 18px 18px !important;overflow:visible !important}
.threeStageLayer{position:absolute;inset:8px;border-radius:calc(var(--radius) - 8px);overflow:hidden;pointer-events:none;z-index:1;opacity:.92;mix-blend-mode:screen;background:radial-gradient(circle at 18% 18%,rgba(255,47,215,.28),transparent 22%),radial-gradient(circle at 82% 22%,rgba(34,247,255,.30),transparent 24%),radial-gradient(circle at 48% 78%,rgba(255,209,102,.20),transparent 30%),repeating-linear-gradient(115deg,rgba(34,247,255,.07) 0 2px,transparent 2px 36px),linear-gradient(135deg,rgba(11,14,48,.38),rgba(9,28,62,.28))}.threeStageLayer:before{content:"";position:absolute;inset:-18%;background:radial-gradient(circle at 22% 40%,rgba(255,47,215,.45),transparent 12%),radial-gradient(circle at 72% 32%,rgba(34,247,255,.42),transparent 14%),radial-gradient(circle at 52% 58%,rgba(255,209,102,.34),transparent 11%);filter:blur(10px);animation:threeOrbs 6.5s ease-in-out infinite alternate}.threeStageLayer:after{content:"";position:absolute;left:50%;top:50%;width:78%;height:78%;transform:translate(-50%,-50%);border-radius:50%;background:conic-gradient(from 0deg,rgba(34,247,255,.0),rgba(34,247,255,.38),rgba(255,47,215,.32),rgba(255,209,102,.26),rgba(34,247,255,.0));filter:blur(18px);opacity:.58;animation:threeSpin 18s linear infinite}.threeStageLayer canvas{position:absolute;inset:0;width:100%!important;height:100%!important;display:block;filter:saturate(1.35) contrast(1.12) brightness(1.18);opacity:.96}.threeStageGlow{position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,7,24,.02),rgba(4,7,24,.16));box-shadow:inset 0 0 120px rgba(0,0,0,.22),inset 0 0 90px rgba(34,247,255,.08);pointer-events:none}.machineCasino>.coinBurst,.machineCasino>.casinoCabinetTop,.machineCasino>.machineTop,.machineCasino>.casinoHud,.machineCasino>.casinoControlDeck,.machineCasino>.casinoSlotBody,.machineCasino>.casinoPayTable,.machineCasino>.resultBox{position:relative;z-index:3}.machineCasino.threeOff .threeStageLayer{display:none}.machineCasino.threeActive{box-shadow:0 34px 110px rgba(0,0,0,.48),0 0 120px rgba(34,247,255,.20),0 0 120px rgba(255,47,215,.18),inset 0 1px 0 rgba(255,255,255,.05)}@keyframes threeOrbs{from{transform:translate3d(-1.5%,1%,0) scale(1)}to{transform:translate3d(2%,-1%,0) scale(1.07)}}@keyframes threeSpin{from{transform:translate(-50%,-50%) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(360deg)}}@media(max-width:900px),(prefers-reduced-motion:reduce){.threeStageLayer{display:none!important}}
.machineCasino .casinoCabinetTop{margin-bottom:10px !important}
.machineCasino .casinoMarquee{height:38px !important}
.machineCasino .machineTop{margin-bottom:10px !important;align-items:center !important}
.machineCasino .machineName{font-size:clamp(24px,2vw,32px) !important}
.machineCasino .eventBanner{padding:8px 11px !important;margin-top:8px !important}
.casinoControlDeck{display:grid;grid-template-columns:minmax(0,1fr) minmax(330px,390px);gap:12px;align-items:center;margin:10px 0 12px;position:relative;z-index:20}
.casinoControlDeck .spinBetPanel{margin:0 !important;display:grid;grid-template-columns:minmax(0, 1fr) 300px;gap:10px}
.casinoControlDeck .betBox,.casinoControlDeck .spinBank{min-height:54px !important;padding:8px 10px !important;border-radius:20px !important}
.casinoControlDeck .betBox{flex-wrap:wrap !important}
.casinoControlDeck .betBtn{padding:8px 11px !important;border-radius:13px !important}
.casinoControlDeck .leverWrap{margin:0 !important;display:grid !important;grid-template-columns:78px minmax(0,1fr) !important;gap:10px !important;align-items:center !important}
.casinoControlDeck .lever{height:76px !important;min-height:76px !important;z-index:21}
.casinoControlDeck .lever:before{height:48px !important;width:14px !important}
.casinoControlDeck .lever:after{width:34px !important;height:34px !important;top:8px !important}
.casinoControlDeck .lever.pulled:after{transform:translate(13px,24px) !important}
.casinoControlDeck .autoSpinBtn{height:58px !important;border-radius:20px !important;font-size:18px !important;z-index:21}
.machineCasino .casinoSlotBody{padding:20px 22px !important;border-radius:32px !important}
.machineCasino .reel{height:162px !important;border-radius:26px !important}
.machineCasino .reelCell{height:48px !important;min-width:92px !important;font-size:40px !important}
.machineCasino .casinoPayTable{margin:10px 0 0 !important;grid-template-columns:repeat(6,minmax(0,1fr)) !important}
.machineCasino .casinoPayTable>div{padding:7px 8px !important;border-radius:14px !important}
.machineCasino .casinoPayTable b{font-size:11px !important}.machineCasino .casinoPayTable small{font-size:9px !important}
.machineCasino .resultBox{margin-top:10px !important;min-height:44px !important;padding:11px 14px !important;border-radius:18px !important}
.slotLayout{align-items:start !important}
@media(max-width:1420px){.casinoControlDeck{grid-template-columns:1fr}.casinoControlDeck .leverWrap{grid-template-columns:78px 1fr !important}.machineCasino .reel{height:150px !important}.machineCasino .casinoPayTable{grid-template-columns:repeat(3,minmax(0,1fr)) !important}}
@media(max-width:860px){.casinoControlDeck{grid-template-columns:1fr}.casinoControlDeck .spinBetPanel{grid-template-columns:1fr}.casinoControlDeck .leverWrap{grid-template-columns:70px 1fr !important}.machineCasino .reel{height:126px !important}.machineCasino .reelCell{height:40px !important;font-size:32px !important}.machineCasino .casinoPayTable{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}



/* --- Smart render + login/register merge patch --- */
.casinoHero{display:none!important}.loginBox.authPro{width:min(1220px,100%);grid-template-columns:1.05fr .95fr;align-items:stretch}.loginSideStack{display:grid;gap:14px}.onlineLoginCard{padding:18px;border-radius:var(--radius);background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04));border:1px solid var(--line);box-shadow:var(--shadow);backdrop-filter:blur(18px)}.onlineLoginRows{display:grid;gap:8px;margin-top:10px}.onlineLoginRow{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px;border-radius:16px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05)}.onlineDot{width:10px;height:10px;border-radius:50%;background:var(--green);box-shadow:0 0 18px rgba(72,255,176,.8)}.onlineLoginRow b{display:block}.onlineLoginRow small{display:block;color:var(--muted);font-size:12px}.checkRow{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;padding:11px 12px;border:1px solid rgba(255,255,255,.10);border-radius:16px;background:rgba(255,255,255,.045);color:#dbe8ff;font-size:13px;line-height:1.35}.checkRow input{width:18px;height:18px;margin:0;accent-color:#20f7ff}.renderFlash{animation:renderFlash .28s ease}@keyframes renderFlash{from{filter:brightness(1.22);transform:translateY(-1px)}to{filter:none;transform:none}}.tabPanel.active{animation:tabIn .18s ease}@keyframes tabIn{from{opacity:.82;transform:translateY(6px)}to{opacity:1;transform:none}}@media(max-width:920px){.loginBox.authPro{grid-template-columns:1fr}.loginSideStack{order:2}}


/* --- Village builder + casino HUD polish --- */
.casinoHud{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:12px 0}.hudCard{padding:10px 12px;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.03));box-shadow:inset 0 0 20px rgba(255,255,255,.025)}.hudCard small{display:block;color:var(--muted);font-size:11px;font-weight:1000;text-transform:uppercase;letter-spacing:.07em}.hudCard b{display:block;font-size:18px;color:#fff;margin-top:4px}.machineCasino{position:relative}.machineCasino:after{content:'';position:absolute;left:18px;right:18px;top:88px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,209,102,.65),transparent);box-shadow:0 0 18px rgba(255,209,102,.35);pointer-events:none}.builderChoices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}.builderChoice{border:1px solid rgba(255,255,255,.13);border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));padding:14px;text-align:left;color:#fff;cursor:pointer;transition:.18s transform,.18s border-color,.18s box-shadow}.builderChoice:hover{transform:translateY(-2px);border-color:rgba(34,247,255,.38);box-shadow:0 0 32px rgba(34,247,255,.12)}.builderChoice .bIcon{font-size:34px;margin-bottom:8px}.builderChoice b{display:block;font-size:16px}.builderChoice small{display:block;color:var(--muted);line-height:1.35;margin-top:4px}.builderChoice .price{display:inline-flex;margin-top:10px;padding:5px 9px;border-radius:999px;background:rgba(255,209,102,.13);border:1px solid rgba(255,209,102,.25);color:#ffe2a0;font-weight:1000}.building.emptyBuilding{cursor:pointer}.building.emptyBuilding:after{content:'Klikni a vyber styl';position:absolute;right:12px;top:12px;font-size:10px;font-weight:1000;color:#bffcff;padding:5px 8px;border-radius:999px;background:rgba(34,247,255,.10);border:1px solid rgba(34,247,255,.20)}.vBuild{animation:villageFloat 3.2s ease-in-out infinite}.vBuild.vSlot1{animation-delay:.25s}.vBuild.vSlot2{animation-delay:.5s}.vBuild.vSlot3{animation-delay:.75s}.vBuild.vSlot4{animation-delay:1s}@keyframes villageFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}.vBuild.l5{animation:villageFloat 3.2s ease-in-out infinite, villageGlow 2.4s ease-in-out infinite}@keyframes villageGlow{50%{filter:brightness(1.25) drop-shadow(0 0 16px rgba(255,209,102,.45))}}.deluxeVillage{background:linear-gradient(180deg,rgba(18,28,82,.92),rgba(6,9,26,.96))}.deluxeVillage .vRoad{animation:roadPulse 2.4s ease-in-out infinite}@keyframes roadPulse{50%{box-shadow:0 0 34px rgba(34,247,255,.42);filter:brightness(1.25)}}.chatComposer{position:relative;z-index:3}.chatComposer .input{min-height:48px}.chatSendState{opacity:.65;pointer-events:none}@media(max-width:860px){.casinoHud,.builderChoices{grid-template-columns:1fr}.builderModalBox{max-height:calc(100vh - 28px);overflow:auto}}

.vBuild.emptyPlot{animation:villageFloat 3.2s ease-in-out infinite!important}.vBuild.emptyPlot:hover,.vBuild:hover{filter:brightness(1.18)}

/* --- Chat fix + jackpot HUD cleanup --- */
.jackpotMeter{display:none!important}
.casinoHud{grid-template-columns:minmax(220px,340px)}
.hudCard.jackpotChance{border-color:rgba(255,209,102,.24);background:linear-gradient(180deg,rgba(255,209,102,.10),rgba(34,247,255,.05))}
.chatComposer .input:focus{border-color:rgba(34,247,255,.45);box-shadow:0 0 0 3px rgba(34,247,255,.08)}
.chatSendState{opacity:.65;pointer-events:none;filter:saturate(.6)}


/* --- HUD cleanup: only jackpot chance card --- */
.casinoHud.jackpotOnlyHud{grid-template-columns:minmax(220px,340px)!important;justify-content:flex-start;margin:10px 0 12px}
.casinoHud.jackpotOnlyHud .hudCard{min-height:64px}
.casinoHud.jackpotOnlyHud .hudCard small{font-size:12px}
.casinoHud.jackpotOnlyHud .hudCard b{font-size:24px;color:#ffe9a6}


/* === Better Empire Map patch for full casino build === */
.mapLayout{height:100%;min-height:0}.mapCasino{height:100%;min-height:0;display:flex;flex-direction:column;gap:14px;overflow:hidden}.mapHero{display:grid;grid-template-columns:1.4fr repeat(3,minmax(150px,.7fr));gap:12px}.mapHeroMain,.mapStat{border:1px solid rgba(255,255,255,.11);border-radius:22px;padding:15px 16px;background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035));box-shadow:inset 0 0 24px rgba(255,255,255,.025)}.mapHeroMain small,.mapStat small{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:1000}.mapHeroMain b,.mapStat b{display:block;font-size:clamp(18px,1.7vw,28px);letter-spacing:-.04em;margin-top:4px}.mapHeroMain span,.mapStat span{display:block;color:#dbe8ff;font-size:12px;margin-top:5px}.mapRoad{display:flex;gap:8px;align-items:center;overflow:auto;padding:8px 4px 10px}.mapRoadNode{min-width:82px;border:1px solid rgba(255,255,255,.11);border-radius:18px;padding:10px 8px;background:linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025));color:#fff;cursor:pointer}.mapRoadNode b{display:block;font-size:15px}.mapRoadNode small{display:block;color:var(--muted);font-size:11px;margin-top:3px}.mapRoadNode.done{background:linear-gradient(180deg,rgba(72,255,176,.14),rgba(72,255,176,.045));border-color:rgba(72,255,176,.25)}.mapRoadNode.current{background:linear-gradient(135deg,var(--pink),var(--cyan));box-shadow:0 0 25px rgba(34,247,255,.24);transform:translateY(-2px)}.mapRoadNode.boss{border-color:rgba(255,209,102,.35);box-shadow:0 0 22px rgba(255,209,102,.10)}.mapFilterBar{display:flex;gap:8px;flex-wrap:wrap}.mapFilterBar button{border:1px solid rgba(255,255,255,.11);border-radius:999px;padding:9px 12px;background:rgba(255,255,255,.055);color:#fff;font-weight:1000;cursor:pointer}.mapFilterBar button.active{background:linear-gradient(135deg,var(--pink),var(--cyan));box-shadow:0 0 22px rgba(34,247,255,.18)}.mapLegend{display:flex;gap:12px;flex-wrap:wrap;color:var(--muted);font-size:12px;font-weight:900}.mapLegend span{display:inline-flex;align-items:center;gap:6px}.mapLegend i{width:12px;height:12px;border-radius:4px;background:rgba(255,255,255,.18)}.mapLegend i.done{background:var(--green)}.mapLegend i.current{background:var(--cyan)}.mapLegend i.boss{background:var(--gold)}.mapLegend i.locked{background:#667085}.betterEmpireMap{display:block!important;max-height:none!important;overflow:auto!important;flex:1;min-height:0;padding-right:8px}.mapSector{margin-bottom:14px;border:1px solid rgba(255,255,255,.10);border-radius:24px;padding:12px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.02))}.mapSectorHead{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:10px}.mapSectorHead b{font-size:16px}.mapSectorHead span{color:var(--muted);font-size:12px;font-weight:900}.mapSectorGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:9px}.mapNode{min-height:76px;text-align:left;border-radius:18px;padding:10px;border:1px solid rgba(255,255,255,.10);background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));color:#eaf3ff;cursor:pointer;transition:.18s transform,.18s border-color,.18s box-shadow}.mapNode:hover{transform:translateY(-2px);border-color:rgba(34,247,255,.28);box-shadow:0 15px 28px rgba(0,0,0,.18)}.mapNode b{display:block;font-size:16px}.mapNode small{display:block;color:#dbe8ff;font-size:10px;line-height:1.2;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mapNode em{display:block;font-style:normal;color:var(--muted);font-size:10px;margin-top:6px}.mapNode.done{background:linear-gradient(180deg,rgba(72,255,176,.14),rgba(72,255,176,.035));border-color:rgba(72,255,176,.24)}.mapNode.current{background:linear-gradient(135deg,rgba(255,47,215,.85),rgba(34,247,255,.78));color:#fff;box-shadow:0 0 28px rgba(34,247,255,.24)}.mapNode.current small,.mapNode.current em{color:#fff}.mapNode.boss{border-color:rgba(255,209,102,.38)}.mapNode.locked{opacity:.64;filter:saturate(.75)}.mapNode.current.locked{opacity:1;filter:none}@media(max-width:980px){.mapHero{grid-template-columns:1fr 1fr}.mapSectorGrid{grid-template-columns:repeat(auto-fill,minmax(86px,1fr))}}@media(max-width:620px){.mapHero{grid-template-columns:1fr}.mapRoadNode{min-width:72px}.mapSectorHead{display:block}.mapSectorGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* attack target picker + raid polish */
.attackTargets.pickTargets{grid-template-columns:repeat(2,minmax(0,1fr));}.attackTarget.targetCard{place-items:stretch;text-align:left;min-height:150px;background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.035));}.attackTarget.targetCard b{font-size:18px}.attackTarget.targetCard .targetTag{display:inline-flex;border-radius:999px;padding:4px 8px;background:linear-gradient(135deg,rgba(255,47,215,.24),rgba(34,247,255,.16));font-size:11px;font-weight:1000}.targetStats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:8px}.targetStats span{border:1px solid rgba(255,255,255,.10);border-radius:12px;padding:6px;background:rgba(255,255,255,.05);font-size:11px}.targetStats strong{display:block;color:var(--cyan);font-size:13px}.vault span{display:block;text-align:center}.vault .hint{font-size:10px;color:var(--muted);margin-top:4px}.vault.opened .hint{color:#fff}.raidBox{width:min(940px,100%)}



/* Raid trezorů - premium oprava překrývání textu */
.raidBox{width:min(980px,100%)!important;padding:26px!important;overflow:hidden}.raidHeader{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 10px}.raidStat{border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:11px 13px;background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.03));box-shadow:inset 0 0 22px rgba(255,255,255,.025)}.raidStat small{display:block;color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.07em;margin-bottom:4px}.raidStat b{font-size:18px;color:#eef7ff}.raidHintText{margin:10px 0 14px!important}.raidVaults{grid-template-columns:repeat(6,minmax(118px,1fr))!important;gap:12px!important}.raidVaults .vault{aspect-ratio:auto!important;min-height:142px!important;padding:12px!important;display:grid!important;grid-template-rows:auto 1fr auto!important;place-items:stretch!important;text-align:center;border-radius:24px!important;overflow:hidden!important;background:linear-gradient(180deg,rgba(255,255,255,.105),rgba(255,255,255,.035))!important}.raidVaults .vault:before{content:""!important;display:none!important}.vaultIcon{font-size:34px;line-height:1;filter:drop-shadow(0 0 18px rgba(255,209,102,.30));margin:2px 0 6px}.vaultTitle{display:block!important;position:static!important;left:auto!important;right:auto!important;bottom:auto!important;font-size:13px!important;line-height:1.15!important;color:#f4f7ff!important;font-weight:1000!important;text-align:center!important;white-space:normal!important;overflow:hidden!important;overflow-wrap:anywhere!important;min-height:30px}.vaultHint{display:block!important;position:static!important;font-size:10px!important;line-height:1.25!important;color:var(--muted)!important;text-align:center!important;margin-top:7px!important;padding:4px 7px!important;border-radius:999px!important;background:rgba(255,255,255,.055)!important;border:1px solid rgba(255,255,255,.08)!important;white-space:normal!important}.vaultValue{display:grid;place-items:center;min-height:42px;font-size:22px;font-weight:1000;color:var(--gold);text-shadow:0 0 18px rgba(255,209,102,.22)}.raidVaults .vault.opened{background:linear-gradient(180deg,rgba(255,209,102,.22),rgba(34,247,255,.10))!important;border-color:rgba(255,209,102,.34)!important}.raidVaults .vault.opened:before{content:""!important;display:none!important}.raidVaults .vault.opened span{display:block!important}.raidVaults .vault:hover:not(:disabled){transform:translateY(-3px);border-color:rgba(34,247,255,.34);box-shadow:0 18px 30px rgba(0,0,0,.23),0 0 24px rgba(34,247,255,.10)}.raidVaults .vault.lastPick{border-color:rgba(72,255,176,.70)!important;box-shadow:0 0 0 2px rgba(72,255,176,.18),0 0 34px rgba(72,255,176,.24)!important;animation:raidRevealPulse .75s ease both}.raidVaults .vault.finalPick{border-color:rgba(255,209,102,.78)!important;box-shadow:0 0 0 2px rgba(255,209,102,.22),0 0 42px rgba(255,209,102,.28)!important}.raidDoneBox{border-color:rgba(255,209,102,.32)!important;background:linear-gradient(135deg,rgba(255,209,102,.16),rgba(72,255,176,.08),rgba(34,247,255,.08))!important;font-weight:1000}.raidCloseHint{display:inline-flex;margin-left:8px;color:var(--muted);font-size:12px;font-weight:800}@keyframes raidRevealPulse{from{transform:scale(.96);filter:brightness(1.4)}to{transform:none;filter:none}}@media(max-width:860px){.raidHeader{grid-template-columns:repeat(2,minmax(0,1fr))}.raidVaults{grid-template-columns:repeat(2,minmax(0,1fr))!important}.raidVaults .vault{min-height:130px!important}}


/* --- Village diversity + readable labels + powered card album --- */
.villageStage.deluxeVillage{overflow:hidden!important}
.vBuild{padding-bottom:0!important;align-items:center!important;justify-content:center!important;min-width:60px!important}
.vBuild .vEmoji{font-size:31px!important;line-height:1!important;margin:0!important;transform:translateY(-5px);filter:drop-shadow(0 0 14px rgba(255,255,255,.24)) drop-shadow(0 0 18px rgba(34,247,255,.18))!important}
.vBuild .vBadge{top:-28px!important;left:50%!important;right:auto!important;transform:translateX(-50%);z-index:4!important;background:linear-gradient(135deg,rgba(255,47,215,.32),rgba(34,247,255,.22))!important;box-shadow:0 0 16px rgba(34,247,255,.20);white-space:nowrap}
.vBuild .vName{left:50%!important;right:auto!important;bottom:-28px!important;transform:translateX(-50%);z-index:5!important;min-width:86px;max-width:132px;padding:4px 8px!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.16)!important;background:linear-gradient(135deg,rgba(4,8,24,.92),rgba(18,32,72,.86))!important;color:#f3fbff!important;font-size:10px!important;font-weight:1000;line-height:1.15!important;text-shadow:0 1px 8px rgba(0,0,0,.9);box-shadow:0 0 16px rgba(34,247,255,.14);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:1!important;pointer-events:none}
.vBuild.emptyPlot .vName{background:linear-gradient(135deg,rgba(255,209,102,.28),rgba(255,47,215,.20))!important;color:#fff!important}
.bigStage .vBuild .vEmoji{font-size:42px!important;transform:translateY(-7px)}
.bigStage .vBuild .vName{bottom:-32px!important;min-width:110px;max-width:170px;font-size:11px!important;padding:5px 10px!important}
.bigStage .vBuild .vBadge{top:-31px!important;font-size:11px!important;padding:3px 9px!important}
.bigStage .vRoad{bottom:12px!important;opacity:.58}
.compactStage .vRoad{bottom:10px!important;opacity:.50}
.building h4{display:block;padding:7px 10px;margin:0;border-radius:14px;background:rgba(4,8,24,.42);border:1px solid rgba(255,255,255,.08);line-height:1.15;min-height:36px;overflow:hidden;text-overflow:ellipsis}
.building .ico{min-height:68px}.building .ico span:first-child{filter:drop-shadow(0 0 14px rgba(34,247,255,.20))}.building .buildDesc{min-height:34px;line-height:1.28}.buildChoices{display:grid;gap:4px;margin-top:2px}.buildChoices span{font-size:11px;color:#dcecff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:3px 6px;border-radius:999px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.06)}
.albumSummaryGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 12px}.albumStat{padding:11px 12px;border-radius:18px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.025));box-shadow:inset 0 0 20px rgba(255,255,255,.025)}.albumStat small{display:block;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em;font-weight:1000}.albumStat b{display:block;margin-top:4px;font-size:14px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.topAlbumCard b{color:#ffe7a7}.miniCard.cardBigNew{min-height:136px!important;justify-content:flex-start!important;gap:5px;border-color:rgba(255,255,255,.10);transition:.18s transform,.18s border-color,.18s filter,.18s box-shadow}.miniCard.cardBigNew:hover{transform:translateY(-2px);border-color:rgba(34,247,255,.36);box-shadow:0 0 24px rgba(34,247,255,.10)}.miniCard.cardBigNew .ci{font-size:32px!important;line-height:1;margin-bottom:3px}.miniCard.cardBigNew .cardName{font-size:13px;line-height:1.12;min-height:30px}.miniCard.cardBigNew .cardSet{color:#b8c8e8}.miniCard.cardBigNew .cardPower{display:inline-flex;align-items:center;gap:4px;width:max-content;max-width:100%;padding:4px 7px;border-radius:999px;background:rgba(255,209,102,.13);border:1px solid rgba(255,209,102,.28);color:#ffe4a4;font-size:11px;font-weight:1000}.miniCard.cardBigNew .cardOwnedBadge{position:absolute;top:8px;right:8px;padding:4px 7px;border-radius:999px;background:rgba(34,247,255,.16);border:1px solid rgba(34,247,255,.28);font-size:10px;font-weight:1000;color:#cfffff}.miniCard.cardBigNew.cardLocked{opacity:.48;filter:grayscale(.82);border-style:dashed}.miniCard.cardBigNew.cardLocked .cardOwnedBadge{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.10);color:#b8c1d6}.miniCard.cardBigNew.cardOwned{border-color:rgba(34,247,255,.34);box-shadow:0 0 24px rgba(34,247,255,.10), inset 0 0 26px rgba(34,247,255,.035)}.miniCard.rarity-epic{background:linear-gradient(180deg,rgba(150,99,255,.16),rgba(255,255,255,.025))}.miniCard.rarity-legendary{background:linear-gradient(180deg,rgba(255,209,102,.16),rgba(255,255,255,.025))}.miniCard.rarity-mythic{background:linear-gradient(180deg,rgba(255,47,215,.18),rgba(255,255,255,.025))}.miniCard.rarity-celestial{background:radial-gradient(circle at top right,rgba(34,247,255,.22),transparent 32%),linear-gradient(180deg,rgba(255,209,102,.15),rgba(255,47,215,.06))}.setCard .setPower{display:block;margin-top:4px;color:#ffe4a4;font-weight:900}.cardsGrid.cardsBig{grid-template-columns:repeat(auto-fill,minmax(148px,1fr))!important}.miniCard.cardBigNew{min-height:172px!important;padding:13px!important;overflow:hidden!important}.miniCard.cardBigNew .cardName{min-height:34px!important;max-height:36px;overflow:hidden}.miniCard.cardBigNew .cardSet{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.miniCard.cardBigNew .cardPower{margin-top:auto;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.miniCard.cardBigNew small:last-child{max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media(max-width:1180px){.albumSummaryGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.albumSummaryGrid{grid-template-columns:1fr}.miniCard.cardBigNew{min-height:128px!important}.vBuild .vName{max-width:100px}.bigStage .vBuild .vName{max-width:132px}}


/* --- Chat badge +1 --- */
.quickNav.tabNav button#chatNavBtn{padding-right:18px}
.quickNav.tabNav .chatBadge{position:absolute;top:-9px;right:-9px;min-width:24px;height:24px;padding:0 7px;border-radius:999px;display:none;align-items:center;justify-content:center;background:linear-gradient(135deg,#ff2fd7,#22f7ff);color:#fff;font-size:12px;font-weight:1000;line-height:1;border:1px solid rgba(255,255,255,.45);box-shadow:0 0 18px rgba(255,47,215,.55),0 0 22px rgba(34,247,255,.35);z-index:5;pointer-events:none;transform-origin:center;animation:chatBadgePop .42s ease both}
.quickNav.tabNav .chatBadge.show{display:inline-flex}
.quickNav.tabNav button.hasChatBadge{border-color:rgba(34,247,255,.48);box-shadow:0 0 24px rgba(34,247,255,.18),inset 0 0 20px rgba(255,255,255,.04)}
@keyframes chatBadgePop{0%{transform:scale(.55);opacity:.25}65%{transform:scale(1.18);opacity:1}100%{transform:scale(1);opacity:1}}


.citySkipBox{margin:12px 0 0;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;border:1px solid rgba(255,209,102,.24);border-radius:20px;padding:12px;background:linear-gradient(135deg,rgba(255,209,102,.13),rgba(255,47,215,.08),rgba(34,247,255,.08));box-shadow:inset 0 0 24px rgba(255,209,102,.04),0 0 28px rgba(255,209,102,.08)}
.citySkipBox b{display:block;font-size:14px;color:#fff3bc;text-shadow:0 0 14px rgba(255,209,102,.22)}
.citySkipBox small{display:block;color:var(--muted);font-weight:800;line-height:1.35;margin-top:3px}
.citySkipBox button{white-space:nowrap;min-width:170px}
.citySkipBox.locked{opacity:.72;border-color:rgba(255,255,255,.11);background:rgba(255,255,255,.045);box-shadow:none}
.citySkipBox.ready{border-color:rgba(72,255,176,.35);box-shadow:0 0 28px rgba(72,255,176,.10),inset 0 0 24px rgba(72,255,176,.04)}
@media(max-width:720px){.citySkipBox{grid-template-columns:1fr}.citySkipBox button{width:100%}}


body.cityActionBusy [data-build],body.cityActionBusy [data-repair],body.cityActionBusy #citySkipBtn,body.cityActionBusy .builderChoice{opacity:.55;filter:grayscale(.35);pointer-events:none}
body.cityActionBusy .buildings{contain:layout paint}


/* FIX: compact village name tags were overlapping on smaller panels */
.compactStage .vBuild .vName{
  min-width:0!important;
  width:76px!important;
  max-width:76px!important;
  padding:3px 5px!important;
  bottom:-24px!important;
  font-size:9px!important;
  line-height:1.05!important;
  letter-spacing:-.025em!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.compactStage .vBuild.vSlot0 .vName{transform:translateX(-42%)!important}
.compactStage .vBuild.vSlot4 .vName{transform:translateX(-58%)!important}
@media(max-width:560px){
  .compactStage .vBuild .vName{width:64px!important;max-width:64px!important;font-size:8.5px!important;padding:3px 4px!important}
}


.shopItem.locked{opacity:.72;filter:saturate(.75)}.shopItem.locked .shopIcon{filter:grayscale(.35)}
.shopHero{display:grid;grid-template-columns:1.2fr .8fr;gap:12px;margin:8px 0 16px}.shopHeroMain,.shopHeroSide{border:1px solid rgba(255,255,255,.10);border-radius:22px;background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.035));padding:16px;position:relative;overflow:hidden}.shopHeroMain:before,.shopHeroSide:before{content:"";position:absolute;inset:auto -10% -35% auto;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,rgba(34,247,255,.16),transparent 70%);pointer-events:none}.shopHeroKicker{display:inline-flex;align-items:center;gap:7px;border-radius:999px;padding:6px 10px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);font-size:11px;font-weight:1000;letter-spacing:.08em;text-transform:uppercase;color:#dff8ff}.shopHero b{display:block;font-size:24px;letter-spacing:-.03em;margin:10px 0 6px}.shopHero small{display:block;color:var(--muted);line-height:1.45}.shopHeroStats{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.shopBubble{display:inline-flex;align-items:center;gap:7px;padding:8px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);font-size:12px;font-weight:1000}.shopRowsCardView{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-content:start}.shopSectionCard{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 2px 2px}.shopSectionCard b{font-size:18px;letter-spacing:-.03em}.shopSectionCard span{color:var(--muted);font-size:12px}.shopItem{display:flex;flex-direction:column;align-items:stretch;gap:12px;padding:16px;min-height:238px;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04));box-shadow:0 20px 45px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.05)}.shopHead{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.shopHeadMain{display:flex;align-items:center;gap:12px;min-width:0}.shopIcon{width:58px;height:58px;border-radius:18px;background:linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.06));font-size:30px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 24px rgba(0,0,0,.16);flex:0 0 58px}.shopTitleWrap{min-width:0}.shopItem b{font-size:18px;line-height:1.1}.shopItem small{font-size:13px}.shopTag{display:inline-flex;align-items:center;justify-content:center;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.10);font-size:11px;font-weight:1000;white-space:nowrap}.shopTag.spins{background:rgba(34,247,255,.12);border-color:rgba(34,247,255,.24);color:#bdfcff}.shopTag.capacity{background:rgba(255,209,102,.13);border-color:rgba(255,209,102,.26);color:#fff0b7}.shopTag.economy{background:rgba(72,255,176,.12);border-color:rgba(72,255,176,.24);color:#c6ffd8}.shopTag.cards{background:rgba(255,47,215,.12);border-color:rgba(255,47,215,.24);color:#ffd2f6}.shopTag.chests{background:rgba(176,132,255,.14);border-color:rgba(176,132,255,.22);color:#e6d6ff}.shopTag.pets{background:rgba(255,155,80,.14);border-color:rgba(255,155,80,.24);color:#ffe3ca}.shopTag.utility{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.12);color:#eef4ff}.shopText{color:#dfeaff;line-height:1.45;min-height:56px}.shopFoot{margin-top:auto;display:grid;grid-template-columns:auto auto;gap:12px;align-items:end;justify-content:space-between}.shopPriceBox{display:grid;gap:6px;justify-self:start;align-self:end;width:auto;min-width:0}.shopPriceBox small{font-size:11px;text-transform:uppercase;letter-spacing:.08em}.shopPrice{display:inline-flex;align-items:center;gap:7px;width:max-content;max-width:100%;padding:8px 12px;border-radius:999px;background:linear-gradient(135deg,rgba(34,247,255,.12),rgba(255,47,215,.10));border:1px solid rgba(255,255,255,.11);font-weight:1000;color:#fff;white-space:nowrap}.shopBuyBtn{min-width:120px;justify-content:center;padding-inline:16px}.shopMetaHint{display:flex;flex-wrap:wrap;gap:7px;margin-top:4px}.shopMiniBubble{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.09);font-size:11px;font-weight:900;color:#dce8ff}.shopItem.locked .shopPrice{background:rgba(255,255,255,.05);color:#c6d0e6}.shopItem.locked .shopBuyBtn{filter:grayscale(1)}@media(max-width:1180px){.shopRowsCardView{grid-template-columns:repeat(2,minmax(0,1fr))}.shopHero{grid-template-columns:1fr}}@media(max-width:860px){.shopRowsCardView{grid-template-columns:1fr}.shopHero{grid-template-columns:1fr}.shopFoot{grid-template-columns:1fr;justify-content:stretch}.shopBuyBtn{width:100%}.shopPrice{width:max-content}}

.renderDebugBox{position:fixed;left:14px;bottom:14px;z-index:99999;min-width:230px;max-width:360px;padding:10px 12px;border-radius:16px;border:1px solid rgba(34,247,255,.28);background:rgba(5,10,28,.90);box-shadow:0 18px 44px rgba(0,0,0,.45),0 0 30px rgba(34,247,255,.10);backdrop-filter:blur(14px);font:12px/1.35 system-ui,Segoe UI,sans-serif;color:#dff7ff;display:none}.renderDebugBox.show{display:block}.renderDebugBox b{display:block;color:#fff;margin-bottom:3px}.renderDebugBox code{color:#ffe7a7}.renderDebugBox small{display:block;color:#9fb3d3}.renderDebugBox .ok{color:#8cffc6}.renderDebugBox .warn{color:#ffd36f}

/* Main casino polish */
.slotLayout{
  grid-template-columns:minmax(680px,1fr) 360px!important;
  gap:14px!important;
}
.machineCasino{
  padding:18px!important;
}
.machineCasino .machineTop{
  display:grid!important;
  grid-template-columns:1fr auto!important;
}
.machineCasino .machineTop .sub{
  max-width:820px;
}
.casinoHud.jackpotOnlyHud{
  grid-template-columns:repeat(4,minmax(120px,1fr))!important;
  justify-content:stretch!important;
  gap:10px!important;
}
.casinoHud.jackpotOnlyHud .hudCard{
  min-height:58px!important;
  padding:9px 12px!important;
}
.casinoHud.jackpotOnlyHud .hudCard b{
  font-size:22px!important;
}
.casinoControlDeck{
  grid-template-columns:minmax(0,1fr) 260px!important;
  align-items:stretch!important;
}
.casinoControlDeck .spinBetPanel{
  grid-template-columns:1fr 170px!important;
}
.casinoControlDeck .betBox{
  gap:7px!important;
}
.casinoControlDeck .betBtn{
  min-width:48px;
}
.casinoControlDeck .leverWrap{
  grid-template-columns:74px 1fr!important;
}
.spinCommandStack{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
}
.spinNowBtn{
  min-height:62px;
  border-radius:20px!important;
  font-size:24px!important;
  letter-spacing:.08em!important;
  background:linear-gradient(135deg,#ffd166,#ff2fd7 52%,#22f7ff)!important;
  box-shadow:0 16px 44px rgba(255,47,215,.24),0 0 38px rgba(34,247,255,.16)!important;
}
.spinNowBtn:disabled{
  opacity:.45;
  filter:grayscale(.6);
}
.casinoControlDeck .autoSpinBtn{
  height:42px!important;
  min-height:42px!important;
  border-radius:16px!important;
  font-size:14px!important;
  box-shadow:none!important;
}
.machineCasino .casinoSlotBody{
  padding:24px 26px!important;
}
.machineCasino .reel{
  height:188px!important;
}
.machineCasino .reelCell{
  height:55px!important;
  font-size:45px!important;
}
.winStrip{
  display:grid;
  grid-template-columns:1.5fr 1fr 1fr;
  gap:8px;
  margin:10px 0 0;
  position:relative;
  z-index:3;
}
.winStrip>div{
  min-width:0;
  border:1px solid rgba(255,255,255,.11);
  border-radius:16px;
  padding:9px 11px;
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.03));
}
.winStrip small{
  display:block;
  color:var(--muted);
  font-size:10px;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.07em;
}
.winStrip b{
  display:block;
  margin-top:3px;
  color:#fff;
  font-size:14px;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.machineCasino .casinoPayTable{
  display:none!important;
}
.machineCasino .casinoPayTable>div{
  padding:6px 7px!important;
}
.machineCasino .resultBox{
  font-size:14px;
}
@media(max-width:1420px){
  .slotLayout{grid-template-columns:1fr!important}
  .casinoControlDeck{grid-template-columns:1fr!important}
  .casinoControlDeck .spinBetPanel{grid-template-columns:1fr 170px!important}
}
@media(max-width:860px){
  .casinoHud.jackpotOnlyHud{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .casinoControlDeck .spinBetPanel{grid-template-columns:1fr!important}
  .casinoControlDeck .leverWrap{grid-template-columns:64px 1fr!important}
  .spinNowBtn{min-height:56px;font-size:20px!important}
  .machineCasino .reel{height:136px!important}
  .machineCasino .reelCell{height:42px!important;font-size:32px!important}
  .winStrip{grid-template-columns:1fr}
}

/* Final village fit pass: keep compact building labels inside the city window. */
.compactStage{
  height:160px!important;
  margin-bottom:8px!important;
}
.compactStage .vRoad{
  bottom:9px!important;
  height:10px!important;
}
.compactStage .vBuild{
  bottom:26px!important;
  width:44px!important;
  min-width:44px!important;
  border-radius:12px 12px 5px 5px!important;
}
.compactStage .vBuild.vSlot0{left:10%!important;height:70px!important}
.compactStage .vBuild.vSlot1{left:28%!important;height:102px!important}
.compactStage .vBuild.vSlot2{left:46%!important;height:84px!important}
.compactStage .vBuild.vSlot3{left:64%!important;height:116px!important}
.compactStage .vBuild.vSlot4{left:82%!important;height:92px!important}
.compactStage .vBuild .vEmoji{
  font-size:24px!important;
  transform:translateY(-4px)!important;
}
.compactStage .vBuild .vBadge{
  top:-22px!important;
  max-width:54px!important;
  padding:2px 5px!important;
  font-size:9px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.compactStage .vBuild .vName{
  top:auto!important;
  bottom:-20px!important;
  width:52px!important;
  min-width:0!important;
  max-width:52px!important;
  padding:2px 4px!important;
  font-size:7.5px!important;
  line-height:1!important;
  letter-spacing:0!important;
  border-radius:7px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.compactStage .vBuild.vSlot0 .vName{transform:translateX(-44%)!important}
.compactStage .vBuild.vSlot4 .vName{transform:translateX(-56%)!important}
@media(max-width:420px){
  .compactStage .vBuild .vName{width:46px!important;max-width:46px!important;font-size:7px!important}
  .compactStage .vBuild .vEmoji{font-size:21px!important}
}
.tabPanel:not(.active){content-visibility:hidden}.tabPanel.active{content-visibility:auto;contain-intrinsic-size:900px}


/* --- Slot cleanup: páčka + AUTO, bez duplicitních HUD boxů --- */
.machineCasino .cleanHud,
.machineCasino .casinoHud.jackpotOnlyHud.cleanHud{
  display:grid!important;
  grid-template-columns:minmax(220px,360px)!important;
  justify-content:flex-start!important;
  margin:8px 0 12px!important;
}
.machineCasino .cleanHud .hudCard{
  min-height:58px!important;
}
.machineCasino .casinoControlDeck{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 170px!important;
  align-items:stretch!important;
  gap:10px!important;
}
.machineCasino .casinoControlDeck .spinBetPanel{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(170px,230px)!important;
  min-width:0!important;
  gap:10px!important;
}
.machineCasino .betBox{
  min-width:0!important;
  overflow:hidden!important;
  flex-wrap:wrap!important;
}
.machineCasino .spinBank{
  min-width:0!important;
  width:100%!important;
  overflow:hidden!important;
  justify-content:center!important;
  padding:8px 10px!important;
  white-space:nowrap!important;
}
.machineCasino .spinBank span{
  font-size:10px!important;
  letter-spacing:.05em!important;
}
.machineCasino .spinBank b{
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:clamp(15px,1.25vw,21px)!important;
  line-height:1!important;
}
.machineCasino .leverOnly{
  display:grid!important;
  grid-template-columns:74px minmax(0,1fr)!important;
  min-width:0!important;
}
.machineCasino .spinCommandStack.autoOnly{
  display:grid!important;
  grid-template-columns:1fr!important;
  min-width:0!important;
}
.machineCasino .spinCommandStack.autoOnly .autoSpinBtn{
  height:100%!important;
  min-height:74px!important;
  border-radius:20px!important;
  font-size:16px!important;
  letter-spacing:.06em!important;
  box-shadow:0 16px 44px rgba(255,47,215,.20),0 0 38px rgba(34,247,255,.14)!important;
}
.machineCasino .spinNowBtn{
  display:none!important;
}
.machineCasino .cleanWinStrip{
  grid-template-columns:1fr 1fr!important;
}
@media(max-width:1180px){
  .machineCasino .casinoControlDeck{grid-template-columns:1fr!important;}
  .machineCasino .casinoControlDeck .spinBetPanel{grid-template-columns:1fr minmax(150px,220px)!important;}
  .machineCasino .leverOnly{grid-template-columns:74px minmax(0,1fr)!important;}
}
@media(max-width:860px){
  .machineCasino .cleanHud,.machineCasino .casinoHud.jackpotOnlyHud.cleanHud{grid-template-columns:1fr!important;}
  .machineCasino .casinoControlDeck .spinBetPanel{grid-template-columns:1fr!important;}
  .machineCasino .cleanWinStrip{grid-template-columns:1fr!important;}
}

/* Fit the whole slot screen in shorter desktop windows. */
@media(max-height:820px) and (min-width:900px){
  .wrap{padding-top:8px!important;padding-bottom:14px!important}
  .topbar{margin-bottom:8px!important}
  .quickNav{margin-bottom:8px!important}
  .machineCasino{padding:12px 14px 14px!important}
  .machineCasino .casinoCabinetTop{margin-bottom:6px!important}
  .machineCasino .casinoMarquee{height:32px!important}
  .machineCasino .machineTop{margin-bottom:6px!important}
  .machineCasino .machineName{font-size:clamp(21px,1.7vw,28px)!important}
  .machineCasino .machineTop .sub{display:none!important}
  .machineCasino .eventBanner{display:none!important}
  .machineCasino .cleanHud,
  .machineCasino .casinoHud.jackpotOnlyHud.cleanHud{margin:6px 0 8px!important}
  .machineCasino .cleanHud .hudCard{min-height:46px!important;padding:7px 10px!important}
  .machineCasino .cleanHud .hudCard small{font-size:10px!important}
  .machineCasino .cleanHud .hudCard b{font-size:19px!important}
  .machineCasino .casinoControlDeck{margin:6px 0 8px!important;gap:8px!important}
  .machineCasino .casinoControlDeck .betBox,
  .machineCasino .casinoControlDeck .spinBank{min-height:44px!important;padding:6px 8px!important;border-radius:16px!important}
  .machineCasino .casinoControlDeck .betBtn{padding:6px 9px!important;border-radius:11px!important;font-size:12px!important}
  .machineCasino .leverOnly{grid-template-columns:58px minmax(0,1fr)!important}
  .machineCasino .casinoControlDeck .lever{height:58px!important;min-height:58px!important}
  .machineCasino .casinoControlDeck .lever:before{height:36px!important}
  .machineCasino .casinoControlDeck .lever:after{width:27px!important;height:27px!important}
  .machineCasino .spinCommandStack.autoOnly .autoSpinBtn{min-height:58px!important;height:58px!important;font-size:14px!important}
  .machineCasino .casinoSlotBody{padding:14px 18px!important;border-radius:26px!important}
  .machineCasino .reels{gap:12px!important}
  .machineCasino .reel{height:128px!important;border-radius:22px!important}
  .machineCasino .reelCell{height:38px!important;min-width:76px!important;font-size:31px!important;border-radius:15px!important}
  .machineCasino .winStrip{margin:6px 0 0!important;gap:6px!important}
  .machineCasino .winStrip>div{padding:7px 9px!important;border-radius:13px!important}
  .machineCasino .winStrip small{font-size:9px!important}
  .machineCasino .winStrip b{font-size:13px!important}
  .machineCasino .casinoPayTable{margin:6px 0 0!important;gap:6px!important}
  .machineCasino .casinoPayTable>div{padding:5px 6px!important;border-radius:11px!important;min-height:34px!important}
  .machineCasino .casinoPayTable b{font-size:10px!important;line-height:1.1!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .machineCasino .casinoPayTable small{display:none!important}
  .machineCasino .resultBox{margin-top:6px!important;min-height:34px!important;padding:8px 10px!important;font-size:12px!important;border-radius:14px!important}
  .miniVillage .compactStage{height:132px!important}
  .miniVillage .stat{padding:9px!important}
  .miniVillage .stat strong{font-size:17px!important}
}

/* Shop card footer: keep price and buy button inside the card bubble. */
.shopRowsCardView .shopItem{
  min-height:260px!important;
  padding:16px!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
}
.shopRowsCardView .shopText{
  min-height:44px!important;
}
.shopRowsCardView .shopMetaHint{
  margin-top:auto!important;
}
.shopRowsCardView .shopFoot{
  width:100%!important;
  margin-top:10px!important;
  padding:10px!important;
  border-radius:18px!important;
  border:1px solid rgba(255,255,255,.11)!important;
  background:linear-gradient(135deg,rgba(4,8,24,.50),rgba(255,255,255,.045))!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  gap:10px!important;
  align-items:center!important;
  justify-content:stretch!important;
}
.shopRowsCardView .shopPriceBox{
  min-width:0!important;
  width:100%!important;
  gap:5px!important;
}
.shopRowsCardView .shopPriceBox small{
  font-size:10px!important;
  line-height:1!important;
}
.shopRowsCardView .shopPrice{
  width:max-content!important;
  max-width:100%!important;
  min-height:34px!important;
  padding:7px 12px!important;
  border-radius:999px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.shopRowsCardView .shopBuyBtn{
  min-width:120px!important;
  max-width:150px!important;
  height:38px!important;
  padding:0 18px!important;
  align-self:center!important;
  justify-self:end!important;
  border-radius:999px!important;
}
@media(max-width:620px){
  .shopRowsCardView .shopFoot{
    grid-template-columns:1fr!important;
  }
  .shopRowsCardView .shopBuyBtn{
    width:100%!important;
    max-width:none!important;
    justify-self:stretch!important;
  }
}

/* Stable casino ticker: moving, but without the old animation stalls. */
.casinoMarquee{
  overflow:hidden!important;
  scrollbar-width:none;
}
.casinoMarquee::-webkit-scrollbar{
  display:none;
}
.casinoMarqueeTrack{
  animation:marqueeMoveStable 54s linear infinite!important;
  transform:translate3d(0,0,0);
  will-change:transform!important;
  padding:0 12px 0 0!important;
  backface-visibility:hidden;
}
.casinoMarquee:hover .casinoMarqueeTrack{
  animation-play-state:paused!important;
}
.casinoMarqueeItem{
  flex:0 0 auto;
}
@keyframes marqueeMoveStable{
  from{transform:translate3d(0,0,0)}
  to{transform:translate3d(-50%,0,0)}
}

/* Raid/attack focus mode: stop rendering the game behind action modals. */
body.actionModalFocus{
  overflow:hidden;
}
body.actionModalFocus .wrap,
body.actionModalFocus #toast,
body.actionModalFocus .spinPopup:not(.show),
body.actionModalFocus .threeStageLayer,
body.actionModalFocus .coinBurst{
  visibility:hidden!important;
}
body.actionModalFocus .modal.show{
  background:
    radial-gradient(circle at 50% 46%,rgba(30,47,92,.44),transparent 30%),
    radial-gradient(circle at 26% 54%,rgba(255,47,215,.16),transparent 28%),
    radial-gradient(circle at 74% 42%,rgba(34,247,255,.14),transparent 30%),
    linear-gradient(135deg,#030611,#050816 48%,#02050b)!important;
  backdrop-filter:none!important;
  isolation:isolate;
}
body.actionModalFocus .modal.show .modalBox{
  position:relative;
  z-index:3;
  transform:translateZ(0);
  will-change:auto;
  contain:layout paint;
}
body.actionModalFocus .modal.show:before,
body.actionModalFocus .modal.show:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
}
body.actionModalFocus .modal.show:before{
  background:
    linear-gradient(rgba(255,255,255,.026) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.024) 1px,transparent 1px);
  background-size:52px 52px;
  mask-image:radial-gradient(circle at 50% 50%,#000 0 58%,transparent 78%);
  opacity:.55;
}
body.actionModalFocus .modal.show:after{
  inset:8%;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.06);
  box-shadow:
    0 0 90px rgba(34,247,255,.10),
    inset 0 0 90px rgba(255,47,215,.06);
  opacity:.9;
}
body.actionRaidFocus #raidModal.show{
  background:
    radial-gradient(circle at 50% 52%,rgba(50,72,118,.52),transparent 28%),
    radial-gradient(circle at 31% 48%,rgba(34,247,255,.18),transparent 20%),
    radial-gradient(circle at 68% 46%,rgba(255,209,102,.13),transparent 24%),
    linear-gradient(135deg,#030714,#071225 54%,#02040a)!important;
}
body.actionRaidFocus #raidModal.show:before{
  background:
    radial-gradient(circle at 50% 50%,transparent 0 14%,rgba(34,247,255,.12) 14.3% 14.8%,transparent 15.1% 24%,rgba(255,209,102,.10) 24.3% 24.8%,transparent 25.1%),
    linear-gradient(rgba(34,247,255,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(34,247,255,.04) 1px,transparent 1px),
    repeating-linear-gradient(115deg,rgba(255,209,102,.055) 0 2px,transparent 2px 44px);
  background-size:auto,48px 48px,48px 48px,auto;
  opacity:.75;
}
body.actionRaidFocus #raidModal.show:after{
  inset:9% 15%;
  border-radius:42px;
  background:
    radial-gradient(circle at 18% 50%,rgba(34,247,255,.11),transparent 18%),
    radial-gradient(circle at 82% 50%,rgba(255,209,102,.09),transparent 18%),
    linear-gradient(90deg,transparent,rgba(34,247,255,.07),transparent);
  border:1px solid rgba(34,247,255,.12);
  box-shadow:0 0 120px rgba(34,247,255,.12),inset 0 0 80px rgba(255,209,102,.04);
}
body.actionAttackFocus #attackModal.show{
  background:
    radial-gradient(circle at 50% 50%,rgba(101,32,42,.45),transparent 28%),
    radial-gradient(circle at 30% 42%,rgba(255,85,118,.18),transparent 24%),
    radial-gradient(circle at 72% 56%,rgba(255,155,61,.14),transparent 28%),
    linear-gradient(135deg,#09030b,#120611 52%,#03040a)!important;
}
body.actionAttackFocus #attackModal.show:before{
  background:
    radial-gradient(circle at 50% 50%,transparent 0 18%,rgba(255,85,118,.16) 18.3% 18.8%,transparent 19.1% 34%,rgba(255,155,61,.13) 34.3% 34.8%,transparent 35.1%),
    linear-gradient(rgba(255,85,118,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,85,118,.04) 1px,transparent 1px),
    repeating-linear-gradient(135deg,rgba(255,155,61,.06) 0 8px,transparent 8px 36px);
  background-size:auto,46px 46px,46px 46px,auto;
  opacity:.72;
}
body.actionAttackFocus #attackModal.show:after{
  inset:10% 16%;
  border-radius:42px;
  background:
    linear-gradient(90deg,transparent 0 49.8%,rgba(255,85,118,.18) 50%,transparent 50.2%),
    linear-gradient(0deg,transparent 0 49.8%,rgba(255,85,118,.16) 50%,transparent 50.2%),
    radial-gradient(circle at 50% 50%,rgba(255,85,118,.10),transparent 45%);
  border:1px solid rgba(255,85,118,.13);
  box-shadow:0 0 120px rgba(255,85,118,.14),inset 0 0 80px rgba(255,155,61,.05);
}
body.actionModalFocus .casinoMarqueeTrack,
body.actionModalFocus .vBuild,
body.actionModalFocus .slotLights,
body.actionModalFocus .casinoBulbs i,
body.actionModalFocus .threeStageLayer:before,
body.actionModalFocus .threeStageLayer:after{
  animation-play-state:paused!important;
}
body.actionModalFocus #raidModal.show,
body.actionModalFocus #attackModal.show{
  visibility:visible!important;
}

/* --- Raid/attack mission UI: richer window, still cheap to render --- */
.actionModal{
  padding:18px!important;
}
.actionBox{
  width:min(980px,calc(100vw - 28px))!important;
  max-height:calc(100vh - 36px);
  overflow:auto!important;
  position:relative;
  isolation:isolate;
  border-radius:28px!important;
  border-color:rgba(255,255,255,.14)!important;
  background:
    radial-gradient(circle at 50% -18%,rgba(255,255,255,.16),transparent 30%),
    linear-gradient(180deg,rgba(22,32,72,.98),rgba(5,8,23,.98))!important;
}
.actionBox:before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(180deg,#000,transparent 82%);
  opacity:.64;
}
.actionBox:after{
  content:"";
  position:absolute;
  inset:12px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.055);
  pointer-events:none;
  z-index:0;
}
.raidActionBox{
  background:
    radial-gradient(circle at 20% 14%,rgba(34,247,255,.16),transparent 24%),
    radial-gradient(circle at 84% 18%,rgba(255,209,102,.13),transparent 25%),
    radial-gradient(circle at 50% 118%,rgba(33,79,124,.38),transparent 42%),
    linear-gradient(180deg,rgba(16,27,66,.98),rgba(5,8,24,.98))!important;
  box-shadow:0 34px 120px rgba(0,0,0,.72),0 0 72px rgba(34,247,255,.16)!important;
}
.attackActionBox{
  background:
    radial-gradient(circle at 18% 18%,rgba(255,85,118,.18),transparent 26%),
    radial-gradient(circle at 82% 20%,rgba(255,155,61,.14),transparent 24%),
    radial-gradient(circle at 50% 116%,rgba(74,22,30,.46),transparent 42%),
    linear-gradient(180deg,rgba(37,18,36,.98),rgba(8,5,15,.98))!important;
  box-shadow:0 34px 120px rgba(0,0,0,.72),0 0 72px rgba(255,85,118,.15)!important;
}
.actionBox>*{
  position:relative;
  z-index:1;
}
.actionBox .sectionTitle{
  gap:12px;
  align-items:flex-start;
}
.actionBox .sectionTitle span{
  max-width:48%;
  text-align:right;
  color:#d8e5ff;
  line-height:1.35;
}
.actionBox .hint{
  color:#c7d5ef;
}
.actionBox .resultBox{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  border-radius:20px;
  color:#f3f7ff;
}
.actionStatusDot{
  width:10px;
  height:10px;
  border-radius:50%;
  flex:0 0 auto;
  background:var(--cyan);
  box-shadow:0 0 18px rgba(34,247,255,.8);
  animation:actionDotPulse 1.25s ease-in-out infinite;
}
.actionStatusDot.danger{
  background:#ff5576;
  box-shadow:0 0 18px rgba(255,85,118,.8);
}
.actionStatusDot.done{
  background:var(--green);
  box-shadow:0 0 18px rgba(72,255,176,.8);
  animation:none;
}
@keyframes actionDotPulse{
  50%{opacity:.42;transform:scale(.72)}
}
.raidActionBox .raidHeader{
  position:relative;
  z-index:1;
}
.raidActionBox .raidStat{
  position:relative;
  overflow:hidden;
  border-color:rgba(34,247,255,.14);
  background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(34,247,255,.035));
}
.raidActionBox .raidStat:before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:2px;
  background:linear-gradient(90deg,rgba(34,247,255,.08),rgba(255,209,102,.72),rgba(34,247,255,.08));
}
.raidActionBox .raidStat small{
  letter-spacing:0!important;
}
.raidActionBox .raidStat b{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.raidVaults .actionVault{
  grid-template-rows:auto auto auto 1fr auto!important;
  align-content:stretch;
  gap:6px;
  position:relative;
  border-color:rgba(255,255,255,.14)!important;
  transition:.18s transform,.18s border-color,.18s box-shadow,.18s filter;
}
.raidVaults .actionVault .vaultIndex{
  position:static!important;
  display:inline-flex!important;
  justify-content:center;
  align-items:center;
  width:max-content;
  margin:0 auto 2px!important;
  padding:3px 8px!important;
  border-radius:999px!important;
  color:#bffcff!important;
  font-size:10px!important;
  font-weight:1000!important;
  line-height:1!important;
  background:rgba(34,247,255,.10)!important;
  border:1px solid rgba(34,247,255,.18)!important;
}
.raidVaults .actionVault .vaultIcon{
  margin:0!important;
  font-size:36px;
}
.raidVaults .actionVault .vaultTitle{
  min-height:32px;
}
.raidVaults .actionVault .vaultValue{
  min-height:38px;
  align-self:center;
}
.raidVaults .actionVault .vaultHint{
  align-self:end;
}
.raidVaults .actionVault .vaultScan{
  position:absolute!important;
  inset:-30% 0 auto 0!important;
  height:55%;
  display:block!important;
  border:0!important;
  padding:0!important;
  margin:0!important;
  border-radius:0!important;
  background:linear-gradient(180deg,transparent,rgba(34,247,255,.18),transparent)!important;
  transform:translateY(-130%);
  opacity:.85;
  pointer-events:none;
  transition:transform .32s ease;
}
.raidVaults .actionVault.isLocked:not(:disabled):hover .vaultScan{
  transform:translateY(230%);
}
.raidVaults .actionVault.isLocked:not(:disabled):hover{
  filter:brightness(1.08);
}
.raidVaults .actionVault.isOpen{
  border-color:rgba(255,209,102,.40)!important;
}
.raidVaults .actionVault.isOpen .vaultIndex{
  color:#ffe7a8!important;
  background:rgba(255,209,102,.12)!important;
  border-color:rgba(255,209,102,.28)!important;
}
.raidCloseHint{
  margin-left:auto;
}
.attackTargets.pickTargets{
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr))!important;
  align-items:stretch;
}
.attackTargets.buildingTargets{
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;
  align-items:stretch;
}
.attackTarget.targetCard{
  min-height:184px!important;
  display:grid!important;
  grid-template-rows:auto auto 1fr auto;
  gap:10px;
  border-color:rgba(255,85,118,.16);
  background:
    radial-gradient(circle at 88% 12%,rgba(255,85,118,.18),transparent 28%),
    linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.032))!important;
}
.targetTop{
  display:grid;
  grid-template-columns:48px 1fr;
  gap:10px;
  align-items:center;
}
.targetAvatar{
  width:48px;
  height:48px;
  border-radius:16px;
  display:grid;
  place-items:center;
  font-weight:1000;
  color:#fff;
  background:linear-gradient(135deg,rgba(255,85,118,.82),rgba(255,155,61,.58));
  box-shadow:0 0 22px rgba(255,85,118,.18);
}
.targetTop b{
  display:inline-block;
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  vertical-align:middle;
}
.targetTop small{
  display:block;
  margin-top:4px;
  color:#cbd6eb;
}
.attackTarget.targetCard .targetTag{
  margin-left:6px;
  vertical-align:middle;
  letter-spacing:0!important;
}
.targetMeta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  flex-wrap:wrap;
  color:#dbe5f8;
  font-size:12px;
  font-weight:900;
}
.targetMeta b{
  color:#ffe1a1;
}
.targetCTA,.attackCTA{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(135deg,rgba(255,85,118,.22),rgba(255,155,61,.13));
  color:#fff;
  font-size:12px;
  font-weight:1000;
}
.attackBuildingCard{
  min-height:166px!important;
  grid-template-rows:auto auto 1fr auto;
  border-color:rgba(255,155,61,.17);
  background:
    radial-gradient(circle at 50% 0,rgba(255,155,61,.14),transparent 30%),
    linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.032))!important;
}
.attackBuildingIcon{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  margin:0 auto;
  border-radius:18px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.10);
  font-size:31px;
  filter:drop-shadow(0 0 16px rgba(255,155,61,.18));
}
.attackBuildingCard b{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.attackBuildingCard small{
  align-self:start;
  line-height:1.35;
}
.attackBuildingCard:hover,.attackTarget.targetCard:hover{
  box-shadow:0 18px 36px rgba(0,0,0,.28),0 0 30px rgba(255,85,118,.13);
}
@media(max-width:900px){
  .actionModal{
    align-items:flex-start!important;
    padding:10px!important;
  }
  .actionBox{
    max-height:calc(100vh - 20px);
    padding:16px!important;
    border-radius:22px!important;
  }
  .actionBox .sectionTitle{
    display:block;
  }
  .actionBox .sectionTitle span{
    display:block;
    max-width:none;
    text-align:left;
    margin-top:6px;
  }
  .raidVaults .actionVault{
    min-height:126px!important;
  }
  .attackTargets.pickTargets,
  .attackTargets.buildingTargets{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:560px){
  .raidHeader{
    grid-template-columns:1fr!important;
  }
  .raidVaults,
  .attackTargets.pickTargets,
  .attackTargets.buildingTargets{
    grid-template-columns:1fr!important;
  }
  .actionBox .resultBox{
    align-items:flex-start;
  }
  .targetTop{
    grid-template-columns:42px 1fr;
  }
  .targetAvatar{
    width:42px;
    height:42px;
    border-radius:14px;
  }
}
@media(prefers-reduced-motion:reduce){
  .actionStatusDot,
  .raidVaults .vault.lastPick{
    animation:none!important;
  }
  .raidVaults .actionVault .vaultScan{
    display:none!important;
  }
}

/* --- Slot machine skins --- */
.slotSkinBar{
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:10px;
  align-items:center;
  margin:0 0 12px;
  padding:10px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.025));
}
.slotSkinTitle{
  min-width:150px;
}
.slotSkinTitle small{
  display:block;
  color:var(--muted);
  font-size:10px;
  font-weight:1000;
  text-transform:uppercase;
}
.slotSkinTitle b{
  display:block;
  color:#fff;
  margin-top:3px;
  font-size:14px;
}
.slotSkinChoices{
  display:flex;
  gap:8px;
  overflow:auto;
  padding-bottom:1px;
}
.slotSkinBtn{
  flex:0 0 auto;
  min-width:132px;
  min-height:54px;
  display:grid;
  grid-template-columns:auto 1fr;
  grid-template-rows:1fr auto;
  gap:2px 8px;
  align-items:center;
  text-align:left;
  color:#eef7ff;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  padding:8px 10px;
  background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));
  cursor:pointer;
  transition:.18s transform,.18s border-color,.18s box-shadow,.18s filter;
}
.slotSkinBtn:hover{
  transform:translateY(-2px);
  border-color:rgba(34,247,255,.34);
  box-shadow:0 14px 26px rgba(0,0,0,.18),0 0 20px rgba(34,247,255,.10);
}
.slotSkinBtn.active{
  border-color:rgba(255,209,102,.55);
  box-shadow:0 0 0 1px rgba(255,209,102,.18),0 0 28px rgba(255,209,102,.13);
}
.slotSkinBtn.locked{
  opacity:.72;
}
.slotSkinSwatches{
  grid-row:1/3;
  display:flex;
  width:34px;
  height:34px;
  border-radius:12px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.14);
  box-shadow:inset 0 0 12px rgba(255,255,255,.08);
}
.slotSkinSwatches i{
  flex:1;
  background:var(--skin-color,#22f7ff);
}
.slotSkinName{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:12px;
  font-weight:1000;
}
.slotSkinState{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#c7d6ef;
  font-size:10px;
  font-weight:900;
}
.shopTag.skins{
  background:rgba(34,247,255,.12);
  border-color:rgba(255,209,102,.24);
  color:#fff0b7;
}
.shopItem.activeShopSkin{
  border-color:rgba(255,209,102,.34);
  box-shadow:0 20px 45px rgba(0,0,0,.22),0 0 32px rgba(255,209,102,.12),inset 0 1px 0 rgba(255,255,255,.05);
}
.shopSectionCard b{
  display:inline-block;
  margin-right:7px;
}
.machineCasino.slotSkin-neon{
  background:radial-gradient(circle at 50% 0%,rgba(255,209,102,.13),transparent 20%),radial-gradient(circle at 10% 18%,rgba(255,47,215,.16),transparent 28%),linear-gradient(180deg,rgba(53,14,80,.58),rgba(9,16,46,.88) 48%,rgba(5,7,20,.96))!important;
}
.machineCasino.slotSkin-midnight{
  background:linear-gradient(180deg,rgba(10,18,45,.94),rgba(3,7,19,.98) 52%,rgba(1,3,10,.98))!important;
  box-shadow:0 34px 110px rgba(0,0,0,.50),0 0 100px rgba(34,247,255,.12),inset 0 1px 0 rgba(255,255,255,.05)!important;
}
.machineCasino.slotSkin-midnight .casinoSlotBody{
  background:linear-gradient(135deg,rgba(34,247,255,.18),rgba(8,15,40,.96) 46%,rgba(255,209,102,.13))!important;
}
.machineCasino.slotSkin-midnight .reel{
  background:linear-gradient(180deg,#16244f,#050812 68%,#02030a)!important;
  border-color:rgba(34,247,255,.25)!important;
}
.machineCasino.slotSkin-midnight .casinoSideRail,
.machineCasino.slotSkin-midnight .payline{
  background:linear-gradient(180deg,#ffd166,#22f7ff)!important;
}
.machineCasino.slotSkin-sakura{
  background:linear-gradient(180deg,rgba(70,29,66,.92),rgba(15,17,49,.96) 50%,rgba(6,8,23,.98))!important;
  box-shadow:0 34px 110px rgba(0,0,0,.46),0 0 90px rgba(255,122,200,.16),inset 0 1px 0 rgba(255,255,255,.07)!important;
}
.machineCasino.slotSkin-sakura .casinoSlotBody{
  background:linear-gradient(135deg,rgba(255,122,200,.26),rgba(24,24,64,.94) 48%,rgba(139,233,255,.15))!important;
}
.machineCasino.slotSkin-sakura .reel{
  background:linear-gradient(180deg,#37254f,#100d2a 66%,#050716)!important;
  border-color:rgba(255,122,200,.25)!important;
}
.machineCasino.slotSkin-sakura .casinoSideRail,
.machineCasino.slotSkin-sakura .payline{
  background:linear-gradient(180deg,#ffe6a7,#ff7ac8,#8be9ff)!important;
}
.machineCasino.slotSkin-chrome{
  background:linear-gradient(180deg,rgba(45,55,78,.90),rgba(8,13,28,.98) 52%,rgba(4,6,12,.98))!important;
  box-shadow:0 34px 110px rgba(0,0,0,.48),0 0 88px rgba(100,244,255,.13),inset 0 1px 0 rgba(255,255,255,.09)!important;
}
.machineCasino.slotSkin-chrome .casinoSlotBody{
  background:linear-gradient(135deg,rgba(223,232,255,.24),rgba(16,22,42,.96) 48%,rgba(100,244,255,.17))!important;
}
.machineCasino.slotSkin-chrome .reel{
  background:linear-gradient(180deg,#2a3557,#10162a 62%,#060811)!important;
  border-color:rgba(223,232,255,.30)!important;
}
.machineCasino.slotSkin-chrome .casinoSideRail,
.machineCasino.slotSkin-chrome .payline{
  background:linear-gradient(180deg,#dfe8ff,#64f4ff,#7c8cff)!important;
}
.machineCasino.slotSkin-inferno{
  background:linear-gradient(180deg,rgba(64,22,28,.92),rgba(28,10,16,.98) 52%,rgba(7,4,8,.98))!important;
  box-shadow:0 34px 110px rgba(0,0,0,.50),0 0 96px rgba(255,85,61,.14),inset 0 1px 0 rgba(255,255,255,.06)!important;
}
.machineCasino.slotSkin-inferno .casinoSlotBody{
  background:linear-gradient(135deg,rgba(255,85,61,.26),rgba(40,13,20,.96) 48%,rgba(255,184,77,.16))!important;
}
.machineCasino.slotSkin-inferno .reel{
  background:linear-gradient(180deg,#4e1e25,#160911 68%,#050305)!important;
  border-color:rgba(255,184,77,.26)!important;
}
.machineCasino.slotSkin-inferno .casinoSideRail,
.machineCasino.slotSkin-inferno .payline{
  background:linear-gradient(180deg,#ffb84d,#ff553d,#fff0b0)!important;
}
.machineCasino.slotSkin-crystal{
  background:linear-gradient(180deg,rgba(28,47,70,.92),rgba(11,16,42,.96) 52%,rgba(5,8,22,.98))!important;
  box-shadow:0 34px 110px rgba(0,0,0,.46),0 0 100px rgba(143,252,255,.15),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.machineCasino.slotSkin-crystal .casinoSlotBody{
  background:linear-gradient(135deg,rgba(143,252,255,.24),rgba(20,22,64,.94) 48%,rgba(216,140,255,.18))!important;
}
.machineCasino.slotSkin-crystal .reel{
  background:linear-gradient(180deg,#263b5b,#111735 64%,#060819)!important;
  border-color:rgba(143,252,255,.28)!important;
}
.machineCasino.slotSkin-crystal .casinoSideRail,
.machineCasino.slotSkin-crystal .payline{
  background:linear-gradient(180deg,#fff0b0,#8ffcff,#d88cff)!important;
}
.machineCasino[class*="slotSkin-"] .autoSpinBtn{
  border-color:rgba(255,255,255,.16)!important;
}
.machineCasino[class*="slotSkin-"] .slotLights{
  opacity:.62!important;
}
@media(max-width:860px){
  .slotSkinBar{
    grid-template-columns:1fr;
    padding:8px;
  }
  .slotSkinTitle{
    min-width:0;
  }
  .slotSkinChoices{
    gap:6px;
  }
  .slotSkinBtn{
    min-width:118px;
    min-height:48px;
    padding:7px 8px;
  }
}
@media(max-height:820px) and (min-width:900px){
  .slotSkinBar{
    margin-bottom:8px!important;
    padding:7px 8px!important;
  }
  .slotSkinBtn{
    min-height:44px;
  }
  .slotSkinTitle small,
  .slotSkinState{
    font-size:9px;
  }
}

/* Keep the skin picker compact so the slot body still fits on short screens. */
.machineCasino .slotSkinBar{
  grid-template-columns:minmax(128px,170px) minmax(0,1fr)!important;
  gap:8px!important;
  margin:0!important;
  padding:7px 8px!important;
  border-radius:16px!important;
  min-height:58px;
}
.machineCasino .casinoHud.skinHudRow,
.machineCasino .casinoHud.jackpotOnlyHud.cleanHud.skinHudRow{
  grid-template-columns:minmax(220px,360px) minmax(0,1fr)!important;
  align-items:stretch!important;
}
.machineCasino .slotSkinTitle{
  min-width:0!important;
}
.machineCasino .slotSkinTitle small{
  font-size:9px!important;
}
.machineCasino .slotSkinTitle b{
  font-size:13px!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.machineCasino .slotSkinChoices{
  gap:6px!important;
}
.machineCasino .slotSkinBtn{
  width:48px!important;
  min-width:48px!important;
  min-height:38px!important;
  grid-template-columns:1fr!important;
  grid-template-rows:1fr!important;
  place-items:center!important;
  padding:4px!important;
  border-radius:14px!important;
}
.machineCasino .slotSkinSwatches{
  grid-row:auto!important;
  width:32px!important;
  height:30px!important;
}
.machineCasino .slotSkinName,
.machineCasino .slotSkinState{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  white-space:nowrap!important;
}
@media(max-width:860px){
  .machineCasino .casinoHud.skinHudRow,
  .machineCasino .casinoHud.jackpotOnlyHud.cleanHud.skinHudRow{
    grid-template-columns:1fr!important;
  }
  .machineCasino .slotSkinBar{
    grid-template-columns:1fr!important;
  }
  .machineCasino .slotSkinChoices{
    padding-bottom:3px;
  }
}

/* --- MEGA village building upgrade: phases, rarity, live district, detail modal --- */
.villageStage{isolation:isolate;overflow:visible!important}
.villageStage.bigStage{overflow:hidden!important}
.vSkylineGlow{position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(circle at 50% 12%,rgba(255,255,255,.16),transparent 26%),linear-gradient(180deg,rgba(34,247,255,.08),transparent 48%,rgba(255,47,215,.08));mix-blend-mode:screen;opacity:.85}
.villageDecorLayer{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;border-radius:inherit}.villageDecorLayer span{position:absolute;left:var(--d-left);top:var(--d-top);font-size:var(--d-size);opacity:.32;filter:drop-shadow(0 0 10px rgba(255,255,255,.32));animation:vDecorFloat 4.8s ease-in-out infinite;animation-delay:var(--d-delay)}@keyframes vDecorFloat{0%,100%{transform:translateY(0) scale(.94);opacity:.24}50%{transform:translateY(-10px) scale(1.08);opacity:.52}}
.villageStage.district-sakura{background:radial-gradient(circle at 24% 15%,rgba(255,99,195,.24),transparent 26%),linear-gradient(180deg,rgba(55,22,78,.92),rgba(10,10,32,.96))!important}.villageStage.district-chrome{background:radial-gradient(circle at 70% 14%,rgba(160,220,255,.22),transparent 26%),linear-gradient(180deg,rgba(22,40,70,.94),rgba(6,10,24,.98))!important}.villageStage.district-inferno{background:radial-gradient(circle at 62% 18%,rgba(255,111,45,.30),transparent 25%),linear-gradient(180deg,rgba(72,22,16,.95),rgba(12,5,13,.98))!important}.villageStage.district-crystal{background:radial-gradient(circle at 50% 10%,rgba(120,255,246,.25),transparent 28%),linear-gradient(180deg,rgba(18,46,78,.94),rgba(5,14,34,.98))!important}.villageStage.district-royal{background:radial-gradient(circle at 50% 8%,rgba(255,209,102,.28),transparent 30%),linear-gradient(180deg,rgba(70,50,16,.93),rgba(16,9,24,.98))!important}.villageStage.district-void{background:radial-gradient(circle at 50% 14%,rgba(150,80,255,.20),transparent 28%),linear-gradient(180deg,rgba(20,10,45,.95),rgba(3,3,12,.99))!important}.villageStage.district-dragon{background:radial-gradient(circle at 50% 12%,rgba(255,80,40,.24),transparent 28%),linear-gradient(180deg,rgba(50,20,32,.94),rgba(10,6,18,.98))!important}.villageStage.district-neon{background:linear-gradient(180deg,rgba(18,28,82,.92),rgba(6,9,26,.96))!important}
.vBuild{z-index:5!important;cursor:pointer;overflow:visible!important;transition:.2s transform,.2s filter,.2s box-shadow,.2s border-color;border-width:1px!important}.vBuild:hover{transform:translateY(-7px) scale(1.03)!important;z-index:20!important}.vBuild .vWindows{position:absolute;inset:12px 12px 18px;border-radius:10px;background:repeating-linear-gradient(180deg,rgba(255,255,255,.15) 0 5px,transparent 5px 12px),repeating-linear-gradient(90deg,rgba(34,247,255,.10) 0 6px,transparent 6px 16px);opacity:.45;pointer-events:none}.vBuild.l1{clip-path:polygon(8% 18%,92% 18%,100% 100%,0 100%)}.vBuild.l2{clip-path:polygon(0 24%,50% 0,100% 24%,100% 100%,0 100%)}.vBuild.l3{clip-path:polygon(12% 0,88% 0,88% 12%,100% 12%,100% 100%,0 100%,0 12%,12% 12%)}.vBuild.l4{clip-path:polygon(10% 0,90% 0,100% 24%,100% 100%,0 100%,0 24%)}.vBuild.l5{clip-path:polygon(50% 0,88% 14%,100% 100%,0 100%,12% 14%)}.vBuild.landmark{border-color:rgba(255,209,102,.46)!important;box-shadow:0 0 28px rgba(255,209,102,.23),inset 0 0 18px rgba(255,255,255,.08)!important}.vBuild.landmark:after{content:'';position:absolute;inset:-10px;border-radius:22px;background:conic-gradient(from 180deg,transparent,rgba(255,209,102,.28),transparent,rgba(34,247,255,.20),transparent);filter:blur(10px);z-index:-1;animation:vLandmarkAura 3.2s linear infinite}@keyframes vLandmarkAura{to{transform:rotate(360deg)}}.vBuild.damaged{filter:saturate(.82) brightness(.82)!important;border-color:rgba(255,85,118,.55)!important}.vSmoke{position:absolute;right:-10px;top:-18px;font-size:18px;animation:vSmoke 1.8s ease-in-out infinite;opacity:.8}@keyframes vSmoke{50%{transform:translateY(-8px) scale(1.15);opacity:.45}}
.rarity-common{--rarityGlow:rgba(180,198,220,.16);--rarityLine:rgba(180,198,220,.22)}.rarity-rare{--rarityGlow:rgba(34,247,255,.22);--rarityLine:rgba(34,247,255,.42)}.rarity-epic{--rarityGlow:rgba(185,88,255,.25);--rarityLine:rgba(185,88,255,.45)}.rarity-legendary{--rarityGlow:rgba(255,209,102,.30);--rarityLine:rgba(255,209,102,.58)}.rarity-mythic{--rarityGlow:rgba(255,47,215,.32);--rarityLine:rgba(255,47,215,.58)}.rarity-celestial{--rarityGlow:rgba(120,255,246,.36);--rarityLine:rgba(120,255,246,.68)}
.vBuild.rarity-rare,.building.rarity-rare,.builderChoice.rarity-rare{border-color:var(--rarityLine)!important;box-shadow:0 0 26px var(--rarityGlow)!important}.vBuild.rarity-epic,.building.rarity-epic,.builderChoice.rarity-epic{border-color:var(--rarityLine)!important;box-shadow:0 0 32px var(--rarityGlow)!important}.vBuild.rarity-legendary,.building.rarity-legendary,.builderChoice.rarity-legendary{border-color:var(--rarityLine)!important;box-shadow:0 0 38px var(--rarityGlow)!important}.vBuild.rarity-mythic,.building.rarity-mythic,.builderChoice.rarity-mythic{border-color:var(--rarityLine)!important;box-shadow:0 0 42px var(--rarityGlow),inset 0 0 20px rgba(255,255,255,.05)!important}.vBuild.rarity-celestial,.building.rarity-celestial,.builderChoice.rarity-celestial{border-color:var(--rarityLine)!important;box-shadow:0 0 48px var(--rarityGlow),0 0 16px rgba(255,255,255,.14)!important}
.style-mythic .vEmoji,.building.style-mythic .ico,.builderChoice.style-mythic .bIcon{animation:mythicPulse 2.2s ease-in-out infinite}@keyframes mythicPulse{50%{filter:brightness(1.35) drop-shadow(0 0 18px rgba(255,47,215,.6)) drop-shadow(0 0 28px rgba(34,247,255,.35))}}
.buildings{grid-template-columns:repeat(5,minmax(170px,1fr))!important}.villageSetPanel{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:13px 14px;border-radius:22px;border:1px solid rgba(255,209,102,.25);background:linear-gradient(135deg,rgba(255,209,102,.12),rgba(255,47,215,.08),rgba(34,247,255,.07));box-shadow:0 0 24px rgba(255,209,102,.08);position:relative;z-index:1}.villageSetPanel small{display:block;color:var(--muted);font-weight:1000;text-transform:uppercase;letter-spacing:.07em}.villageSetPanel b{display:block;margin-top:3px;color:#fff}.villageSetChips{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.setChip{padding:6px 9px;border-radius:999px;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.06);font-size:12px;font-weight:1000;color:#dbe8ff}.setChip.active{border-color:rgba(72,255,176,.36);background:rgba(72,255,176,.12);color:#c7ffd9}.setChip.locked{opacity:.62}.building{min-height:280px!important;transition:.18s transform,.18s box-shadow,.18s border-color}.building:hover{transform:translateY(-3px);box-shadow:0 0 34px var(--rarityGlow,rgba(34,247,255,.10))!important}.building .ico{position:relative;overflow:hidden}.building .ico:after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent,rgba(255,255,255,.18),transparent);transform:translateX(-120%);animation:buildingShine 3.4s ease-in-out infinite}@keyframes buildingShine{50%,100%{transform:translateX(120%)}}.buildBonus{padding:8px 10px;border-radius:14px;border:1px solid rgba(72,255,176,.18);background:rgba(72,255,176,.07);font-size:12px;font-weight:1000;color:#d4ffe6;line-height:1.35}.rarityPill{border-color:var(--rarityLine,rgba(255,255,255,.12))!important;background:var(--rarityGlow,rgba(255,255,255,.05))!important;color:#fff!important}.buildingActions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:auto}.buildingActions .btn{margin-top:0!important}.buildingActions .btn:first-child:last-child{grid-column:1/-1}.buildChoices{display:flex!important;gap:6px!important;flex-wrap:wrap}.buildChoices span{padding:5px 7px;border-radius:999px;border:1px solid var(--rarityLine,rgba(255,255,255,.12));background:var(--rarityGlow,rgba(255,255,255,.05));font-size:11px;font-weight:1000;color:#eef7ff}
.builderChoices{grid-template-columns:repeat(5,minmax(150px,1fr))!important}.builderChoice{min-height:210px;position:relative;overflow:hidden}.builderChoice:before{content:'';position:absolute;inset:-40%;background:radial-gradient(circle,var(--rarityGlow,rgba(34,247,255,.10)),transparent 48%);opacity:.9;pointer-events:none}.builderChoice>*{position:relative;z-index:1}.choiceBonus{margin-top:9px;padding:7px 8px;border-radius:13px;background:rgba(72,255,176,.08);border:1px solid rgba(72,255,176,.16);color:#d9ffe9;font-size:12px;font-weight:900;line-height:1.35}.choiceMeta{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}.choiceMeta span{font-size:11px;padding:4px 7px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.055);color:#dbe8ff;font-weight:900}.builderChoice.style-mythic{background:linear-gradient(135deg,rgba(255,47,215,.18),rgba(34,247,255,.10),rgba(255,209,102,.10))!important}.builderModalBox{width:min(1080px,100%)!important}
.buildingDetailModal{z-index:11000}.buildingDetailBox{width:min(850px,100%);padding:0!important;overflow:hidden!important;position:relative}.buildingDetailClose{position:absolute;right:13px;top:12px;z-index:5;width:36px;height:36px;border:1px solid rgba(255,255,255,.16);border-radius:50%;background:rgba(0,0,0,.28);color:#fff;font-size:24px;cursor:pointer}.detailHero{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;padding:24px;background:radial-gradient(circle at 14% 20%,var(--rarityGlow,rgba(34,247,255,.14)),transparent 38%),linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.035));border-bottom:1px solid rgba(255,255,255,.12)}.detailHero h2{margin:3px 0 7px;font-size:30px;letter-spacing:-.04em}.detailHero p{margin:0;color:#dbe8ff;line-height:1.55}.detailHero small{color:var(--muted);font-weight:1000;text-transform:uppercase;letter-spacing:.08em}.detailIcon{width:94px;height:94px;border-radius:28px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(255,255,255,.14),rgba(255,255,255,.04));border:1px solid var(--rarityLine,rgba(255,255,255,.16));font-size:52px;box-shadow:0 0 40px var(--rarityGlow,rgba(34,247,255,.15))}.detailMetaGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:16px 18px 8px}.detailMetaGrid>div{padding:12px;border-radius:18px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.055)}.detailMetaGrid small{display:block;color:var(--muted);font-weight:1000;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.detailMetaGrid b{display:block;margin-top:4px}.detailProgress{height:10px;border-radius:999px;background:rgba(255,255,255,.09);margin:8px 18px;overflow:hidden}.detailProgress span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--pink),var(--cyan),var(--gold));box-shadow:0 0 20px rgba(34,247,255,.38)}.detailBonus{margin:12px 18px;padding:14px;border-radius:20px;border:1px solid rgba(72,255,176,.18);background:rgba(72,255,176,.07)}.detailBonus b{display:block;color:#d8ffe9}.detailBonus p{margin:5px 0;color:#fff;font-weight:1000}.detailBonus small{color:#b7c6df;line-height:1.45}.detailDamage{margin:0 18px 12px;padding:12px 14px;border-radius:18px;border:1px solid rgba(255,85,118,.36);background:rgba(255,85,118,.12);font-weight:1000;color:#ffd8e0}.detailSets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:12px 18px}.detailSet{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center;padding:11px;border-radius:18px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.045)}.detailSet span{font-size:24px}.detailSet b{font-size:13px}.detailSet small{grid-column:2;color:var(--muted);font-size:12px}.detailSet.active{border-color:rgba(72,255,176,.30);background:rgba(72,255,176,.08)}.detailSet.locked{opacity:.65}.detailActions{display:flex;gap:10px;justify-content:flex-end;padding:16px 18px 20px;border-top:1px solid rgba(255,255,255,.10);background:rgba(0,0,0,.12)}
@media(max-width:1180px){.builderChoices{grid-template-columns:repeat(2,minmax(0,1fr))!important}.buildings{grid-template-columns:repeat(2,minmax(0,1fr))!important}.villageSetPanel{grid-template-columns:1fr}.villageSetChips{justify-content:flex-start}}@media(max-width:720px){.buildings,.builderChoices{grid-template-columns:1fr!important}.detailHero{grid-template-columns:1fr;text-align:center}.detailIcon{margin:auto}.detailMetaGrid,.detailSets{grid-template-columns:1fr}.detailActions{flex-direction:column}.detailActions .btn{width:100%}}


/* --- UX fix: no text selection outside chat / inputs --- */
body, body *{-webkit-user-select:none;user-select:none}
input, textarea, [contenteditable="true"], .input{-webkit-user-select:text;user-select:text}
#chatPanel, #chatPanel *, .chatRows, .chatRows *, .chatText, .chatText *, #chatInput{-webkit-user-select:text;user-select:text}

/* --- Online rows: show stage + village clearly --- */
.topOnlineMeta{min-width:0}
.topOnlineMeta b{display:block;font-size:13px;color:#fff;max-width:128px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.topOnlineMeta small{display:block;color:#aebbd5;font-size:11px;font-weight:800;line-height:1.18;white-space:normal}
.topOnlineCity,.onlineVillageName{color:#d8e6ff!important}
.onlineLoginRow small + small{margin-top:2px}

/* --- Building icon bubble: only one centered icon --- */
.building .ico{justify-content:center!important;min-height:74px;text-align:center}
.building .ico .subIco{display:none!important}
.building .ico .mainIco,.building .ico > span:first-child{display:inline-flex;align-items:center;justify-content:center;font-size:36px;line-height:1;filter:drop-shadow(0 0 14px rgba(34,247,255,.22))}
.detailIcon{line-height:1;overflow:hidden}


/* --- Fix: stage/building icons stay one clean emoji --- */
.vBuild .vEmoji,
.detailIcon,
.building .ico .mainIco{
  white-space:nowrap!important;
  overflow:hidden!important;
  text-align:center!important;
}
.vBuild .vEmoji{
  max-width:1.25em!important;
  display:inline-flex!important;
  justify-content:center!important;
}

/* --- Server boss visible under city badge --- */
.serverBossMini{
  margin-top:12px;
  padding:12px;
  border-radius:18px;
  border:1px solid rgba(255,85,118,.28);
  background:linear-gradient(135deg,rgba(255,85,118,.13),rgba(34,247,255,.07));
  box-shadow:inset 0 0 22px rgba(255,255,255,.035),0 0 24px rgba(255,85,118,.08);
  position:relative;
  z-index:2;
}
.serverBossHead{display:flex;justify-content:space-between;gap:10px;align-items:center;color:#ffd7df;font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:1000}
.serverBossName{margin:6px 0 8px;font-size:15px;font-weight:1000;color:#fff;text-shadow:0 0 14px rgba(255,85,118,.24)}
.serverBossProgress{height:8px!important}
.serverBossMini .bossMeta{font-size:11px;margin-top:7px}

/* --- Premium leaderboard cards / bubbles --- */
.leaderRows.leaderBig{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;max-height:none!important;overflow:visible!important}
.leaderBubble{
  display:grid;
  grid-template-columns:auto auto minmax(0,1fr) auto;
  gap:11px;
  align-items:center;
  padding:14px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.12);
  background:radial-gradient(circle at top left,rgba(34,247,255,.13),transparent 34%),linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.035));
  box-shadow:0 18px 48px rgba(0,0,0,.20),inset 0 0 20px rgba(255,255,255,.025);
  position:relative;
  overflow:hidden;
}
.leaderBubble:before{content:"";position:absolute;inset:-80% -30%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.10),transparent);transform:rotate(18deg);opacity:.42;pointer-events:none}
.leaderBubble.gold{border-color:rgba(255,209,102,.45);box-shadow:0 0 38px rgba(255,209,102,.12),0 18px 48px rgba(0,0,0,.22)}
.leaderBubble.silver{border-color:rgba(210,230,255,.34)}
.leaderBubble.bronze{border-color:rgba(255,157,78,.36)}
.leaderBubble.offline{opacity:.72;filter:saturate(.86)}
.leaderBubbleRank{min-width:44px;height:44px;border-radius:16px;display:grid;place-items:center;font-weight:1000;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12)}
.leaderBubbleAvatar{width:48px;height:48px;border-radius:18px;display:grid;place-items:center;font-size:26px;background:linear-gradient(135deg,rgba(255,47,215,.18),rgba(34,247,255,.13));border:1px solid rgba(255,255,255,.12);box-shadow:0 0 22px rgba(34,247,255,.10)}
.leaderBubbleMain{min-width:0}
.leaderBubbleTop{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.leaderBubbleTop b{font-size:16px;max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.leaderBubbleMain small{display:block;color:#aebbd5;font-size:12px;line-height:1.28;margin-top:2px}
.leaderBubbleMoney{text-align:right;min-width:76px}
.leaderBubbleMoney small{display:block;color:#aebbd5;font-size:10px;text-transform:uppercase;letter-spacing:.08em;font-weight:1000}
.leaderBubbleMoney b{display:block;color:#caffdd;font-size:17px}

/* --- Radio Kiss top widget --- */
.kissRadioTop{
  display:grid;
  grid-template-columns:auto minmax(120px,220px);
  gap:9px;
  align-items:center;
  max-width:300px;
  padding:8px 12px 8px 8px;
  border-radius:999px;
  border:1px solid rgba(255,105,180,.30);
  background:linear-gradient(135deg,rgba(255,47,215,.13),rgba(255,209,102,.08),rgba(34,247,255,.06));
  box-shadow:inset 0 0 18px rgba(255,255,255,.035);
}
.kissPlayBtn{
  width:34px;height:34px;border-radius:50%;
  border:1px solid rgba(255,255,255,.16);
  color:#fff;background:linear-gradient(135deg,#ff2fd7,#22f7ff);
  font-weight:1000;cursor:pointer;box-shadow:0 0 18px rgba(255,47,215,.25);
}
.kissPlayBtn.playing{background:linear-gradient(135deg,#48ffb0,#22f7ff);color:#04121a}
.kissRadioMeta{min-width:0}
.kissRadioMeta b{display:block;font-size:12px;line-height:1;color:#fff}
.kissRadioMeta small{display:block;margin-top:3px;color:#dbe8ff;font-size:11px;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

@media(max-width:860px){
  .kissRadioTop{max-width:100%;grid-template-columns:auto 1fr}
  .leaderRows.leaderBig{grid-template-columns:1fr}
}


/* --- Fix server boss card: no cut-off text --- */
.miniVillage{overflow:visible!important}
.serverBossMini{
  padding:11px 12px 14px!important;
  margin-top:11px!important;
  margin-bottom:8px!important;
  overflow:visible!important;
}
.serverBossHead{line-height:1.15!important}
.serverBossName{
  font-size:14px!important;
  line-height:1.18!important;
  margin:5px 0 7px!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.serverBossMini .bossMeta{
  display:flex!important;
  justify-content:space-between!important;
  align-items:flex-start!important;
  flex-wrap:wrap!important;
  gap:4px 10px!important;
  font-size:10.5px!important;
  line-height:1.25!important;
  margin-top:7px!important;
  overflow:visible!important;
}
.serverBossMini .bossMeta span{
  display:block!important;
  min-width:0!important;
  white-space:nowrap!important;
}
.serverBossMini .bossMeta span:last-child{
  max-width:155px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:right;
}
.serverBossProgress{height:7px!important}

/* --- Kiss now playing: artist + song, no fake time --- */
.kissRadioTop{grid-template-columns:auto minmax(150px,260px)!important;max-width:350px!important}
.kissRadioMeta small{
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  line-height:1.18!important;
}
.kissRadioMeta .kissLine{
  display:block;
  max-width:260px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.kissRadioMeta .kissLine em{
  color:#ffdd8a;
  font-style:normal;
  font-weight:1000;
}

/* Boss removed from Events panel; IDs can stay missing safely. */
#eventsPanel .bossBox{display:none!important}


/* --- Radio Kiss live v2: 2s refresh + volume slider --- */
.kissRadioTop{
  grid-template-columns:auto minmax(160px,260px) 82px!important;
  max-width:440px!important;
  border-radius:22px!important;
  padding:8px 10px 8px 8px!important;
  gap:9px!important;
}
.kissRadioMeta small{
  min-height:28px;
}
.kissRadioMeta .kissLine{
  display:block;
  max-width:260px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.kissVolume{
  display:flex;
  align-items:center;
  gap:5px;
  min-width:78px;
  padding:4px 7px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
}
.kissVolume span{font-size:12px;line-height:1}
.kissVolume input{
  width:52px;
  height:4px;
  accent-color:#22f7ff;
  cursor:pointer;
}
@media(max-width:1100px){
  .kissRadioTop{grid-template-columns:auto minmax(150px,1fr)!important}
  .kissVolume{grid-column:2;max-width:96px}
}
@media(max-width:620px){
  .kissRadioTop{width:100%;max-width:100%!important}
}

/* --- Server boss karta: úplně bez useknutí --- */
.serverBossMini{
  display:block!important;
  min-height:104px!important;
  padding:12px 13px 16px!important;
  overflow:visible!important;
}
.serverBossHead{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:10px!important;
  min-width:0!important;
}
.serverBossName{
  display:block!important;
  max-width:100%!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  line-height:1.2!important;
}
.serverBossMini .bossMeta{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:3px!important;
  margin-top:7px!important;
  overflow:visible!important;
}
.serverBossMini .bossMeta span,
.serverBossMini .bossMeta span:last-child{
  max-width:100%!important;
  text-align:left!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
#eventsPanel .bossBox{display:none!important}


/* --- Final boss card anti-cut + Radio Kiss no waiting text --- */
.panelStack,.slotLayout,.miniVillage,.cityCard{overflow:visible!important}
.serverBossMini{
  min-height:128px!important;
  padding:13px 14px 18px!important;
  margin-bottom:18px!important;
  border-radius:22px!important;
}
.serverBossName{font-size:15px!important;line-height:1.22!important;margin:6px 0 8px!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}
.serverBossMini .bossMeta{display:grid!important;grid-template-columns:1fr!important;gap:4px!important;font-size:11px!important;line-height:1.25!important;overflow:visible!important;padding-bottom:2px!important}
.serverBossMini .bossMeta span,.serverBossMini .bossMeta span:last-child{white-space:normal!important;max-width:100%!important;text-align:left!important;overflow:visible!important;text-overflow:clip!important}
.kissRadioMeta small{min-height:31px!important}
.kissRadioMeta .kissLine em{color:#ffdd8a;font-style:normal;font-weight:1000}


/* --- Kiss: never keep old fake Radio Kiss/live cache and give real title more room --- */
.kissRadioTop{min-width:330px!important}
.kissRadioMeta .kissLine em{color:#ffd166!important}
@media(max-width:620px){.kissRadioTop{min-width:0!important}}


/* --- Radio Kiss immediate server-rendered song --- */
.kissRadioMeta .kissLoading{opacity:.72}
.kissRadioMeta .kissLine{font-weight:800}
.kissRadioMeta .kissLine em{color:#ffdd8a;font-style:normal;font-weight:1000}


/* --- Final fix: server boss nesmí být useknutý v pravém panelu --- */
/* Sahá se jen na boss/right panel layout, rádio a logika hry zůstávají beze změny. */
#slotPanel .panelStack,
#slotPanel .miniVillage{
  overflow:visible!important;
}

#slotPanel .miniVillage{
  padding:15px 16px 14px!important;
}

#slotPanel .miniVillage .compactStage{
  height:120px!important;
  margin-bottom:7px!important;
}

#slotPanel .miniVillage .progress{
  height:7px!important;
}

#slotPanel .miniVillage .statGrid{
  gap:8px!important;
  margin-top:9px!important;
}

#slotPanel .miniVillage .stat{
  padding:8px 10px!important;
  min-height:56px!important;
  border-radius:16px!important;
}

#slotPanel .miniVillage .stat small{
  font-size:11px!important;
  line-height:1.1!important;
}

#slotPanel .miniVillage .stat strong{
  font-size:18px!important;
  line-height:1.15!important;
  margin-top:4px!important;
}

#slotPanel .miniVillage .shieldSlots{
  margin:6px 0 4px!important;
  gap:5px!important;
}

#slotPanel .miniVillage .shieldSlot{
  width:25px!important;
  height:25px!important;
  border-radius:9px!important;
}

#slotPanel .miniVillage .cityBadge{
  margin-top:4px!important;
  gap:7px!important;
}

#slotPanel .miniVillage .cityBadge .pill{
  padding:7px 10px!important;
  font-size:12px!important;
  line-height:1.1!important;
}

#slotPanel .serverBossMini{
  min-height:auto!important;
  height:auto!important;
  margin-top:9px!important;
  margin-bottom:0!important;
  padding:10px 12px 12px!important;
  border-radius:18px!important;
  overflow:visible!important;
  display:grid!important;
  gap:6px!important;
}

#slotPanel .serverBossHead{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  font-size:10px!important;
  line-height:1.1!important;
  min-width:0!important;
}

#slotPanel .serverBossHead span,
#slotPanel .serverBossHead b{
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

#slotPanel .serverBossName{
  display:block!important;
  margin:0!important;
  font-size:14px!important;
  line-height:1.18!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

#slotPanel .serverBossProgress{
  height:7px!important;
  margin:0!important;
}

#slotPanel .serverBossMini .bossMeta{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  align-items:center!important;
  gap:8px!important;
  margin:0!important;
  padding:0!important;
  font-size:10px!important;
  line-height:1.15!important;
  min-height:12px!important;
  overflow:visible!important;
}

#slotPanel .serverBossMini .bossMeta span,
#slotPanel .serverBossMini .bossMeta span:last-child{
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

#slotPanel .serverBossMini .bossMeta span:last-child{
  text-align:right!important;
}

/* Na menších výškách ještě víc zmenšíme jen pravý panel, aby boss nelezl pod obraz. */
@media(max-height:850px){
  #slotPanel .miniVillage{padding:13px 15px 12px!important}
  #slotPanel .miniVillage .compactStage{height:104px!important}
  #slotPanel .miniVillage .statGrid{gap:7px!important;margin-top:7px!important}
  #slotPanel .miniVillage .stat{padding:7px 9px!important;min-height:50px!important}
  #slotPanel .miniVillage .stat strong{font-size:16px!important}
  #slotPanel .serverBossMini{padding:9px 11px 10px!important;gap:5px!important;margin-top:7px!important}
  #slotPanel .serverBossName{font-size:13px!important}
  #slotPanel .serverBossMini .bossMeta{font-size:9.5px!important}
}

@media(max-height:760px){
  #slotPanel .miniVillage .compactStage{height:88px!important}
  #slotPanel .miniVillage .sectionTitle{margin-bottom:8px!important}
  #slotPanel .miniVillage .stat{min-height:46px!important}
  #slotPanel .miniVillage .shieldSlots{display:none!important}
  #slotPanel .serverBossMini{padding:8px 10px!important}
}


/* --- Radio Kiss widget sjednocený podle Sakura Farm --- */
.radioKissTop{
  display:grid!important;
  grid-template-columns:auto minmax(150px,1fr) 88px!important;
  align-items:center!important;
  gap:9px!important;
}
.radioKissMeta{
  min-width:0;
  display:grid;
  gap:2px;
}
.radioKissTitle{
  display:block;
  font-size:12px;
  font-weight:1000;
  line-height:1;
  color:#fff;
}
.radioKissNowPlaying{
  min-width:0;
  display:flex;
  align-items:center;
  gap:5px;
  color:#e9f3ff;
  font-size:11px;
  line-height:1.12;
}
.radioKissNowPlayingIcon{
  flex:0 0 auto;
  opacity:.95;
}
.radioKissNowPlayingTrack{
  min-width:0;
  display:block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-weight:900;
}
.radioKissNowPlaying.is-loaded .radioKissNowPlayingTrack{
  color:#fff;
}
.radioKissControls{
  min-width:80px;
  display:flex;
  align-items:center;
  gap:5px;
  padding:4px 7px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
}
.radioKissVolume{
  width:52px;
  height:4px;
  accent-color:#22f7ff;
  cursor:pointer;
}
.radioKissVolumeText{
  min-width:28px;
  text-align:right;
  font-size:10px;
  font-weight:1000;
  color:#dbe8ff;
}
@media(max-width:1100px){
  .radioKissTop{grid-template-columns:auto minmax(130px,1fr)!important}
  .radioKissControls{grid-column:2;max-width:100px}
}


/* --- Radio Kiss disco top panel effect --- */
:root{
  --rk-level:0;
  --rk-level-px:6px;
  --rk-blur-px:12px;
  --rk-alpha:.12;
  --rk-alpha-strong:.22;
  --rk-shift:0px;
  --rk-scale:1;
  --rk-hue:190;
}
.topbar,
.quickNav.tabNav{
  position:relative;
  isolation:isolate;
}
body.radioKissDisco .topbar::before,
body.radioKissDisco .quickNav.tabNav::before{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:inherit;
  pointer-events:none;
  background:
    linear-gradient(90deg,
      hsla(calc(var(--rk-hue) * 1deg),100%,64%,calc(var(--rk-alpha) + .03)),
      hsla(calc((var(--rk-hue) + 75) * 1deg),100%,66%,calc(var(--rk-alpha) + .08)),
      hsla(calc((var(--rk-hue) + 155) * 1deg),100%,68%,calc(var(--rk-alpha) + .02)),
      hsla(calc((var(--rk-hue) + 235) * 1deg),100%,70%,calc(var(--rk-alpha) + .07)),
      hsla(calc((var(--rk-hue) + 315) * 1deg),100%,64%,calc(var(--rk-alpha) + .03))
    );
  filter:blur(var(--rk-blur-px)) saturate(1.25);
  opacity:calc(.35 + var(--rk-level) * .55);
  z-index:-2;
  animation:radioKissDiscoSweep 1.2s linear infinite;
}
body.radioKissDisco .topbar::after,
body.radioKissDisco .quickNav.tabNav::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:4px;
  height:6px;
  border-radius:999px;
  pointer-events:none;
  background:
    repeating-linear-gradient(
      90deg,
      rgba(255,255,255,.08) 0 10px,
      rgba(255,255,255,.0) 10px 18px
    ),
    linear-gradient(
      90deg,
      hsla(calc(var(--rk-hue) * 1deg),100%,66%,calc(.32 + var(--rk-level) * .30)),
      hsla(calc((var(--rk-hue) + 88) * 1deg),100%,69%,calc(.30 + var(--rk-level) * .32)),
      hsla(calc((var(--rk-hue) + 166) * 1deg),100%,70%,calc(.28 + var(--rk-level) * .28)),
      hsla(calc((var(--rk-hue) + 244) * 1deg),100%,65%,calc(.32 + var(--rk-level) * .30))
    );
  box-shadow:
    0 0 calc(10px + var(--rk-level) * 16px) hsla(calc(var(--rk-hue) * 1deg),100%,65%,calc(.12 + var(--rk-level) * .26)),
    0 0 calc(16px + var(--rk-level) * 22px) rgba(34,247,255,calc(.08 + var(--rk-level) * .18));
  transform:scaleX(calc(.985 + var(--rk-level) * .015));
  opacity:calc(.35 + var(--rk-level) * .6);
  z-index:-1;
}
body.radioKissDisco .topbar{
  transform:translateY(calc(var(--rk-level) * -1.2px)) scale(var(--rk-scale));
}
body.radioKissDisco .quickNav.tabNav{
  box-shadow:
    0 18px 50px rgba(0,0,0,.25),
    inset 0 0 28px rgba(255,255,255,.04),
    0 0 calc(12px + var(--rk-level) * 24px) hsla(calc((var(--rk-hue) + 28) * 1deg),100%,66%,calc(.10 + var(--rk-level) * .24)),
    0 0 calc(18px + var(--rk-level) * 28px) rgba(34,247,255,calc(.08 + var(--rk-level) * .18));
  transform:translateY(calc(var(--rk-level) * -1.5px)) scale(calc(1 + var(--rk-level) * .008));
}
body.radioKissDisco .quickNav.tabNav button{
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease, background .18s ease, border-color .18s ease;
}
body.radioKissDisco .quickNav.tabNav button{
  box-shadow:
    inset 0 0 20px rgba(255,255,255,.05),
    0 0 calc(6px + var(--rk-level) * 18px) hsla(calc(var(--rk-hue) * 1deg),100%,65%,calc(.05 + var(--rk-level) * .16));
  filter:saturate(calc(1 + var(--rk-level) * .5));
}
body.radioKissDisco .quickNav.tabNav button:nth-child(odd){
  transform:translateY(calc(var(--rk-level) * -1.4px));
}
body.radioKissDisco .quickNav.tabNav button:nth-child(even){
  transform:translateY(calc(var(--rk-level) * 1.1px));
}
body.radioKissDisco .quickNav.tabNav button.active{
  box-shadow:
    0 16px 34px rgba(34,247,255,.16),
    0 0 32px rgba(255,47,215,.20),
    0 0 calc(14px + var(--rk-level) * 24px) hsla(calc((var(--rk-hue) + 64) * 1deg),100%,66%,calc(.14 + var(--rk-level) * .28));
}
body.radioKissDisco .pill,
body.radioKissDisco .topOnline{
  box-shadow:
    inset 0 0 20px rgba(255,255,255,.035),
    0 0 calc(10px + var(--rk-level) * 20px) hsla(calc((var(--rk-hue) + 95) * 1deg),100%,68%,calc(.07 + var(--rk-level) * .16));
  border-color:rgba(255,255,255,calc(.16 + var(--rk-level) * .14));
}
body.radioKissDisco .radioKissTop{
  box-shadow:
    0 0 calc(12px + var(--rk-level) * 18px) rgba(34,247,255,calc(.10 + var(--rk-level) * .18)),
    0 0 calc(18px + var(--rk-level) * 24px) rgba(255,47,215,calc(.08 + var(--rk-level) * .14));
}
@keyframes radioKissDiscoSweep{
  0%{transform:translateX(-1.2%) scale(1)}
  50%{transform:translateX(1.2%) scale(1.01)}
  100%{transform:translateX(-1.2%) scale(1)}
}


/* --- Fix: online dropdown musí být nad disco efektem i nad navigací --- */
.topbar{
  position:relative!important;
  z-index:9000!important;
  overflow:visible!important;
  isolation:isolate!important;
}

.pillrow{
  position:relative!important;
  z-index:9001!important;
  overflow:visible!important;
}

.topOnline{
  position:relative!important;
  z-index:9100!important;
  overflow:visible!important;
  isolation:isolate!important;
}

.topOnlineDrop{
  z-index:999999!important;
  position:absolute!important;
  pointer-events:auto!important;
  isolation:isolate!important;
}

.quickNav.tabNav{
  position:relative!important;
  z-index:100!important;
}

body.radioKissDisco .topbar::before,
body.radioKissDisco .topbar::after,
body.radioKissDisco .quickNav.tabNav::before,
body.radioKissDisco .quickNav.tabNav::after{
  pointer-events:none!important;
}

body.radioKissDisco .topOnlineDrop{
  opacity:0;
  transform:translateY(-6px);
}

body.radioKissDisco .topOnline:hover .topOnlineDrop,
body.radioKissDisco .topOnline:focus-within .topOnlineDrop{
  opacity:1!important;
  transform:translateY(0)!important;
  pointer-events:auto!important;
}

body.radioKissDisco .topOnlineDrop,
body.radioKissDisco .topOnlineDrop *{
  filter:none!important;
  transform:none;
}

body.radioKissDisco .topOnline{
  box-shadow:
    inset 0 0 20px rgba(255,255,255,.035),
    0 0 calc(10px + var(--rk-level) * 20px) hsla(calc((var(--rk-hue) + 95) * 1deg),100%,68%,calc(.07 + var(--rk-level) * .16))!important;
}


/* --- Radio Kiss disco PLUS: equalizer, bass glow, tab beat --- */
body.radioKissDisco .topbar,
body.radioKissDisco .quickNav.tabNav{
  transition:transform .08s linear, box-shadow .08s linear, filter .08s linear;
}

.radioKissEq{
  position:absolute;
  left:18px;
  right:18px;
  bottom:5px;
  height:16px;
  display:grid;
  grid-template-columns:repeat(18,1fr);
  gap:4px;
  align-items:end;
  pointer-events:none;
  z-index:0;
  opacity:0;
  transform:translateY(5px);
  transition:opacity .25s ease, transform .25s ease;
}

.radioKissEq i{
  display:block;
  min-height:3px;
  height:calc(3px + var(--rk-eq-0, .2) * 13px);
  border-radius:999px 999px 3px 3px;
  background:linear-gradient(
    180deg,
    hsla(calc((var(--rk-hue) + var(--i) * 13) * 1deg),100%,72%,.98),
    hsla(calc((var(--rk-hue) + var(--i) * 13 + 95) * 1deg),100%,60%,.58)
  );
  box-shadow:
    0 0 10px hsla(calc((var(--rk-hue) + var(--i) * 13) * 1deg),100%,64%,calc(.16 + var(--rk-bass) * .30)),
    0 0 18px rgba(34,247,255,calc(.08 + var(--rk-level) * .16));
  transform-origin:bottom center;
  transform:scaleY(calc(.65 + var(--rk-bass) * .25 + var(--rk-treble) * .18));
}

.radioKissEq i:nth-child(1){height:calc(3px + var(--rk-eq-0,.2) * 13px)}
.radioKissEq i:nth-child(2){height:calc(3px + var(--rk-eq-1,.2) * 13px)}
.radioKissEq i:nth-child(3){height:calc(3px + var(--rk-eq-2,.2) * 13px)}
.radioKissEq i:nth-child(4){height:calc(3px + var(--rk-eq-3,.2) * 13px)}
.radioKissEq i:nth-child(5){height:calc(3px + var(--rk-eq-4,.2) * 13px)}
.radioKissEq i:nth-child(6){height:calc(3px + var(--rk-eq-5,.2) * 13px)}
.radioKissEq i:nth-child(7){height:calc(3px + var(--rk-eq-6,.2) * 13px)}
.radioKissEq i:nth-child(8){height:calc(3px + var(--rk-eq-7,.2) * 13px)}
.radioKissEq i:nth-child(9){height:calc(3px + var(--rk-eq-8,.2) * 13px)}
.radioKissEq i:nth-child(10){height:calc(3px + var(--rk-eq-9,.2) * 13px)}
.radioKissEq i:nth-child(11){height:calc(3px + var(--rk-eq-10,.2) * 13px)}
.radioKissEq i:nth-child(12){height:calc(3px + var(--rk-eq-11,.2) * 13px)}
.radioKissEq i:nth-child(13){height:calc(3px + var(--rk-eq-12,.2) * 13px)}
.radioKissEq i:nth-child(14){height:calc(3px + var(--rk-eq-13,.2) * 13px)}
.radioKissEq i:nth-child(15){height:calc(3px + var(--rk-eq-14,.2) * 13px)}
.radioKissEq i:nth-child(16){height:calc(3px + var(--rk-eq-15,.2) * 13px)}
.radioKissEq i:nth-child(17){height:calc(3px + var(--rk-eq-16,.2) * 13px)}
.radioKissEq i:nth-child(18){height:calc(3px + var(--rk-eq-17,.2) * 13px)}

.radioKissEqTop{
  bottom:-2px;
  height:14px;
}

.radioKissEqNav{
  bottom:3px;
  left:22px;
  right:22px;
  height:12px;
  opacity:0;
}

body.radioKissDisco .radioKissEq{
  opacity:calc(.42 + var(--rk-level) * .58);
  transform:translateY(0);
}

body.radioKissDisco .radioKissEqNav{
  opacity:calc(.25 + var(--rk-mid) * .48);
}

body.radioKissDisco .topbar{
  filter:saturate(calc(1.05 + var(--rk-level) * .45)) brightness(calc(1 + var(--rk-treble) * .06));
  box-shadow:
    0 18px 50px rgba(0,0,0,.22),
    0 0 calc(14px + var(--rk-bass) * 36px) hsla(calc((var(--rk-hue) + 18) * 1deg),100%,64%,calc(.10 + var(--rk-bass) * .24)),
    0 0 calc(18px + var(--rk-level) * 28px) rgba(34,247,255,calc(.08 + var(--rk-level) * .18));
}

body.radioKissDisco .quickNav.tabNav{
  background:
    linear-gradient(90deg,
      hsla(calc(var(--rk-hue) * 1deg),100%,60%,calc(.08 + var(--rk-bass)*.10)),
      rgba(255,255,255,.045),
      hsla(calc((var(--rk-hue) + 150) * 1deg),100%,60%,calc(.06 + var(--rk-treble)*.12))
    ),
    linear-gradient(180deg,rgba(10,15,38,.72),rgba(20,28,62,.58))!important;
}

body.radioKissDisco .quickNav.tabNav button{
  will-change:transform,filter,box-shadow;
  transform:
    translateY(calc((var(--rk-tab-shift, 0) * 1px) + var(--rk-bass) * -1.3px))
    scale(calc(1 + var(--rk-bass) * .010));
  filter:saturate(calc(1.05 + var(--rk-treble) * .70)) brightness(calc(1 + var(--rk-mid) * .06));
}

body.radioKissDisco .quickNav.tabNav button:nth-child(1){--rk-tab-shift:calc(var(--rk-eq-0,.2) * -3)}
body.radioKissDisco .quickNav.tabNav button:nth-child(2){--rk-tab-shift:calc(var(--rk-eq-1,.2) * 2)}
body.radioKissDisco .quickNav.tabNav button:nth-child(3){--rk-tab-shift:calc(var(--rk-eq-2,.2) * -2)}
body.radioKissDisco .quickNav.tabNav button:nth-child(4){--rk-tab-shift:calc(var(--rk-eq-3,.2) * 2.5)}
body.radioKissDisco .quickNav.tabNav button:nth-child(5){--rk-tab-shift:calc(var(--rk-eq-4,.2) * -2.5)}
body.radioKissDisco .quickNav.tabNav button:nth-child(6){--rk-tab-shift:calc(var(--rk-eq-5,.2) * 2)}
body.radioKissDisco .quickNav.tabNav button:nth-child(7){--rk-tab-shift:calc(var(--rk-eq-6,.2) * -2)}
body.radioKissDisco .quickNav.tabNav button:nth-child(8){--rk-tab-shift:calc(var(--rk-eq-7,.2) * 2.5)}
body.radioKissDisco .quickNav.tabNav button:nth-child(9){--rk-tab-shift:calc(var(--rk-eq-8,.2) * -2.5)}
body.radioKissDisco .quickNav.tabNav button:nth-child(10){--rk-tab-shift:calc(var(--rk-eq-9,.2) * 2)}
body.radioKissDisco .quickNav.tabNav button:nth-child(11){--rk-tab-shift:calc(var(--rk-eq-10,.2) * -2)}
body.radioKissDisco .quickNav.tabNav button:nth-child(12){--rk-tab-shift:calc(var(--rk-eq-11,.2) * 2.5)}

body.radioKissDisco .quickNav.tabNav button::after{
  content:"";
  position:absolute;
  left:12px;
  right:12px;
  bottom:5px;
  height:2px;
  border-radius:999px;
  pointer-events:none;
  background:linear-gradient(90deg,
    hsla(calc(var(--rk-hue) * 1deg),100%,70%,calc(.18 + var(--rk-bass) * .36)),
    hsla(calc((var(--rk-hue) + 95) * 1deg),100%,68%,calc(.12 + var(--rk-treble) * .34))
  );
  box-shadow:0 0 calc(8px + var(--rk-bass) * 12px) hsla(calc(var(--rk-hue) * 1deg),100%,64%,calc(.16 + var(--rk-level) * .22));
  opacity:calc(.22 + var(--rk-level) * .62);
}

body.radioKissDisco .quickNav.tabNav button.active::after{
  height:3px;
  opacity:calc(.45 + var(--rk-bass) * .55);
}

body.radioKissDisco .radioKissTop{
  transform:scale(calc(1 + var(--rk-bass) * .012));
  border-color:hsla(calc((var(--rk-hue) + 40) * 1deg),100%,72%,calc(.25 + var(--rk-level) * .35))!important;
}

@media (prefers-reduced-motion: reduce){
  .radioKissEq{display:none!important}
  body.radioKissDisco .quickNav.tabNav button,
  body.radioKissDisco .topbar,
  body.radioKissDisco .quickNav.tabNav{
    transform:none!important;
    animation:none!important;
  }
}


/* --- Fix: online dropdown se otevírá jen přes skutečný online pill, ne přes menu Události --- */
/* Vypne původní CSS :hover pravidlo, které se při disco vrstvách mohlo chytat i mimo online pill. */
.topOnline:hover .topOnlineDrop,
.topOnline:focus-within .topOnlineDrop,
body.radioKissDisco .topOnline:hover .topOnlineDrop,
body.radioKissDisco .topOnline:focus-within .topOnlineDrop{
  opacity:0!important;
  transform:translateY(-6px)!important;
  pointer-events:none!important;
}

/* Nově dropdown otvírá jen JS třídou, když je myš přímo na .topOnline pillu. */
.topOnline.onlineDropOpen .topOnlineDrop,
body.radioKissDisco .topOnline.onlineDropOpen .topOnlineDrop{
  opacity:1!important;
  transform:translateY(0)!important;
  pointer-events:auto!important;
}

.topOnlineDrop{
  will-change:opacity,transform;
}

.quickNav.tabNav,
.quickNav.tabNav button{
  pointer-events:auto!important;
}


/* --- FINAL online dropdown fix: otevřít jen přes online, ale dovolí najet i do dropdownu --- */
.topOnline{
  position:relative!important;
  z-index:9100!important;
  overflow:visible!important;
}

.topOnlineDrop{
  z-index:999999!important;
  position:absolute!important;
  opacity:0!important;
  transform:translateY(-6px)!important;
  pointer-events:none!important;
  transition:opacity .14s ease, transform .14s ease!important;
}

/* Vypne staré CSS hover otevírání, které se chytalo i přes disco/nav vrstvy. */
.topOnline:hover .topOnlineDrop,
.topOnline:focus-within .topOnlineDrop,
body.radioKissDisco .topOnline:hover .topOnlineDrop,
body.radioKissDisco .topOnline:focus-within .topOnlineDrop{
  opacity:0!important;
  transform:translateY(-6px)!important;
  pointer-events:none!important;
}

/* Jediný platný stav: JS přidá třídu onlineDropOpen po najetí na skutečný online pill. */
.topOnline.onlineDropOpen .topOnlineDrop,
body.radioKissDisco .topOnline.onlineDropOpen .topOnlineDrop{
  opacity:1!important;
  transform:translateY(0)!important;
  pointer-events:auto!important;
}

.topOnlineDrop.onlineDropHoverKeep{
  opacity:1!important;
  transform:translateY(0)!important;
  pointer-events:auto!important;
}

.quickNav.tabNav,
.quickNav.tabNav button{
  pointer-events:auto!important;
}

/* Disco efekty nikdy nesmí chytat myš nad online dropdownem. */
body.radioKissDisco .topbar::before,
body.radioKissDisco .topbar::after,
body.radioKissDisco .quickNav.tabNav::before,
body.radioKissDisco .quickNav.tabNav::after,
.radioKissEq{
  pointer-events:none!important;
}


/* --- Neon Events / Server Challenge --- */
.serverChallengeLayout{
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);
}
.serverChallengeCard{
  min-height:0;
}
.challengeHero{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:82px minmax(0,1fr) auto;
  gap:16px;
  align-items:center;
  padding:18px;
  border-radius:24px;
  border:1px solid rgba(34,247,255,.22);
  background:
    radial-gradient(circle at 10% 20%,rgba(255,47,215,.18),transparent 35%),
    radial-gradient(circle at 85% 15%,rgba(34,247,255,.18),transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
  box-shadow:inset 0 0 34px rgba(255,255,255,.035),0 0 34px rgba(34,247,255,.08);
  overflow:hidden;
}
.challengeHero:before{
  content:"";
  position:absolute;
  inset:auto -20% -35% -20%;
  height:70%;
  background:linear-gradient(90deg,rgba(255,47,215,.18),rgba(34,247,255,.20),rgba(255,209,102,.14));
  filter:blur(34px);
  opacity:.55;
  pointer-events:none;
}
.challengeIcon{
  width:74px;
  height:74px;
  border-radius:24px;
  display:grid;
  place-items:center;
  font-size:38px;
  background:linear-gradient(135deg,rgba(255,47,215,.28),rgba(34,247,255,.22));
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 0 30px rgba(34,247,255,.14),inset 0 0 24px rgba(255,255,255,.08);
}
.challengeMain{
  min-width:0;
  display:grid;
  gap:7px;
}
.challengeMain small{
  color:#9ffcff;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:11px;
}
.challengeMain h3{
  margin:0;
  font-size:clamp(22px,2vw,34px);
  letter-spacing:-.05em;
}
.challengeMain p{
  margin:0;
  color:var(--muted);
  line-height:1.4;
}
.challengeProgressTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-weight:1000;
  color:#fff;
  font-size:13px;
}
.challengeProgress{
  height:10px;
  background:rgba(255,255,255,.08);
}
.challengeProgress i{
  background:linear-gradient(90deg,var(--pink),var(--cyan),var(--gold));
  box-shadow:0 0 20px rgba(34,247,255,.22);
}
.challengeReward{
  display:inline-flex;
  width:max-content;
  max-width:100%;
  padding:8px 11px;
  border-radius:999px;
  border:1px solid rgba(255,209,102,.25);
  background:rgba(255,209,102,.08);
  color:#fff4c8;
  font-weight:1000;
  font-size:12px;
}
.challengeInfoGrid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin:14px 0;
}
.challengeInfo{
  border:1px solid rgba(255,255,255,.11);
  border-radius:18px;
  background:rgba(255,255,255,.055);
  padding:12px;
}
.challengeInfo small{
  display:block;
  color:var(--muted);
  font-weight:900;
}
.challengeInfo b{
  display:block;
  margin-top:4px;
  font-size:17px;
}
.challengeTopRows{
  position:relative;
  z-index:1;
  display:grid;
  gap:8px;
}
.challengeTopItem{
  display:grid;
  grid-template-columns:44px minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.045);
}
.challengeTopItem span{
  width:32px;
  height:32px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,rgba(255,47,215,.22),rgba(34,247,255,.18));
  font-weight:1000;
}
.challengeTopItem b{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.challengeTopItem em{
  font-style:normal;
  color:#cfffff;
  font-weight:1000;
}
.challengeTopEmpty{
  padding:14px;
  border-radius:16px;
  color:var(--muted);
  border:1px dashed rgba(255,255,255,.14);
}
@media(max-width:1180px){
  .serverChallengeLayout{
    grid-template-columns:1fr;
  }
}
@media(max-width:760px){
  .challengeHero{
    grid-template-columns:1fr;
  }
  .challengeIcon{
    width:62px;
    height:62px;
    font-size:32px;
  }
  .challengeInfoGrid{
    grid-template-columns:1fr;
  }
}


/* --- Event join button --- */
.challengeActions{
  display:grid;
  gap:9px;
  min-width:150px;
}
.challengeActions .btn{
  width:100%;
  white-space:nowrap;
}
.challengeInfoGrid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
@media(max-width:980px){
  .challengeInfoGrid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:760px){
  .challengeActions{
    width:100%;
  }
  .challengeInfoGrid{
    grid-template-columns:1fr;
  }
}


/* --- Stage missions: 20 misí na etapu, přehlednější grid --- */
#missionCard .rows{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
#missionCard .mission{
  min-height:104px;
  align-items:center;
}
#missionCard .mission small{
  font-size:11px;
}
#missionCard .mission b{
  font-size:13px;
}
#missionCard .mission .btn{
  min-width:74px;
}
@media(max-width:980px){
  #missionCard .rows{
    grid-template-columns:1fr;
  }
}


/* --- Tournament Arena redesign --- */
.tournamentLayout{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);gap:16px}
.tourneySide{display:grid;gap:16px}
.tourneyHeroBox{position:relative;display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:16px;align-items:center;padding:18px;border-radius:28px;border:1px solid rgba(255,149,0,.22);background:radial-gradient(circle at 14% 18%, rgba(255,72,145,.22), transparent 34%),radial-gradient(circle at 88% 18%, rgba(34,247,255,.18), transparent 30%),linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035));box-shadow:0 0 34px rgba(255,149,0,.09), inset 0 0 40px rgba(255,255,255,.04);overflow:hidden}
.tourneyHeroBox:before{content:"";position:absolute;inset:auto -18% -46% -18%;height:78%;background:linear-gradient(90deg, rgba(255,72,145,.18), rgba(255,169,64,.18), rgba(34,247,255,.18));filter:blur(32px);pointer-events:none}
.tourneyHeroIcon{width:84px;height:84px;border-radius:26px;display:grid;place-items:center;font-size:42px;background:linear-gradient(135deg, rgba(255,72,145,.28), rgba(255,169,64,.22));border:1px solid rgba(255,255,255,.16);box-shadow:0 0 28px rgba(255,169,64,.18), inset 0 0 22px rgba(255,255,255,.08)}
.tourneyHeroMain{min-width:0;display:grid;gap:7px}
.tourneyHeroMain small{color:#ffe39d;font-weight:1000;text-transform:uppercase;letter-spacing:.08em;font-size:11px}
.tourneyHeroMain h3{margin:0;font-size:clamp(24px,2.1vw,36px);letter-spacing:-.05em}
.tourneyHeroMain p{margin:0;color:var(--muted);line-height:1.45}
.tourneyFocusChips{display:flex;flex-wrap:wrap;gap:8px}
.tourneyChip{display:inline-flex;align-items:center;gap:6px;padding:8px 11px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.055);font-size:12px;font-weight:1000;color:#fff}
.tourneyHeroMeta{display:flex;flex-wrap:wrap;gap:8px}
.tourneyMetaPill{display:inline-flex;align-items:center;padding:8px 11px;border-radius:999px;border:1px solid rgba(34,247,255,.16);background:rgba(34,247,255,.08);font-size:12px;font-weight:1000;color:#cbffff}
.tourneyMetaPill.gold{border-color:rgba(255,209,102,.20);background:rgba(255,209,102,.10);color:#ffe9b4}
.tourneyHeroActions{display:grid;gap:9px;min-width:164px}
.tourneyHeroActions .btn{width:100%}
.tourneyStatsGrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 16px}
.tourneyStatCard{padding:14px;border-radius:20px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.05);box-shadow:inset 0 0 18px rgba(255,255,255,.03)}
.tourneyStatCard small{display:block;color:var(--muted);font-weight:900}
.tourneyStatCard b{display:block;margin-top:4px;font-size:24px;line-height:1.1}
.tourneyStatCard span{display:block;margin-top:5px;color:#d8fdff;font-size:12px}
.tourneyColumns{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:14px}
.tourneyRewardRows{display:grid;gap:10px}
.tourneyRewardItem{display:grid;grid-template-columns:92px minmax(0,1fr);gap:12px;align-items:center;padding:12px 14px;border-radius:18px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.048)}
.tourneyRewardItem.top{border-color:rgba(255,209,102,.28);background:linear-gradient(180deg, rgba(255,209,102,.12), rgba(255,255,255,.05));box-shadow:0 0 24px rgba(255,209,102,.08)}
.tourneyRewardPlace{width:100%;text-align:center;padding:10px 8px;border-radius:14px;background:linear-gradient(135deg, rgba(255,72,145,.2), rgba(255,169,64,.18));font-weight:1000}
.tourneyRewardMain b{display:block}
.tourneyRewardMain small{display:block;color:#d7fcff;line-height:1.4}
.tournamentLeader.top{border-color:rgba(255,209,102,.26);background:linear-gradient(180deg, rgba(255,209,102,.12), rgba(255,255,255,.05))}
.tourneyLastReward{margin-top:16px;padding:14px 16px;border-radius:20px;border:1px dashed rgba(255,255,255,.16);color:var(--muted)}
.tourneyLastReward.ready{border-style:solid;border-color:rgba(34,247,255,.22);background:linear-gradient(180deg, rgba(34,247,255,.10), rgba(255,255,255,.04));color:#fff}
.tourneyLastHead{font-weight:1000;margin-bottom:6px}
.tourneyLastText{margin-top:6px;color:#d6ffff}
.tourneyTipList{display:grid;gap:10px}
.tourneyTip{padding:12px 14px;border-radius:16px;border:1px solid rgba(255,255,255,.10);background:rgba(255,255,255,.045);color:var(--muted);line-height:1.45}
@media(max-width:1200px){.tournamentLayout{grid-template-columns:1fr}}
@media(max-width:980px){.tourneyStatsGrid{grid-template-columns:repeat(2,minmax(0,1fr))}.tourneyColumns{grid-template-columns:1fr}}
@media(max-width:760px){.tourneyHeroBox{grid-template-columns:1fr}.tourneyHeroIcon{width:68px;height:68px;font-size:34px}.tourneyHeroActions{min-width:0}.tourneyStatsGrid{grid-template-columns:1fr}.tourneyRewardItem{grid-template-columns:1fr}}


/* --- Tournament reward panel no-cut fix --- */
.tourneyColumns{
  grid-template-columns:minmax(0,1.18fr) minmax(280px,.82fr);
  align-items:start;
}
.tourneyRewardRows,
#tourneyRows{
  min-width:0;
}
.tourneyRewardRows{
  max-height:390px;
  overflow:auto;
  padding-right:3px;
}
.tourneyRewardItem{
  min-width:0;
  grid-template-columns:84px minmax(0,1fr);
  padding:11px 12px;
}
.tourneyRewardPlace{
  padding:9px 8px;
}
.tourneyRewardMain{
  min-width:0;
}
.tourneyRewardMain b,
.tourneyRewardMain small{
  white-space:normal;
  overflow-wrap:anywhere;
}
#tourneyRows .logItem,
#tourneyRows .leader{
  min-width:0;
}
#tourneyRows .leader small,
#tourneyRows .logItem{
  white-space:normal;
  overflow-wrap:anywhere;
}
@media(max-width:980px){
  .tourneyColumns{
    grid-template-columns:1fr;
  }
  .tourneyRewardRows{
    max-height:none;
    overflow:visible;
    padding-right:0;
  }
}


/* --- Gang + Chat clickability repair --- */
#gangPanel,
#chatPanel{
  position:relative!important;
  z-index:200!important;
  pointer-events:auto!important;
}
#gangPanel *,
#chatPanel *{
  pointer-events:auto;
}
#chatInput,
#gangInput,
#chatSendBtn,
#gangJoinBtn,
#gangLeaveBtn{
  position:relative;
  z-index:220!important;
  pointer-events:auto!important;
}
.chatComposer,
.gangBox{
  position:relative;
  z-index:210!important;
}


/* --- HARD FAILSAFE visibility for GANG + Chat --- */
body.hardGangChatMode .tabPanel:not(.hardVisiblePanel){
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
}

#gangPanel.hardVisiblePanel,
#chatPanel.hardVisiblePanel,
#gangPanel.active,
#chatPanel.active,
body:has([data-panel="gangPanel"].active) #gangPanel,
body:has([data-panel="chatPanel"].active) #chatPanel,
body:has([data-panel="gangPanel"]:focus) #gangPanel,
body:has([data-panel="chatPanel"]:focus) #chatPanel{
  display:grid!important;
  visibility:visible!important;
  opacity:1!important;
  min-height:calc(100vh - 110px)!important;
  position:relative!important;
  z-index:999!important;
  pointer-events:auto!important;
  grid-template-columns:1fr!important;
}

#gangPanel .card,
#chatPanel .card,
#gangPanel .gangCasino,
#chatPanel .chatCasino{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  position:relative!important;
  z-index:1000!important;
}

#gangPanel .gangCasino{
  flex-direction:column!important;
}

#chatPanel.chatLayout.hardVisiblePanel,
#chatPanel.chatLayout.active{
  grid-template-columns:minmax(0,1fr) 330px!important;
}

#gangPanel * ,
#chatPanel *{
  pointer-events:auto!important;
}

#gangInput,
#chatInput,
#gangJoinBtn,
#gangLeaveBtn,
#chatSendBtn{
  position:relative!important;
  z-index:1200!important;
  pointer-events:auto!important;
}

@media(max-width:900px){
  #chatPanel.chatLayout.hardVisiblePanel,
  #chatPanel.chatLayout.active{
    grid-template-columns:1fr!important;
  }
}


/* --- FORCE VISIBLE GANG/CHAT PANEL --- */
body.gcForceMode{
  overflow:hidden!important;
}

body.gcForceMode .tabPanel:not(.gcForcedPanel){
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
}

#gangPanel.gcForcedPanel,
#chatPanel.gcForcedPanel{
  display:grid!important;
  visibility:visible!important;
  opacity:1!important;
  position:fixed!important;
  top:82px!important;
  left:8px!important;
  right:8px!important;
  bottom:8px!important;
  z-index:999999!important;
  overflow:auto!important;
  padding:16px!important;
  border-radius:26px!important;
  border:1px solid rgba(34,247,255,.22)!important;
  background:
    radial-gradient(circle at 10% 0%,rgba(255,47,215,.18),transparent 34%),
    radial-gradient(circle at 90% 0%,rgba(34,247,255,.14),transparent 34%),
    linear-gradient(180deg,rgba(10,15,38,.98),rgba(12,18,36,.98))!important;
  box-shadow:0 28px 80px rgba(0,0,0,.55),0 0 42px rgba(34,247,255,.10)!important;
  pointer-events:auto!important;
}

#gangPanel.gcForcedPanel{
  grid-template-columns:1fr!important;
}

#chatPanel.gcForcedPanel{
  grid-template-columns:minmax(0,1fr) 340px!important;
}

#gangPanel.gcForcedPanel .card,
#chatPanel.gcForcedPanel .card,
#gangPanel.gcForcedPanel .gangCasino,
#chatPanel.gcForcedPanel .chatCasino{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  position:relative!important;
  z-index:1000000!important;
  min-height:auto!important;
}

#gangPanel.gcForcedPanel .gangCasino,
#chatPanel.gcForcedPanel .chatCasino{
  flex-direction:column!important;
}

#gangPanel.gcForcedPanel *,
#chatPanel.gcForcedPanel *{
  pointer-events:auto!important;
}

#gangPanel.gcForcedPanel input,
#chatPanel.gcForcedPanel input,
#gangPanel.gcForcedPanel button,
#chatPanel.gcForcedPanel button{
  position:relative!important;
  z-index:1000001!important;
}

@media(max-width:900px){
  #chatPanel.gcForcedPanel{
    grid-template-columns:1fr!important;
  }
}


/* --- Premium redesign pro Force GANG + Chat panel --- */
#gangPanel.gcForcedPanel,
#chatPanel.gcForcedPanel{
  top:72px!important;
  left:18px!important;
  right:18px!important;
  bottom:18px!important;
  padding:18px!important;
  border-radius:30px!important;
  border:1px solid rgba(93,247,255,.20)!important;
  background:
    radial-gradient(circle at 8% 0%,rgba(255,47,215,.22),transparent 34%),
    radial-gradient(circle at 86% 0%,rgba(34,247,255,.18),transparent 34%),
    linear-gradient(135deg,rgba(13,18,42,.98),rgba(12,24,42,.98) 48%,rgba(17,18,42,.98))!important;
  box-shadow:
    0 30px 90px rgba(0,0,0,.58),
    inset 0 0 0 1px rgba(255,255,255,.035),
    0 0 42px rgba(34,247,255,.10)!important;
}

/* GANG HQ layout */
#gangPanel.gcForcedPanel .gangCasino{
  display:grid!important;
  grid-template-rows:auto auto auto minmax(0,1fr)!important;
  gap:14px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

#gangPanel.gcForcedPanel .sectionTitle{
  padding:0 4px!important;
  margin:0!important;
}

#gangPanel.gcForcedPanel .sectionTitle h2{
  font-size:22px!important;
  letter-spacing:-.03em!important;
}

#gangPanel.gcForcedPanel .gangHero{
  display:grid!important;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr)!important;
  gap:16px!important;
  align-items:stretch!important;
}

#gangPanel.gcForcedPanel .gangActionCard,
#gangPanel.gcForcedPanel .gangChestCard{
  position:relative!important;
  overflow:hidden!important;
  border-radius:26px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:
    radial-gradient(circle at 12% 0%,rgba(255,47,215,.16),transparent 38%),
    radial-gradient(circle at 90% 0%,rgba(34,247,255,.12),transparent 36%),
    linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035))!important;
  box-shadow:
    inset 0 0 32px rgba(255,255,255,.035),
    0 18px 42px rgba(0,0,0,.20)!important;
}

#gangPanel.gcForcedPanel .gangActionCard{
  padding:16px!important;
}

#gangPanel.gcForcedPanel .gangActionCard::before{
  content:"🏰 GANG HQ";
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:12px;
  color:#d7fbff;
  font-size:12px;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.08em;
}

#gangPanel.gcForcedPanel .gangBox{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 116px 108px!important;
  gap:10px!important;
  margin:0 0 12px!important;
}

#gangPanel.gcForcedPanel #gangInput{
  height:54px!important;
  border-radius:18px!important;
  padding:0 18px!important;
  font-size:16px!important;
  font-weight:1000!important;
  background:rgba(4,8,24,.72)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  color:#fff!important;
  text-transform:none!important;
}

#gangPanel.gcForcedPanel #gangJoinBtn,
#gangPanel.gcForcedPanel #gangLeaveBtn{
  height:54px!important;
  border-radius:18px!important;
  font-size:13px!important;
  font-weight:1000!important;
}

#gangPanel.gcForcedPanel #gangJoinBtn{
  background:linear-gradient(135deg,#ff4ed8,#22f7ff)!important;
  color:#06111e!important;
  box-shadow:0 0 26px rgba(34,247,255,.18)!important;
}

#gangPanel.gcForcedPanel .gangSelfBanner{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  min-height:58px!important;
  padding:12px 16px!important;
  border-radius:20px!important;
  border:1px solid rgba(255,209,102,.22)!important;
  background:
    linear-gradient(90deg,rgba(255,209,102,.12),rgba(34,247,255,.08))!important;
  color:#f5fbff!important;
  font-size:14px!important;
  line-height:1.35!important;
}

#gangPanel.gcForcedPanel .gangSelfBanner .gangSelfStatus{
  display:inline-flex!important;
  padding:7px 10px!important;
  border-radius:999px!important;
  background:rgba(255,209,102,.13)!important;
  border:1px solid rgba(255,209,102,.24)!important;
  color:#ffe9b5!important;
  font-size:11px!important;
  font-weight:1000!important;
  text-transform:uppercase!important;
  letter-spacing:.06em!important;
}

#gangPanel.gcForcedPanel .gangSelfBanner b{
  font-size:18px!important;
  color:#fff!important;
}

#gangPanel.gcForcedPanel .gangSelfBanner em{
  font-style:normal!important;
  color:#cbd8ee!important;
  font-weight:900!important;
}

#gangPanel.gcForcedPanel .gangChestCard{
  padding:16px!important;
}

#gangPanel.gcForcedPanel .gangChestBox{
  display:grid!important;
  gap:10px!important;
  padding:0!important;
}

#gangPanel.gcForcedPanel .gangChestHead b{
  display:block!important;
  font-size:16px!important;
}

#gangPanel.gcForcedPanel .gangChestHead small{
  display:block!important;
  margin-top:4px!important;
  color:#aebbd5!important;
}

#gangPanel.gcForcedPanel .gangChestMeta{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  color:#fff!important;
  font-weight:1000!important;
}

#gangPanel.gcForcedPanel .gangStatsGrid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
}

#gangPanel.gcForcedPanel .gangStat{
  min-height:82px!important;
  padding:14px!important;
  border-radius:20px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.035))!important;
  box-shadow:inset 0 0 20px rgba(255,255,255,.025)!important;
}

#gangPanel.gcForcedPanel .gangStat .gIcon{
  width:34px!important;
  height:34px!important;
  border-radius:13px!important;
  background:linear-gradient(135deg,rgba(255,47,215,.20),rgba(34,247,255,.16))!important;
}

#gangPanel.gcForcedPanel .gangStat small{
  margin-top:8px!important;
  color:#aebbd5!important;
  font-weight:900!important;
}

#gangPanel.gcForcedPanel .gangStat b{
  margin-top:4px!important;
  font-size:20px!important;
}

#gangPanel.gcForcedPanel .gangPerkSection{
  padding:16px!important;
  border-radius:24px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  background:rgba(0,0,0,.16)!important;
}

#gangPanel.gcForcedPanel .gangPerks{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
}

#gangPanel.gcForcedPanel .gangPerk{
  min-height:70px!important;
  padding:12px!important;
  border-radius:18px!important;
  background:rgba(255,255,255,.055)!important;
  border:1px solid rgba(255,255,255,.10)!important;
}

#gangPanel.gcForcedPanel .gangColumns{
  display:grid!important;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important;
  gap:14px!important;
  min-height:0!important;
}

#gangPanel.gcForcedPanel .gangColumn{
  min-height:170px!important;
  border-radius:24px!important;
  padding:14px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  background:rgba(0,0,0,.16)!important;
}

#gangPanel.gcForcedPanel .gangMembersList,
#gangPanel.gcForcedPanel #gangRows{
  max-height:245px!important;
  overflow:auto!important;
  padding-right:4px!important;
}

#gangPanel.gcForcedPanel .leader,
#chatPanel.gcForcedPanel .leader{
  border-radius:16px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  background:rgba(255,255,255,.045)!important;
}

/* Chat premium fix */
#chatPanel.gcForcedPanel{
  gap:16px!important;
  grid-template-columns:minmax(0,1fr) 360px!important;
}

#chatPanel.gcForcedPanel .chatCasino,
#chatPanel.gcForcedPanel .chatSide .card{
  border-radius:26px!important;
  border:1px solid rgba(255,255,255,.11)!important;
  background:
    linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.035))!important;
  box-shadow:inset 0 0 28px rgba(255,255,255,.025)!important;
}

#chatPanel.gcForcedPanel .chatComposer{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 120px!important;
  gap:10px!important;
  padding:12px!important;
  border-radius:22px!important;
  background:rgba(0,0,0,.18)!important;
  border:1px solid rgba(255,255,255,.10)!important;
}

#chatPanel.gcForcedPanel #chatInput{
  height:50px!important;
  border-radius:17px!important;
  background:rgba(4,8,24,.72)!important;
  border:1px solid rgba(255,255,255,.12)!important;
}

#chatPanel.gcForcedPanel #chatSendBtn{
  height:50px!important;
  border-radius:17px!important;
  background:linear-gradient(135deg,#ff4ed8,#22f7ff)!important;
  color:#06111e!important;
}

#chatPanel.gcForcedPanel .chatRows{
  max-height:calc(100vh - 245px)!important;
  overflow:auto!important;
  padding-right:6px!important;
}

#chatPanel.gcForcedPanel .chatMsg{
  border-radius:20px!important;
  background:rgba(255,255,255,.045)!important;
}

#chatPanel.gcForcedPanel .chatAvatar{
  background:linear-gradient(135deg,rgba(255,47,215,.28),rgba(34,247,255,.22))!important;
}

@media(max-width:1150px){
  #gangPanel.gcForcedPanel .gangHero,
  #gangPanel.gcForcedPanel .gangColumns,
  #chatPanel.gcForcedPanel{
    grid-template-columns:1fr!important;
  }
  #gangPanel.gcForcedPanel .gangStatsGrid,
  #gangPanel.gcForcedPanel .gangPerks{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:720px){
  #gangPanel.gcForcedPanel,
  #chatPanel.gcForcedPanel{
    left:8px!important;
    right:8px!important;
    top:72px!important;
    bottom:8px!important;
    padding:10px!important;
  }
  #gangPanel.gcForcedPanel .gangBox,
  #chatPanel.gcForcedPanel .chatComposer{
    grid-template-columns:1fr!important;
  }
  #gangPanel.gcForcedPanel .gangStatsGrid,
  #gangPanel.gcForcedPanel .gangPerks{
    grid-template-columns:1fr!important;
  }
}


/* --- Normal tabs fix: GANG + Chat už nejsou overlay, fungují jako ostatní záložky --- */
body.gcForceMode,
body.hardGangChatMode{
  overflow:auto!important;
}

body.gcForceMode .tabPanel:not(.active),
body.hardGangChatMode .tabPanel:not(.active){
  display:none!important;
}

#gangPanel.gcForcedPanel,
#chatPanel.gcForcedPanel,
#gangPanel.hardVisiblePanel,
#chatPanel.hardVisiblePanel,
#gangPanel.active,
#chatPanel.active,
body:has([data-panel="gangPanel"].active) #gangPanel,
body:has([data-panel="chatPanel"].active) #chatPanel{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  right:auto!important;
  bottom:auto!important;
  z-index:auto!important;
  display:grid!important;
  visibility:visible!important;
  opacity:1!important;
  min-height:0!important;
  overflow:visible!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  pointer-events:auto!important;
}

#gangPanel.active{
  grid-template-columns:1fr!important;
}

#chatPanel.active{
  grid-template-columns:minmax(0,1fr) 330px!important;
}

#gangPanel.active .gangCasino,
#chatPanel.active .chatCasino,
#chatPanel.active .chatSide .card{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  position:relative!important;
}

#gangPanel.active .gangCasino{
  flex-direction:column!important;
}

#gangPanel.active *,
#chatPanel.active *{
  pointer-events:auto!important;
}

/* Premium vzhled uvnitř normální záložky, bez překrytí menu */
#gangPanel.active .gangHero{
  display:grid!important;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr)!important;
  gap:16px!important;
  align-items:stretch!important;
}

#gangPanel.active .gangActionCard,
#gangPanel.active .gangChestCard,
#chatPanel.active .chatCasino,
#chatPanel.active .chatSide .card{
  border-radius:26px!important;
  border:1px solid rgba(255,255,255,.11)!important;
  background:
    radial-gradient(circle at 12% 0%,rgba(255,47,215,.13),transparent 38%),
    radial-gradient(circle at 90% 0%,rgba(34,247,255,.10),transparent 36%),
    linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.035))!important;
  box-shadow:inset 0 0 28px rgba(255,255,255,.025)!important;
}

#gangPanel.active .gangActionCard,
#gangPanel.active .gangChestCard{
  padding:16px!important;
}

#gangPanel.active .gangBox{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 116px 108px!important;
  gap:10px!important;
  margin:0 0 12px!important;
}

#gangPanel.active #gangInput,
#chatPanel.active #chatInput{
  height:52px!important;
  border-radius:18px!important;
  background:rgba(4,8,24,.72)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  color:#fff!important;
}

#gangPanel.active #gangJoinBtn,
#chatPanel.active #chatSendBtn{
  background:linear-gradient(135deg,#ff4ed8,#22f7ff)!important;
  color:#06111e!important;
  box-shadow:0 0 26px rgba(34,247,255,.16)!important;
}

#gangPanel.active .gangStatsGrid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
}

#gangPanel.active .gangPerks{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
}

#gangPanel.active .gangColumns{
  display:grid!important;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important;
  gap:14px!important;
}

#gangPanel.active .gangColumn{
  border-radius:24px!important;
  padding:14px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  background:rgba(0,0,0,.16)!important;
}

#gangPanel.active .gangMembersList,
#gangPanel.active #gangRows{
  max-height:245px!important;
  overflow:auto!important;
  padding-right:4px!important;
}

#chatPanel.active .chatComposer{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 120px!important;
  gap:10px!important;
  padding:12px!important;
  border-radius:22px!important;
  background:rgba(0,0,0,.18)!important;
  border:1px solid rgba(255,255,255,.10)!important;
}

#chatPanel.active .chatRows{
  max-height:calc(100vh - 260px)!important;
  overflow:auto!important;
  padding-right:6px!important;
}

@media(max-width:1150px){
  #gangPanel.active .gangHero,
  #gangPanel.active .gangColumns,
  #chatPanel.active{
    grid-template-columns:1fr!important;
  }
  #gangPanel.active .gangStatsGrid,
  #gangPanel.active .gangPerks{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:720px){
  #gangPanel.active .gangBox,
  #chatPanel.active .chatComposer{
    grid-template-columns:1fr!important;
  }
  #gangPanel.active .gangStatsGrid,
  #gangPanel.active .gangPerks{
    grid-template-columns:1fr!important;
  }
}


/* --- Clean tabs restore: žádné zaseknuté inline display:none a žádný overlay --- */
body.gcForceMode,
body.hardGangChatMode{
  overflow:auto!important;
}

.tabPanel.gcForcedPanel,
.tabPanel.hardVisiblePanel{
  position:relative!important;
  top:auto!important;
  left:auto!important;
  right:auto!important;
  bottom:auto!important;
  z-index:auto!important;
}

.appTabs .tabPanel{
  visibility:visible;
  opacity:1;
}

.appTabs .tabPanel:not(.active){
  display:none!important;
}

.appTabs .tabPanel.active{
  display:grid!important;
  position:relative!important;
  top:auto!important;
  left:auto!important;
  right:auto!important;
  bottom:auto!important;
  z-index:auto!important;
  min-height:0!important;
  overflow:visible!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

#gangPanel.active{
  grid-template-columns:1fr!important;
}

#chatPanel.active{
  grid-template-columns:minmax(0,1fr) 330px!important;
}

/* premium vzhled uvnitř normální záložky */
#gangPanel.active .gangHero{
  display:grid!important;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr)!important;
  gap:16px!important;
}

#gangPanel.active .gangActionCard,
#gangPanel.active .gangChestCard,
#chatPanel.active .chatCasino,
#chatPanel.active .chatSide .card{
  border-radius:26px!important;
  border:1px solid rgba(255,255,255,.11)!important;
  background:
    radial-gradient(circle at 12% 0%,rgba(255,47,215,.13),transparent 38%),
    radial-gradient(circle at 90% 0%,rgba(34,247,255,.10),transparent 36%),
    linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.035))!important;
  box-shadow:inset 0 0 28px rgba(255,255,255,.025)!important;
}

#gangPanel.active .gangActionCard,
#gangPanel.active .gangChestCard{
  padding:16px!important;
}

#gangPanel.active .gangBox{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 116px 108px!important;
  gap:10px!important;
  margin:0 0 12px!important;
}

#gangPanel.active #gangInput,
#chatPanel.active #chatInput{
  height:52px!important;
  border-radius:18px!important;
  background:rgba(4,8,24,.72)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  color:#fff!important;
}

#gangPanel.active #gangJoinBtn,
#chatPanel.active #chatSendBtn{
  background:linear-gradient(135deg,#ff4ed8,#22f7ff)!important;
  color:#06111e!important;
}

#gangPanel.active .gangStatsGrid,
#gangPanel.active .gangPerks{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
}

#gangPanel.active .gangColumns{
  display:grid!important;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important;
  gap:14px!important;
}

#gangPanel.active .gangColumn{
  border-radius:24px!important;
  padding:14px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  background:rgba(0,0,0,.16)!important;
}

#gangPanel.active .gangMembersList,
#gangPanel.active #gangRows{
  max-height:245px!important;
  overflow:auto!important;
  padding-right:4px!important;
}

#chatPanel.active .chatComposer{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 120px!important;
  gap:10px!important;
  padding:12px!important;
  border-radius:22px!important;
  background:rgba(0,0,0,.18)!important;
  border:1px solid rgba(255,255,255,.10)!important;
}

#chatPanel.active .chatRows{
  max-height:calc(100vh - 260px)!important;
  overflow:auto!important;
  padding-right:6px!important;
}

@media(max-width:1150px){
  #gangPanel.active .gangHero,
  #gangPanel.active .gangColumns,
  #chatPanel.active{
    grid-template-columns:1fr!important;
  }
  #gangPanel.active .gangStatsGrid,
  #gangPanel.active .gangPerks{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:720px){
  #gangPanel.active .gangBox,
  #chatPanel.active .chatComposer{
    grid-template-columns:1fr!important;
  }
  #gangPanel.active .gangStatsGrid,
  #gangPanel.active .gangPerks{
    grid-template-columns:1fr!important;
  }
}


/* --- Chat only layout: odstraněn online panel/tip, composer dole --- */
#chatPanel.chatOnlyLayout,
#chatPanel.chatOnlyLayout.active,
#chatPanel.active.chatOnlyLayout,
body:has([data-panel="chatPanel"].active) #chatPanel.chatOnlyLayout{
  grid-template-columns:1fr!important;
}

#chatPanel.chatOnlyLayout .chatSide{
  display:none!important;
}

#chatPanel.chatOnlyLayout .chatOnlyCard,
#chatPanel.active.chatOnlyLayout .chatOnlyCard{
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  gap:12px!important;
  min-height:calc(100vh - 145px)!important;
}

#chatPanel.chatOnlyLayout .chatOnlyRows{
  min-height:0!important;
  max-height:none!important;
  overflow:auto!important;
  padding-right:6px!important;
}

#chatPanel.chatOnlyLayout .chatComposerBottom{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 130px!important;
  gap:10px!important;
  margin-top:0!important;
  padding:12px!important;
  border-radius:22px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  background:
    radial-gradient(circle at 10% 0%,rgba(255,47,215,.10),transparent 36%),
    radial-gradient(circle at 90% 0%,rgba(34,247,255,.09),transparent 36%),
    rgba(0,0,0,.18)!important;
  box-shadow:inset 0 0 22px rgba(255,255,255,.025)!important;
}

#chatPanel.chatOnlyLayout #chatInput{
  height:52px!important;
  border-radius:18px!important;
}

#chatPanel.chatOnlyLayout #chatSendBtn{
  height:52px!important;
  border-radius:18px!important;
  font-weight:1000!important;
}

@media(max-width:720px){
  #chatPanel.chatOnlyLayout .chatComposerBottom{
    grid-template-columns:1fr!important;
  }
}


/* --- Chat Ctrl+Enter + poslední zpráva dole --- */
#chatPanel.chatOnlyLayout .chatTextarea,
#chatPanel.active #chatInput.chatTextarea{
  min-height:56px!important;
  max-height:120px!important;
  resize:vertical!important;
  line-height:1.35!important;
  padding:12px 16px!important;
  overflow:auto!important;
  white-space:pre-wrap!important;
}

#chatPanel.chatOnlyLayout .chatOnlyRows,
#chatPanel.active .chatRows{
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  gap:8px!important;
  scroll-behavior:smooth;
}

#chatPanel.chatOnlyLayout .chatMsg,
#chatPanel.active .chatMsg{
  flex:0 0 auto!important;
}

#chatPanel.chatOnlyLayout .chatText,
#chatPanel.active .chatText{
  white-space:pre-wrap!important;
  overflow-wrap:anywhere!important;
}

#chatPanel.chatOnlyLayout .chatComposerBottom::after{
  content:"Enter = odeslat • Ctrl+Enter = nový řádek";
  grid-column:1 / -1;
  color:var(--muted);
  font-size:11px;
  font-weight:900;
  padding-left:4px;
}

@media(max-width:720px){
  #chatPanel.chatOnlyLayout .chatComposerBottom::after{
    text-align:center;
    padding-left:0;
  }
}


/* --- Village tab stage fit fix: velká vesnice se musí vejít do svého okna --- */
/* Platí jen pro záložku Moje vesnice / velký náhled. Automatový kompaktní náhled nechávám být. */
#villagePanel #villageStageBig.villageStage.bigStage.deluxeVillage,
#villagePanel #villageStageBig.villageStage.bigStage{
  height:clamp(255px,34vh,330px)!important;
  min-height:255px!important;
  max-height:330px!important;
  overflow:hidden!important;
  margin:8px 0 12px!important;
  contain:layout paint!important;
}

#villagePanel #villageStageBig .vSkylineGlow{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  transform:none!important;
  border-radius:inherit!important;
  overflow:hidden!important;
}

#villagePanel #villageStageBig .villageDecorLayer{
  inset:0!important;
  width:100%!important;
  height:100%!important;
  overflow:hidden!important;
}

/* Budovy ve velkém náhledu byly moc vysoké pro okno vesnice. Zmenšeno jen tady. */
#villagePanel #villageStageBig.bigStage .vBuild{
  width:48px!important;
  bottom:48px!important;
  padding-bottom:7px!important;
  border-radius:13px 13px 5px 5px!important;
}

#villagePanel #villageStageBig.bigStage .vBuild.vSlot0{left:10%!important;height:78px!important}
#villagePanel #villageStageBig.bigStage .vBuild.vSlot1{left:27%!important;height:132px!important}
#villagePanel #villageStageBig.bigStage .vBuild.vSlot2{left:45%!important;height:104px!important}
#villagePanel #villageStageBig.bigStage .vBuild.vSlot3{right:26%!important;height:158px!important}
#villagePanel #villageStageBig.bigStage .vBuild.vSlot4{right:10%!important;height:122px!important}

#villagePanel #villageStageBig.bigStage .vBuild .vEmoji{
  font-size:30px!important;
  transform:translateY(-3px)!important;
}

#villagePanel #villageStageBig.bigStage .vBuild .vBadge{
  top:-23px!important;
  font-size:10px!important;
  padding:2px 7px!important;
  max-width:92px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

#villagePanel #villageStageBig.bigStage .vBuild .vName{
  bottom:-25px!important;
  min-width:82px!important;
  max-width:118px!important;
  font-size:9px!important;
  padding:3px 6px!important;
}

#villagePanel #villageStageBig.bigStage .vBuild:hover{
  transform:translateY(-4px) scale(1.02)!important;
}

#villagePanel #villageStageBig.bigStage .vRoad{
  left:24px!important;
  right:24px!important;
  bottom:24px!important;
  height:11px!important;
  opacity:.55!important;
}

/* Stat karty pod vesnicí se lehce zmenší, aby se celá sekce líp vešla bez pocitu přetečení. */
#villagePanel .villageStatsGrid{
  gap:8px!important;
}

#villagePanel .vStatCard{
  padding:10px 12px!important;
  min-height:72px!important;
}

#villagePanel .vStatCard b{
  font-size:15px!important;
  line-height:1.15!important;
}

#villagePanel .vStatCard span{
  font-size:11px!important;
  line-height:1.2!important;
}

/* Na menším okně ještě kompaktnější varianta. */
@media(max-width:1360px){
  #villagePanel #villageStageBig.villageStage.bigStage{
    height:clamp(230px,32vh,290px)!important;
    min-height:230px!important;
    max-height:290px!important;
  }

  #villagePanel #villageStageBig.bigStage .vBuild{
    width:44px!important;
    bottom:43px!important;
  }

  #villagePanel #villageStageBig.bigStage .vBuild.vSlot0{height:68px!important}
  #villagePanel #villageStageBig.bigStage .vBuild.vSlot1{height:112px!important}
  #villagePanel #villageStageBig.bigStage .vBuild.vSlot2{height:90px!important}
  #villagePanel #villageStageBig.bigStage .vBuild.vSlot3{height:136px!important}
  #villagePanel #villageStageBig.bigStage .vBuild.vSlot4{height:104px!important}

  #villagePanel #villageStageBig.bigStage .vBuild .vEmoji{
    font-size:27px!important;
  }
}

@media(max-width:860px){
  #villagePanel #villageStageBig.villageStage.bigStage{
    height:240px!important;
    min-height:240px!important;
    max-height:240px!important;
  }

  #villagePanel #villageStageBig.bigStage .vBuild .vName{
    max-width:96px!important;
  }
}


/* --- Village panel: remove top info stat cards under big city preview --- */
#villagePanel #villageStatsGrid,
#villagePanel .villageStatsGrid{
  display:none!important;
}

#villagePanel #citySkipBox{
  margin-bottom:12px!important;
}

#villagePanel #buildCard{
  margin-top:0!important;
}


/* --- Kolekce výkon: rychlé otevření a dávkové kreslení karet --- */
#cardsGrid.cardsRendering{
  min-height:220px;
  align-content:start;
}

.cardsLoadingBox{
  grid-column:1 / -1;
  min-height:190px;
  display:grid;
  place-items:center;
  border-radius:24px;
  border:1px solid rgba(34,247,255,.18);
  background:
    radial-gradient(circle at 50% 0%,rgba(34,247,255,.14),transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.065),rgba(255,255,255,.025));
  color:#dffcff;
  font-weight:1000;
  letter-spacing:.02em;
  box-shadow:inset 0 0 26px rgba(255,255,255,.025);
}

.cardsLoadingBox::after{
  content:"";
  width:42px;
  height:42px;
  border-radius:999px;
  border:3px solid rgba(255,255,255,.16);
  border-top-color:rgba(34,247,255,.9);
  animation:cardsSpinLoader .8s linear infinite;
  margin-top:54px;
  position:absolute;
}

@keyframes cardsSpinLoader{
  to{transform:rotate(360deg)}
}


/* --- Tournament rewards compact/no-cut fix --- */
#tourneyPanel .tourneyArena{
  min-height:0!important;
  overflow:visible!important;
}

#tourneyPanel .tourneyColumns{
  align-items:start!important;
  grid-template-columns:minmax(0,1fr) minmax(300px,.95fr)!important;
}

#tourneyPanel .tourneyRewardRows{
  display:grid!important;
  gap:8px!important;
  max-height:min(44vh,360px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-right:4px!important;
  padding-bottom:8px!important;
  scrollbar-gutter:stable!important;
}

#tourneyPanel .tourneyRewardItem{
  min-height:66px!important;
  grid-template-columns:86px minmax(0,1fr)!important;
  gap:10px!important;
  padding:9px 12px!important;
  border-radius:18px!important;
}

#tourneyPanel .tourneyRewardPlace{
  min-height:42px!important;
  display:grid!important;
  place-items:center!important;
  padding:7px 8px!important;
  border-radius:14px!important;
}

#tourneyPanel .tourneyRewardMain{
  min-width:0!important;
}

#tourneyPanel .tourneyRewardMain b{
  line-height:1.1!important;
  margin-bottom:3px!important;
}

#tourneyPanel .tourneyRewardMain small{
  display:block!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
  line-height:1.25!important;
  font-size:12px!important;
}

@media(max-width:980px){
  #tourneyPanel .tourneyColumns{
    grid-template-columns:1fr!important;
  }
  #tourneyPanel .tourneyRewardRows{
    max-height:none!important;
    overflow:visible!important;
    padding-right:0!important;
  }
}


/* --- Tournament rewards final compact fix: žádný useknutý poslední řádek --- */
#tourneyPanel .tourneyColumns{
  grid-template-columns:minmax(0,1fr) minmax(300px,.95fr)!important;
  align-items:start!important;
  min-height:0!important;
}

#tourneyPanel .tourneyColumn{
  min-height:0!important;
  overflow:visible!important;
}

#tourneyPanel .tourneyRewardRows{
  max-height:255px!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding:0 5px 14px 0!important;
  margin:0!important;
  gap:6px!important;
  scrollbar-gutter:stable!important;
}

#tourneyPanel .tourneyRewardItem{
  min-height:52px!important;
  height:auto!important;
  grid-template-columns:76px minmax(0,1fr)!important;
  gap:9px!important;
  padding:7px 10px!important;
  border-radius:16px!important;
  align-items:center!important;
}

#tourneyPanel .tourneyRewardPlace{
  min-height:36px!important;
  height:36px!important;
  padding:5px 7px!important;
  border-radius:13px!important;
  display:grid!important;
  place-items:center!important;
  font-size:13px!important;
  line-height:1!important;
}

#tourneyPanel .tourneyRewardMain{
  min-width:0!important;
  display:grid!important;
  gap:1px!important;
}

#tourneyPanel .tourneyRewardMain b{
  font-size:14px!important;
  line-height:1.05!important;
  margin:0!important;
}

#tourneyPanel .tourneyRewardMain small{
  font-size:11px!important;
  line-height:1.2!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}

#tourneyPanel .tourneyLastReward{
  margin-top:10px!important;
}

/* Když je menší výška okna, reward box bude mít vlastní scroll místo aby přetékal dolů. */
@media(max-height:820px){
  #tourneyPanel .tourneyRewardRows{
    max-height:220px!important;
  }
  #tourneyPanel .tourneyRewardItem{
    min-height:48px!important;
    padding:6px 9px!important;
  }
}

@media(max-width:980px){
  #tourneyPanel .tourneyRewardRows{
    max-height:none!important;
    overflow:visible!important;
    padding-right:0!important;
    padding-bottom:0!important;
  }
}


/* --- Shop scroll stability: nákup ani refresh nesmí posouvat obchod --- */
#shopPanel,
#shopRows,
#shopHero{
  overflow-anchor:none!important;
}

#shopRows{
  scroll-behavior:auto!important;
  contain:layout paint!important;
}

#shopRows .shopBuyBtn{
  min-width:86px;
}

#shopRows .shopBuyBtn:disabled{
  cursor:not-allowed;
}


/* ===== LOGIN MEGA REDESIGN ===== */
body:has(.loginShell){
  background:
    radial-gradient(circle at 8% 0%, rgba(255,53,186,.20), transparent 28%),
    radial-gradient(circle at 86% 4%, rgba(34,247,255,.18), transparent 26%),
    radial-gradient(circle at 50% 100%, rgba(113,76,255,.16), transparent 30%),
    linear-gradient(135deg,#15061d 0%, #070b1e 38%, #07182a 72%, #0b2330 100%)!important;
}

.loginShell{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

.loginShell::before,
.loginShell::after{
  content:"";
  position:fixed;
  inset:auto;
  pointer-events:none;
  z-index:0;
  filter:blur(8px);
  opacity:.75;
}
.loginShell::before{
  width:420px;height:420px;left:-90px;top:-80px;
  background:radial-gradient(circle, rgba(255,60,193,.28), transparent 62%);
}
.loginShell::after{
  width:460px;height:460px;right:-120px;top:40px;
  background:radial-gradient(circle, rgba(34,247,255,.20), transparent 62%);
}
.loginShell > *{position:relative; z-index:1;}

.loginBox.authPro{
  width:min(1280px, 96vw)!important;
  grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr)!important;
  gap:18px!important;
}

.loginSideStack{
  display:grid;
  gap:16px;
}

.loginHeroTop,
.authMega,
.onlineLoginCard{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(159,230,255,.13)!important;
  box-shadow:
    0 24px 60px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.04),
    0 0 0 1px rgba(255,255,255,.02)!important;
}

.loginHeroTop{
  min-height:630px;
  padding:28px 34px 30px!important;
  background:
    radial-gradient(circle at 8% 6%, rgba(255,66,198,.16), transparent 24%),
    radial-gradient(circle at 92% 10%, rgba(34,247,255,.12), transparent 26%),
    linear-gradient(135deg, rgba(255,255,255,.05), rgba(255,255,255,.018))!important;
}

.loginHeroTop::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(to right, rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size:42px 42px;
  opacity:.09;
  pointer-events:none;
}
.loginHeroTop::after{
  content:"";
  position:absolute;
  width:360px;height:360px;right:-110px;bottom:-120px;
  background:radial-gradient(circle, rgba(34,247,255,.13), transparent 66%);
  pointer-events:none;
}

.heroBrand{position:relative; z-index:2;}
.heroKickerRow{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:4px 0 18px;
}
.heroKickerPill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.09);
  color:#ecf7ff;
  font-size:12px;
  font-weight:900;
  letter-spacing:.02em;
  backdrop-filter:blur(10px);
}
.heroKickerPill.alt{
  background:linear-gradient(90deg, rgba(255,66,198,.12), rgba(34,247,255,.10));
}
.heroHeadlineMega{
  font-size:clamp(58px, 6.1vw, 86px)!important;
  line-height:.94!important;
  letter-spacing:-.06em!important;
  margin:8px 0 18px!important;
  max-width:10.2ch;
  text-wrap:balance;
}
.heroLead{
  max-width:800px;
  font-size:24px;
  line-height:1.6;
  color:#d8e5fb;
  margin:0 0 22px;
}
.heroValueStrip{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin:0 0 18px;
}
.heroValueCard{
  padding:15px 16px;
  border-radius:20px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 0 26px rgba(255,255,255,.02);
}
.heroValueCard b{
  display:block;
  font-size:16px;
  margin-bottom:6px;
  color:#fff;
}
.heroValueCard span{
  display:block;
  font-size:13px;
  line-height:1.42;
  color:#bfd0ea;
}
.loginFeatureGrid{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px!important;
  margin-top:18px!important;
}
.loginFeatureGrid .feature{
  min-height:74px;
  display:flex;
  align-items:center;
  padding:14px 16px!important;
  border-radius:18px!important;
  background:
    linear-gradient(180deg, rgba(5,12,30,.62), rgba(17,31,53,.40))!important;
  border:1px solid rgba(255,255,255,.08)!important;
  box-shadow:inset 0 0 20px rgba(255,255,255,.02);
  color:#eef8ff;
  font-size:15px;
  line-height:1.35;
}
.heroTrustBar{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:18px;
}
.heroTrustBar span{
  padding:8px 12px;
  border-radius:999px;
  background:rgba(8,18,36,.55);
  border:1px solid rgba(255,255,255,.07);
  color:#dcecff;
  font-size:12px;
  font-weight:900;
}
.loginDecorIcons{
  position:absolute;
  inset:0;
  pointer-events:none;
}
.decorChip{
  position:absolute;
  display:grid;
  place-items:center;
  width:54px;height:54px;
  border-radius:18px;
  background:linear-gradient(135deg, rgba(255,66,198,.18), rgba(34,247,255,.15));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 10px 24px rgba(0,0,0,.22), inset 0 0 18px rgba(255,255,255,.04);
  font-size:24px;
  backdrop-filter:blur(8px);
  animation:loginFloatChip 6s ease-in-out infinite;
}
.decorChip.d1{right:26px; top:34px; animation-delay:0s}
.decorChip.d2{right:72px; top:132px; animation-delay:1s}
.decorChip.d3{right:34px; top:230px; animation-delay:2s}
.decorChip.d4{right:124px; top:312px; animation-delay:3s}
.decorChip.d5{right:48px; bottom:126px; animation-delay:4s}
.decorChip.d6{right:152px; bottom:42px; animation-delay:5s}
@keyframes loginFloatChip{
  0%,100%{transform:translateY(0px)}
  50%{transform:translateY(-8px)}
}

.onlineLoginCard{
  padding:18px 18px 16px!important;
  background:
    radial-gradient(circle at 100% 0%, rgba(34,247,255,.09), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03))!important;
}
.onlineLoginCard .sectionTitle{
  margin-bottom:14px;
}
.onlineLoginRows{
  display:grid;
  gap:10px;
}
.onlineLoginRow{
  min-height:58px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(8,14,34,.45);
}

.authMega{
  padding:24px!important;
  background:
    radial-gradient(circle at 0% 0%, rgba(255,66,198,.10), transparent 24%),
    radial-gradient(circle at 100% 0%, rgba(34,247,255,.11), transparent 26%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025))!important;
}
.authMega::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 50% -10%, rgba(255,255,255,.08), transparent 34%);
  pointer-events:none;
}
.authIntro{
  display:flex;
  gap:16px;
  align-items:flex-start;
  justify-content:space-between;
  margin-bottom:16px;
}
.authKicker{
  color:#a9c8ef;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:11px;
  font-weight:1000;
  margin-bottom:8px;
}
.authTitle{
  margin:0 0 8px;
  font-size:28px;
  line-height:1.05;
  color:#fff;
}
.authLead{
  margin:0;
  font-size:14px;
  line-height:1.55;
  color:#cfe0f8;
  max-width:520px;
}
.authIntroBadge{
  max-width:220px;
  padding:10px 12px;
  border-radius:16px;
  background:linear-gradient(135deg, rgba(255,66,198,.12), rgba(34,247,255,.10));
  border:1px solid rgba(255,255,255,.08);
  color:#ebf8ff;
  font-size:12px;
  font-weight:900;
  line-height:1.4;
}
.authMega .tabs{
  margin-bottom:14px!important;
}
.authMega .tab{
  min-height:54px;
  font-size:14px;
  font-weight:1000;
}
.authQuickPoints{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-bottom:14px;
}
.authQuickPoints span{
  padding:8px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  font-size:12px;
  font-weight:900;
  color:#dcecff;
}
.authFormMega{
  gap:12px!important;
}
.authFormMega .input{
  height:56px!important;
  font-size:17px!important;
  border-radius:18px!important;
  background:rgba(239,244,252,.92)!important;
}
#registerForm.authFormMega .input,
.authFormMega#registerForm .input{
  height:54px!important;
}
.authSubmitMega{
  min-height:56px!important;
  font-size:15px!important;
  font-weight:1000!important;
  border-radius:18px!important;
}
.authHintMega{
  font-size:13px!important;
  line-height:1.6!important;
  color:#b9cbe7!important;
}
.registerMiniPoints{
  margin:4px 0 2px!important;
}
.checkRow{
  padding:10px 12px;
  border-radius:16px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.06);
}

@media (max-width: 1140px){
  .loginBox.authPro{
    grid-template-columns:1fr!important;
  }
  .loginHeroTop{
    min-height:auto;
  }
  .heroHeadlineMega{
    max-width:none;
  }
  .decorChip{
    opacity:.65;
  }
}
@media (max-width: 760px){
  .heroValueStrip,
  .loginFeatureGrid{
    grid-template-columns:1fr!important;
  }
  .authIntro{
    flex-direction:column;
  }
  .authIntroBadge{
    max-width:none;
  }
  .heroLead{
    font-size:17px;
  }
  .heroHeadlineMega{
    font-size:clamp(38px, 13vw, 58px)!important;
  }
  .authQuickPoints{
    gap:6px;
  }
}


/* --- Login mega redesign fit fix: nic nesmí být useklé dole --- */
body:has(.loginShell){
  overflow-y:auto!important;
  overflow-x:hidden!important;
}

.loginShell{
  min-height:auto!important;
  display:block!important;
  padding:18px 14px 30px!important;
}

.loginBox.authPro{
  min-height:unset!important;
  align-items:start!important;
  margin:0 auto!important;
}

.loginSideStack{
  align-self:start!important;
}

.loginHeroTop{
  min-height:auto!important;
  padding:24px 28px 24px!important;
}

.heroHeadlineMega{
  font-size:clamp(50px,5.2vw,72px)!important;
  line-height:.95!important;
  max-width:11.2ch!important;
  margin:8px 0 14px!important;
}

.heroLead{
  font-size:20px!important;
  line-height:1.5!important;
  margin:0 0 16px!important;
}

.heroValueStrip{
  gap:10px!important;
  margin-bottom:14px!important;
}

.heroValueCard{
  padding:13px 14px!important;
}

.loginFeatureGrid{
  gap:10px!important;
  margin-top:14px!important;
}

.loginFeatureGrid .feature{
  min-height:64px!important;
  padding:12px 14px!important;
  font-size:14px!important;
}

.heroTrustBar{
  margin-top:14px!important;
}

.onlineLoginCard{
  padding:16px!important;
}

.authMega{
  padding:20px!important;
}

.authTitle{
  font-size:24px!important;
}

.authLead{
  font-size:13px!important;
  line-height:1.5!important;
}

.authMega .tab{
  min-height:50px!important;
}

.authFormMega .input{
  height:52px!important;
  font-size:16px!important;
}

.authSubmitMega{
  min-height:52px!important;
}

@media (max-width: 1140px){
  .loginShell{
    padding:14px 12px 26px!important;
  }
  .loginHeroTop{
    min-height:auto!important;
  }
}

@media (max-width: 760px){
  .heroHeadlineMega{
    max-width:none!important;
    font-size:clamp(38px,12vw,56px)!important;
  }
  .heroLead{
    font-size:16px!important;
  }
}


/* --- LOGIN FINAL: scroll only right side stack + richer background --- */
html, body{
  height:100%!important;
}

body:has(.loginShell){
  overflow:hidden!important;
  overflow-x:hidden!important;
  overflow-y:hidden!important;
  background:
    radial-gradient(circle at 8% 10%, rgba(255,56,190,.28), transparent 24%),
    radial-gradient(circle at 88% 8%, rgba(34,247,255,.22), transparent 24%),
    radial-gradient(circle at 18% 82%, rgba(145,74,255,.16), transparent 26%),
    linear-gradient(135deg,#14051c 0%, #060a18 34%, #071829 65%, #0d2a38 100%)!important;
}

body:has(.loginShell)::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(circle at 12% 18%, rgba(255,93,205,.14), transparent 16%),
    radial-gradient(circle at 82% 16%, rgba(67,243,255,.13), transparent 15%),
    radial-gradient(circle at 50% 100%, rgba(115,75,255,.10), transparent 22%),
    linear-gradient(to right, rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size:auto, auto, auto, 42px 42px, 42px 42px;
  opacity:.9;
}

body:has(.loginShell)::after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(280px 280px at 10% 18%, rgba(255,47,215,.18), transparent 70%),
    radial-gradient(260px 260px at 88% 16%, rgba(34,247,255,.16), transparent 72%),
    radial-gradient(220px 220px at 74% 72%, rgba(120,88,255,.14), transparent 74%);
  filter:blur(10px);
  opacity:.9;
}

.loginShell{
  height:100vh!important;
  min-height:100vh!important;
  display:grid!important;
  place-items:center!important;
  padding:16px 14px!important;
  overflow:hidden!important;
}

.loginBox.authPro{
  width:min(1280px, 96vw)!important;
  height:calc(100vh - 32px)!important;
  max-height:calc(100vh - 32px)!important;
  margin:0 auto!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr)!important;
  align-items:stretch!important;
  gap:18px!important;
  overflow:hidden!important;
}

.loginBox.authPro > .card,
.loginBox.authPro > .loginSideStack{
  min-height:0!important;
}

.loginHeroTop{
  height:100%!important;
  min-height:0!important;
  overflow:hidden!important;
  position:relative!important;
  background:
    radial-gradient(circle at 7% 7%, rgba(255,72,198,.17), transparent 24%),
    radial-gradient(circle at 92% 10%, rgba(34,247,255,.14), transparent 24%),
    linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.02))!important;
}

.loginHeroTop::before{
  opacity:.12!important;
}

.loginHeroTop::after{
  width:420px!important;
  height:420px!important;
  right:-120px!important;
  bottom:-130px!important;
}

.loginHeroTop .brand .logo{
  box-shadow:
    0 18px 36px rgba(0,0,0,.28),
    0 0 30px rgba(61,214,255,.18),
    inset 0 0 24px rgba(255,255,255,.08)!important;
}

.heroHeadlineMega{
  font-size:clamp(50px,5.4vw,74px)!important;
  line-height:.94!important;
  max-width:10.6ch!important;
  margin:10px 0 14px!important;
}

.heroLead{
  font-size:19px!important;
  line-height:1.5!important;
  margin:0 0 16px!important;
}

.heroValueStrip{
  gap:10px!important;
  margin-bottom:14px!important;
}

.heroValueCard{
  padding:13px 14px!important;
  border-radius:18px!important;
}

.heroValueCard b{
  font-size:15px!important;
}

.heroValueCard span{
  font-size:12px!important;
}

.loginFeatureGrid{
  gap:10px!important;
  margin-top:14px!important;
}

.loginFeatureGrid .feature{
  min-height:60px!important;
  padding:12px 14px!important;
  font-size:14px!important;
  line-height:1.3!important;
}

.heroTrustBar{
  gap:8px!important;
  margin-top:14px!important;
}

.heroTrustBar span{
  font-size:11px!important;
  padding:8px 11px!important;
}

.loginSideStack{
  height:100%!important;
  max-height:100%!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-right:6px!important;
  scrollbar-width:thin;
  scrollbar-color:rgba(34,247,255,.55) rgba(255,255,255,.06);
  overscroll-behavior:contain!important;
}

.loginSideStack::-webkit-scrollbar{
  width:10px;
}
.loginSideStack::-webkit-scrollbar-track{
  background:rgba(255,255,255,.04);
  border-radius:999px;
}
.loginSideStack::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, rgba(255,47,215,.88), rgba(34,247,255,.88));
  border-radius:999px;
  border:2px solid rgba(10,17,30,.3);
}

.authMega,
.onlineLoginCard{
  backdrop-filter:blur(10px);
}

.authMega{
  min-height:max-content!important;
  flex:0 0 auto!important;
}

.onlineLoginCard{
  flex:0 0 auto!important;
}

.authTitle{
  font-size:23px!important;
}

.authLead{
  font-size:13px!important;
  line-height:1.5!important;
}

.authMega .tabs{
  margin-bottom:12px!important;
}

.authMega .tab{
  min-height:50px!important;
}

.authQuickPoints{
  gap:8px!important;
  margin-bottom:12px!important;
}

.authQuickPoints span{
  font-size:11px!important;
  padding:8px 10px!important;
}

.authFormMega{
  gap:10px!important;
}

.authFormMega .input{
  height:50px!important;
  font-size:16px!important;
  border-radius:17px!important;
}

.authSubmitMega{
  min-height:50px!important;
  border-radius:17px!important;
}

.authHintMega{
  font-size:12px!important;
}

.checkRow{
  padding:9px 11px!important;
  font-size:12px!important;
}

.loginDecorIcons .decorChip{
  background:
    linear-gradient(135deg, rgba(255,66,198,.18), rgba(34,247,255,.18)),
    rgba(10,16,30,.35)!important;
  box-shadow:
    0 14px 30px rgba(0,0,0,.28),
    0 0 20px rgba(34,247,255,.08),
    inset 0 0 18px rgba(255,255,255,.05)!important;
}

.loginDecorIcons .d1{top:28px!important; right:20px!important;}
.loginDecorIcons .d2{top:114px!important; right:72px!important;}
.loginDecorIcons .d3{top:214px!important; right:26px!important;}
.loginDecorIcons .d4{top:302px!important; right:116px!important;}
.loginDecorIcons .d5{bottom:118px!important; right:36px!important;}
.loginDecorIcons .d6{bottom:34px!important; right:148px!important;}

/* extra neon floating particles/icons just for the login wow effect */
.loginShell .loginBgFX,
.loginShell .loginBgFXRight{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:0;
}

@media (max-width: 1140px){
  body:has(.loginShell){
    overflow-y:auto!important;
  }
  .loginShell{
    height:auto!important;
    min-height:100vh!important;
    overflow:visible!important;
    padding:14px 12px 22px!important;
  }
  .loginBox.authPro{
    height:auto!important;
    max-height:none!important;
    grid-template-columns:1fr!important;
    overflow:visible!important;
  }
  .loginSideStack{
    max-height:none!important;
    height:auto!important;
    overflow:visible!important;
    padding-right:0!important;
  }
  .loginHeroTop{
    height:auto!important;
  }
}

@media (max-height: 920px){
  .heroHeadlineMega{
    font-size:clamp(44px,4.9vw,66px)!important;
  }
  .heroLead{
    font-size:17px!important;
  }
  .loginFeatureGrid .feature{
    min-height:56px!important;
    font-size:13px!important;
  }
  .heroValueCard{
    padding:12px 13px!important;
  }
}


/* --- Login hero scroll + floating game icons background --- */
body:has(.loginShell){
  overflow:hidden!important;
}

.loginShell{
  position:relative;
  isolation:isolate;
}

.loginSceneFX{
  position:fixed;
  inset:0;
  pointer-events:none;
  overflow:hidden;
  z-index:0;
}

.loginSceneFX .fxIcon{
  position:absolute;
  display:grid;
  place-items:center;
  width:56px;
  height:56px;
  border-radius:18px;
  font-size:26px;
  color:#fff;
  background:
    linear-gradient(135deg, rgba(255,66,198,.13), rgba(34,247,255,.12)),
    rgba(10,16,28,.14);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:
    0 14px 30px rgba(0,0,0,.22),
    0 0 18px rgba(34,247,255,.08),
    inset 0 0 18px rgba(255,255,255,.04);
  opacity:.42;
  filter:blur(.0px);
  animation:loginBgFloat 11s ease-in-out infinite;
  backdrop-filter:blur(8px);
}

.loginSceneFX .i1{left:3%; top:16%; animation-duration:12s;}
.loginSceneFX .i2{left:9%; top:70%; animation-duration:14s; animation-delay:1s;}
.loginSceneFX .i3{left:28%; top:82%; animation-duration:13s; animation-delay:2s;}
.loginSceneFX .i4{left:46%; top:12%; animation-duration:15s; animation-delay:3s;}
.loginSceneFX .i5{left:58%; top:78%; animation-duration:12s; animation-delay:1.5s;}
.loginSceneFX .i6{left:72%; top:14%; animation-duration:14s; animation-delay:2.5s;}
.loginSceneFX .i7{left:81%; top:32%; animation-duration:16s; animation-delay:1s;}
.loginSceneFX .i8{left:88%; top:70%; animation-duration:13s; animation-delay:4s;}
.loginSceneFX .i9{left:38%; top:58%; animation-duration:15s; animation-delay:1.2s;}
.loginSceneFX .i10{left:21%; top:34%; animation-duration:13s; animation-delay:3.2s;}
.loginSceneFX .i11{left:63%; top:42%; animation-duration:16s; animation-delay:2.2s;}
.loginSceneFX .i12{left:93%; top:20%; animation-duration:14s; animation-delay:3.5s;}

@keyframes loginBgFloat{
  0%,100%{transform:translate3d(0,0,0) scale(1) rotate(0deg); opacity:.28;}
  25%{transform:translate3d(10px,-18px,0) scale(1.05) rotate(5deg); opacity:.45;}
  50%{transform:translate3d(-8px,-30px,0) scale(1.08) rotate(-4deg); opacity:.55;}
  75%{transform:translate3d(12px,-12px,0) scale(1.03) rotate(3deg); opacity:.4;}
}

.loginBox.authPro{
  position:relative;
  z-index:1;
}

.loginHeroTop{
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-gutter:stable!important;
  padding-right:18px!important;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,47,215,.75) rgba(255,255,255,.05);
}

.loginHeroTop::-webkit-scrollbar{
  width:10px;
}
.loginHeroTop::-webkit-scrollbar-track{
  background:rgba(255,255,255,.04);
  border-radius:999px;
}
.loginHeroTop::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, rgba(255,47,215,.9), rgba(34,247,255,.9));
  border-radius:999px;
  border:2px solid rgba(10,17,30,.3);
}

.loginHeroTop::before{
  opacity:.11!important;
}

.heroFloatIcons{
  position:absolute;
  inset:0;
  pointer-events:none;
}

.heroFloat{
  position:absolute;
  display:grid;
  place-items:center;
  width:44px;
  height:44px;
  border-radius:14px;
  font-size:20px;
  background:linear-gradient(135deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 10px 24px rgba(0,0,0,.18), inset 0 0 14px rgba(255,255,255,.04);
  opacity:.5;
  animation:heroOrbFloat 8s ease-in-out infinite;
}
.heroFloat.f1{left:54%; top:22%; animation-delay:0s;}
.heroFloat.f2{left:70%; top:46%; animation-delay:1s;}
.heroFloat.f3{left:60%; top:65%; animation-delay:2s;}
.heroFloat.f4{left:76%; top:78%; animation-delay:3s;}
.heroFloat.f5{left:84%; top:58%; animation-delay:4s;}
.heroFloat.f6{left:88%; top:88%; animation-delay:5s;}

@keyframes heroOrbFloat{
  0%,100%{transform:translateY(0px) rotate(0deg)}
  50%{transform:translateY(-10px) rotate(4deg)}
}

@media (max-width: 1140px){
  body:has(.loginShell){
    overflow-y:auto!important;
  }
  .loginSceneFX{
    display:none;
  }
  .loginHeroTop{
    overflow:visible!important;
    padding-right:24px!important;
  }
}


/* --- Login hero polish: icons nesmí lézt do textu + lepší styl textu --- */
.loginHeroTop{
  position:relative!important;
}

.loginHeroTop > *:not(.loginDecorIcons):not(.heroFloatIcons){
  position:relative;
  z-index:2;
}

.heroBrand,
.heroKickerRow,
.heroHeadlineMega,
.heroLead,
.heroValueStrip,
.loginFeatureGrid,
.heroTrustBar{
  max-width:calc(100% - 170px)!important;
}

.heroHeadlineMega{
  margin:8px 0 16px!important;
  line-height:.90!important;
  letter-spacing:-.075em!important;
  text-wrap:balance;
  text-shadow:0 10px 30px rgba(0,0,0,.22);
  font-family:Inter, "Segoe UI", Arial, sans-serif!important;
}

.heroHeadlineMega .line{
  display:block;
}

.heroHeadlineMega .lineMain{
  color:#f8fbff;
}

.heroHeadlineMega .lineAccent{
  background:linear-gradient(90deg,#ffffff 0%, #baf4ff 48%, #ff9be0 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  filter:drop-shadow(0 0 18px rgba(100,221,255,.10));
}

.heroHeadlineMega .lineGlow{
  background:linear-gradient(90deg,#ffffff 0%, #dff6ff 60%, #ffffff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.heroLead{
  font-size:20px!important;
  line-height:1.65!important;
  color:#d9e8ff!important;
  text-shadow:0 4px 16px rgba(0,0,0,.20);
}

.heroFloatIcons{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
}

.heroFloat{
  width:40px!important;
  height:40px!important;
  font-size:18px!important;
  opacity:.34!important;
  filter:saturate(.95);
}

.heroFloat.f1{left:auto!important; right:122px!important; top:22%!important;}
.heroFloat.f2{left:auto!important; right:34px!important; top:38%!important;}
.heroFloat.f3{left:auto!important; right:102px!important; top:56%!important;}
.heroFloat.f4{left:auto!important; right:26px!important; top:71%!important;}
.heroFloat.f5{left:auto!important; right:118px!important; top:84%!important;}
.heroFloat.f6{left:auto!important; right:40px!important; top:91%!important;}

.loginDecorIcons .decorChip{
  z-index:1;
  opacity:.92;
}
.loginDecorIcons .d1{right:24px!important; top:22px!important;}
.loginDecorIcons .d2{right:82px!important; top:114px!important;}
.loginDecorIcons .d3{right:30px!important; top:232px!important;}
.loginDecorIcons .d4{right:112px!important; top:338px!important;}
.loginDecorIcons .d5{right:34px!important; bottom:118px!important;}
.loginDecorIcons .d6{right:134px!important; bottom:28px!important;}

.loginHeroTop::after{
  background:
    radial-gradient(circle, rgba(34,247,255,.16), transparent 64%)!important;
}

@media (max-width: 1140px){
  .heroBrand,
  .heroKickerRow,
  .heroHeadlineMega,
  .heroLead,
  .heroValueStrip,
  .loginFeatureGrid,
  .heroTrustBar{
    max-width:none!important;
  }

  .heroFloatIcons{
    display:none!important;
  }
}

@media (max-height: 920px){
  .heroLead{
    font-size:18px!important;
    line-height:1.55!important;
  }
}


/* --- Album rarity tabs: méně renderování, rychlejší Kolekce --- */
.cardRarityTabs{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:10px 0 12px;
  padding:8px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.09);
  background:
    radial-gradient(circle at 0% 0%,rgba(255,47,215,.12),transparent 32%),
    radial-gradient(circle at 100% 0%,rgba(34,247,255,.10),transparent 32%),
    rgba(0,0,0,.16);
  box-shadow:inset 0 0 24px rgba(255,255,255,.025);
}

.cardRarityTab{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:40px;
  padding:8px 11px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.055);
  color:#dcecff;
  font-weight:1000;
  cursor:pointer;
  transition:.16s ease;
}

.cardRarityTab:hover{
  transform:translateY(-1px);
  background:rgba(255,255,255,.09);
}

.cardRarityTab.active{
  color:#06111e;
  border-color:rgba(34,247,255,.45);
  background:linear-gradient(135deg,#ff4ed8,#22f7ff);
  box-shadow:0 0 24px rgba(34,247,255,.18),0 0 18px rgba(255,47,215,.16);
}

.cardRarityTab.is-empty{
  opacity:.52;
}

.cardRarityTab b{
  display:inline-grid;
  place-items:center;
  min-width:28px;
  padding:3px 7px;
  border-radius:999px;
  background:rgba(0,0,0,.20);
  color:inherit;
  font-size:11px;
}

.cardRarityTab.active b{
  background:rgba(255,255,255,.34);
}

.rarityTabIcon{
  font-size:15px;
}

.rarityTabText{
  font-size:12px;
  letter-spacing:.01em;
}

.cardsEmptyRarity{
  grid-column:1 / -1;
  min-height:240px;
  display:grid;
  place-items:center;
  text-align:center;
  gap:8px;
  padding:24px;
  border-radius:24px;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(circle at 50% 0%,rgba(34,247,255,.12),transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  color:#eaf7ff;
}

.cardsEmptyRarity .emptyRarityIcon{
  width:66px;
  height:66px;
  display:grid;
  place-items:center;
  border-radius:22px;
  background:linear-gradient(135deg,rgba(255,47,215,.18),rgba(34,247,255,.16));
  border:1px solid rgba(255,255,255,.10);
  font-size:30px;
  box-shadow:inset 0 0 20px rgba(255,255,255,.04);
}

.cardsEmptyRarity b{
  font-size:18px;
}

.cardsEmptyRarity small{
  max-width:520px;
  color:#aebbd5;
  line-height:1.55;
  font-weight:800;
}

@media(max-width:760px){
  .cardRarityTabs{
    gap:6px;
  }
  .cardRarityTab{
    flex:1 1 calc(50% - 6px);
    justify-content:center;
  }
}


/* --- Neon Road / Event Map --- */
.eventMapLayout{
  grid-template-columns:1fr!important;
}

.eventMapCard{
  min-height:calc(100vh - 135px);
  overflow:hidden;
  background:
    radial-gradient(circle at 12% 0%,rgba(255,47,215,.16),transparent 34%),
    radial-gradient(circle at 88% 0%,rgba(34,247,255,.15),transparent 34%),
    linear-gradient(180deg,rgba(17,23,52,.92),rgba(6,11,28,.96))!important;
}

.eventMapHero{
  display:grid;
  grid-template-columns:minmax(0,1fr) 380px;
  gap:16px;
  align-items:stretch;
  margin-bottom:14px;
  position:relative;
  z-index:2;
}

.eventMapTitleBlock,
.eventMapGrand{
  border:1px solid rgba(255,255,255,.10);
  border-radius:28px;
  background:linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
  box-shadow:inset 0 0 26px rgba(255,255,255,.025);
}

.eventMapTitleBlock{
  padding:22px;
}

.eventMapTitleBlock small{
  display:block;
  color:#9eefff;
  font-weight:1000;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:7px;
}

.eventMapTitleBlock h2{
  margin:0;
  font-size:clamp(38px,4vw,64px);
  line-height:.92;
  letter-spacing:-.06em;
  background:linear-gradient(90deg,#fff,#8ff6ff,#ff80dc);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  text-shadow:0 0 24px rgba(34,247,255,.08);
}

.eventMapTitleBlock p{
  max-width:780px;
  color:#cad8f3;
  line-height:1.55;
  margin:12px 0 16px;
}

.eventMapMeta{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
}

.eventMapMeta span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(0,0,0,.18);
  border:1px solid rgba(255,255,255,.08);
  font-size:12px;
  font-weight:1000;
  color:#dffaff;
}

.eventMapGrand{
  display:grid;
  gap:8px;
  padding:18px;
  align-content:center;
  text-align:center;
  position:relative;
  overflow:hidden;
}

.eventMapGrand:before{
  content:"";
  position:absolute;
  inset:-50%;
  background:conic-gradient(from 0deg,transparent,rgba(255,209,102,.18),transparent,rgba(34,247,255,.16),transparent);
  animation:eventMapSpin 8s linear infinite;
  opacity:.7;
}

.eventMapGrand>*{
  position:relative;
  z-index:1;
}

.eventGrandIcon{
  width:76px;
  height:76px;
  margin:0 auto 4px;
  display:grid;
  place-items:center;
  border-radius:26px;
  background:linear-gradient(135deg,#ff4ed8,#22f7ff);
  color:#05101d;
  font-size:38px;
  box-shadow:0 0 36px rgba(34,247,255,.24),0 0 28px rgba(255,47,215,.18);
}

.eventMapGrand small{
  color:#ffe6a8;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:1000;
}

.eventMapGrand b{
  color:#fff;
  font-size:25px;
  line-height:1.12;
}

.eventMapProgress{
  margin-top:6px;
}

.eventMapStage{
  position:relative;
  min-height:610px;
  border-radius:32px;
  border:1px solid rgba(34,247,255,.18);
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 0%,rgba(34,247,255,.18),transparent 22%),
    radial-gradient(circle at 20% 70%,rgba(255,47,215,.14),transparent 24%),
    linear-gradient(180deg,rgba(8,18,46,.88),rgba(3,8,22,.96));
  box-shadow:inset 0 0 55px rgba(34,247,255,.055);
}

.eventMapStage:before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(to right,rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(to bottom,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:42px 42px;
  opacity:.20;
}

.eventMapStage:after{
  content:"";
  position:absolute;
  left:50%;
  top:7%;
  width:62%;
  height:86%;
  transform:translateX(-50%);
  border-radius:50%;
  border:7px solid rgba(255,209,102,.14);
  box-shadow:0 0 38px rgba(255,209,102,.14), inset 0 0 30px rgba(34,247,255,.08);
  clip-path:polygon(0 0,100% 0,100% 100%,0 100%);
  opacity:.85;
}

.eventMapSkyline{
  position:absolute;
  inset:0;
  pointer-events:none;
}

.eventMapSkyline span{
  position:absolute;
  display:grid;
  place-items:center;
  width:46px;
  height:46px;
  border-radius:17px;
  background:linear-gradient(135deg,rgba(255,47,215,.16),rgba(34,247,255,.14));
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 12px 30px rgba(0,0,0,.24),inset 0 0 18px rgba(255,255,255,.04);
  opacity:.45;
  animation:eventFloat 6s ease-in-out infinite;
}

.eventMapSkyline span:nth-child(1){left:7%;top:12%}
.eventMapSkyline span:nth-child(2){right:9%;top:13%;animation-delay:1s}
.eventMapSkyline span:nth-child(3){left:14%;bottom:18%;animation-delay:2s}
.eventMapSkyline span:nth-child(4){right:16%;bottom:16%;animation-delay:3s}
.eventMapSkyline span:nth-child(5){left:44%;top:8%;animation-delay:4s}
.eventMapSkyline span:nth-child(6){right:40%;bottom:8%;animation-delay:5s}

.eventMapRoad{
  position:relative;
  z-index:2;
  min-height:610px;
}

.eventMapNode{
  --x:50%;
  position:absolute;
  left:var(--x);
  top:calc(88% - (var(--node-index) * 5.65%));
  transform:translate(-50%,-50%);
  width:152px;
  min-height:104px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.045));
  color:#fff;
  display:grid;
  gap:4px;
  place-items:center;
  padding:10px;
  cursor:pointer;
  box-shadow:0 16px 34px rgba(0,0,0,.32),inset 0 0 26px rgba(255,255,255,.025);
  transition:.16s ease;
}

.eventMapNode:nth-child(4n+1){--x:28%}
.eventMapNode:nth-child(4n+2){--x:62%}
.eventMapNode:nth-child(4n+3){--x:43%}
.eventMapNode:nth-child(4n+4){--x:74%}

.eventMapNode:hover{
  transform:translate(-50%,-54%) scale(1.03);
}

.eventMapNode .eventNodeIcon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:16px;
  background:rgba(255,255,255,.08);
  font-size:23px;
}

.eventMapNode b{
  font-size:13px;
  line-height:1.1;
  text-align:center;
}

.eventMapNode small{
  color:#bfd0ea;
  font-size:10px;
  line-height:1.15;
  text-align:center;
  max-width:128px;
}

.eventMapNode em{
  font-style:normal;
  padding:4px 8px;
  border-radius:999px;
  background:rgba(0,0,0,.20);
  color:#dffaff;
  font-size:10px;
  font-weight:1000;
}

.eventMapNode.locked{
  opacity:.55;
  filter:grayscale(.28);
}

.eventMapNode.claimed{
  border-color:rgba(72,255,176,.38);
  background:linear-gradient(180deg,rgba(72,255,176,.13),rgba(255,255,255,.035));
}

.eventMapNode.claimable{
  border-color:rgba(255,209,102,.62);
  box-shadow:0 0 36px rgba(255,209,102,.18),0 16px 34px rgba(0,0,0,.32);
  animation:eventPulse 1.35s ease-in-out infinite;
}

.eventMapNode.active{
  border-color:rgba(34,247,255,.48);
}

.eventMapFooter{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-top:14px;
}

.eventMapGuide{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  padding:12px 14px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.18);
}

.eventBot{
  width:50px;
  height:50px;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:linear-gradient(135deg,rgba(255,47,215,.18),rgba(34,247,255,.16));
  font-size:26px;
}

.eventMapGuide b,
.eventMapGuide span{
  display:block;
}

.eventMapGuide span{
  color:#b9c8e4;
  font-size:12px;
  line-height:1.45;
}

@keyframes eventPulse{
  0%,100%{transform:translate(-50%,-50%) scale(1)}
  50%{transform:translate(-50%,-54%) scale(1.04)}
}
@keyframes eventFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-10px)}
}
@keyframes eventMapSpin{
  to{transform:rotate(360deg)}
}

@media(max-width:1050px){
  .eventMapHero{grid-template-columns:1fr}
  .eventMapStage{min-height:760px}
  .eventMapRoad{min-height:760px}
  .eventMapNode{width:136px}
}

@media(max-width:680px){
  .eventMapNode:nth-child(n){--x:50%}
  .eventMapFooter{align-items:stretch;flex-direction:column}
}


/* --- Neon Road nocut fix: panel se musí scrollovat uvnitř, ne ořezávat mapu --- */
.eventMapLayout{
  min-height:0!important;
}

.eventMapCard{
  min-height:auto!important;
  height:calc(100vh - 135px)!important;
  max-height:calc(100vh - 135px)!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  padding-right:8px!important;
  scrollbar-width:thin;
  scrollbar-color:rgba(34,247,255,.75) rgba(255,255,255,.05);
}

.eventMapCard::-webkit-scrollbar{
  width:10px;
}
.eventMapCard::-webkit-scrollbar-track{
  background:rgba(255,255,255,.04);
  border-radius:999px;
}
.eventMapCard::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, rgba(255,47,215,.88), rgba(34,247,255,.88));
  border-radius:999px;
  border:2px solid rgba(10,17,30,.25);
}

.eventMapStage,
.eventMapRoad{
  min-height:980px!important;
}

.eventMapHero,
.eventMapFooter{
  position:sticky;
  z-index:4;
}

.eventMapHero{
  top:0;
  padding-top:2px;
  background:
    linear-gradient(180deg, rgba(6,11,28,.98) 0%, rgba(6,11,28,.95) 72%, rgba(6,11,28,0) 100%);
}

.eventMapFooter{
  bottom:0;
  padding-top:10px;
  padding-bottom:2px;
  background:
    linear-gradient(0deg, rgba(6,11,28,.98) 0%, rgba(6,11,28,.95) 68%, rgba(6,11,28,0) 100%);
}

.eventMapStage{
  margin-top:8px!important;
  margin-bottom:8px!important;
}

@media(max-height:760px){
  .eventMapCard{
    height:calc(100vh - 118px)!important;
    max-height:calc(100vh - 118px)!important;
  }
  .eventMapStage,
  .eventMapRoad{
    min-height:1080px!important;
  }
}

@media(max-width:1050px){
  .eventMapCard{
    height:auto!important;
    max-height:none!important;
  }
  .eventMapHero,
  .eventMapFooter{
    position:relative!important;
    top:auto!important;
    bottom:auto!important;
    background:none!important;
  }
}


/* --- Neon Road deluxe compact no-scroll redesign --- */
.eventMapCard{
  height:calc(100vh - 134px)!important;
  max-height:calc(100vh - 134px)!important;
  min-height:calc(100vh - 134px)!important;
  overflow:hidden!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto;
  gap:12px;
  padding-right:22px!important;
}

.eventMapHero,
.eventMapFooter{
  position:relative!important;
  top:auto!important;
  bottom:auto!important;
  background:none!important;
  margin:0!important;
}

.eventMapHero{
  grid-template-columns:minmax(0,1fr) 330px!important;
  gap:14px!important;
}

.eventMapTitleBlock{
  padding:18px 20px!important;
  border-radius:24px!important;
  background:
    radial-gradient(circle at 0% 0%, rgba(255,47,215,.14), transparent 28%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04))!important;
}
.eventMapTitleBlock h2{
  font-size:clamp(32px,3.2vw,52px)!important;
  margin-bottom:4px!important;
}
.eventMapTitleBlock p{
  margin:9px 0 12px!important;
  font-size:13px!important;
  line-height:1.45!important;
  max-width:none!important;
}
.eventMapMeta{
  gap:7px!important;
}
.eventMapMeta span{
  font-size:11px!important;
  padding:7px 10px!important;
}

.eventMapGrand{
  padding:16px 16px 14px!important;
  border-radius:26px!important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,209,102,.25), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.035))!important;
  box-shadow:
    inset 0 0 40px rgba(255,230,160,.06),
    0 0 30px rgba(255,209,102,.10)!important;
}
.eventMapGrand:before{
  inset:-35%!important;
  opacity:.95!important;
}
.eventGrandIcon{
  width:88px!important;
  height:88px!important;
  border-radius:28px!important;
  font-size:42px!important;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,.45), transparent 30%),
    linear-gradient(135deg,#ffe48a,#ff74d8 48%,#22f7ff)!important;
  box-shadow:
    0 0 42px rgba(255,209,102,.30),
    0 0 26px rgba(255,47,215,.18),
    inset 0 0 18px rgba(255,255,255,.20)!important;
}
.eventMapGrand small{
  font-size:11px!important;
}
.eventMapGrand b{
  font-size:22px!important;
}
.eventMapProgress{
  height:14px!important;
  border-radius:999px!important;
  overflow:hidden!important;
  background:rgba(0,0,0,.24)!important;
  border:1px solid rgba(255,255,255,.08)!important;
}
.eventMapProgress i{
  background:linear-gradient(90deg,#ffe48a 0%, #ff65da 48%, #22f7ff 100%)!important;
  box-shadow:0 0 22px rgba(34,247,255,.22)!important;
}

.eventMapStage{
  min-height:0!important;
  height:100%!important;
  margin:0!important;
  border-radius:28px!important;
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% 0%, rgba(34,247,255,.18), transparent 24%),
    radial-gradient(circle at 20% 85%, rgba(255,47,215,.13), transparent 25%),
    linear-gradient(180deg, rgba(9,19,48,.94), rgba(3,8,22,.98))!important;
}
.eventMapStage:after{
  display:none!important;
}
.eventMapSkyline span{
  opacity:.34!important;
  width:40px!important;
  height:40px!important;
  font-size:18px!important;
}

.eventMapRoad{
  min-height:0!important;
  height:100%!important;
  position:relative!important;
  overflow:hidden!important;
}

.eventMapPathSvg{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
}
.eventMapPathSvg .pathGlow{
  fill:none;
  stroke:rgba(255,224,130,.24);
  stroke-width:38;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:url(#eventMapGlow);
}
.eventMapPathSvg .pathCore{
  fill:none;
  stroke:url(#eventMapRouteGradient);
  stroke-width:18;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.eventMapPathSvg defs + .pathGlow{}
.eventMapPathSvg::before{content:"";}
.eventMapPathSvg defs{}
.eventMapRoad svg defs{
  pointer-events:none;
}
.eventMapRoad svg{
  --dummy:0;
}
.eventMapRoad svg defs:after{content:'';}
.eventMapRoad svg{
}
.eventMapRoad svg .pathCore{
  stroke:url(#routeGrad);
}
.eventMapRoad svg defs{
}
.eventMapRoad svg{
}
.eventMapRoad svg{
}
.eventMapRoad > svg .pathCore{
  stroke: #e2c16e;
  stroke: linear-gradient(90deg,#e7cb7d,#ff8ee5,#6afcff);
}
.eventMapRoad::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse at 10% 18%, rgba(34,247,255,.08), transparent 24%),
    radial-gradient(ellipse at 82% 74%, rgba(255,47,215,.08), transparent 24%);
  pointer-events:none;
}

.eventMapNode{
  position:absolute!important;
  transform:translate(-50%,-50%);
  width:132px!important;
  min-height:92px!important;
  padding:26px 10px 12px!important;
  border-radius:24px!important;
  border:1px solid rgba(255,255,255,.10)!important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.045))!important;
  box-shadow:
    0 14px 28px rgba(0,0,0,.28),
    inset 0 0 22px rgba(255,255,255,.025)!important;
  gap:2px!important;
  overflow:visible!important;
  backdrop-filter:blur(8px);
  z-index:3;
}
.eventMapNode:hover{
  transform:translate(-50%,-53%) scale(1.03)!important;
}
.eventMapNode .eventNodeHalo{
  position:absolute;
  left:50%;
  bottom:-18px;
  width:92px;
  height:24px;
  border-radius:50%;
  transform:translateX(-50%);
  background:radial-gradient(circle, rgba(34,247,255,.26), transparent 68%);
  pointer-events:none;
}
.eventMapNode .eventNodePedestal{
  position:absolute;
  left:50%;
  bottom:-8px;
  width:82px;
  height:18px;
  transform:translateX(-50%);
  border-radius:999px;
  background:linear-gradient(180deg,#ffd793,#c88b39);
  box-shadow:0 8px 18px rgba(0,0,0,.30), inset 0 2px 0 rgba(255,255,255,.30);
}
.eventMapNode .eventNodeRibbon{
  position:absolute;
  top:-11px;
  left:50%;
  transform:translateX(-50%);
  padding:4px 10px;
  border-radius:999px;
  background:linear-gradient(90deg,#ffb54f,#ff6ed9);
  color:#321100;
  border:1px solid rgba(255,255,255,.20);
  font-size:10px;
  font-weight:1000;
  letter-spacing:.03em;
  box-shadow:0 8px 18px rgba(0,0,0,.18);
  white-space:nowrap;
}
.eventMapNode .eventNodeIconWrap{
  width:50px;
  height:50px;
  display:grid;
  place-items:center;
  border-radius:18px;
  background:
    radial-gradient(circle at 30% 30%, rgba(255,255,255,.22), transparent 32%),
    linear-gradient(135deg, rgba(255,47,215,.16), rgba(34,247,255,.16))!important;
  border:1px solid rgba(255,255,255,.11);
  box-shadow:inset 0 0 18px rgba(255,255,255,.05),0 10px 22px rgba(0,0,0,.18);
}
.eventMapNode .eventNodeIcon{
  width:auto!important;
  height:auto!important;
  background:none!important;
  font-size:26px!important;
}
.eventMapNode b{
  font-size:13px!important;
  line-height:1.05!important;
  max-width:110px;
}
.eventMapNode small{
  font-size:9px!important;
  line-height:1.1!important;
  max-width:112px!important;
  min-height:20px;
}
.eventMapNode em{
  font-size:10px!important;
  padding:4px 8px!important;
  border-radius:999px!important;
  background:rgba(0,0,0,.22)!important;
}

.eventMapNode.claimable{
  border-color:rgba(255,209,102,.62)!important;
  box-shadow:
    0 0 26px rgba(255,209,102,.18),
    0 14px 28px rgba(0,0,0,.28),
    inset 0 0 22px rgba(255,255,255,.03)!important;
}
.eventMapNode.claimable .eventNodeHalo{
  background:radial-gradient(circle, rgba(255,209,102,.34), transparent 68%)!important;
}
.eventMapNode.claimed{
  border-color:rgba(74,255,174,.42)!important;
  background:linear-gradient(180deg, rgba(74,255,174,.14), rgba(255,255,255,.04))!important;
}
.eventMapNode.claimed .eventNodeRibbon{
  background:linear-gradient(90deg,#76ffae,#51e9ff)!important;
}
.eventMapNode.active{
  border-color:rgba(34,247,255,.48)!important;
}

.eventMapNode.is-big{
  width:152px!important;
  min-height:106px!important;
}
.eventMapNode.is-big .eventNodeIconWrap{
  width:56px;height:56px;
}
.eventMapNode.is-big b{
  font-size:14px!important;
}
.eventMapNode.is-gate{
  background:
    radial-gradient(circle at 50% 0%, rgba(255,132,69,.18), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.04))!important;
  border-color:rgba(255,148,89,.44)!important;
}
.eventMapNode.is-gate .eventNodeRibbon{
  background:linear-gradient(90deg,#ffcf5a,#ff7b43)!important;
}
.eventMapNode.is-gate .eventNodeHalo{
  background:radial-gradient(circle, rgba(255,111,71,.30), transparent 68%)!important;
}
.eventMapNode.is-grand{
  background:
    radial-gradient(circle at 50% 0%, rgba(255,226,136,.22), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.045))!important;
  border-color:rgba(255,228,138,.48)!important;
  box-shadow:
    0 0 36px rgba(255,226,136,.16),
    0 14px 28px rgba(0,0,0,.28),
    inset 0 0 22px rgba(255,255,255,.04)!important;
}
.eventMapNode.is-grand .eventNodeRibbon{
  background:linear-gradient(90deg,#ffe48a,#ff9c53,#ff6ed9)!important;
}
.eventMapNode.is-grand .eventNodePedestal{
  background:linear-gradient(180deg,#fff0b7,#efac42)!important;
}
.eventMapNode.is-mythic{
  border-color:rgba(198,123,255,.42)!important;
}
.eventMapNode.is-mythic .eventNodeRibbon{
  background:linear-gradient(90deg,#ba77ff,#ff80dc)!important;
}

.eventMapNode.claiming{
  animation:eventNodeClaim .55s ease both!important;
}
@keyframes eventNodeClaim{
  0%{transform:translate(-50%,-50%) scale(1); filter:brightness(1);}
  35%{transform:translate(-50%,-55%) scale(1.08); filter:brightness(1.15);}
  70%{transform:translate(-50%,-42%) scale(.92); filter:brightness(1.35);}
  100%{transform:translate(-50%,-50%) scale(1); filter:brightness(1);}
}

.eventMapFooter{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:12px!important;
}
.eventMapGuide{
  padding:10px 12px!important;
  border-radius:20px!important;
}
.eventMapGuide span{
  font-size:11px!important;
  line-height:1.35!important;
}
.eventBot{
  width:46px!important;
  height:46px!important;
  font-size:24px!important;
}

@media(max-width:1280px){
  .eventMapHero{
    grid-template-columns:minmax(0,1fr) 290px!important;
  }
  .eventMapNode{
    width:122px!important;
    min-height:88px!important;
    padding:24px 8px 11px!important;
  }
  .eventMapNode.is-big{
    width:142px!important;
  }
  .eventMapNode small{
    font-size:8px!important;
  }
}

@media(max-width:1050px){
  .eventMapCard{
    height:calc(100vh - 120px)!important;
    max-height:calc(100vh - 120px)!important;
  }
  .eventMapHero{
    grid-template-columns:1fr!important;
  }
}

@media(max-width:900px){
  .eventMapCard{
    overflow:auto!important;
    height:auto!important;
    max-height:none!important;
  }
  .eventMapStage{
    min-height:620px!important;
  }
}


/* --- Neon Road 500k + no-overlap layout fix --- */
.eventMapCard{
  overflow:hidden!important;
}

.eventMapStage,
.eventMapRoad{
  height:100%!important;
  min-height:0!important;
}

/* Mapu uděláme jako kompaktní 3-lane path bez překryvů. */
.eventMapPathSvg .pathGlow{
  stroke-width:30!important;
  opacity:.85!important;
}
.eventMapPathSvg .pathCore{
  stroke-width:13!important;
  opacity:.95!important;
}

/* Reward pedestaly: menší, čitelnější, bez vzájemného přelezu. */
.eventMapNode{
  width:112px!important;
  min-height:76px!important;
  max-height:86px!important;
  padding:21px 7px 9px!important;
  border-radius:19px!important;
  gap:1px!important;
}

.eventMapNode.is-big{
  width:126px!important;
  min-height:84px!important;
  max-height:94px!important;
}

.eventMapNode .eventNodeIconWrap{
  width:40px!important;
  height:40px!important;
  border-radius:14px!important;
}

.eventMapNode.is-big .eventNodeIconWrap{
  width:44px!important;
  height:44px!important;
}

.eventMapNode .eventNodeIcon{
  font-size:21px!important;
}

.eventMapNode.is-big .eventNodeIcon{
  font-size:24px!important;
}

.eventMapNode b{
  max-width:96px!important;
  font-size:11px!important;
  line-height:1.04!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

.eventMapNode.is-big b{
  max-width:108px!important;
  font-size:12px!important;
}

.eventMapNode small{
  max-width:96px!important;
  min-height:13px!important;
  max-height:13px!important;
  font-size:8px!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

.eventMapNode.is-big small{
  max-width:108px!important;
}

.eventMapNode em{
  font-size:9px!important;
  padding:3px 7px!important;
  line-height:1!important;
}

.eventMapNode .eventNodeRibbon{
  top:-9px!important;
  padding:3px 8px!important;
  font-size:9px!important;
  max-width:100px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

.eventMapNode.is-big .eventNodeRibbon{
  max-width:116px!important;
}

.eventMapNode .eventNodePedestal{
  width:68px!important;
  height:14px!important;
  bottom:-6px!important;
}

.eventMapNode.is-big .eventNodePedestal{
  width:78px!important;
}

.eventMapNode .eventNodeHalo{
  width:72px!important;
  height:18px!important;
  bottom:-13px!important;
}

/* Na nižších monitorech ještě o trochu zmenšit, pořád bez scrollu. */
@media(max-height:820px){
  .eventMapHero{
    grid-template-columns:minmax(0,1fr) 280px!important;
    gap:10px!important;
  }
  .eventMapTitleBlock{
    padding:14px 16px!important;
  }
  .eventMapTitleBlock h2{
    font-size:clamp(28px,2.8vw,44px)!important;
  }
  .eventMapTitleBlock p{
    display:none!important;
  }
  .eventMapGrand{
    padding:12px!important;
  }
  .eventGrandIcon{
    width:62px!important;
    height:62px!important;
    font-size:31px!important;
  }
  .eventMapGrand b{
    font-size:18px!important;
  }
  .eventMapFooter{
    margin-top:0!important;
  }
  .eventMapGuide{
    padding:8px 10px!important;
  }
  .eventBot{
    width:38px!important;
    height:38px!important;
    font-size:20px!important;
  }
  .eventMapNode{
    width:104px!important;
    min-height:70px!important;
    max-height:78px!important;
    padding-top:19px!important;
  }
  .eventMapNode.is-big{
    width:116px!important;
    min-height:78px!important;
    max-height:86px!important;
  }
}

/* Na šířkově menších oknech držet mezery a nezvětšovat karty. */
@media(max-width:1280px){
  .eventMapNode{
    width:104px!important;
  }
  .eventMapNode.is-big{
    width:116px!important;
  }
}


/* --- Neon Road text visibility fix: reward text musí být normálně vidět --- */
.eventMapNode{
  min-height:84px!important;
  max-height:96px!important;
  padding:21px 8px 10px!important;
}

.eventMapNode.is-big{
  min-height:92px!important;
  max-height:104px!important;
}

.eventMapNode b{
  max-width:98px!important;
  font-size:11px!important;
  line-height:1.06!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  color:#ffffff!important;
  text-shadow:0 2px 10px rgba(0,0,0,.35)!important;
}

.eventMapNode.is-big b{
  max-width:110px!important;
  font-size:12px!important;
}

.eventMapNode small{
  max-width:98px!important;
  min-height:20px!important;
  max-height:20px!important;
  font-size:8.5px!important;
  line-height:1.1!important;
  white-space:normal!important;
  overflow:hidden!important;
  text-overflow:clip!important;
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  color:#f0f6ff!important;
  opacity:1!important;
  text-shadow:0 2px 8px rgba(0,0,0,.35)!important;
}

.eventMapNode.is-big small{
  max-width:110px!important;
}

.eventMapNode em{
  margin-top:2px!important;
  font-size:9px!important;
  color:#06111e!important;
  background:linear-gradient(180deg,#ffd992,#d69a49)!important;
  box-shadow:0 4px 12px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.30)!important;
}

.eventMapNode .eventNodeRibbon{
  z-index:2!important;
}

@media(max-height:820px){
  .eventMapNode{
    min-height:80px!important;
    max-height:92px!important;
  }
  .eventMapNode.is-big{
    min-height:88px!important;
    max-height:100px!important;
  }
  .eventMapNode small{
    min-height:18px!important;
    max-height:18px!important;
    font-size:8px!important;
  }
}


/* --- Neon Road pedestal label fix: "Vybráno" bude přímo ve žluté bublině --- */
.eventMapNode .eventNodePedestal{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 12px!important;
  width:auto!important;
  min-width:68px!important;
  max-width:92px!important;
  height:20px!important;
  bottom:-8px!important;
  color:#06111e!important;
  font-size:10px!important;
  font-weight:1000!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:center!important;
  letter-spacing:.01em!important;
  z-index:3!important;
}

.eventMapNode.is-big .eventNodePedestal{
  min-width:78px!important;
  max-width:102px!important;
  height:21px!important;
}

.eventMapNode em{
  display:none!important;
}

/* jemné odlišení podle stavu */
.eventMapNode.claimed .eventNodePedestal{
  background:linear-gradient(180deg,#ffd992,#d69a49)!important;
  color:#06111e!important;
}

.eventMapNode.claimable .eventNodePedestal{
  background:linear-gradient(180deg,#ffe7a6,#f3b65a)!important;
  color:#06111e!important;
  box-shadow:0 6px 14px rgba(0,0,0,.22), 0 0 16px rgba(255,209,102,.16), inset 0 1px 0 rgba(255,255,255,.28)!important;
}

.eventMapNode.locked .eventNodePedestal{
  background:linear-gradient(180deg,#ffdb9c,#cd964f)!important;
  color:#1c1206!important;
}

@media(max-height:820px){
  .eventMapNode .eventNodePedestal{
    min-width:64px!important;
    max-width:88px!important;
    height:18px!important;
    font-size:9px!important;
  }
  .eventMapNode.is-big .eventNodePedestal{
    min-width:72px!important;
    max-width:96px!important;
    height:19px!important;
  }
}


/* --- Neon Road vertical map with internal scrollbar --- */
.eventMapCard{
  height:calc(100vh - 134px)!important;
  max-height:calc(100vh - 134px)!important;
  min-height:calc(100vh - 134px)!important;
  overflow:hidden!important;
  display:grid!important;
  grid-template-rows:auto minmax(0,1fr) auto!important;
  gap:12px!important;
}

.eventMapHero,
.eventMapFooter{
  position:relative!important;
  top:auto!important;
  bottom:auto!important;
  margin:0!important;
  background:none!important;
}

.eventMapHero{
  grid-template-columns:minmax(0,1fr) 320px!important;
  gap:12px!important;
}

.eventMapTitleBlock{
  padding:16px 18px!important;
}

.eventMapTitleBlock h2{
  font-size:clamp(30px,3vw,50px)!important;
}

.eventMapTitleBlock p{
  font-size:13px!important;
  line-height:1.45!important;
  margin:8px 0 10px!important;
}

.eventMapGrand{
  padding:14px!important;
}

.eventGrandIcon{
  width:72px!important;
  height:72px!important;
  font-size:36px!important;
}

.eventMapGrand b{
  font-size:20px!important;
}

.eventMapStage{
  height:100%!important;
  min-height:0!important;
  max-height:100%!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-width:thin!important;
  scrollbar-color:rgba(34,247,255,.78) rgba(255,255,255,.055)!important;
  scroll-behavior:auto!important;
  overscroll-behavior:contain!important;
  margin:0!important;
}

.eventMapStage::-webkit-scrollbar{
  width:11px;
}
.eventMapStage::-webkit-scrollbar-track{
  background:rgba(255,255,255,.045);
  border-radius:999px;
}
.eventMapStage::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, rgba(255,47,215,.92), rgba(34,247,255,.92));
  border-radius:999px;
  border:2px solid rgba(6,11,28,.45);
}

.eventMapRoad{
  position:relative!important;
  min-height:1600px!important;
  overflow:visible!important;
}

.eventMapPathSvg{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  pointer-events:none!important;
}

.eventMapPathSvg.verticalPath .pathGlow{
  fill:none!important;
  stroke:rgba(255,224,130,.24)!important;
  stroke-width:34!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}

.eventMapPathSvg.verticalPath .pathCore{
  fill:none!important;
  stroke:url(#eventMapVerticalGold)!important;
  stroke-width:14!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  opacity:.98!important;
}

.eventMapNode{
  width:126px!important;
  min-height:86px!important;
  max-height:98px!important;
  padding:22px 8px 11px!important;
  z-index:4!important;
}

.eventMapNode.is-big{
  width:142px!important;
  min-height:96px!important;
  max-height:108px!important;
}

.eventMapNode b{
  max-width:108px!important;
  font-size:12px!important;
}

.eventMapNode.is-big b{
  max-width:122px!important;
  font-size:13px!important;
}

.eventMapNode small{
  max-width:108px!important;
  min-height:20px!important;
  max-height:22px!important;
  font-size:8.5px!important;
  line-height:1.12!important;
}

.eventMapNode.is-big small{
  max-width:122px!important;
}

.eventMapNode .eventNodePedestal{
  min-width:72px!important;
  max-width:100px!important;
}

.eventMapNode.is-big .eventNodePedestal{
  min-width:84px!important;
  max-width:114px!important;
}

.eventMapFooter{
  padding-top:0!important;
}

.eventMapGuide{
  padding:9px 11px!important;
}

.eventMapGuide span{
  font-size:11px!important;
}

@media(max-height:820px){
  .eventMapTitleBlock p{
    display:none!important;
  }
  .eventMapHero{
    grid-template-columns:minmax(0,1fr) 280px!important;
  }
  .eventGrandIcon{
    width:58px!important;
    height:58px!important;
    font-size:30px!important;
  }
  .eventMapGrand b{
    font-size:17px!important;
  }
}

@media(max-width:980px){
  .eventMapCard{
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }
  .eventMapStage{
    height:680px!important;
  }
}


/* --- Neon Road connected path fix --- */
.eventMapRoad{
  position:relative!important;
}

.eventMapConnectors{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
}

.eventMapConnector{
  position:absolute;
  height:18px;
  transform-origin:left center;
  border-radius:999px;
  background:
    linear-gradient(90deg, rgba(255,229,148,.92) 0%, rgba(255,191,91,.98) 38%, rgba(255,232,174,.94) 100%);
  box-shadow:
    0 0 10px rgba(255,214,112,.20),
    0 0 22px rgba(255,214,112,.14);
  opacity:.72;
}

.eventMapConnector:before{
  content:'';
  position:absolute;
  inset:4px 10px;
  border-radius:999px;
  background:rgba(255,245,210,.80);
  opacity:.58;
}

.eventMapConnector.is-active{
  opacity:.96;
  box-shadow:
    0 0 12px rgba(255,214,112,.28),
    0 0 26px rgba(255,120,210,.14),
    0 0 20px rgba(34,247,255,.12);
}

.eventMapNode{
  z-index:3!important;
}


/* --- Neon Road status under reward text --- */
.eventMapNode .eventNodePedestal{
  width:74px!important;
  height:12px!important;
  min-width:74px!important;
  max-width:74px!important;
  bottom:-5px!important;
  padding:0!important;
  font-size:0!important;
  color:transparent!important;
  overflow:hidden!important;
}

.eventMapNode.is-big .eventNodePedestal{
  width:82px!important;
  min-width:82px!important;
  max-width:82px!important;
  height:13px!important;
}

.eventMapNode em{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  align-self:center!important;
  margin-top:3px!important;
  padding:3px 8px!important;
  min-height:18px!important;
  max-width:100px!important;
  border-radius:999px!important;
  font-size:9px!important;
  font-weight:1000!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  color:#06111e!important;
  background:linear-gradient(180deg,#ffd992,#d69a49)!important;
  box-shadow:0 4px 12px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.30)!important;
  z-index:2!important;
}

.eventMapNode.is-big em{
  max-width:112px!important;
}

.eventMapNode.claimable em{
  background:linear-gradient(180deg,#ffe7a6,#f3b65a)!important;
  box-shadow:0 6px 14px rgba(0,0,0,.22), 0 0 16px rgba(255,209,102,.16), inset 0 1px 0 rgba(255,255,255,.28)!important;
}

.eventMapNode.locked em{
  background:linear-gradient(180deg,#ffdb9c,#cd964f)!important;
  color:#1c1206!important;
}

.eventMapNode small{
  min-height:18px!important;
  max-height:18px!important;
}

@media(max-height:820px){
  .eventMapNode em{
    min-height:16px!important;
    padding:2px 7px!important;
    font-size:8px!important;
  }
}


/* --- Neon Road bubble text restore + JirkaCZEU reset patch companion --- */
.eventMapNode .eventNodePedestal{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-width:74px!important;
  max-width:96px!important;
  height:20px!important;
  bottom:-7px!important;
  padding:0 10px!important;
  font-size:10px!important;
  font-weight:1000!important;
  line-height:1!important;
  letter-spacing:.01em!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  text-align:center!important;
  color:#06111e!important;
  background:linear-gradient(180deg,#ffd992,#d69a49)!important;
  box-shadow:0 4px 12px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.30)!important;
  z-index:3!important;
}

.eventMapNode.is-big .eventNodePedestal{
  min-width:84px!important;
  max-width:108px!important;
  height:21px!important;
}

.eventMapNode em{
  display:none!important;
}

.eventMapNode.claimable .eventNodePedestal{
  background:linear-gradient(180deg,#ffe7a6,#f3b65a)!important;
  box-shadow:0 6px 14px rgba(0,0,0,.22), 0 0 16px rgba(255,209,102,.16), inset 0 1px 0 rgba(255,255,255,.28)!important;
}
.eventMapNode.locked .eventNodePedestal{
  background:linear-gradient(180deg,#ffdb9c,#cd964f)!important;
  color:#1c1206!important;
}
.eventMapNode.claimed .eventNodePedestal{
  background:linear-gradient(180deg,#ffd992,#d69a49)!important;
  color:#06111e!important;
}

.eventMapNode small{
  min-height:18px!important;
  max-height:18px!important;
}

@media(max-height:820px){
  .eventMapNode .eventNodePedestal{
    min-width:68px!important;
    max-width:90px!important;
    height:18px!important;
    font-size:9px!important;
    padding:0 8px!important;
  }
  .eventMapNode.is-big .eventNodePedestal{
    min-width:76px!important;
    max-width:98px!important;
    height:19px!important;
  }
}


/* --- Neon Road / Online small stability --- */
.eventMapNode.claiming{
  pointer-events:none!important;
  filter:brightness(1.15)!important;
}
.topOnlineDrop{
  will-change:contents;
}


/* --- Restore village empty building card without breaking radio/boss --- */
.buildings{align-items:start!important}
.building.emptyBuilding{
  padding-top:15px!important;
}
.building.emptyBuilding .ico{
  position:relative!important;
  margin-top:6px!important;
}
.building.emptyBuilding .ico::before{
  content:"Klikni a vyber styl";
  position:absolute;
  left:12px;
  right:12px;
  top:-12px;
  height:22px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 10px;
  border-radius:999px;
  box-sizing:border-box;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:10px;
  line-height:1;
  font-weight:1000;
  color:#c8fbff;
  background:linear-gradient(180deg,rgba(34,247,255,.18),rgba(34,247,255,.10));
  border:1px solid rgba(34,247,255,.28);
  box-shadow:0 0 16px rgba(34,247,255,.10);
}
.building.emptyBuilding .ico .subIco{display:none!important}
.building.emptyBuilding .ico .mainIco,
.building.emptyBuilding .ico > span:first-child{
  margin:0 auto!important;
}
@media(max-width:860px){
  .building.emptyBuilding .ico::before{font-size:9px;height:20px;left:10px;right:10px}
}


/* --- Final safe fix: one empty-building badge, radio/boss CSS stays from restored build --- */
.building.emptyBuilding{
  padding-top:15px !important;
}

/* hlavní badge necháme jen jednou */
.building.emptyBuilding:after{
  content:'Klikni a vyber styl' !important;
  position:absolute !important;
  top:12px !important;
  right:12px !important;
  left:auto !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  max-width:calc(100% - 24px) !important;
  min-height:22px !important;
  padding:5px 8px !important;
  border-radius:999px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  font-size:10px !important;
  font-weight:1000 !important;
  line-height:1 !important;
  color:#bffcff !important;
  background:rgba(34,247,255,.10) !important;
  border:1px solid rgba(34,247,255,.20) !important;
  z-index:5 !important;
}

/* duplicitní staré badge z předchozích CSS pokusů pryč */
.building.emptyBuilding .ico::before,
.building.emptyBuilding .ico::after,
.building.emptyBuilding .mainIco::before,
.building.emptyBuilding .mainIco::after,
.building.emptyBuilding .subIco::before,
.building.emptyBuilding .subIco::after{
  content:none !important;
  display:none !important;
}

/* Radio Kiss compact restore guard */
.radioKiss,
.radioKissTop,
.radioKissWidget,
.radioKissPlayer{
  min-width:0 !important;
}

.radioKissNowPlaying,
.radioKissNowPlayingTrack,
.radioKissTitle,
.radioKissVolumeText{
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

@media (max-width:860px){
  .building.emptyBuilding:after{
    font-size:9px !important;
    min-height:20px !important;
    padding:4px 7px !important;
  }
}


/* --- Critical login restore guard --- */
body{
  margin:0;
  background:
    radial-gradient(circle at 12% 10%, rgba(255,47,215,.18), transparent 34%),
    radial-gradient(circle at 82% 14%, rgba(34,247,255,.16), transparent 34%),
    linear-gradient(135deg,#09071b 0%,#10172a 48%,#06272d 100%);
  color:#f6f8ff;
}
.loginShell{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:28px;
  box-sizing:border-box;
}
.loginBox.authPro{
  width:min(1280px,100%);
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  gap:18px;
}
.loginBox .card,
.authPanel,
.onlineLoginCard{
  background:rgba(18,24,43,.72);
  border:1px solid rgba(255,255,255,.10);
  border-radius:28px;
  box-shadow:0 24px 80px rgba(0,0,0,.30);
  backdrop-filter:blur(18px);
}
.loginBox input,
.loginBox button{
  font:inherit;
}
@media(max-width:900px){
  .loginBox.authPro{grid-template-columns:1fr}
}


/* --- Full UI restore guard: Radio Kiss, Neon Events, Neon Road, Turnaj --- */
.quickNav.tabNav{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px!important;
  align-items:center!important;
}
.quickNav.tabNav button{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
}
.kissRadioTop,
.radioKissTop{
  display:flex!important;
  align-items:center!important;
}
#eventMapPanel,
#eventsPanel,
#tourneyPanel{
  min-height:0;
}
.heroHeadlineMega .line{display:block}
.loginSideScroll{
  max-height:calc(100vh - 76px);
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
}
.loginSideScroll::-webkit-scrollbar{width:8px}
.loginSideScroll::-webkit-scrollbar-track{background:rgba(255,255,255,.05);border-radius:999px}
.loginSideScroll::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(255,47,215,.75),rgba(34,247,255,.75));border-radius:999px}