:root {
  --bg-a: #0f1028;
  --bg-b: #30206f;
  --paper: rgba(255,255,255,.92);
  --paper-soft: rgba(255,255,255,.18);
  --ink: #111827;
  --muted: #6b7280;
  --primary: #6d5dfc;
  --primary-2: #ff72c6;
  --gold: #fbbf24;
  --danger: #ef4444;
  --radius: 28px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: radial-gradient(circle at 20% 10%, #6246ea 0, transparent 34%), linear-gradient(135deg, var(--bg-a), var(--bg-b)); overflow: hidden; }
button, a { font: inherit; }
.game-shell { position: relative; width: 100vw; height: 100vh; overflow: hidden; color: white; }
canvas { width: 100%; height: 100%; display: block; image-rendering: auto; }
.screen { position: absolute; inset: 0; display: none; place-items: center; padding: 26px; background: linear-gradient(135deg, rgba(17,15,46,.75), rgba(48,32,111,.54)); backdrop-filter: blur(13px); z-index: 10; }
.screen.active { display: grid; }
.screen.compact { background: rgba(17,15,46,.45); }
.menu-stage { position: relative; display: grid; grid-template-columns: minmax(0, 620px) 260px; align-items: center; gap: 20px; width: min(1040px, 96vw); }
.panel { width: min(590px, 94vw); padding: 34px; border-radius: var(--radius); color: var(--ink); background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,255,255,.88)); box-shadow: 0 34px 90px rgba(0,0,0,.30); border: 1px solid rgba(255,255,255,.55); }
.hero-panel { text-align: center; animation: floatIn .55s ease both; }
.wide-panel { width: min(1040px, 96vw); max-height: 88vh; overflow: auto; }
.settings-panel { width: min(640px, 94vw); }
.pause-panel { display: grid; gap: 12px; }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 22px; }
h1 { margin: 0; font-size: clamp(56px, 9vw, 104px); letter-spacing: -0.09em; line-height: .88; background: linear-gradient(135deg, var(--primary), var(--primary-2)); -webkit-background-clip: text; background-clip: text; color: transparent; }
h2 { margin: 0; font-size: clamp(30px, 4vw, 50px); letter-spacing: -0.05em; }
.subtitle { margin: 10px 0 0; color: #4b5563; font-weight: 850; font-size: 19px; }
.eyebrow { margin: 0 0 10px; font-size: 12px; letter-spacing: .16em; text-transform: uppercase; color: var(--primary); font-weight: 950; }
.hint, .score-line, .story-panel p { color: var(--muted); line-height: 1.65; }
.hero-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 22px 0 0; }
.hero-stats span { padding: 12px 10px; border-radius: 18px; background: rgba(109,93,252,.08); color: #4b5563; font-size: 12px; font-weight: 900; }
.hero-stats strong { display: block; color: #312e81; font-size: 18px; }
.menu-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 28px auto 18px; width: min(460px, 100%); }
.menu-actions .primary { grid-column: 1 / -1; }
.btn { border: 0; border-radius: 18px; padding: 14px 18px; background: #eef2ff; color: #312e81; cursor: pointer; font-weight: 950; text-decoration: none; text-align: center; box-shadow: inset 0 0 0 1px rgba(99,102,241,.08); transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
.btn:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(109,93,252,.22); }
.btn.primary { color: white; background: linear-gradient(135deg, var(--primary), var(--primary-2)); }
.btn.ghost { background: rgba(17,24,39,.06); color: #374151; }
.btn.danger { color: white; background: linear-gradient(135deg, #fb7185, #ef4444); }
.btn.small { padding: 10px 14px; border-radius: 14px; }
.full-link { display: block; margin-top: 18px; }
.premium-card { align-self: end; padding: 22px; border-radius: 28px; color: white; background: linear-gradient(135deg, rgba(109,93,252,.86), rgba(255,114,198,.74)); border: 1px solid rgba(255,255,255,.35); box-shadow: 0 24px 70px rgba(0,0,0,.28); backdrop-filter: blur(20px); animation: floatCard 4s ease-in-out infinite; }
.premium-card strong { display: block; font-size: 22px; letter-spacing: -.04em; }
.premium-card p { color: rgba(255,255,255,.82); line-height: 1.55; }
.badge { display: inline-flex; padding: 8px 10px; border-radius: 999px; background: rgba(255,255,255,.2); margin-bottom: 14px; font-weight: 950; }
.orb { position: absolute; border-radius: 50%; filter: blur(.5px); opacity: .68; animation: drift 8s ease-in-out infinite; pointer-events: none; }
.orb-one { width: 90px; height: 90px; background: #67e8f9; top: -20px; left: -28px; }
.orb-two { width: 56px; height: 56px; background: #fbbf24; right: 230px; bottom: 20px; animation-delay: -2s; }
.orb-three { width: 72px; height: 72px; background: #fb7185; right: 90px; top: 70px; animation-delay: -4s; }
.level-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(126px, 1fr)); gap: 14px; }
.level-card { border: 0; border-radius: 24px; padding: 16px; min-height: 112px; text-align: left; background: linear-gradient(135deg, #ffffff, #eef2ff); color: #111827; cursor: pointer; box-shadow: 0 12px 28px rgba(15,23,42,.08); position: relative; overflow: hidden; }
.level-card::after { content: ''; position: absolute; width: 70px; height: 70px; right: -20px; bottom: -20px; border-radius: 50%; background: rgba(109,93,252,.12); }
.level-card.locked { opacity: .48; cursor: not-allowed; filter: grayscale(.8); }
.level-card strong { display: block; font-size: 26px; }
.level-card span { display: block; color: var(--muted); font-size: 12px; font-weight: 850; margin-top: 4px; }
.level-card em { display: block; margin-top: 9px; color: var(--gold); font-style: normal; letter-spacing: .06em; }
.guide-grid, .story-grid, .achievement-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.guide-grid article, .story-grid article, .achievement { background: rgba(109,93,252,.08); border-radius: 22px; padding: 18px; }
.guide-grid strong, .story-grid strong, .achievement strong { display: block; margin-bottom: 8px; color: #312e81; }
.guide-grid span, .story-grid span, .achievement span { color: #4b5563; line-height: 1.55; }
.achievement.locked { opacity: .52; filter: grayscale(.7); }
.setting-row { display: flex; justify-content: space-between; align-items: center; gap: 18px; margin: 12px 0; padding: 14px 0; border-bottom: 1px solid rgba(15,23,42,.08); font-weight: 850; }
.setting-row input { width: 22px; height: 22px; accent-color: var(--primary); }
.hud { position: absolute; top: max(18px, env(safe-area-inset-top)); left: 50%; transform: translateX(-50%); z-index: 5; display: flex; gap: 10px; align-items: center; padding: 8px; border-radius: 999px; background: rgba(255,255,255,.18); backdrop-filter: blur(18px); box-shadow: 0 14px 50px rgba(0,0,0,.22); max-width: calc(100vw - 20px); overflow-x: auto; }
.hud.hidden { display: none; }
.hud-pill { display: flex; gap: 8px; align-items: center; border-radius: 999px; padding: 9px 14px; background: rgba(255,255,255,.88); color: #111827; font-weight: 950; white-space: nowrap; }
.hud-pill span { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; }
.hud-button { min-width: 42px; height: 42px; border: 0; border-radius: 50%; color: #111827; background: rgba(255,255,255,.9); cursor: pointer; font-weight: 950; }
.complete-stars { color: var(--gold); font-size: 34px; letter-spacing: 4px; text-align: center; margin: 4px 0 10px; text-shadow: 0 8px 22px rgba(251,191,36,.32); }
.toast { position: absolute; left: 50%; bottom: 105px; transform: translateX(-50%) translateY(18px); opacity: 0; pointer-events: none; z-index: 8; padding: 13px 18px; border-radius: 999px; background: rgba(17,24,39,.75); color: white; backdrop-filter: blur(14px); font-weight: 900; transition: opacity .25s ease, transform .25s ease; }
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.mobile-controls { position: absolute; left: 18px; right: 18px; bottom: max(18px, env(safe-area-inset-bottom)); z-index: 6; display: none; justify-content: space-between; pointer-events: none; }
.mobile-controls button { pointer-events: auto; border: 0; border-radius: 24px; background: rgba(255,255,255,.18); color: white; font-weight: 950; backdrop-filter: blur(16px); box-shadow: 0 15px 35px rgba(0,0,0,.24); }
.mobile-controls .pad { display: flex; gap: 12px; }
.mobile-controls .pad button { width: 64px; height: 60px; }
.mobile-controls .action-pad button { width: 92px; }
.mobile-controls .jump { width: 108px; height: 64px; }
@keyframes floatIn { from { transform: translateY(18px) scale(.98); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes floatCard { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes drift { 0%,100% { transform: translate3d(0,0,0); } 50% { transform: translate3d(12px,-16px,0); } }
@media (max-width: 900px) {
  .menu-stage { grid-template-columns: 1fr; }
  .premium-card { display: none; }
  .menu-actions { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .screen { padding: 16px; }
  .panel { padding: 24px; border-radius: 24px; }
  .guide-grid, .story-grid, .achievement-grid { grid-template-columns: 1fr; }
  .hud { top: 10px; border-radius: 22px; }
  .hud-pill { padding: 8px 10px; }
  .hud-pill span { display: none; }
  .mobile-controls { display: flex; }
  h1 { font-size: clamp(46px, 14vw, 80px); }
}


/* v1.2-v1.3 Premium polish */
.screen.active { animation: screenFade .34s ease both; }
@keyframes screenFade { from { opacity: 0; transform: scale(.985); } to { opacity: 1; transform: scale(1); } }
.hero-panel, .premium-card, .wide-panel, .settings-panel, .pause-panel { backdrop-filter: blur(22px) saturate(1.15); border: 1px solid rgba(255,255,255,.28); box-shadow: 0 32px 90px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.55); }
.hero-panel h1 { letter-spacing: -.06em; text-shadow: 0 18px 42px rgba(109,93,252,.35); }
.hero-art { position: absolute; right: min(8vw, 110px); top: 12vh; width: 310px; height: 310px; border-radius: 42px; background: linear-gradient(150deg, rgba(255,255,255,.22), rgba(255,255,255,.05)); border: 1px solid rgba(255,255,255,.28); box-shadow: 0 30px 80px rgba(0,0,0,.28); overflow: hidden; animation: floatCard 5.5s ease-in-out infinite; }
.hero-art::before { content: ""; position: absolute; inset: 0; background: radial-gradient(circle at 70% 20%, rgba(255,255,255,.68), transparent 16%), radial-gradient(circle at 30% 80%, rgba(255,114,198,.35), transparent 28%); }
.hero-art .moon { position: absolute; width: 82px; height: 82px; right: 34px; top: 32px; border-radius: 50%; background: #fff3a3; box-shadow: 0 0 34px rgba(255,243,163,.85); }
.hero-art .mini-hero { position: absolute; left: 98px; bottom: 54px; width: 72px; height: 94px; border-radius: 28px 28px 18px 18px; background: linear-gradient(#ffd658 0 24%, #ff5fa8 25% 42%, #ffd658 43%); box-shadow: 0 18px 36px rgba(0,0,0,.22); animation: heroBounce 1.8s ease-in-out infinite; }
.hero-art .mini-hero::before, .hero-art .mini-hero::after { content: ""; position: absolute; top: 38px; width: 10px; height: 10px; border-radius: 50%; background: #111827; }
.hero-art .mini-hero::before { left: 18px; } .hero-art .mini-hero::after { right: 18px; }
.hero-art .crystal { position: absolute; width: 34px; height: 48px; transform: rotate(45deg); background: linear-gradient(135deg, #79f2ff, #fff); box-shadow: 0 0 24px rgba(121,242,255,.72); border-radius: 8px; animation: crystalPulse 2.3s ease-in-out infinite; }
.hero-art .c1 { left: 42px; top: 58px; } .hero-art .c2 { right: 58px; bottom: 62px; animation-delay: .4s; } .hero-art .c3 { left: 44px; bottom: 92px; animation-delay: .8s; }
@keyframes floatCard { 0%,100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-14px) rotate(1deg); } }
@keyframes heroBounce { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-18px); } }
@keyframes crystalPulse { 0%,100% { transform: rotate(45deg) scale(1); opacity: .82; } 50% { transform: rotate(45deg) scale(1.12); opacity: 1; } }
.cinematic-panel { width: min(980px, 94vw); padding: 38px; text-align: center; position: relative; overflow: hidden; }
.cinematic-panel::before { content: ""; position: absolute; inset: -20%; background: radial-gradient(circle at 50% 20%, rgba(121,242,255,.16), transparent 42%), radial-gradient(circle at 10% 80%, rgba(255,114,198,.12), transparent 36%); }
.cinematic-panel > * { position: relative; z-index: 1; }
.cinematic-lead { max-width: 760px; margin: 0 auto 24px; color: rgba(255,255,255,.82); font-size: 1.08rem; line-height: 1.7; }
.cinematic-scenes { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; margin: 24px 0; }
.cinematic-scenes article { padding: 20px; border-radius: 24px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.24); text-align: left; animation: sceneRise .7s ease both; }
.cinematic-scenes article:nth-child(2){ animation-delay:.08s; } .cinematic-scenes article:nth-child(3){ animation-delay:.16s; }
.cinematic-scenes span { display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 14px; background: rgba(255,255,255,.20); font-weight: 900; margin-bottom: 14px; }
.cinematic-scenes strong { display:block; font-size:1.1rem; margin-bottom:6px; } .cinematic-scenes em { color: rgba(255,255,255,.72); font-style: normal; }
.inline-actions { justify-content:center; }
.level-intro-panel { width: min(620px, 94vw); text-align: center; padding: 36px; position: relative; overflow: hidden; }
.level-intro-panel::after { content:""; position:absolute; left:20%; right:20%; bottom:-40px; height:90px; background: radial-gradient(ellipse, rgba(121,242,255,.42), transparent 70%); }
.intro-objectives { display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin: 20px 0 24px; }
.intro-objectives span, .victory-ribbons span { padding: 9px 12px; border-radius: 999px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.20); color: rgba(255,255,255,.86); font-weight: 800; font-size: .85rem; }
.trophy-crown { width:72px; height:72px; display:grid; place-items:center; border-radius:24px; margin: -2px auto 12px; background: linear-gradient(135deg, #fff1a7, #ffba42); color:#5b3410; font-size: 2.5rem; box-shadow: 0 18px 40px rgba(251,191,36,.32); animation: trophyPop 1.35s ease-in-out infinite; }
.victory-panel { position: relative; overflow: hidden; }
.victory-panel::before { content:""; position:absolute; inset:-20%; background: radial-gradient(circle at 50% 0%, rgba(251,191,36,.26), transparent 42%), radial-gradient(circle at 0% 100%, rgba(255,114,198,.16), transparent 34%); }
.victory-panel > * { position:relative; z-index:1; }
.complete-stars { animation: starPulse 1.15s ease-in-out infinite; text-shadow: 0 0 24px rgba(251,191,36,.75); }
.victory-ribbons { display:flex; gap:8px; flex-wrap:wrap; justify-content:center; margin: 12px 0 20px; }
.btn.primary { box-shadow: 0 16px 36px rgba(109,93,252,.36), inset 0 1px 0 rgba(255,255,255,.42); }
.btn:hover { transform: translateY(-2px); filter: brightness(1.05); }
.level-card { transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease; }
.level-card:hover { transform: translateY(-4px) scale(1.015); box-shadow: 0 18px 34px rgba(0,0,0,.18); border-color: rgba(255,255,255,.44); }
@keyframes spinGlow { to { transform: rotate(360deg); } }
@keyframes sceneRise { from { opacity:0; transform: translateY(18px); } to { opacity:1; transform: translateY(0); } }
@keyframes trophyPop { 0%,100% { transform: scale(1) rotate(-2deg); } 50% { transform: scale(1.07) rotate(2deg); } }
@keyframes starPulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.08); } }
@media (max-width: 1050px) { .hero-art { display:none; } }
@media (max-width: 760px) { .cinematic-scenes { grid-template-columns: 1fr; } .cinematic-panel, .level-intro-panel { padding: 24px; } }

.level-card small { display:block; margin-top:4px; font-size:11px; font-weight:900; color:#6d5dfc; text-transform:uppercase; letter-spacing:.06em; }
.hero-panel, .premium-card { position: relative; z-index: 1; }
.hero-art { z-index: 0; pointer-events: none; right: -130px; }


/* v1.3 calmer premium background + extra mobile control */
.mobile-controls .pad button[data-control="down"] { min-width: 78px; padding-inline: 12px; }
@media (max-width: 760px) { .mobile-controls .pad { gap: 8px; } .mobile-controls .pad button { width: 58px; height: 58px; } .mobile-controls .pad button[data-control="down"] { width: 82px; font-size: 12px; } }


/* v1.4 Classic Gameplay UI — menus/intro now match the game world */
:root {
  --game-sky-top: #7fdcff;
  --game-sky-mid: #aeeeff;
  --game-sky-bottom: #ffe3a8;
  --game-grass: #34d168;
  --game-grass-dark: #11994a;
  --game-dirt: #9b5a2e;
  --game-dirt-dark: #6d371f;
  --game-wood: #8b4a25;
  --game-cream: #fff6cf;
  --game-cream-2: #ffe7a6;
  --game-ink: #3a2418;
  --game-purple: #6d5dfc;
  --game-pink: #ff5fa8;
  --game-cyan: #5cf1ff;
  --game-yellow: #ffd658;
}
html, body {
  background: linear-gradient(180deg, var(--game-sky-top) 0%, var(--game-sky-mid) 48%, var(--game-sky-bottom) 100%);
}
.screen {
  overflow: hidden;
  color: var(--game-ink);
  background:
    radial-gradient(circle at 16% 16%, rgba(255,246,164,.82) 0 42px, transparent 43px),
    radial-gradient(ellipse at 18% 88%, rgba(34,197,94,.42) 0 15%, transparent 16%),
    radial-gradient(ellipse at 82% 90%, rgba(16,185,129,.34) 0 20%, transparent 21%),
    linear-gradient(180deg, rgba(120,216,255,.96) 0%, rgba(177,239,255,.94) 50%, rgba(255,226,168,.94) 100%);
  backdrop-filter: none;
}.screen > * { position: relative; z-index: 1; }
.screen.compact { background: linear-gradient(180deg, rgba(127,220,255,.96), rgba(255,226,168,.94)); }
.menu-stage {
  grid-template-columns: minmax(0, 640px) 280px;
  align-items: end;
  padding-bottom: 54px;
}
.orb { display: none; }
.gameplay-cloud {
  position: absolute;
  z-index: 0;
  width: 138px;
  height: 56px;
  border-radius: 999px;
  background: rgba(255,255,255,.86);
  box-shadow: 34px -16px 0 7px rgba(255,255,255,.78), 74px 2px 0 3px rgba(255,255,255,.72);
  pointer-events: none;
  animation: cloudDrift 11s ease-in-out infinite;
}
.gameplay-cloud.cloud-a { left: 20px; top: -70px; }
.gameplay-cloud.cloud-b { right: 210px; top: -40px; transform: scale(.72); animation-delay: -4s; }
.panel {
  color: var(--game-ink);
  border-radius: 24px;
  border: 5px solid var(--game-wood);
  background:
    linear-gradient(180deg, rgba(255,250,218,.98), rgba(255,231,166,.97)),
    repeating-linear-gradient(90deg, transparent 0 42px, rgba(139,74,37,.06) 42px 44px);
  box-shadow: 0 12px 0 var(--game-dirt-dark), 0 34px 72px rgba(86,48,24,.30), inset 0 4px 0 rgba(255,255,255,.72), inset 0 -9px 0 rgba(145,89,39,.13);
  backdrop-filter: none;
}
.hero-panel, .premium-card, .wide-panel, .settings-panel, .pause-panel {
  border: 5px solid var(--game-wood);
  box-shadow: 0 12px 0 var(--game-dirt-dark), 0 34px 72px rgba(86,48,24,.30), inset 0 4px 0 rgba(255,255,255,.72), inset 0 -9px 0 rgba(145,89,39,.13);
  backdrop-filter: none;
}
.hero-panel { text-align: left; }
.hero-panel h1,
h1 {
  background: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  color: var(--game-yellow);
  letter-spacing: -.055em;
  text-shadow: 0 5px 0 #9b4d21, 0 10px 0 #5a2b16, 0 18px 28px rgba(90,43,22,.32);
}
h2 {
  color: #5b321f;
  text-shadow: 0 2px 0 rgba(255,255,255,.58);
}
.subtitle,
.hint,
.score-line,
.story-panel p,
.guide-grid span,
.story-grid span,
.achievement span,
.cinematic-lead {
  color: #684735;
}
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  width: auto;
  color: #fff8dd;
  background: linear-gradient(180deg, #27d472, #109549);
  border: 3px solid #0b6a34;
  border-radius: 999px;
  padding: 7px 12px;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.32), 0 4px 0 #064f28;
  letter-spacing: .10em;
}
.hero-stats span,
.guide-grid article,
.story-grid article,
.achievement,
.cinematic-scenes article,
.level-card,
.setting-row {
  background: linear-gradient(180deg, #fff7d6, #ffe19c);
  border: 3px solid #9b5a2e;
  box-shadow: inset 0 3px 0 rgba(255,255,255,.54), 0 7px 0 #704027;
}
.hero-stats strong,
.guide-grid strong,
.story-grid strong,
.achievement strong {
  color: #6d371f;
}
.btn {
  border-radius: 16px;
  border: 3px solid #7a421f;
  color: #4b2917;
  background: linear-gradient(180deg, #fff36b, #ffbf3a);
  box-shadow: inset 0 3px 0 rgba(255,255,255,.55), 0 7px 0 #7a421f, 0 14px 22px rgba(108,64,24,.20);
}
.btn:hover { transform: translateY(-3px); box-shadow: inset 0 3px 0 rgba(255,255,255,.55), 0 10px 0 #7a421f, 0 18px 30px rgba(108,64,24,.24); }
.btn.primary {
  color: #fff7d6;
  background: linear-gradient(180deg, #ff72c6, #d93278);
  border-color: #8d1745;
  box-shadow: inset 0 3px 0 rgba(255,255,255,.40), 0 7px 0 #8d1745, 0 16px 30px rgba(217,50,120,.26);
}
.btn.ghost {
  color: #105c37;
  background: linear-gradient(180deg, #7af7a0, #24c466);
  border-color: #0e7b3d;
  box-shadow: inset 0 3px 0 rgba(255,255,255,.38), 0 7px 0 #0e7b3d, 0 14px 22px rgba(20,130,68,.18);
}
.btn.danger {
  color: #fff7d6;
  background: linear-gradient(180deg, #ff7b7b, #ef4444);
  border-color: #9e1f1f;
  box-shadow: inset 0 3px 0 rgba(255,255,255,.38), 0 7px 0 #9e1f1f;
}
.premium-card {
  color: #fff7d6;
  background: linear-gradient(180deg, #37d979, #12984f);
  border-color: #0b6532;
  box-shadow: inset 0 5px 0 rgba(255,255,255,.26), 0 12px 0 #064f28, 0 30px 52px rgba(6,79,40,.30);
}
.premium-card p { color: rgba(255,248,221,.88); }
.badge { background: rgba(255,255,255,.18); border: 2px solid rgba(255,255,255,.28); }
.hero-art {
  width: 320px;
  height: 260px;
  border-radius: 24px;
  right: -150px;
  top: 20px;
  border: 5px solid #7a421f;
  background: linear-gradient(180deg, #7fdcff 0%, #b8f4ff 54%, #ffe1a4 55%, #ffe1a4 100%);
  box-shadow: 0 10px 0 #5f3118, 0 26px 48px rgba(95,49,24,.28);
}
.hero-art::before {
  background:
    radial-gradient(circle at 78% 18%, #fff3a3 0 37px, transparent 38px),
    radial-gradient(ellipse at 20% 80%, #38c46b 0 55px, transparent 56px),
    radial-gradient(ellipse at 62% 86%, #27a95a 0 70px, transparent 71px),
    linear-gradient(180deg, transparent 0 188px, #34d168 189px 204px, #9b5a2e 205px 100%);
}
.hero-art .moon { display: none; }
.hero-art .mini-hero { left: 116px; bottom: 48px; }
.hero-art .crystal { border-radius: 6px; }
.level-card { min-height: 122px; border-radius: 18px; }
.level-card::after {
  width: 82px;
  height: 48px;
  right: -14px;
  bottom: -7px;
  border-radius: 18px 18px 8px 8px;
  background: linear-gradient(180deg, #35e08a 0 14px, #13a865 15px 100%);
  opacity: .9;
}
.level-card:hover { transform: translateY(-7px); box-shadow: inset 0 3px 0 rgba(255,255,255,.54), 0 12px 0 #704027, 0 22px 28px rgba(112,64,39,.20); }
.level-card small { color: #0e7b3d; }
.cinematic-panel,
.level-intro-panel,
.victory-panel {
  overflow: hidden;
}
.cinematic-panel::before,
.level-intro-panel::before,
.victory-panel::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 15% 16%, rgba(255,255,255,.55) 0 32px, transparent 33px),
    radial-gradient(ellipse at 85% 18%, rgba(255,255,255,.42) 0 38px, transparent 39px),
    radial-gradient(ellipse at 22% 100%, rgba(52,209,104,.26) 0 18%, transparent 19%),
    linear-gradient(180deg, rgba(127,220,255,.36), rgba(255,226,168,.28));
  z-index: 0;
}
.cinematic-panel > *, .level-intro-panel > *, .victory-panel > * { position: relative; z-index: 1; }
.cinematic-scenes article { color: var(--game-ink); text-align: left; }
.cinematic-scenes span {
  background: linear-gradient(180deg, #5cf1ff, #21aac8);
  color: #073946;
  border: 3px solid #08738a;
  box-shadow: 0 5px 0 #075565;
}
.cinematic-scenes em { color: #684735; }
.intro-game-stage {
  position: relative;
  width: min(720px, 100%);
  height: 238px;
  margin: 12px auto 20px;
  overflow: hidden;
  border-radius: 22px;
  border: 5px solid #7a421f;
  background: linear-gradient(180deg, #7fdcff 0%, #b8f4ff 57%, #ffe1a4 58%, #ffe1a4 100%);
  box-shadow: 0 9px 0 #5f3118, inset 0 3px 0 rgba(255,255,255,.55);
}
.intro-game-stage span { position: absolute; display: block; }
.intro-sun { width: 66px; height: 66px; right: 52px; top: 26px; border-radius: 50%; background: #fff3a3; box-shadow: 0 0 32px rgba(255,243,163,.88); }
.intro-cloud { width: 104px; height: 36px; border-radius: 999px; background: rgba(255,255,255,.86); box-shadow: 26px -12px 0 7px rgba(255,255,255,.78), 60px 2px 0 4px rgba(255,255,255,.72); }
.intro-cloud.one { left: 54px; top: 34px; }
.intro-cloud.two { right: 180px; top: 64px; transform: scale(.7); }
.intro-hill { bottom: 40px; border-radius: 50% 50% 0 0; background: #34d168; }
.hill-one { left: 44px; width: 210px; height: 92px; }
.hill-two { right: 80px; width: 260px; height: 112px; background: #27b763; }
.intro-platform { left: 0; right: 0; bottom: 0; height: 52px; background: linear-gradient(180deg, #34d168 0 13px, #11994a 14px 18px, #9b5a2e 19px 100%); box-shadow: inset 0 12px 0 rgba(255,255,255,.12); }
.intro-tunnel { left: 425px; bottom: 50px; width: 76px; height: 74px; border-radius: 15px 15px 8px 8px; background: radial-gradient(ellipse at 50% 18%, #083c27 0 32%, transparent 33%), linear-gradient(180deg, #35e08a 0 24px, #13a865 25px 100%); box-shadow: inset 0 -10px 0 rgba(0,0,0,.14), 0 9px 0 rgba(6,79,40,.4); }
.intro-hero { left: 166px; bottom: 50px; width: 48px; height: 62px; border-radius: 19px 19px 11px 11px; background: linear-gradient(#ffd658 0 24%, #ff5fa8 25% 42%, #ffd658 43%); box-shadow: 0 10px 0 rgba(95,49,24,.25); animation: heroBounce 1.55s ease-in-out infinite; }
.intro-hero::before, .intro-hero::after { content:""; position:absolute; top:27px; width:6px; height:6px; border-radius:50%; background:#111827; }
.intro-hero::before { left: 13px; } .intro-hero::after { right: 13px; }
.intro-flower { left: 545px; bottom: 50px; width: 72px; height: 94px; background: radial-gradient(circle at 38% 20%, #fff 0 5px, transparent 6px), radial-gradient(circle at 64% 20%, #fff 0 5px, transparent 6px), radial-gradient(ellipse at 50% 33%, #2d0710 0 14px, transparent 15px), radial-gradient(ellipse at 50% 28%, #f43f5e 0 31px, transparent 32px), linear-gradient(90deg, transparent 0 31px, #13994b 32px 42px, transparent 43px); animation: chomperUiBite 2.1s ease-in-out infinite; }
.intro-crystal { width: 25px; height: 36px; transform: rotate(45deg); border-radius: 5px; background: linear-gradient(135deg, #5cf1ff, #fff); box-shadow: 0 0 18px rgba(92,241,255,.8); animation: crystalPulse 2s ease-in-out infinite; }
.crystal-one { left: 284px; bottom: 94px; }
.crystal-two { left: 330px; bottom: 122px; animation-delay: .35s; }
.intro-objectives span,
.victory-ribbons span {
  color: #fff8dd;
  background: linear-gradient(180deg, #27d472, #109549);
  border: 2px solid #0b6a34;
  box-shadow: 0 4px 0 #064f28;
}
.trophy-crown {
  border: 4px solid #8f5a20;
  background: linear-gradient(180deg, #fff36b, #ffbf3a);
  box-shadow: inset 0 3px 0 rgba(255,255,255,.52), 0 8px 0 #7a421f;
}
.hud { background: rgba(255,246,207,.62); border: 3px solid rgba(122,66,31,.55); box-shadow: 0 8px 0 rgba(95,49,24,.20), 0 18px 42px rgba(95,49,24,.22); }
.hud-pill { background: linear-gradient(180deg, #fff7d6, #ffe19c); border: 2px solid rgba(155,90,46,.65); color: #4b2917; }
.hud-button { background: linear-gradient(180deg, #fff36b, #ffbf3a); border: 2px solid #7a421f; color: #4b2917; }
.toast { background: linear-gradient(180deg, #fff7d6, #ffe19c); color: #4b2917; border: 3px solid #7a421f; box-shadow: 0 7px 0 #7a421f; }
.mobile-controls button { background: linear-gradient(180deg, #fff7d6, #ffbf3a); color: #4b2917; border: 3px solid #7a421f; box-shadow: inset 0 3px 0 rgba(255,255,255,.50), 0 7px 0 #7a421f; backdrop-filter: none; }
@keyframes chomperUiBite { 0%,100% { transform: translateY(0) scaleY(1); } 45% { transform: translateY(4px) scaleY(.92); } 55% { transform: translateY(0) scaleY(1.05); } }
@keyframes cloudDrift { 0%,100% { transform: translate3d(0,0,0); } 50% { transform: translate3d(16px,-4px,0); } }
@media (max-width: 760px) {
  .menu-stage { padding-bottom: 78px; }  .hero-panel { text-align: center; }
  .intro-game-stage { height: 190px; }
  .intro-flower { left: auto; right: 42px; }
  .intro-tunnel { left: 58%; }
  .intro-hero { left: 18%; }
}

/* v1.6 Premium Powers — power room cards and softer arcade polish */
.power-room-panel { position: relative; overflow: hidden; }
.power-room-panel::before {
  content: "";
  position: absolute;
  inset: 16px 18px auto auto;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,246,160,.72), rgba(255,190,86,.20) 58%, transparent 70%);
  pointer-events: none;
}
.power-room-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
  margin-top: 20px;
}
.power-card {
  position: relative;
  min-height: 176px;
  padding: 22px 18px 18px;
  border-radius: 28px;
  border: 3px solid #7a421f;
  background: linear-gradient(180deg, #fff7d6, #ffd67a 55%, #f39a42);
  color: #4b2917;
  box-shadow: inset 0 4px 0 rgba(255,255,255,.45), 0 8px 0 #7a421f, 0 18px 38px rgba(95,49,24,.22);
  overflow: hidden;
}
.power-card::after {
  content: "";
  position: absolute;
  right: -26px;
  bottom: -24px;
  width: 96px;
  height: 96px;
  border-radius: 34px;
  background: rgba(255,255,255,.20);
  transform: rotate(18deg);
}
.power-card i {
  position: relative;
  z-index: 1;
  display: inline-grid;
  place-items: center;
  width: 54px;
  height: 54px;
  border-radius: 20px;
  margin-bottom: 14px;
  background: rgba(255,255,255,.62);
  border: 2px solid rgba(122,66,31,.38);
  font-style: normal;
  font-size: 28px;
  animation: powerBob 1.8s ease-in-out infinite;
}
.power-card strong,
.power-card span { position: relative; z-index: 1; display: block; }
.power-card strong { font-size: 18px; margin-bottom: 8px; }
.power-card span { color: rgba(75,41,23,.78); line-height: 1.45; font-weight: 700; }
.power-card.seed i { color: #0f91a8; }
.power-card.giant i { color: #e83576; }
.power-card.shield i { color: #0096b8; }
.power-card.magnet i { color: #b35c00; }
@keyframes powerBob { 0%,100% { transform: translateY(0) rotate(-4deg); } 50% { transform: translateY(-7px) rotate(4deg); } }
@media (max-width: 980px) { .power-room-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .power-room-grid { grid-template-columns: 1fr; } .power-card { min-height: 144px; } }


/* v1.7 Adventure Shop — progression, coins, wings, time bubble */
.shop-panel { position: relative; overflow: hidden; }
.shop-panel::before { content:""; position:absolute; right:22px; top:22px; width:132px; height:132px; border-radius:42px; transform:rotate(12deg); background:linear-gradient(135deg, rgba(255,222,97,.62), rgba(255,109,176,.20)); pointer-events:none; }
.shop-wallet { display:inline-flex; align-items:center; gap:12px; margin:14px 0 20px; padding:12px 16px; border-radius:999px; background:linear-gradient(180deg,#fff7d6,#ffd67a); border:3px solid #7a421f; box-shadow:0 7px 0 #7a421f; color:#4b2917; font-weight:950; }
.shop-wallet strong { font-size:24px; }
.shop-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-top:8px; }
.shop-card { position:relative; min-height:190px; padding:20px; border-radius:28px; border:3px solid #7a421f; background:linear-gradient(180deg,#fff7d6,#ffd67a 58%,#f39a42); box-shadow:inset 0 4px 0 rgba(255,255,255,.45),0 8px 0 #7a421f,0 18px 38px rgba(95,49,24,.22); color:#4b2917; overflow:hidden; }
.shop-card::after { content:""; position:absolute; right:-32px; bottom:-30px; width:108px; height:108px; border-radius:36px; background:rgba(255,255,255,.20); transform:rotate(18deg); }
.shop-card strong { display:block; font-size:18px; margin-bottom:8px; position:relative; z-index:1; }
.shop-card span { display:block; line-height:1.45; color:rgba(75,41,23,.78); font-weight:750; position:relative; z-index:1; }
.shop-card .cost { display:inline-flex; margin:14px 0 12px; padding:7px 11px; border-radius:999px; background:rgba(255,255,255,.55); border:2px solid rgba(122,66,31,.32); font-weight:950; position:relative; z-index:1; }
.shop-card button { position:relative; z-index:2; width:100%; }
.shop-card.owned { background:linear-gradient(180deg,#dfffea,#9ff3c5 58%,#52c989); }
.power-card.wings i { color:#6574ff; }
.power-card.time i { color:#5265e8; }
@media (max-width: 980px) { .shop-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .shop-grid { grid-template-columns: 1fr; } }


/* v1.9.1 Corrected Adventure Deluxe — applied directly on top of the good v1.7 visual base */
.hero-stats { grid-template-columns: repeat(5, 1fr); }
.menu-actions { width: min(520px, 100%); }
.wardrobe-grid, .shop-grid, .profile-stats, .profile-badges { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 16px; }
.skin-card, .shop-card, .profile-stats article, .profile-badges article { position: relative; overflow: hidden; border-radius: 26px; padding: 18px; background: linear-gradient(180deg, var(--game-cream), var(--game-cream-2)); border: 3px solid rgba(109,55,31,.16); box-shadow: 0 16px 34px rgba(109,55,31,.12); color: var(--game-ink); }
.skin-card::after, .shop-card::after, .profile-stats article::after { content: ""; position: absolute; right: -20px; bottom: -22px; width: 90px; height: 58px; border-radius: 50%; background: rgba(52,209,104,.18); }
.skin-card strong, .shop-card strong, .profile-badges strong { display: block; margin: 10px 0 6px; color: #4a2614; font-size: 1.05rem; }
.skin-card span, .shop-card span, .profile-badges span { display: block; color: #73523a; line-height: 1.5; }
.skin-card .cost, .shop-card .cost { display: inline-flex; margin: 12px 0; padding: 7px 10px; border-radius: 999px; background: rgba(255,255,255,.58); color: #7c3e13; font-style: normal; font-weight: 950; }
.skin-card.selected { outline: 4px solid rgba(255,214,88,.72); box-shadow: 0 20px 44px rgba(251,191,36,.25); }
.skin-preview { height: 108px; border-radius: 22px; background: linear-gradient(180deg, #7fdcff, #ffe3a8); position: relative; display: grid; place-items: end center; overflow: hidden; border: 2px solid rgba(255,255,255,.7); }
.skin-preview::before { content:""; position:absolute; left:0; right:0; bottom:0; height:28px; background: linear-gradient(180deg, #34d168 0 11px, #11994a 12px 16px, #9b5a2e 17px); }
.skin-preview span { position: relative; z-index: 1; width: 42px; height: 58px; margin-bottom: 21px; border-radius: 18px 18px 11px 11px; background: linear-gradient(180deg, var(--skin-b) 0 18%, var(--skin-a) 19% 72%, var(--skin-c) 73%); box-shadow: 0 10px 20px rgba(0,0,0,.22); }
.skin-preview span::before, .skin-preview span::after { content:""; position:absolute; top:23px; width:6px; height:6px; border-radius:50%; background:#111827; }
.skin-preview span::before { left:10px; } .skin-preview span::after { right:10px; }
.daily-panel { width: min(620px, 94vw); text-align: center; }
.daily-chest { width: 146px; height: 118px; margin: 6px auto 20px; border-radius: 22px; background: linear-gradient(180deg, #ffba42 0 28%, #9b5a2e 29%); box-shadow: 0 20px 44px rgba(109,55,31,.28), inset 0 -12px 0 rgba(0,0,0,.12); position: relative; animation: chestBob 2.2s ease-in-out infinite; }
.daily-chest::before { content:""; position:absolute; left:50%; top:42%; transform:translate(-50%,-50%); width:30px; height:34px; border-radius:8px; background:#fff1a7; box-shadow: inset 0 -6px 0 rgba(0,0,0,.10); }
.daily-chest span { position:absolute; left:16px; right:16px; top:-14px; height:28px; border-radius: 16px 16px 6px 6px; background: linear-gradient(180deg, #ffd658, #f59e0b); }
.profile-stats { margin-bottom: 20px; }
.profile-stats article span { color:#73523a; font-weight:900; text-transform:uppercase; letter-spacing:.08em; font-size:.72rem; }
.profile-stats article strong { display:block; margin-top:8px; font-size:1.5rem; color:#4a2614; }
.profile-badges article.locked { opacity:.58; filter: grayscale(.65); }
@keyframes chestBob { 0%,100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-10px) rotate(1deg); } }
@media (max-width: 900px) { .hero-stats { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 760px) { .wardrobe-grid, .shop-grid, .profile-stats, .profile-badges { grid-template-columns: 1fr; } .hero-stats { grid-template-columns: 1fr 1fr; } }


/* v1.10 Quest & Relic Expansion */
.hero-stats { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.quest-grid, .vault-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:16px; margin-top:18px; }
.quest-card, .vault-card { position:relative; overflow:hidden; min-height:170px; border-radius:28px; padding:20px; background:linear-gradient(180deg,#fff7d6,#ffd67a 58%,#f39a42); border:3px solid rgba(122,66,31,.42); box-shadow:inset 0 4px 0 rgba(255,255,255,.38),0 9px 0 rgba(122,66,31,.72),0 18px 40px rgba(95,49,24,.20); color:#4b2917; }
.quest-card::after, .vault-card::after { content:""; position:absolute; right:-28px; bottom:-32px; width:120px; height:120px; border-radius:42px; background:rgba(255,255,255,.22); transform:rotate(18deg); }
.quest-card strong, .vault-card strong { display:block; font-size:1.08rem; margin-bottom:8px; position:relative; z-index:1; color:#4b2917; }
.quest-card span, .vault-card span { display:block; color:rgba(75,41,23,.78); font-weight:800; line-height:1.45; position:relative; z-index:1; }
.quest-card .cost { display:inline-flex; margin:14px 0 12px; padding:7px 11px; border-radius:999px; background:rgba(255,255,255,.58); border:2px solid rgba(122,66,31,.22); font-style:normal; font-weight:950; position:relative; z-index:1; }
.quest-card button { position:relative; z-index:2; width:100%; }
.quest-card.ready { background:linear-gradient(180deg,#e9fff1,#9ff3c5 58%,#52c989); }
.quest-card.claimed { opacity:.72; filter:saturate(.88); }
.vault-card { background:linear-gradient(180deg,#efeaff,#c9bbff 58%,#8b6af6); color:#291c58; }
.vault-card.complete { background:linear-gradient(180deg,#fff7d6,#ffe08a 58%,#ffb13b); }
.vault-slots { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; position:relative; z-index:1; }
.vault-slots i { width:22px; height:22px; border-radius:7px; background:rgba(255,255,255,.45); border:2px solid rgba(41,28,88,.25); box-shadow:inset 0 -4px 0 rgba(0,0,0,.08); }
.vault-slots i.found { background:linear-gradient(135deg,#fff5a3,#ffb728); border-color:#7a421f; box-shadow:0 0 18px rgba(255,205,64,.45), inset 0 -4px 0 rgba(0,0,0,.08); }
@media (max-width:900px){ .hero-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width:620px){ .quest-grid, .vault-grid { grid-template-columns:1fr; } }

/* v1.11 Shadow Gate Expansion */
.hero-stats { grid-template-columns: repeat(auto-fit, minmax(112px, 1fr)); }


/* v1.12 Radiant Arena Expansion */
.arena-panel { position: relative; overflow: hidden; }
.arena-panel::before { content:""; position:absolute; right:28px; top:26px; width:150px; height:150px; border-radius:48px; transform:rotate(16deg); background:linear-gradient(135deg, rgba(255,238,112,.62), rgba(255,109,176,.22), rgba(54,211,255,.18)); pointer-events:none; }
.arena-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px; margin-top:20px; }
.arena-card { position:relative; overflow:hidden; min-height:190px; border-radius:28px; padding:20px; background:linear-gradient(180deg,#fff8d9,#ffe07c 56%,#ff9a55); border:3px solid rgba(122,66,31,.42); box-shadow:inset 0 4px 0 rgba(255,255,255,.42),0 9px 0 rgba(122,66,31,.72),0 18px 40px rgba(95,49,24,.20); color:#4b2917; }
.arena-card::after { content:"✹"; position:absolute; right:18px; bottom:8px; font-size:68px; line-height:1; color:rgba(255,255,255,.36); transform:rotate(12deg); }
.arena-card strong { display:block; font-size:1.1rem; margin-bottom:8px; position:relative; z-index:1; }
.arena-card span { display:block; color:rgba(75,41,23,.78); font-weight:800; line-height:1.45; position:relative; z-index:1; }
.arena-card em { display:inline-flex; margin:14px 0 12px; padding:7px 11px; border-radius:999px; background:rgba(255,255,255,.60); border:2px solid rgba(122,66,31,.20); font-style:normal; font-weight:950; position:relative; z-index:1; }
.arena-card button { position:relative; z-index:2; width:100%; }
.power-card.radiant i { color:#d97706; text-shadow:0 0 14px rgba(255,214,88,.65); }
@media (max-width:620px){ .arena-grid { grid-template-columns:1fr; } }


/* v1.13 UI Balance & Checkpoint Fix — wider main panel, compact feature card and screen-size modes */
body { display: grid; place-items: center; }
body[data-screen-size="auto"] .game-shell,
body[data-screen-size="full"] .game-shell { width: 100vw; height: 100vh; border-radius: 0; box-shadow: none; }
body[data-screen-size="wide"] .game-shell { width: min(100vw, calc(100vh * 16 / 9)); height: min(100vh, calc(100vw * 9 / 16)); border-radius: 24px; box-shadow: 0 26px 80px rgba(75,41,23,.30); }
body[data-screen-size="classic"] .game-shell { width: min(100vw, calc(100vh * 4 / 3)); height: min(100vh, calc(100vw * 3 / 4)); border-radius: 24px; box-shadow: 0 26px 80px rgba(75,41,23,.30); }
body[data-screen-size="compact"] .game-shell { width: min(1180px, 100vw); height: min(760px, 100vh); border-radius: 24px; box-shadow: 0 26px 80px rgba(75,41,23,.30); }
body[data-screen-size="wide"] .game-shell,
body[data-screen-size="classic"] .game-shell,
body[data-screen-size="compact"] .game-shell { overflow: hidden; }

.menu-stage { width: min(1160px, 96vw); grid-template-columns: minmax(0, 760px) 238px; gap: 18px; }
.hero-panel { width: min(760px, 94vw); padding: 28px 30px 30px; }
.hero-panel h1 { font-size: clamp(54px, 6vw, 92px); }
.hero-stats { grid-template-columns: repeat(auto-fit, minmax(94px, 1fr)); gap: 8px; margin-top: 16px; }
.hero-stats span { padding: 9px 8px; border-radius: 14px; font-size: 11px; }
.hero-stats strong { font-size: 15px; }
.menu-actions { width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; margin: 18px 0 14px; }
.menu-actions .primary { grid-column: 1 / -1; }
.menu-actions .btn { min-height: 42px; padding: 10px 12px; border-radius: 14px; font-size: 13px; }
.hero-panel .hint { margin-bottom: 0; font-size: 12px; line-height: 1.45; }

.premium-card.compact-card { align-self: end; padding: 18px; border-radius: 24px; max-height: 360px; animation-duration: 5.2s; }
.premium-card.compact-card strong { font-size: 18px; margin-top: 8px; }
.premium-card.compact-card p { margin: 10px 0 12px; font-size: 13px; line-height: 1.45; }
.premium-tags { display: flex; flex-wrap: wrap; gap: 7px; }
.premium-tags span { padding: 6px 9px; border-radius: 999px; background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.26); color: #fff8dd; font-size: 11px; font-weight: 950; }

.setting-note { margin: 4px 0 14px; color: #684735; line-height: 1.45; font-weight: 750; font-size: 13px; }
.setting-row select { min-width: 180px; border-radius: 14px; border: 3px solid #7a421f; padding: 10px 12px; color: #4b2917; background: linear-gradient(180deg, #fff7d6, #ffe19c); box-shadow: inset 0 2px 0 rgba(255,255,255,.55), 0 5px 0 #7a421f; font-weight: 900; outline: none; }
.setting-row select:focus { box-shadow: inset 0 2px 0 rgba(255,255,255,.55), 0 5px 0 #7a421f, 0 0 0 4px rgba(92,241,255,.30); }

@media (max-width: 1180px) { .menu-stage { grid-template-columns: 1fr; width: min(820px, 96vw); } .premium-card.compact-card { display: none; } }
@media (max-width: 760px) { body[data-screen-size] .game-shell { width: 100vw; height: 100vh; border-radius: 0; box-shadow: none; } .hero-panel { padding: 22px; } .menu-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); } .menu-actions .primary { grid-column: 1 / -1; } .setting-row { align-items: flex-start; flex-direction: column; gap: 10px; } .setting-row select { width: 100%; } }


/* v1.15 Garden Secrets Update */
.power-card.bomb { background: linear-gradient(145deg, rgba(255, 208, 150, .95), rgba(255, 118, 76, .82)); }
.journal-panel .guide-grid article { min-height: 120px; }
.mobile-controls .action-pad { grid-template-columns: repeat(2, minmax(64px, 1fr)); }
@media (max-width: 760px) { .mobile-controls .action-pad button { min-width: 64px; } }

/* v1.15.1 Styled Scrollbars — in-game UI skin */
:root {
  --ui-scroll-track: #ffe7a6;
  --ui-scroll-track-light: #fff7d6;
  --ui-scroll-thumb: #24c466;
  --ui-scroll-thumb-dark: #0e7b3d;
  --ui-scroll-thumb-hover: #ffbf3a;
  --ui-scroll-wood: #7a421f;
}

.wide-panel,
.panel,
.hud,
.shop-panel,
.power-room-panel,
.quest-panel,
.vault-panel,
.arena-panel,
.journal-panel,
.wardrobe-panel,
.profile-panel,
.settings-panel {
  scrollbar-width: thin;
  scrollbar-color: var(--ui-scroll-thumb) var(--ui-scroll-track);
  scrollbar-gutter: stable;
  overscroll-behavior: contain;
}

.wide-panel::-webkit-scrollbar,
.panel::-webkit-scrollbar,
.hud::-webkit-scrollbar,
.shop-panel::-webkit-scrollbar,
.power-room-panel::-webkit-scrollbar,
.quest-panel::-webkit-scrollbar,
.vault-panel::-webkit-scrollbar,
.arena-panel::-webkit-scrollbar,
.journal-panel::-webkit-scrollbar,
.wardrobe-panel::-webkit-scrollbar,
.profile-panel::-webkit-scrollbar,
.settings-panel::-webkit-scrollbar {
  width: 18px;
  height: 16px;
}

.wide-panel::-webkit-scrollbar-track,
.panel::-webkit-scrollbar-track,
.hud::-webkit-scrollbar-track,
.shop-panel::-webkit-scrollbar-track,
.power-room-panel::-webkit-scrollbar-track,
.quest-panel::-webkit-scrollbar-track,
.vault-panel::-webkit-scrollbar-track,
.arena-panel::-webkit-scrollbar-track,
.journal-panel::-webkit-scrollbar-track,
.wardrobe-panel::-webkit-scrollbar-track,
.profile-panel::-webkit-scrollbar-track,
.settings-panel::-webkit-scrollbar-track {
  border-radius: 999px;
  background: linear-gradient(180deg, var(--ui-scroll-track-light), var(--ui-scroll-track));
  box-shadow: inset 0 0 0 3px rgba(122, 66, 31, .58), inset 0 3px 0 rgba(255,255,255,.56), inset 0 -3px 0 rgba(122,66,31,.16);
}

.wide-panel::-webkit-scrollbar-thumb,
.panel::-webkit-scrollbar-thumb,
.hud::-webkit-scrollbar-thumb,
.shop-panel::-webkit-scrollbar-thumb,
.power-room-panel::-webkit-scrollbar-thumb,
.quest-panel::-webkit-scrollbar-thumb,
.vault-panel::-webkit-scrollbar-thumb,
.arena-panel::-webkit-scrollbar-thumb,
.journal-panel::-webkit-scrollbar-thumb,
.wardrobe-panel::-webkit-scrollbar-thumb,
.profile-panel::-webkit-scrollbar-thumb,
.settings-panel::-webkit-scrollbar-thumb {
  min-height: 64px;
  border-radius: 999px;
  border: 4px solid var(--ui-scroll-track);
  background: linear-gradient(180deg, #7af7a0, var(--ui-scroll-thumb) 58%, #109549);
  box-shadow: inset 0 3px 0 rgba(255,255,255,.42), inset 0 -4px 0 rgba(0,0,0,.16), 0 0 0 2px rgba(14,123,61,.72);
}

.wide-panel::-webkit-scrollbar-thumb:hover,
.panel::-webkit-scrollbar-thumb:hover,
.hud::-webkit-scrollbar-thumb:hover,
.shop-panel::-webkit-scrollbar-thumb:hover,
.power-room-panel::-webkit-scrollbar-thumb:hover,
.quest-panel::-webkit-scrollbar-thumb:hover,
.vault-panel::-webkit-scrollbar-thumb:hover,
.arena-panel::-webkit-scrollbar-thumb:hover,
.journal-panel::-webkit-scrollbar-thumb:hover,
.wardrobe-panel::-webkit-scrollbar-thumb:hover,
.profile-panel::-webkit-scrollbar-thumb:hover,
.settings-panel::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #fff36b, var(--ui-scroll-thumb-hover));
  box-shadow: inset 0 3px 0 rgba(255,255,255,.52), inset 0 -4px 0 rgba(0,0,0,.12), 0 0 0 2px var(--ui-scroll-wood);
}

.wide-panel::-webkit-scrollbar-button,
.panel::-webkit-scrollbar-button,
.hud::-webkit-scrollbar-button,
.shop-panel::-webkit-scrollbar-button,
.power-room-panel::-webkit-scrollbar-button,
.quest-panel::-webkit-scrollbar-button,
.vault-panel::-webkit-scrollbar-button,
.arena-panel::-webkit-scrollbar-button,
.journal-panel::-webkit-scrollbar-button,
.wardrobe-panel::-webkit-scrollbar-button,
.profile-panel::-webkit-scrollbar-button,
.settings-panel::-webkit-scrollbar-button {
  width: 0;
  height: 0;
  display: none;
}

.wide-panel::-webkit-scrollbar-corner,
.panel::-webkit-scrollbar-corner,
.hud::-webkit-scrollbar-corner,
.shop-panel::-webkit-scrollbar-corner,
.power-room-panel::-webkit-scrollbar-corner,
.quest-panel::-webkit-scrollbar-corner,
.vault-panel::-webkit-scrollbar-corner,
.arena-panel::-webkit-scrollbar-corner,
.journal-panel::-webkit-scrollbar-corner,
.wardrobe-panel::-webkit-scrollbar-corner,
.profile-panel::-webkit-scrollbar-corner,
.settings-panel::-webkit-scrollbar-corner {
  background: transparent;
}

@media (max-width: 760px) {
  .wide-panel::-webkit-scrollbar,
  .panel::-webkit-scrollbar,
  .hud::-webkit-scrollbar {
    width: 12px;
    height: 12px;
  }
  .wide-panel::-webkit-scrollbar-thumb,
  .panel::-webkit-scrollbar-thumb,
  .hud::-webkit-scrollbar-thumb {
    border-width: 3px;
  }
}



/* v1.15.2 Notification & Pickup Fix */
.toast {
  left: auto !important;
  right: 28px;
  top: 92px;
  bottom: auto !important;
  max-width: min(360px, calc(100vw - 56px));
  transform: translateX(18px) translateY(0) scale(.98) !important;
  opacity: 0;
  text-align: left;
  padding: 10px 14px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(255,247,214,.82), rgba(255,225,156,.76));
  color: #4b2917;
  border: 3px solid rgba(122,66,31,.74);
  box-shadow: 0 5px 0 rgba(122,66,31,.72), 0 14px 34px rgba(75,41,23,.18);
  backdrop-filter: blur(8px);
  font-size: .92rem;
  line-height: 1.25;
}
.toast.show {
  opacity: .92;
  transform: translateX(0) translateY(0) scale(1) !important;
}
.toast.toast-gameplay {
  top: 78px;
  right: 22px;
  opacity: 0;
  background: linear-gradient(180deg, rgba(255,247,214,.64), rgba(255,225,156,.52));
  border-color: rgba(122,66,31,.54);
  box-shadow: 0 4px 0 rgba(122,66,31,.46), 0 10px 26px rgba(75,41,23,.12);
  max-width: 300px;
}
.toast.toast-gameplay.show { opacity: .76; }
@media (max-width: 760px) {
  .toast,
  .toast.toast-gameplay {
    top: auto;
    right: 14px;
    bottom: 104px !important;
    max-width: min(310px, calc(100vw - 28px));
    font-size: .84rem;
    padding: 9px 12px;
  }
}

.level-card .level-medal { display:inline-flex; width:max-content; margin-top:8px; padding:5px 9px; border-radius:999px; background:linear-gradient(180deg,#fff5c7,#ffd76b); border:2px solid rgba(122,66,31,.22); color:#6d371f; font-size:10px; font-weight:950; box-shadow:inset 0 2px 0 rgba(255,255,255,.45); }


/* v1.21.2 Menu Polish Fix */
.panel-head {
  position: sticky;
  top: -6px;
  z-index: 6;
  padding-bottom: 10px;
  margin-bottom: 18px;
  background: linear-gradient(180deg, rgba(255,250,218,.96), rgba(255,250,218,.92) 78%, rgba(255,250,218,0));
}
.panel-head > div,
.panel-head > button { position: relative; z-index: 2; }
.wide-panel,
.settings-panel,
.daily-panel,
.power-room-panel,
.shop-panel,
.arena-panel,
.wardrobe-panel,
.quest-panel,
.vault-panel,
.journal-panel,
.profile-panel {
  max-height: 88vh;
  overflow-y: auto;
}
.power-room-panel,
.shop-panel,
.arena-panel,
.wardrobe-panel,
.quest-panel,
.vault-panel,
.journal-panel,
.profile-panel {
  position: relative;
  padding-right: 14px;
}
.power-room-panel::before,
.shop-panel::before,
.arena-panel::before,
.wardrobe-panel::before {
  z-index: 0;
  pointer-events: none;
}
.power-room-panel > *,
.shop-panel > *,
.arena-panel > *,
.wardrobe-panel > *,
.quest-panel > *,
.vault-panel > *,
.journal-panel > *,
.profile-panel > *,
.daily-panel > * {
  position: relative;
  z-index: 1;
}
.arena-panel::before {
  content: "";
  position: absolute;
  right: 20px;
  top: 22px;
  width: 130px;
  height: 130px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,214,88,.50), rgba(255,116,198,.16) 58%, transparent 72%);
}
.wardrobe-panel::before {
  content: "";
  position: absolute;
  right: 24px;
  top: 26px;
  width: 154px;
  height: 154px;
  border-radius: 44px;
  background: radial-gradient(circle, rgba(255,213,88,.46), rgba(255,111,179,.18) 58%, transparent 74%);
}
.wardrobe-panel::after {
  content: "";
  position: absolute;
  left: 24px;
  bottom: 18px;
  width: 180px;
  height: 70px;
  border-radius: 50%;
  background: rgba(52,209,104,.10);
  pointer-events: none;
}
.wardrobe-grid {
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 18px;
}
.skin-card {
  min-height: 282px;
  border: 3px solid rgba(122,66,31,.32);
  box-shadow: inset 0 4px 0 rgba(255,255,255,.45), 0 8px 0 rgba(122,66,31,.72), 0 20px 38px rgba(95,49,24,.18);
}
.skin-card:hover {
  transform: translateY(-5px);
  box-shadow: inset 0 4px 0 rgba(255,255,255,.45), 0 12px 0 rgba(122,66,31,.72), 0 24px 42px rgba(95,49,24,.22);
}
.skin-preview {
  height: 132px;
  border-radius: 24px;
  background: linear-gradient(180deg, #7fdcff 0%, #b8f4ff 57%, #ffe1a4 58%, #ffe1a4 100%);
  box-shadow: inset 0 3px 0 rgba(255,255,255,.55), 0 6px 0 rgba(122,66,31,.18);
}
.skin-preview::after {
  content: "";
  position: absolute;
  left: 14px;
  top: 14px;
  width: 52px;
  height: 20px;
  border-radius: 999px;
  background: rgba(255,255,255,.55);
  box-shadow: 26px 8px 0 0 rgba(255,255,255,.45);
}
.skin-card strong { font-size: 1.08rem; }
.skin-card button { width: 100%; }
.daily-panel { text-align: center; }
.daily-panel .panel-head { align-items: flex-start; text-align: left; }
.daily-panel .panel-head > div { flex: 1; text-align: left; }
.story-panel .eyebrow { color: #fff8dd !important; }
.cinematic-panel {
  width: min(900px, 95vw);
  padding: 28px 28px 30px;
}
.cinematic-panel h2 {
  font-size: clamp(28px, 4vw, 46px);
  line-height: 1.02;
}
.cinematic-lead {
  max-width: 760px;
  margin: 0 auto;
  font-size: 15px;
  line-height: 1.6;
}
.intro-game-stage {
  height: 212px;
  margin: 10px auto 18px;
}
.level-intro-panel {
  width: min(860px, 96vw);
  text-align: left;
  padding: 30px 34px 32px;
}
.level-intro-panel h2 {
  font-size: clamp(28px, 4vw, 44px);
}
.level-intro-panel::before,
.cinematic-panel::before,
.victory-panel::before {
  inset: -2px;
  border-radius: inherit;
}
.level-intro-panel::after {
  left: 0;
  right: 0;
  bottom: -34px;
  height: 96px;
}
.intro-objectives {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  justify-content: stretch;
  gap: 10px;
  margin: 18px 0 24px;
}
.intro-objectives span {
  text-align: center;
}
@media (max-width: 760px) {
  .intro-objectives { grid-template-columns: 1fr; }
  .wide-panel,
  .settings-panel,
  .daily-panel,
  .power-room-panel,
  .shop-panel,
  .arena-panel,
  .wardrobe-panel,
  .quest-panel,
  .vault-panel,
  .journal-panel,
  .profile-panel { max-height: 90vh; }
  .panel-head { top: -2px; }
  .wardrobe-grid { grid-template-columns: 1fr; }
  .cinematic-panel h2 { font-size: clamp(26px, 7vw, 36px); }
  .level-intro-panel { padding: 24px; }
}


/* v1.22 Boss & Save Slots Update */
.save-slots-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 18px;
  margin-top: 18px;
}
.save-slot-card {
  position: relative;
  overflow: hidden;
  min-height: 260px;
  padding: 20px;
  border-radius: 28px;
  background: linear-gradient(180deg, #fff7d6, #ffd67a 58%, #f39a42);
  border: 3px solid rgba(122,66,31,.42);
  box-shadow: inset 0 4px 0 rgba(255,255,255,.42), 0 9px 0 rgba(122,66,31,.72), 0 18px 40px rgba(95,49,24,.20);
  color: #4b2917;
}
.save-slot-card::after {
  content: "";
  position: absolute;
  right: -24px;
  bottom: -26px;
  width: 120px;
  height: 120px;
  border-radius: 42px;
  background: rgba(255,255,255,.20);
  transform: rotate(18deg);
}
.save-slot-card.active-slot {
  outline: 4px solid rgba(255,214,88,.62);
  box-shadow: inset 0 4px 0 rgba(255,255,255,.42), 0 10px 0 rgba(122,66,31,.72), 0 22px 42px rgba(95,49,24,.24), 0 0 0 6px rgba(82,201,137,.18);
}
.save-slot-card h3,
.save-slot-card p,
.save-slot-card ul,
.save-slot-card .slot-actions,
.save-slot-card .slot-badge { position: relative; z-index: 1; }
.save-slot-card h3 { margin: 0 0 6px; font-size: 1.2rem; color: #4b2917; }
.save-slot-card p { margin: 0 0 10px; color: rgba(75,41,23,.75); font-weight: 750; }
.save-slot-card ul { list-style: none; padding: 0; margin: 0 0 14px; display: grid; gap: 6px; }
.save-slot-card li { padding: 8px 10px; border-radius: 14px; background: rgba(255,255,255,.42); border: 2px solid rgba(122,66,31,.14); font-weight: 850; }
.save-slot-card .slot-badge { display: inline-flex; margin-bottom: 10px; }
.save-slot-card .slot-actions { display: grid; gap: 10px; margin-top: 10px; }
.save-slot-card .slot-actions .btn { width: 100%; }

/* v1.23 Player Hub, World Gates & Mobile Modes */
.menu-profile-card {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin: 16px 0 4px;
}
.menu-profile-card > div {
  padding: 10px 12px;
  border-radius: 16px;
  background: linear-gradient(180deg, #fff7d6, #ffe19c);
  border: 3px solid #9b5a2e;
  box-shadow: inset 0 3px 0 rgba(255,255,255,.54), 0 6px 0 #704027;
  color: #4b2917;
}
.menu-profile-card span {
  display: block;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .09em;
  font-weight: 950;
  color: #0e7b3d;
}
.menu-profile-card strong {
  display: block;
  margin-top: 4px;
  font-size: 16px;
  color: #5b321f;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.world-gates-panel { position: relative; overflow-y: auto; }
.world-gates-panel::before {
  content: "";
  position: absolute;
  right: 28px;
  top: 26px;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,214,88,.45), rgba(82,201,137,.14) 58%, transparent 74%);
  z-index: 0;
  pointer-events: none;
}
.world-gates-panel > * { position: relative; z-index: 1; }
.world-wallet {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 14px 0 20px;
  padding: 12px;
  border-radius: 22px;
  background: linear-gradient(180deg,#fff7d6,#ffd67a);
  border: 3px solid #7a421f;
  box-shadow: 0 7px 0 #7a421f;
  color: #4b2917;
  font-weight: 950;
}
.world-wallet strong { font-size: 24px; margin-right: auto; }
.world-gates-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 18px;
}
.world-gate-card {
  position: relative;
  overflow: hidden;
  min-height: 250px;
  padding: 20px;
  border-radius: 28px;
  background: linear-gradient(180deg,#fff7d6,#ffd67a 58%,#f39a42);
  border: 3px solid rgba(122,66,31,.42);
  box-shadow: inset 0 4px 0 rgba(255,255,255,.42), 0 9px 0 rgba(122,66,31,.72), 0 18px 40px rgba(95,49,24,.20);
  color: #4b2917;
}
.world-gate-card::after {
  content: "";
  position: absolute;
  right: -24px;
  bottom: -24px;
  width: 118px;
  height: 118px;
  border-radius: 38px;
  background: rgba(255,255,255,.20);
  transform: rotate(18deg);
}
.world-gate-card.unlocked { background: linear-gradient(180deg,#e9fff1,#9ff3c5 58%,#52c989); }
.world-gate-card.locked { filter: saturate(.96); }
.world-gate-card h3,
.world-gate-card p,
.world-gate-card ul,
.world-gate-card .world-actions,
.world-gate-card .world-badge { position: relative; z-index: 1; }
.world-gate-card h3 { margin: 0 0 8px; font-size: 1.18rem; }
.world-gate-card p { margin: 0 0 12px; color: rgba(75,41,23,.76); font-weight: 780; line-height: 1.45; }
.world-gate-card ul { list-style: none; padding: 0; margin: 0 0 14px; display: grid; gap: 7px; }
.world-gate-card li { padding: 8px 10px; border-radius: 14px; background: rgba(255,255,255,.42); border: 2px solid rgba(122,66,31,.14); font-weight: 850; }
.world-gate-card .world-badge { display: inline-flex; margin-bottom: 10px; }
.world-actions { display: grid; gap: 10px; }
.world-actions .btn { width: 100%; }
.setting-row input[type="text"] {
  min-width: 190px;
  border-radius: 14px;
  border: 3px solid #7a421f;
  padding: 10px 12px;
  color: #4b2917;
  background: linear-gradient(180deg, #fff7d6, #ffe19c);
  box-shadow: inset 0 2px 0 rgba(255,255,255,.55), 0 5px 0 #7a421f;
  font-weight: 900;
  outline: none;
}
.setting-row input[type="text"]:focus {
  box-shadow: inset 0 2px 0 rgba(255,255,255,.55), 0 5px 0 #7a421f, 0 0 0 4px rgba(92,241,255,.30);
}
body[data-screen-size="tablet"] .game-shell { width: min(100vw, calc(100vh * 3 / 4)); height: min(100vh, calc(100vw * 4 / 3)); border-radius: 24px; box-shadow: 0 26px 80px rgba(75,41,23,.30); }
body[data-screen-size="square"] .game-shell { width: min(100vw, 100vh); height: min(100vw, 100vh); border-radius: 24px; box-shadow: 0 26px 80px rgba(75,41,23,.30); }
body[data-screen-size="phone"] .game-shell { width: min(100vw, calc(100vh * 9 / 16)); height: min(100vh, calc(100vw * 16 / 9)); border-radius: 24px; box-shadow: 0 26px 80px rgba(75,41,23,.30); }
body[data-screen-size="phoneTall"] .game-shell { width: min(100vw, calc(100vh * 9 / 19.5)); height: min(100vh, calc(100vw * 19.5 / 9)); border-radius: 24px; box-shadow: 0 26px 80px rgba(75,41,23,.30); }
body[data-screen-size="tablet"] .game-shell,
body[data-screen-size="square"] .game-shell,
body[data-screen-size="phone"] .game-shell,
body[data-screen-size="phoneTall"] .game-shell { overflow: hidden; }
.game-shell.is-playing.is-touch .mobile-controls { display: flex; z-index: 22; }
.game-shell.is-playing .mobile-controls { z-index: 22; }
.game-shell:not(.is-playing) .mobile-controls { display: none !important; }
@media (hover: none), (pointer: coarse), (max-width: 900px) {
  .game-shell.is-playing .mobile-controls { display: flex; }
}
@media (max-width: 760px) {
  body[data-screen-size="phone"] .game-shell,
  body[data-screen-size="phoneTall"] .game-shell,
  body[data-screen-size="tablet"] .game-shell,
  body[data-screen-size="square"] .game-shell { width: 100vw; height: 100vh; border-radius: 0; box-shadow: none; }
  .screen { padding: 10px; align-items: start; }
  .screen.active { place-items: start center; }
  .menu-stage { width: 100%; padding: 4px 0 118px; align-items: start; }
  .hero-panel { width: 100%; max-height: calc(100vh - 128px); overflow-y: auto; padding: 18px; text-align: center; }
  .hero-panel h1 { font-size: clamp(46px, 16vw, 68px); }
  .menu-profile-card { grid-template-columns: 1fr; gap: 8px; }
  .hero-stats { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .menu-actions { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 8px; }
  .menu-actions .primary { grid-column: 1 / -1; }
  .menu-actions .btn { min-height: 40px; padding: 9px 8px; font-size: 12px; }
  .world-wallet { display: grid; grid-template-columns: 1fr; }
  .world-wallet strong { margin-right: 0; }
  .mobile-controls { left: 10px; right: 10px; bottom: max(12px, env(safe-area-inset-bottom)); gap: 8px; }
  .mobile-controls .pad { gap: 6px; }
  .mobile-controls .pad button { width: 54px; height: 52px; border-radius: 18px; font-size: 12px; }
  .mobile-controls .pad button[data-control="down"] { width: 70px; font-size: 11px; }
  .mobile-controls .action-pad button { width: 62px; min-width: 62px; }
  .mobile-controls .jump { width: 76px !important; }
}


/* v1.23.1 Gameplay & Mobile Fix */
.panel-head {
  position: relative !important;
  top: auto !important;
  z-index: 5 !important;
  background: transparent !important;
  padding: 0 !important;
}
.panel-head > div,
.panel-head > button {
  position: relative;
  z-index: 6;
}
.settings-panel {
  padding: 34px 40px !important;
}
.settings-panel .panel-head {
  margin-bottom: 20px;
}
.setting-row {
  padding: 14px 16px !important;
  border-radius: 18px;
  margin: 12px 0 14px !important;
  border-bottom: 0 !important;
}
.setting-row > span {
  padding-left: 4px;
  line-height: 1.35;
}
.setting-row input[type="text"],
.setting-row select {
  width: min(280px, 100%);
}
.power-room-panel::before,
.shop-panel::before,
.arena-panel::before,
.wardrobe-panel::before,
.world-gates-panel::before {
  z-index: 0 !important;
  pointer-events: none !important;
}
.power-room-panel > *,
.shop-panel > *,
.arena-panel > *,
.wardrobe-panel > *,
.world-gates-panel > * {
  position: relative;
  z-index: 1;
}
/* Vault card highlight/shadow order fix. */
.vault-card {
  background: linear-gradient(180deg, #efeaff 0%, #c9bbff 58%, #8b6af6 100%) !important;
  border-color: rgba(63,47,150,.60) !important;
  box-shadow: inset 0 4px 0 rgba(255,255,255,.48), inset 0 -8px 0 rgba(49,33,110,.18), 0 9px 0 rgba(63,47,150,.72), 0 18px 40px rgba(49,33,110,.20) !important;
}
.vault-card.complete {
  background: linear-gradient(180deg,#fff7d6 0%,#ffe08a 58%,#ffb13b 100%) !important;
  border-color: rgba(122,66,31,.48) !important;
  box-shadow: inset 0 4px 0 rgba(255,255,255,.48), inset 0 -8px 0 rgba(122,66,31,.15), 0 9px 0 rgba(122,66,31,.72), 0 18px 40px rgba(95,49,24,.20) !important;
}
.vault-slots i {
  box-shadow: inset 0 3px 0 rgba(255,255,255,.48), inset 0 -4px 0 rgba(0,0,0,.10) !important;
}
.vault-slots i.found {
  box-shadow: inset 0 3px 0 rgba(255,255,255,.58), inset 0 -4px 0 rgba(122,66,31,.16), 0 0 18px rgba(255,205,64,.45) !important;
}
/* Firefly bridges now render higher in the tile and use stronger visible contrast. */
/* Mobile controls: force show during gameplay on touch and narrow screens. */
.game-shell.is-playing.is-touch .mobile-controls {
  display: flex !important;
  opacity: 1 !important;
  visibility: visible !important;
  z-index: 40 !important;
}
@media (hover: none), (pointer: coarse), (max-width: 980px) {
  .game-shell.is-playing .mobile-controls {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    z-index: 40 !important;
  }
}
body[data-screen-size="phone"] .screen,
body[data-screen-size="phoneTall"] .screen {
  padding: 10px;
}
body[data-screen-size="phone"] .screen.active,
body[data-screen-size="phoneTall"] .screen.active {
  place-items: start center;
  overflow-y: auto;
}
body[data-screen-size="phone"] .hero-panel,
body[data-screen-size="phoneTall"] .hero-panel {
  width: 100%;
  max-height: calc(100vh - 116px);
  overflow-y: auto;
  padding: 18px !important;
}
body[data-screen-size="phone"] .menu-stage,
body[data-screen-size="phoneTall"] .menu-stage {
  width: 100%;
  padding-bottom: 116px;
  align-items: start;
}
body[data-screen-size="phone"] .menu-profile-card,
body[data-screen-size="phoneTall"] .menu-profile-card {
  grid-template-columns: 1fr;
}
body[data-screen-size="phone"] .menu-actions,
body[data-screen-size="phoneTall"] .menu-actions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}
body[data-screen-size="phone"] .menu-actions .btn,
body[data-screen-size="phoneTall"] .menu-actions .btn {
  min-height: 40px;
  padding: 9px 8px;
  font-size: 12px;
}
@media (max-width: 760px) {
  .settings-panel { padding: 22px !important; }
  .setting-row { align-items: stretch !important; }
  .setting-row input[type="text"], .setting-row select { width: 100%; }
}


/* v1.24 Realm Tunnels & Blaze Hazards */
.tunnel-color-guide {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 10px;
  margin-top: 14px;
}
.tunnel-color-guide span {
  padding: 9px 11px;
  border-radius: 999px;
  border: 2px solid rgba(122,66,31,.28);
  background: linear-gradient(180deg, #fff7d6, #ffe19c);
  font-weight: 900;
}


/* v1.24.1 Strict Gameplay & UI Fix — real menu fit + unified highlight/shadow */
:root {
  --ui-top-light: rgba(255,255,255,.55);
  --ui-bottom-shade: rgba(88,48,22,.18);
  --ui-drop-wood: rgba(112,64,39,.78);
}
/* Normalize button/card depth: light highlight on top, darker weight on bottom. */
.btn,
.hero-stats span,
.guide-grid article,
.story-grid article,
.achievement,
.cinematic-scenes article,
.level-card,
.setting-row,
.skin-card,
.shop-card,
.power-card,
.quest-card,
.vault-card,
.arena-card,
.world-gate-card,
.save-slot-card,
.profile-stats article,
.profile-badges article,
.shop-wallet,
.world-wallet,
.menu-profile-card > div,
.premium-tags span {
  box-shadow: inset 0 4px 0 var(--ui-top-light), inset 0 -7px 0 var(--ui-bottom-shade), 0 7px 0 var(--ui-drop-wood), 0 18px 34px rgba(95,49,24,.16) !important;
}
.btn:hover,
.level-card:hover,
.skin-card:hover {
  box-shadow: inset 0 4px 0 var(--ui-top-light), inset 0 -7px 0 var(--ui-bottom-shade), 0 10px 0 var(--ui-drop-wood), 0 22px 38px rgba(95,49,24,.20) !important;
}
/* Keep decorative glow under content, without sticky white header overlays. */
.panel-head {
  position: relative !important;
  top: auto !important;
  z-index: 10 !important;
  background: transparent !important;
  padding: 0 !important;
}
.panel-head::before { display: none !important; }
.panel-head > div,
.panel-head > button { position: relative; z-index: 12 !important; }
.power-room-panel::before,
.shop-panel::before,
.arena-panel::before,
.wardrobe-panel::before,
.world-gates-panel::before,
.save-slots-panel::before {
  z-index: 0 !important;
  pointer-events: none !important;
}
.power-room-panel > *,
.shop-panel > *,
.arena-panel > *,
.wardrobe-panel > *,
.world-gates-panel > *,
.save-slots-panel > * {
  position: relative;
  z-index: 2;
}
/* Desktop homepage must fit a 1920×1200 display at 100% zoom. */
@media (min-width: 1000px) and (min-height: 760px) {
  #screen-main.screen { padding: 18px 26px 120px; place-items: center; }
  #screen-main .menu-stage {
    width: min(1420px, 96vw);
    max-height: calc(100vh - 48px);
    grid-template-columns: minmax(0, 940px) 270px;
    gap: 16px;
    align-items: center;
    padding-bottom: 0;
  }
  #screen-main .hero-panel {
    width: 100%;
    max-height: calc(100vh - 72px);
    overflow-y: auto;
    padding: 20px 24px 22px;
  }
  #screen-main .hero-panel h1 { font-size: clamp(48px, 4.2vw, 76px); line-height: .82; }
  #screen-main .subtitle { margin-top: 4px; font-size: 15px; }
  #screen-main .eyebrow { padding: 5px 10px; font-size: 10px; margin-bottom: 6px; }
  #screen-main .menu-profile-card { margin: 10px 0 6px; gap: 7px; }
  #screen-main .menu-profile-card > div { padding: 8px 10px; }
  #screen-main .menu-profile-card strong { font-size: 14px; }
  #screen-main .hero-stats { grid-template-columns: repeat(6, minmax(0,1fr)); gap: 7px; margin-top: 10px; }
  #screen-main .hero-stats span { padding: 7px 6px; border-radius: 12px; font-size: 10px; }
  #screen-main .hero-stats strong { font-size: 13px; }
  #screen-main .menu-actions { grid-template-columns: repeat(4, minmax(0,1fr)); gap: 7px; margin: 12px 0 10px; }
  #screen-main .menu-actions .primary { grid-column: span 2; }
  #screen-main .menu-actions .btn { min-height: 36px; padding: 8px 9px; border-radius: 12px; font-size: 12px; }
  #screen-main .hero-panel .hint { font-size: 11px; line-height: 1.35; }
  #screen-main .premium-card.compact-card { max-height: calc(100vh - 190px); padding: 16px; }
  #screen-main .premium-card.compact-card p { font-size: 12px; line-height: 1.35; }
}
@media (min-width: 1600px) and (min-height: 1000px) {
  #screen-main .menu-actions .btn { min-height: 38px; }
  #screen-main .hero-stats span { padding: 8px 7px; }
}
/* Firefly bridge cards/guide wording is in JS; canvas bridge positions are elevated by parser. */


/* v1.24.2 Header & Level Theme Polish */
.menu-stage {
  width: min(1180px, 96vw) !important;
  grid-template-columns: minmax(0, 700px) 250px !important;
  gap: 18px !important;
  align-items: start !important;
}
.menu-topbar {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: minmax(240px, 1fr) minmax(320px, 420px) minmax(260px, 1fr);
  align-items: center;
  gap: 16px;
  margin-bottom: 14px;
  position: relative;
  z-index: 2;
}
.glass-pill {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 72px;
  padding: 12px 16px;
  border-radius: 28px;
  background: linear-gradient(180deg, rgba(5,24,44,.40), rgba(9,35,70,.32));
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 18px 38px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: none;
}
.topbar-player { justify-self: start; }
.topbar-avatar {
  width: 48px; height: 48px; border-radius: 50%; flex: 0 0 48px;
  display: grid; place-items: center;
  font-weight: 1000; color: #fff8dd; font-size: 24px;
  background: linear-gradient(180deg, #ffcf5a, #ff8f2d);
  border: 3px solid rgba(255,255,255,.24);
  box-shadow: inset 0 3px 0 rgba(255,255,255,.35), 0 6px 18px rgba(0,0,0,.2);
}
.topbar-player-copy { display:flex; flex-direction:column; gap:4px; }
.topbar-player-copy strong, .currency-pill strong, .topbar-logo strong { color:#fff; font-weight:1000; letter-spacing:-.02em; }
.topbar-player-copy span, .currency-pill span, .topbar-logo span { color: rgba(240,248,255,.84); font-weight:800; }
.topbar-logo { justify-self: center; justify-content:center; flex-direction:column; gap:2px; text-align:center; padding-inline: 26px; }
.topbar-logo strong { font-size: clamp(32px, 3vw, 52px); line-height: .95; text-shadow: 0 2px 0 rgba(255,255,255,.08), 0 10px 20px rgba(0,0,0,.2); }
.topbar-logo span { letter-spacing:.12em; text-transform: uppercase; font-size: 12px; }
.topbar-actions { justify-self: end; display:flex; align-items:center; gap:12px; }
.currency-pill { min-width: 174px; justify-content:space-between; gap:14px; }
.icon-btn {
  width: 56px; height: 56px; border-radius: 50%; border: 0; cursor: pointer;
  display:grid; place-items:center; font-size: 24px; color: #fff;
  background: linear-gradient(180deg, rgba(5,24,44,.46), rgba(9,35,70,.36));
  border: 1px solid rgba(255,255,255,.18);
  box-shadow: 0 16px 32px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.18);
  backdrop-filter: none;
}
.icon-btn:hover { transform: translateY(-2px); }
.hero-panel { text-align: left; width: min(700px, 100%) !important; }
.hero-panel .menu-profile-card { display:none !important; }
#screen-main .hero-panel {
  max-height: calc(100vh - 180px) !important;
  overflow-y: auto;
  padding: 24px 26px 24px !important;
}
#screen-main .hero-panel h1 { font-size: clamp(52px, 5vw, 82px) !important; }
#screen-main .hero-stats { grid-template-columns: repeat(4, minmax(0,1fr)) !important; }
#screen-main .menu-actions { grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: 8px !important; }
#screen-main .menu-actions .primary { grid-column: span 3 !important; }
#screen-main .premium-card.compact-card { align-self: start; margin-top: 6px; max-height: calc(100vh - 190px); }
.level-card { padding: 16px 16px 16px 16px; }
.level-card::after {
  width: 58px !important; height: 34px !important; right: -8px !important; bottom: -2px !important;
  border-radius: 18px 18px 8px 8px !important; opacity: .88 !important;
  z-index: 0;
}
.level-card > * { position: relative; z-index: 1; }
.level-card span:last-of-type, .level-card em, .level-card .level-medal, .level-card small { position: relative; z-index:1; }
.level-card.theme-green::after { background: linear-gradient(180deg, #35e08a 0 14px, #13a865 15px 100%) !important; }
.level-card.theme-lava::after { background: linear-gradient(180deg, #ffb255 0 14px, #ef5933 15px 100%) !important; }
.level-card.theme-frost::after { background: linear-gradient(180deg, #9fe9ff 0 14px, #5cb4ff 15px 100%) !important; }
.level-card.theme-root::after { background: linear-gradient(180deg, #e6c07d 0 14px, #9b6d32 15px 100%) !important; }
.level-card.theme-sky::after { background: linear-gradient(180deg, #87f0b1 0 14px, #3ab6ff 15px 100%) !important; }
.level-card.theme-moon::after { background: linear-gradient(180deg, #cbb5ff 0 14px, #7d5bff 15px 100%) !important; }
.level-card.theme-firefly::after { background: linear-gradient(180deg, #ffe67a 0 14px, #70c83e 15px 100%) !important; }
.level-card.theme-shadow::after { background: linear-gradient(180deg, #f18cff 0 14px, #5f3cc8 15px 100%) !important; }
.level-card.theme-desert::after { background: linear-gradient(180deg, #ffe37b 0 14px, #f09c40 15px 100%) !important; }
.level-card:hover, .skin-card:hover, .btn:hover {
  box-shadow: 0 16px 26px rgba(95,49,24,.14), inset 0 3px 0 rgba(255,255,255,.52) !important;
}
.btn, .hero-stats span, .guide-grid article, .story-grid article, .achievement, .cinematic-scenes article, .level-card, .setting-row, .shop-card, .skin-card, .vault-card, .quest-card, .arena-card, .save-slot-card, .world-card, .menu-profile-card > div, .premium-tags span {
  box-shadow: inset 0 3px 0 rgba(255,255,255,.54), 0 7px 0 #704027, 0 12px 20px rgba(95,49,24,.10) !important;
}
@media (min-width: 1000px) and (min-height: 760px) {
  #screen-main.screen { padding: 18px 26px 116px !important; }
  #screen-main .menu-stage { width: min(1180px, 96vw) !important; grid-template-columns: minmax(0,700px) 250px !important; max-height: none !important; }
}
@media (max-width: 1180px) {
  .menu-topbar { grid-template-columns: 1fr; }
  .topbar-logo { order: -1; }
  .topbar-actions, .topbar-player { justify-self: stretch; }
  .topbar-actions { justify-content: flex-start; }
}
@media (max-width: 760px) {
  .menu-topbar { gap: 10px; }
  .glass-pill { min-height: 62px; padding: 10px 12px; border-radius: 22px; }
  .topbar-logo strong { font-size: clamp(26px, 10vw, 40px); }
  .topbar-actions { gap: 8px; flex-wrap: wrap; }
  .icon-btn { width: 48px; height: 48px; font-size: 20px; }
  .currency-pill { min-width: 152px; }
  #screen-main .hero-panel { max-height: calc(100vh - 220px) !important; }
  #screen-main .hero-stats { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  #screen-main .menu-actions { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  #screen-main .menu-actions .primary { grid-column: 1 / -1 !important; }
}

/* v1.25.0 Tunnel/Firefly/Swim + premium header/shop final polish */
:root {
  --berrigo-glass: linear-gradient(180deg, rgba(5,24,44,.42), rgba(9,35,70,.30));
  --berrigo-gold: #ffd45f;
  --berrigo-cream: #fff8dd;
}

/* Homepage tags: back to the clean outlined version. */
.premium-tags span {
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  color: #fff !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

/* Buttons: restore the lighter previous hover feel; cards keep the stronger hover. */
.btn {
  box-shadow: inset 0 2px 0 rgba(255,255,255,.38), 0 8px 18px rgba(95,49,24,.10) !important;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}
.btn:hover {
  transform: translateY(-2px) !important;
  filter: brightness(1.035) saturate(1.04) !important;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.44), 0 12px 24px rgba(95,49,24,.14) !important;
}
.level-card:hover,
.skin-card:hover,
.shop-card:hover,
.vault-card:hover,
.quest-card:hover,
.arena-card:hover,
.save-slot-card:hover,
.world-card:hover,
.achievement:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 30px rgba(95,49,24,.16), inset 0 3px 0 rgba(255,255,255,.52) !important;
}
#screen-main .menu-stage > * { position: relative; z-index: 1; }

/* Rounded panels: keep scrollbar visually inside straight content area, not over rounded corners. */
.panel,
.hero-panel,
.wide-panel,
.premium-card,
.compact-card,
.shop-panel,
.wardrobe-panel,
.world-gates-panel,
.save-slots-panel,
.power-room-panel,
.arena-panel,
.relic-vault-panel,
.quest-board-panel {
  scrollbar-gutter: stable;
  clip-path: inset(0 round 28px);
}
#screen-main .hero-panel,
.wide-panel,
.shop-panel,
.wardrobe-panel,
.world-gates-panel,
.save-slots-panel,
.power-room-panel,
.arena-panel,
.relic-vault-panel,
.quest-board-panel {
  overflow-y: auto;
  overflow-x: hidden;
  padding-right: max(18px, env(safe-area-inset-right)) !important;
}
.panel::-webkit-scrollbar,
.hero-panel::-webkit-scrollbar,
.wide-panel::-webkit-scrollbar,
.premium-card::-webkit-scrollbar,
.compact-card::-webkit-scrollbar,
.shop-panel::-webkit-scrollbar,
.wardrobe-panel::-webkit-scrollbar,
.world-gates-panel::-webkit-scrollbar,
.save-slots-panel::-webkit-scrollbar,
.power-room-panel::-webkit-scrollbar,
.arena-panel::-webkit-scrollbar,
.relic-vault-panel::-webkit-scrollbar,
.quest-board-panel::-webkit-scrollbar {
  width: 9px;
}
.panel::-webkit-scrollbar-track,
.hero-panel::-webkit-scrollbar-track,
.wide-panel::-webkit-scrollbar-track,
.premium-card::-webkit-scrollbar-track,
.compact-card::-webkit-scrollbar-track,
.shop-panel::-webkit-scrollbar-track,
.wardrobe-panel::-webkit-scrollbar-track,
.world-gates-panel::-webkit-scrollbar-track,
.save-slots-panel::-webkit-scrollbar-track,
.power-room-panel::-webkit-scrollbar-track,
.arena-panel::-webkit-scrollbar-track,
.relic-vault-panel::-webkit-scrollbar-track,
.quest-board-panel::-webkit-scrollbar-track {
  margin: 18px 0;
  border-radius: 999px;
  background: rgba(255,255,255,.18);
}
.panel::-webkit-scrollbar-thumb,
.hero-panel::-webkit-scrollbar-thumb,
.wide-panel::-webkit-scrollbar-thumb,
.premium-card::-webkit-scrollbar-thumb,
.compact-card::-webkit-scrollbar-thumb,
.shop-panel::-webkit-scrollbar-thumb,
.wardrobe-panel::-webkit-scrollbar-thumb,
.world-gates-panel::-webkit-scrollbar-thumb,
.save-slots-panel::-webkit-scrollbar-thumb,
.power-room-panel::-webkit-scrollbar-thumb,
.arena-panel::-webkit-scrollbar-thumb,
.relic-vault-panel::-webkit-scrollbar-thumb,
.quest-board-panel::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,211,95,.76));
  border: 2px solid rgba(101,59,28,.18);
}

/* Real avatar in the header. */
.topbar-avatar {
  position: relative;
  overflow: hidden;
  background: radial-gradient(circle at 34% 24%, rgba(255,255,255,.92) 0 9%, transparent 10%), linear-gradient(180deg, var(--avatar-a, #ffcf5a), var(--avatar-b, #ff8f2d)) !important;
}
.topbar-avatar .avatar-face {
  position: absolute;
  inset: 8px 9px 7px;
  border-radius: 42% 42% 46% 46%;
  background: linear-gradient(180deg, var(--avatar-a, #ffd45f), var(--avatar-b, #ff9842));
  box-shadow: inset 0 3px 0 rgba(255,255,255,.32), inset 0 -5px 0 rgba(112,64,39,.15);
}
.topbar-avatar .avatar-face::before {
  content: "";
  position: absolute;
  left: 8px; right: 8px; top: 14px;
  height: 6px;
  background:
    radial-gradient(circle at 20% 50%, #2d2118 0 2px, transparent 2.5px),
    radial-gradient(circle at 80% 50%, #2d2118 0 2px, transparent 2.5px);
}
.topbar-avatar .avatar-face::after {
  content: "";
  position: absolute;
  left: 12px; right: 12px; bottom: 8px;
  height: 6px;
  border-bottom: 3px solid rgba(80,44,24,.7);
  border-radius: 0 0 999px 999px;
}

/* XP bar + animated coins + notifications. */
.topbar-xp {
  position: relative;
  width: min(210px, 36vw);
  height: 14px;
  margin-top: 2px;
  border-radius: 999px;
  overflow: hidden;
  background: rgba(255,255,255,.18);
  border: 1px solid rgba(255,255,255,.20);
  box-shadow: inset 0 2px 4px rgba(0,0,0,.16);
}
.topbar-xp i {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: linear-gradient(90deg, #78f6ae, #ffdf66, #ff9f45);
  box-shadow: 0 0 18px rgba(255,221,95,.42);
  transition: width .32s ease;
}
.topbar-xp em {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-style: normal;
  font-size: 9px;
  line-height: 1;
  color: #2f2115;
  font-weight: 1000;
  text-shadow: 0 1px 0 rgba(255,255,255,.54);
}
.currency-pill .coin-stack {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  background: radial-gradient(circle at 32% 26%, #fff7bd 0 18%, #ffd45f 19% 62%, #ef9f2e 63% 100%);
  box-shadow: inset 0 3px 0 rgba(255,255,255,.5), 0 6px 14px rgba(0,0,0,.18);
  animation: coinPulse 1.8s ease-in-out infinite;
}
@keyframes coinPulse {
  0%,100% { transform: translateY(0) rotate(-4deg); }
  50% { transform: translateY(-3px) rotate(5deg); }
}
.notification-wrap { position: relative; }
.icon-btn.has-alert::after {
  content: "";
  position: absolute;
  right: 8px;
  top: 8px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #ff4d6d;
  box-shadow: 0 0 0 3px rgba(255,255,255,.22), 0 0 14px rgba(255,77,109,.7);
}
.notification-dropdown {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  width: min(320px, 82vw);
  max-height: 340px;
  overflow: auto;
  padding: 12px;
  border-radius: 22px;
  background: linear-gradient(180deg, rgba(255,251,234,.98), rgba(255,239,195,.98));
  border: 1px solid rgba(255,255,255,.7);
  box-shadow: 0 24px 52px rgba(42,28,17,.24);
  z-index: 120;
  transform: translateY(-6px) scale(.98);
  opacity: 0;
  pointer-events: none;
  transition: .18s ease;
}
.notification-dropdown.open {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0) scale(1);
}
.notification-dropdown article {
  display: grid;
  grid-template-columns: 32px minmax(0,1fr);
  gap: 9px;
  padding: 10px;
  border-radius: 16px;
  background: rgba(255,255,255,.58);
  border: 1px solid rgba(112,64,39,.10);
  color: #5a321d;
  font-weight: 850;
}
.notification-dropdown article + article { margin-top: 8px; }
.notification-dropdown b { color: #2f2115; }
.notification-dropdown small { display:block; margin-top: 2px; color: rgba(90,50,29,.78); font-weight: 750; }

/* Premium shop cards. */
.shop-grid { align-items: stretch; }
.premium-shop-card {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-rows: auto auto 1fr auto;
  gap: 10px;
  border: 1px solid rgba(255,255,255,.72) !important;
  background:
    radial-gradient(circle at 14% 10%, rgba(255,255,255,.90), transparent 32%),
    linear-gradient(180deg, rgba(255,250,229,.98), rgba(255,229,166,.96)) !important;
}
.premium-shop-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, transparent 0 42%, rgba(255,255,255,.30) 44%, transparent 56% 100%);
  transform: translateX(-120%);
  transition: transform .55s ease;
  pointer-events: none;
}
.premium-shop-card:hover::before { transform: translateX(120%); }
.shop-card-top,
.shop-card-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}
.shop-icon {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  font-size: 24px;
  background: linear-gradient(180deg, #fff8dd, #ffd45f);
  box-shadow: inset 0 3px 0 rgba(255,255,255,.5), 0 10px 20px rgba(95,49,24,.12);
}
.shop-tier {
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(112,64,39,.10);
  color: #7a421f;
  font-style: normal;
  font-weight: 1000;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.premium-shop-card strong { color: #3b2515; font-size: 17px; line-height: 1.1; }
.premium-shop-card span { color: rgba(73,43,24,.82); line-height: 1.35; }
.premium-shop-card .cost { font-style: normal; font-weight: 1000; color: #8a4e25; }
.premium-shop-card.owned {
  background: linear-gradient(180deg, rgba(231,255,235,.98), rgba(204,244,196,.96)) !important;
}
.premium-shop-card.can-buy .shop-tier { background: rgba(255,212,95,.28); color: #7a421f; }

@media (max-width: 760px) {
  .topbar-xp { width: min(210px, 62vw); }
  .notification-dropdown { right: auto; left: 0; }
}
.topbar-avatar .avatar-face b,
.topbar-avatar .avatar-face i { display: none; }
.notification-dropdown i { font-style: normal; font-size: 20px; display: grid; place-items: center; }

/* v1.25.5 — Header icon polish, real home/logout switch, two-tone XP bar and wider menu layout. */
:root {
  --topbar-h: 86px;
  --topbar-line: rgba(255,255,255,.24);
  --topbar-dark: rgba(2,14,24,.88);
}
#menu-global-header.global-menu-topbar { display: none !important; }
.game-shell.has-menu-screen #menu-global-header.global-menu-topbar { display: grid !important; }
.game-shell.is-playing #menu-global-header.global-menu-topbar { display: none !important; }
#menu-global-header.global-menu-topbar {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  z-index: 80 !important;
  width: 100vw !important;
  height: var(--topbar-h) !important;
  min-height: var(--topbar-h) !important;
  grid-template-columns: minmax(300px, .85fr) minmax(190px, 300px) minmax(588px, 1.25fr) !important;
  align-items: stretch !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  overflow: visible !important;
  background: linear-gradient(180deg, var(--topbar-dark) 0%, rgba(0,25,38,.72) 58%, rgba(0,25,38,.16) 100%) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--topbar-line) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 16px 34px rgba(0,0,0,.18) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
#menu-global-header,
#menu-global-header *,
#menu-global-header .glass-pill,
#menu-global-header .topbar-player,
#menu-global-header .topbar-logo,
#menu-global-header .topbar-actions,
#menu-global-header .currency-cell,
#menu-global-header .currency-add,
#menu-global-header .icon-btn {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
#menu-global-header .glass-pill {
  min-height: 0 !important;
  height: 100% !important;
  border-radius: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
#menu-global-header .topbar-player {
  justify-self: stretch !important;
  display: flex !important;
  align-items: stretch !important;
  gap: 0 !important;
  padding: 0 !important;
  border-right: 1px solid var(--topbar-line) !important;
  min-width: 0 !important;
}
#menu-global-header .topbar-rank,
#menu-global-header .topbar-avatar {
  width: 92px !important;
  flex: 0 0 92px !important;
  height: 100% !important;
  border-radius: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 2px !important;
  background: transparent !important;
  border: 0 !important;
  border-right: 1px solid var(--topbar-line) !important;
  box-shadow: none !important;
}
#menu-global-header .topbar-rank strong,
#menu-global-header .topbar-avatar strong {
  display: block !important;
  color: #8cff37 !important;
  font-size: 30px !important;
  line-height: .9 !important;
  font-weight: 1000 !important;
  text-shadow: 0 0 12px rgba(140,255,55,.45) !important;
}
#menu-global-header .topbar-rank span,
#menu-global-header .topbar-avatar span {
  display: block !important;
  color: rgba(255,255,255,.78) !important;
  font-size: 9px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: .16em !important;
}
#menu-global-header .topbar-player-copy {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 4px !important;
  padding: 0 18px !important;
}
#menu-global-header .topbar-player-copy strong {
  color: #fff !important;
  font-size: 16px !important;
  line-height: 1.1 !important;
  font-weight: 1000 !important;
  letter-spacing: -.02em !important;
  white-space: nowrap !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.35) !important;
}
#menu-global-header .topbar-xp {
  position: relative !important;
  width: min(235px, 25vw) !important;
  height: 6px !important;
  margin: 0 !important;
  overflow: hidden !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, rgba(53,138,26,.92), rgba(39,112,27,.70)) !important;
  border: 0 !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.42) !important;
}
#menu-global-header .topbar-xp i {
  display: block !important;
  height: 100% !important;
  border-radius: inherit !important;
  background: linear-gradient(90deg, #6fff42, #36e94d) !important;
  box-shadow: 0 0 13px rgba(111,255,66,.50) !important;
}
#menu-global-header .topbar-player-copy span,
#menu-global-header .topbar-player-copy em {
  color: #7cff4d !important;
  font-size: 11px !important;
  font-style: normal !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
}
#menu-global-header .topbar-player-copy em { color: rgba(255,255,255,.76) !important; }
#menu-global-header .topbar-logo {
  justify-self: stretch !important;
  align-self: stretch !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  padding: 0 16px !important;
  text-align: center !important;
  border-right: 1px solid var(--topbar-line) !important;
}
#menu-global-header .topbar-logo strong {
  color: #fff !important;
  font-size: clamp(30px, 2.45vw, 48px) !important;
  line-height: .84 !important;
  font-weight: 1000 !important;
  letter-spacing: -.055em !important;
  text-shadow: 0 0 14px rgba(255,255,255,.22), 0 4px 0 rgba(0,0,0,.18) !important;
}
#menu-global-header .topbar-logo span {
  color: rgba(255,255,255,.82) !important;
  font-size: 9px !important;
  font-weight: 950 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
}
#menu-global-header .topbar-actions {
  justify-self: stretch !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: flex-end !important;
  gap: 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
}
#menu-global-header .topbar-currencies {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(116px, 1fr)) !important;
  grid-auto-rows: 1fr !important;
  align-self: stretch !important;
  min-width: 300px !important;
  max-width: 360px !important;
  flex: 1 1 316px !important;
  border-right: 1px solid var(--topbar-line) !important;
}
#menu-global-header .currency-cell {
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: 26px minmax(0,1fr) 26px !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 12px !important;
  background: transparent !important;
  border: 0 !important;
  border-left: 1px solid var(--topbar-line) !important;
  box-shadow: none !important;
}
#menu-global-header .currency-cell:nth-child(1),
#menu-global-header .currency-cell:nth-child(2) { border-bottom: 1px solid var(--topbar-line) !important; }
#menu-global-header .currency-cell > svg {
  width: 21px !important;
  height: 21px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.35 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  filter: drop-shadow(0 0 8px currentColor) !important;
}
#menu-global-header .currency-cell strong {
  color: currentColor !important;
  font-size: 17px !important;
  line-height: 1 !important;
  font-weight: 1000 !important;
  white-space: nowrap !important;
  text-shadow: 0 0 10px currentColor !important;
}
#menu-global-header .currency-coin { color: #ffd232 !important; }
#menu-global-header .currency-ruby { color: #ff5b70 !important; }
#menu-global-header .currency-gem { color: #10dfff !important; }
#menu-global-header .currency-star { color: #9cff47 !important; }
#menu-global-header .currency-add {
  width: 26px !important;
  height: 26px !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  color: currentColor !important;
  cursor: pointer !important;
  box-shadow: none !important;
}
#menu-global-header .currency-add svg,
#menu-global-header .icon-btn svg {
  width: 24px !important;
  height: 24px !important;
  display: block !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.65 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#menu-global-header .currency-add:hover,
#menu-global-header .icon-btn:hover {
  transform: none !important;
  color: #8cff37 !important;
  filter: drop-shadow(0 0 8px rgba(140,255,55,.58)) !important;
  background: transparent !important;
  box-shadow: none !important;
}
#menu-global-header .icon-btn {
  position: relative !important;
  width: 72px !important;
  height: 100% !important;
  flex: 0 0 72px !important;
  display: grid !important;
  place-items: center !important;
  border-radius: 0 !important;
  border: 0 !important;
  border-right: 1px solid var(--topbar-line) !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #cfe0ff !important;
  padding: 0 !important;
  cursor: pointer !important;
  font-size: 0 !important;
}
#menu-global-header .icon-btn:first-of-type { border-left: 1px solid var(--topbar-line) !important; }
#menu-global-header .icon-btn.is-logout { color: #d7e5ff !important; }
#menu-global-header .hotkey-badge {
  position: absolute !important;
  top: 7px !important;
  left: 7px !important;
  display: inline-grid !important;
  place-items: center !important;
  min-width: 28px !important;
  height: 20px !important;
  padding: 0 5px !important;
  border-radius: 4px !important;
  background: #fff !important;
  color: #0f172a !important;
  font-size: 13px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
}
#menu-global-header .notification-wrap { position: relative !important; display: contents !important; }
#menu-global-header .notification-dropdown {
  position: fixed !important;
  top: calc(var(--topbar-h) + 10px) !important;
  right: 92px !important;
  z-index: 120 !important;
}
#menu-global-header .icon-btn.has-alert::after { right: 18px !important; top: 22px !important; }
.screen.active { padding-top: max(108px, calc(var(--topbar-h) + 22px)) !important; }
#screen-main.screen.active { padding: max(108px, calc(var(--topbar-h) + 22px)) 26px 110px !important; }
#screen-main .menu-stage {
  width: min(1320px, 97vw) !important;
  grid-template-columns: minmax(0, 900px) 260px !important;
  align-items: center !important;
  gap: 24px !important;
  max-height: none !important;
  padding-bottom: 78px !important;
}
#screen-main .hero-panel {
  width: 100% !important;
  max-width: none !important;
  padding: 28px 32px 30px !important;
}
#screen-main .home-menu-heading { margin: 0 0 12px !important; display: block !important; text-align: center !important; }
#screen-main .home-menu-heading .eyebrow {
  margin: 0 0 10px !important;
  display: block !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
  color: var(--primary) !important;
  font-size: 12px !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
  font-weight: 950 !important;
}
#screen-main .home-menu-heading h2 {
  margin: 0 !important;
  font-size: clamp(42px, 5vw, 70px) !important;
  line-height: .88 !important;
  letter-spacing: -.06em !important;
  color: #312e81 !important;
  text-shadow: 0 14px 34px rgba(109,93,252,.22) !important;
}
#screen-main .hero-panel > .hint { display: none !important; }
#screen-main .menu-actions {
  width: 100% !important;
  grid-template-columns: repeat(3, minmax(150px, 1fr)) !important;
  gap: 12px !important;
  margin: 18px 0 14px !important;
}
#screen-main .menu-actions .primary { grid-column: 1 / -1 !important; }
#screen-main .menu-actions .btn { min-height: 44px !important; padding: 11px 14px !important; font-size: 13px !important; }
#screen-main .premium-card.compact-card {
  align-self: end !important;
  justify-self: stretch !important;
  width: auto !important;
  padding: 18px !important;
  border-radius: 24px !important;
  max-height: 360px !important;
  margin: 0 !important;
  color: #fff7d6 !important;
  background: linear-gradient(180deg, #37d979, #12984f) !important;
  border-color: #0b6532 !important;
  box-shadow: inset 0 5px 0 rgba(255,255,255,.26), 0 12px 0 #064f28, 0 30px 52px rgba(6,79,40,.30) !important;
  animation: floatCard 4s ease-in-out infinite !important;
  transform-origin: center bottom !important;
}
#screen-main .premium-card.compact-card p { margin: 0 !important; color: rgba(255,248,221,.88) !important; font-size: 13px !important; line-height: 1.45 !important; font-weight: 850 !important; }
@keyframes floatCard { 0%,100% { transform: translateY(0) rotate(-1deg); } 50% { transform: translateY(-14px) rotate(1deg); } }
/* Restored old arcade button shape/colors. */
.btn {
  border-radius: 16px !important;
  border: 3px solid #7a421f !important;
  color: #4b2917 !important;
  background: linear-gradient(180deg, #fff36b, #ffbf3a) !important;
  box-shadow: inset 0 3px 0 rgba(255,255,255,.55), 0 7px 0 #7a421f, 0 14px 22px rgba(108,64,24,.20) !important;
  text-shadow: none !important;
  filter: none !important;
}
.btn:hover { transform: translateY(-3px) !important; box-shadow: inset 0 3px 0 rgba(255,255,255,.55), 0 10px 0 #7a421f, 0 18px 30px rgba(108,64,24,.24) !important; }
.btn.primary { color: #fff7d6 !important; background: linear-gradient(180deg, #ff72c6, #d93278) !important; border-color: #8d1745 !important; box-shadow: inset 0 3px 0 rgba(255,255,255,.40), 0 7px 0 #8d1745, 0 16px 30px rgba(217,50,120,.26) !important; }
.btn.primary:hover { box-shadow: inset 0 3px 0 rgba(255,255,255,.40), 0 10px 0 #8d1745, 0 20px 34px rgba(217,50,120,.30) !important; }
.btn.ghost { color: #105c37 !important; background: linear-gradient(180deg, #7af7a0, #24c466) !important; border-color: #0e7b3d !important; box-shadow: inset 0 3px 0 rgba(255,255,255,.38), 0 7px 0 #0e7b3d, 0 14px 22px rgba(20,130,68,.18) !important; }
.btn.ghost:hover { box-shadow: inset 0 3px 0 rgba(255,255,255,.38), 0 10px 0 #0e7b3d, 0 18px 30px rgba(20,130,68,.22) !important; }
.wide-panel,
.shop-panel,
.wardrobe-panel,
.power-room-panel,
.quest-panel,
.vault-panel,
.arena-panel,
.world-gates-panel,
.save-slots-panel,
.journal-panel { width: min(1180px, 96vw) !important; }
@media (min-width: 1500px) {
  #screen-main .menu-stage { width: min(1420px, 96vw) !important; grid-template-columns: minmax(0, 980px) 278px !important; }
  #screen-main .menu-actions { grid-template-columns: repeat(4, minmax(150px, 1fr)) !important; }
  #screen-main .menu-actions .primary { grid-column: span 2 !important; }
}
@media (max-width: 1180px) {
  :root { --topbar-h: 82px; }
  #menu-global-header.global-menu-topbar { grid-template-columns: minmax(270px, .85fr) minmax(516px, 1.15fr) !important; }
  #menu-global-header .topbar-logo { display: none !important; }
  #menu-global-header .topbar-currencies { min-width: 260px !important; max-width: 300px !important; grid-template-columns: repeat(2, minmax(104px,1fr)) !important; }
  #menu-global-header .currency-cell { padding: 0 9px !important; grid-template-columns: 22px minmax(0,1fr) 24px !important; }
  #menu-global-header .currency-cell strong { font-size: 16px !important; }
  #menu-global-header .icon-btn { width: 64px !important; flex-basis: 64px !important; }
  #screen-main .menu-stage { grid-template-columns: 1fr !important; width: min(920px, 96vw) !important; }
  #screen-main .premium-card.compact-card { display: none !important; }
  #screen-main .menu-actions { grid-template-columns: repeat(3, minmax(140px, 1fr)) !important; }
}
@media (max-width: 760px) {
  :root { --topbar-h: 74px; }
  #menu-global-header.global-menu-topbar { grid-template-columns: minmax(0, 1fr) auto !important; }
  #menu-global-header .topbar-logo { display: none !important; }
  #menu-global-header .topbar-rank, #menu-global-header .topbar-avatar { width: 68px !important; flex-basis: 68px !important; }
  #menu-global-header .topbar-player-copy { padding: 0 10px !important; }
  #menu-global-header .topbar-player-copy strong { font-size: 13px !important; }
  #menu-global-header .topbar-player-copy span, #menu-global-header .topbar-player-copy em { font-size: 10px !important; }
  #menu-global-header .topbar-player-copy em { display: none !important; }
  #menu-global-header .topbar-xp { width: min(150px, 36vw) !important; }
  #menu-global-header .topbar-currencies { display: none !important; }
  #menu-global-header .icon-btn { width: 48px !important; flex-basis: 48px !important; }
  #menu-global-header .hotkey-badge { display: none !important; }
  .screen.active { padding-top: max(92px, calc(var(--topbar-h) + 18px)) !important; }
  #screen-main.screen.active { padding: max(92px, calc(var(--topbar-h) + 18px)) 10px 108px !important; }
  #screen-main .hero-panel { max-height: calc(100vh - 210px) !important; padding: 22px !important; }
  #screen-main .menu-actions { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #screen-main .menu-actions .primary { grid-column: 1 / -1 !important; }
}

/* v1.25.6 — authoritative header/menu corrections. Keeps the Tanki-style full-width header, adds rewards/back context, readable settings gear, two-tone XP text and wider homepage menu. */
#menu-global-header.global-menu-topbar {
  grid-template-columns: minmax(390px, .95fr) minmax(210px, 320px) minmax(580px, 1.15fr) !important;
}
#menu-global-header .topbar-context-btn {
  width: 72px !important;
  flex: 0 0 72px !important;
  border-left: 0 !important;
  border-right: 1px solid var(--topbar-line) !important;
  color: #ffd232 !important;
}
#menu-global-header .topbar-context-btn.is-back {
  color: #bfd5ff !important;
}
#menu-global-header .topbar-context-btn.is-back svg {
  width: 30px !important;
  height: 30px !important;
}
#menu-global-header .topbar-rank,
#menu-global-header .topbar-avatar {
  width: 88px !important;
  flex-basis: 88px !important;
}
#menu-global-header .topbar-player-copy {
  flex: 1 1 auto !important;
  padding-inline: 16px !important;
}
#menu-global-header #menu-xp-text .xp-current {
  color: #7cff4d !important;
  text-shadow: 0 0 9px rgba(124,255,77,.55) !important;
}
#menu-global-header #menu-xp-text .xp-total {
  color: rgba(124,255,77,.58) !important;
  text-shadow: none !important;
}
#menu-global-header .topbar-logo.is-page-title {
  align-items: flex-start !important;
  padding-left: 2.625em !important;
  text-align: left !important;
}
#menu-global-header .topbar-logo.is-page-title strong {
  color: #fff !important;
  font-size: clamp(22px, 2vw, 32px) !important;
  line-height: 1 !important;
  letter-spacing: -.035em !important;
  text-transform: none !important;
  text-shadow: 0 0 14px rgba(255,255,255,.18), 0 8px 20px rgba(0,0,0,.25) !important;
}
#menu-global-header .topbar-logo.is-page-title span {
  display: none !important;
}
#menu-global-header #menu-nav-button[hidden] {
  display: none !important;
}
#menu-global-header [data-action="settings"] svg {
  width: 28px !important;
  height: 28px !important;
  stroke-width: 2.25 !important;
}
@media (min-width: 1200px) {
  #screen-main .menu-stage {
    width: min(1640px, calc(100vw - 72px)) !important;
    grid-template-columns: minmax(0, 1fr) 300px !important;
    gap: 28px !important;
    justify-content: center !important;
  }
  #screen-main .hero-panel {
    width: 100% !important;
    max-width: none !important;
  }
  #screen-main .menu-actions {
    width: 100% !important;
    grid-template-columns: repeat(4, minmax(170px, 1fr)) !important;
    gap: 12px !important;
  }
  #screen-main .menu-actions .primary {
    grid-column: span 2 !important;
  }
  #screen-main .menu-actions .btn {
    min-height: 48px !important;
    padding-inline: 16px !important;
  }
}
@media (min-width: 1500px) {
  #screen-main .menu-stage {
    width: min(1720px, calc(100vw - 88px)) !important;
    grid-template-columns: minmax(0, 1fr) 320px !important;
  }
  #screen-main .menu-actions {
    grid-template-columns: repeat(4, minmax(190px, 1fr)) !important;
  }
}
@media (max-width: 1180px) {
  #menu-global-header.global-menu-topbar {
    grid-template-columns: minmax(360px, 1fr) minmax(450px, auto) !important;
  }
  #menu-global-header .topbar-context-btn { width: 64px !important; flex-basis: 64px !important; }
  #menu-global-header .topbar-rank, #menu-global-header .topbar-avatar { width: 76px !important; flex-basis: 76px !important; }
  #screen-main .menu-stage {
    width: min(1040px, calc(100vw - 36px)) !important;
    grid-template-columns: 1fr !important;
  }
  #screen-main .menu-actions {
    grid-template-columns: repeat(3, minmax(155px, 1fr)) !important;
  }
  #screen-main .menu-actions .primary { grid-column: 1 / -1 !important; }
}
@media (max-width: 760px) {
  #menu-global-header .topbar-context-btn { width: 48px !important; flex-basis: 48px !important; }
  #menu-global-header .topbar-rank, #menu-global-header .topbar-avatar { width: 58px !important; flex-basis: 58px !important; }
  #menu-global-header .topbar-currencies { display: none !important; }
  #screen-main .menu-stage { width: min(100%, calc(100vw - 20px)) !important; }
  #screen-main .menu-actions { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}


/* v1.25.7 — final header cleanup + crown rewards + new Tanki-style homepage menu. */
#menu-global-header.global-menu-topbar {
  grid-template-columns: minmax(390px, .95fr) max-content minmax(580px, 1.18fr) !important;
}
#menu-global-header .topbar-logo {
  min-width: 0 !important;
  width: auto !important;
  padding-inline: 34px !important;
}
#menu-global-header .topbar-logo::before,
#menu-global-header .topbar-logo::after,
#menu-global-header .topbar-actions::before,
#menu-global-header .topbar-actions::after { display: none !important; content: none !important; }
#menu-global-header .topbar-actions { margin-left: 0 !important; }
#menu-global-header .topbar-currencies { margin-left: 0 !important; }
#menu-global-header .topbar-context-btn.is-rewards {
  overflow: hidden !important;
  color: #ffd12d !important;
  background: radial-gradient(100% 100% at 0% 0%, rgba(255,204,0,.75) 0%, rgba(255,38,74,.50) 50%, rgba(255,38,74,0) 100%) !important;
  box-shadow: rgba(255,255,255,.25) 1px 0 0 0 !important;
}
#menu-global-header .topbar-context-btn.is-rewards svg {
  width: 34px !important;
  height: 34px !important;
  stroke-width: 2.25 !important;
  filter: drop-shadow(0 0 9px rgba(255,210,50,.55)) !important;
}
#menu-global-header .topbar-context-btn.is-back {
  background: transparent !important;
  color: #bfd5ff !important;
}
#menu-global-header .context-hotkey {
  top: 7px !important;
  left: 7px !important;
  min-width: 18px !important;
  height: 18px !important;
  font-size: 11px !important;
  border-radius: 4px !important;
}
#menu-global-header [data-action="settings"] svg {
  width: 31px !important;
  height: 31px !important;
  stroke-width: 2.05 !important;
}
/* Hide the old homepage menu layout completely on the main screen and use the new menu only. */
#screen-main .menu-actions { display: none !important; }
#screen-main .hero-panel {
  overflow: hidden !important;
  padding: 28px 30px 30px !important;
}
.berry-main-menu {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(170px, 230px) minmax(0, 1fr);
  gap: 18px;
  align-items: stretch;
  margin-top: 18px;
  width: 100%;
}
.berry-play-button,
.berry-menu-item {
  font-family: inherit;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,.28);
  color: #fff;
  background: linear-gradient(180deg, rgba(8,28,44,.80), rgba(2,15,24,.72));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 16px 34px rgba(0,0,0,.18);
  text-align: left;
  transition: transform .18s ease, border-color .18s ease, background .18s ease, box-shadow .18s ease;
}
.berry-play-button:hover,
.berry-menu-item:hover {
  transform: translateY(-2px);
  border-color: rgba(140,255,55,.58);
  background: linear-gradient(180deg, rgba(18,61,51,.86), rgba(4,24,29,.78));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.20), 0 20px 40px rgba(0,0,0,.22), 0 0 0 1px rgba(140,255,55,.16);
}
.berry-play-button {
  position: relative;
  min-height: 100%;
  border-radius: 0;
  padding: 22px 20px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  overflow: hidden;
  background: linear-gradient(180deg, #91ff32 0%, #3ecb18 52%, #14842c 100%);
  border-color: rgba(255,255,255,.34);
  box-shadow: inset 0 3px 0 rgba(255,255,255,.42), 0 8px 0 rgba(9,85,32,.95), 0 24px 42px rgba(30,166,58,.28);
}
.berry-play-button .play-glow {
  position: absolute;
  inset: -40% auto auto -20%;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.42), transparent 62%);
  pointer-events: none;
}
.berry-play-button strong {
  position: relative;
  font-size: clamp(34px, 4vw, 54px);
  line-height: .88;
  font-weight: 1000;
  letter-spacing: -.07em;
  text-transform: uppercase;
  text-shadow: 0 4px 0 rgba(0,0,0,.18);
}
.berry-play-button em {
  position: relative;
  margin-top: 10px;
  color: rgba(255,255,255,.84);
  font-style: normal;
  font-size: 12px;
  font-weight: 950;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.berry-menu-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(138px, 1fr));
  gap: 8px;
  width: 100%;
}
.berry-menu-item {
  min-height: 76px;
  border-radius: 0;
  padding: 11px 12px 11px 56px;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  overflow: hidden;
}
.berry-menu-item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 44px;
  border-right: 1px solid rgba(255,255,255,.18);
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02));
}
.berry-menu-item i {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 44px;
  display: grid;
  place-items: center;
  color: #8cff37;
  font-style: normal;
  font-size: 21px;
  font-weight: 1000;
  text-shadow: 0 0 10px rgba(140,255,55,.45);
}
.berry-menu-item span {
  color: #fff;
  font-size: 14px;
  line-height: 1;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: -.01em;
}
.berry-menu-item small {
  color: rgba(211,229,255,.72);
  font-size: 11px;
  line-height: 1;
  font-weight: 850;
}
.berry-menu-item.is-hot i { color: #ffd232; text-shadow: 0 0 10px rgba(255,210,50,.50); }
@media (min-width: 1500px) {
  #screen-main .menu-stage { grid-template-columns: minmax(0, 1fr) 320px !important; }
  .berry-menu-grid { grid-template-columns: repeat(4, minmax(170px, 1fr)); }
  .berry-menu-item { min-height: 82px; }
}
@media (max-width: 1180px) {
  #menu-global-header.global-menu-topbar { grid-template-columns: minmax(360px, 1fr) minmax(450px, auto) !important; }
  #menu-global-header .topbar-logo { display: none !important; }
  .berry-main-menu { grid-template-columns: 1fr; }
  .berry-play-button { min-height: 108px; }
  .berry-menu-grid { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
}
@media (max-width: 760px) {
  .berry-menu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .berry-menu-item { min-height: 68px; padding-left: 50px; }
  .berry-play-button { min-height: 92px; }
}


/* v1.25.8 — final cleanup: remove blank header action space, replace old home menu shell, clearer crown, centered gear. */
#menu-global-header.global-menu-topbar {
  grid-template-columns: minmax(390px, .92fr) minmax(300px, 1fr) max-content !important;
}
#menu-global-header .topbar-logo {
  min-width: 0 !important;
  width: 100% !important;
  padding-inline: 18px !important;
  border-right: 1px solid var(--topbar-line) !important;
}
#menu-global-header .topbar-actions {
  width: max-content !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: 0 0 auto !important;
  justify-self: end !important;
  justify-content: flex-end !important;
}
#menu-global-header .topbar-currencies {
  flex: 0 0 auto !important;
  width: 360px !important;
  min-width: 360px !important;
  max-width: 360px !important;
  margin-left: 0 !important;
  border-left: 0 !important;
}
#menu-global-header .currency-cell:first-child,
#menu-global-header .icon-btn:first-of-type {
  border-left: 1px solid var(--topbar-line) !important;
}
#menu-global-header .reward-crown-svg .crown-fill {
  fill: currentColor !important;
  stroke: rgba(255,248,178,.95) !important;
  stroke-width: .75 !important;
  stroke-linejoin: round !important;
}
#menu-global-header .reward-crown-svg .crown-line {
  fill: none !important;
  stroke: rgba(255,248,178,.95) !important;
  stroke-width: 1.65 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#menu-global-header .reward-crown-svg .crown-jewel {
  fill: #fff3a3 !important;
  stroke: #ffb82e !important;
  stroke-width: .65 !important;
}
#menu-global-header .settings-gear-svg circle,
#menu-global-header .settings-gear-svg path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#menu-global-header .settings-gear-svg circle { stroke-width: 2.35 !important; }
#menu-global-header .settings-gear-svg path { stroke-width: 2.05 !important; }
#screen-main .menu-stage {
  width: min(1540px, calc(100vw - 56px)) !important;
  grid-template-columns: minmax(0, 1fr) 300px !important;
  align-items: center !important;
  gap: 28px !important;
}
#screen-main .home-menu-panel {
  position: relative !important;
  z-index: 3 !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}
#screen-main .home-menu-heading {
  width: min(420px, 100%) !important;
  margin: 0 0 14px !important;
  padding: 0 !important;
  text-align: left !important;
}
#screen-main .home-menu-heading .eyebrow {
  margin: 0 0 7px !important;
  color: rgba(255,255,255,.74) !important;
  text-shadow: 0 2px 10px rgba(0,0,0,.22) !important;
}
#screen-main .home-menu-heading h2 {
  color: #fff !important;
  font-size: clamp(36px, 4.2vw, 58px) !important;
  text-shadow: 0 4px 0 rgba(0,0,0,.16), 0 12px 26px rgba(0,0,0,.22) !important;
}
#screen-main .hero-stats,
#screen-main .menu-actions,
#screen-main .hero-panel {
  display: none !important;
}
#screen-main .berry-main-menu {
  display: grid !important;
  grid-template-columns: minmax(190px, 250px) minmax(0, 1fr) !important;
  gap: 14px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  align-items: stretch !important;
}
#screen-main .berry-menu-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(155px, 1fr)) !important;
  gap: 9px !important;
  width: 100% !important;
  min-width: 0 !important;
}
#screen-main .berry-play-button {
  min-height: 100% !important;
  border-radius: 0 !important;
}
#screen-main .berry-menu-item {
  min-height: 78px !important;
  border-radius: 0 !important;
}
@media (min-width: 1650px) {
  #screen-main .menu-stage { width: min(1720px, calc(100vw - 76px)) !important; grid-template-columns: minmax(0, 1fr) 320px !important; }
  #screen-main .berry-menu-grid { grid-template-columns: repeat(4, minmax(190px, 1fr)) !important; }
}
@media (max-width: 1280px) {
  #menu-global-header.global-menu-topbar { grid-template-columns: minmax(350px, 1fr) max-content !important; }
  #menu-global-header .topbar-logo { display: none !important; }
  #screen-main .menu-stage { width: min(1120px, calc(100vw - 36px)) !important; grid-template-columns: 1fr !important; }
  #screen-main .berry-main-menu { grid-template-columns: 1fr !important; }
  #screen-main .berry-play-button { min-height: 105px !important; }
  #screen-main .berry-menu-grid { grid-template-columns: repeat(3, minmax(150px, 1fr)) !important; }
}
@media (max-width: 820px) {
  #menu-global-header .topbar-currencies { display: none !important; }
  #screen-main .berry-menu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #screen-main .menu-stage { width: min(100%, calc(100vw - 20px)) !important; }
}


/* v1.25.9 — clean homepage menu composition: decorative world is outside menu-stage, hero art stays right, old heading/card removed. */
#menu-global-header.global-menu-topbar {
  grid-template-columns: minmax(390px, 1fr) max-content max-content !important;
}
#menu-global-header .topbar-logo {
  width: auto !important;
  min-width: 270px !important;
  max-width: none !important;
  padding-inline: clamp(22px, 3vw, 58px) !important;
  border-right: 0 !important;
}
#menu-global-header .topbar-actions {
  width: max-content !important;
  min-width: 0 !important;
  justify-self: end !important;
  margin-left: 0 !important;
}
#menu-global-header .topbar-currencies {
  width: 360px !important;
  min-width: 360px !important;
  max-width: 360px !important;
  border-left: 1px solid var(--topbar-line) !important;
  border-right: 1px solid var(--topbar-line) !important;
}
#menu-global-header .currency-cell:nth-child(odd) { border-left: 0 !important; }
#menu-global-header .currency-cell:nth-child(even) { border-left: 1px solid var(--topbar-line) !important; }
#screen-main.screen.active {
  overflow: hidden !important;
  place-items: center !important;
}
#screen-main .menu-stage {
  position: relative !important;
  z-index: 2 !important;
  width: min(1120px, calc(100vw - 480px)) !important;
  max-width: 1120px !important;
  min-width: min(860px, calc(100vw - 480px)) !important;
  grid-template-columns: 1fr !important;
  align-items: center !important;
  justify-items: stretch !important;
  gap: 0 !important;
  margin: 0 clamp(330px, 24vw, 470px) 0 0 !important;
  padding: 0 0 70px !important;
}
#screen-main .home-menu-heading,
#screen-main .premium-card.compact-card {
  display: none !important;
}
#screen-main .home-menu-panel {
  position: relative !important;
  z-index: 2 !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
}
#screen-main .berry-main-menu {
  margin: 0 !important;
  grid-template-columns: minmax(190px, 260px) minmax(0, 1fr) !important;
}
@media (min-width: 1650px) {
  #screen-main .menu-stage {
    width: min(1220px, calc(100vw - 520px)) !important;
    margin-right: clamp(370px, 24vw, 520px) !important;
  }
  #screen-main .berry-menu-grid { grid-template-columns: repeat(4, minmax(188px, 1fr)) !important; }
}
@media (max-width: 1280px) {
  #menu-global-header.global-menu-topbar { grid-template-columns: minmax(350px, 1fr) max-content !important; }
  #menu-global-header .topbar-logo { display: none !important; }
  #screen-main .menu-stage {
    width: min(1040px, calc(100vw - 36px)) !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding-bottom: 78px !important;
  }
  #screen-main .berry-main-menu { grid-template-columns: 1fr !important; }
}



/* v1.25.10 — remove homepage controls note and restyle notifications in the new header/menu language. */
#menu-global-header .notification-wrap {
  position: relative !important;
  display: contents !important;
}
#menu-global-header .notification-dropdown {
  position: fixed !important;
  top: var(--topbar-h) !important;
  right: 0 !important;
  width: min(420px, calc(100vw - 18px)) !important;
  max-height: min(430px, calc(100vh - var(--topbar-h) - 18px)) !important;
  overflow: auto !important;
  padding: 0 !important;
  border-radius: 0 0 0 18px !important;
  background:
    linear-gradient(180deg, rgba(0, 25, 38, .98) 0%, rgba(0, 20, 34, .96) 100%) !important;
  border: 0 !important;
  border-left: 1px solid var(--topbar-line) !important;
  border-bottom: 1px solid var(--topbar-line) !important;
  box-shadow: 0 24px 54px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255,255,255,.10) !important;
  color: #eaf3ff !important;
  z-index: 140 !important;
  transform: translateY(-8px) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity .16s ease, transform .16s ease !important;
}
#menu-global-header .notification-dropdown.open {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translateY(0) !important;
}
#menu-global-header .notification-panel-head {
  min-height: 54px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 0 18px !important;
  border-bottom: 1px solid var(--topbar-line) !important;
  background: linear-gradient(90deg, rgba(140,255,55,.12), rgba(16,223,255,.06), transparent) !important;
}
#menu-global-header .notification-panel-head span {
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 1000 !important;
  letter-spacing: .02em !important;
  text-transform: uppercase !important;
}
#menu-global-header .notification-panel-head small {
  color: #9cff47 !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
}
#menu-global-header .notification-list {
  display: grid !important;
  gap: 0 !important;
}
#menu-global-header .notification-dropdown article {
  display: grid !important;
  grid-template-columns: 52px minmax(0, 1fr) !important;
  gap: 0 !important;
  min-height: 72px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.14) !important;
  background: transparent !important;
  color: #eaf3ff !important;
  box-shadow: none !important;
}
#menu-global-header .notification-dropdown article:hover {
  background: linear-gradient(90deg, rgba(140,255,55,.10), rgba(16,223,255,.05), transparent) !important;
}
#menu-global-header .notification-dropdown article i {
  width: 52px !important;
  min-height: 72px !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid var(--topbar-line) !important;
  color: #ffd232 !important;
  font-style: normal !important;
  font-size: 20px !important;
  filter: drop-shadow(0 0 8px rgba(255,210,50,.35)) !important;
}
#menu-global-header .notification-dropdown article div {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  padding: 10px 16px !important;
}
#menu-global-header .notification-dropdown b {
  color: #fff !important;
  font-size: 14px !important;
  line-height: 1.15 !important;
  font-weight: 1000 !important;
}
#menu-global-header .notification-dropdown small {
  display: block !important;
  margin-top: 4px !important;
  color: rgba(207,224,255,.74) !important;
  font-size: 12px !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
}
#menu-global-header .notification-dropdown::-webkit-scrollbar {
  width: 8px !important;
}
#menu-global-header .notification-dropdown::-webkit-scrollbar-track {
  background: rgba(255,255,255,.08) !important;
}
#menu-global-header .notification-dropdown::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  background: linear-gradient(180deg, #9cff47, #10dfff) !important;
}
@media (max-width: 760px) {
  #menu-global-header .notification-dropdown {
    left: 8px !important;
    right: 8px !important;
    width: auto !important;
    border-radius: 0 0 18px 18px !important;
  }
}


/* v1.25.11 — inner menu pages now use the same header-led dark UI language.
   Page titles/back controls live only in the fixed global header. */
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .panel-head {
  display: none !important;
}
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .wide-panel,
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .settings-panel,
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .daily-panel,
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .cinematic-panel,
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .level-intro-panel {
  width: min(1320px, calc(100vw - 56px)) !important;
  max-height: calc(100vh - var(--topbar-h) - 42px) !important;
  margin: 0 auto !important;
  padding: 22px !important;
  border-radius: 0 !important;
  overflow: auto !important;
  background:
    linear-gradient(180deg, rgba(0, 25, 38, .91) 0%, rgba(0, 18, 31, .86) 100%) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 28px 62px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.10) !important;
  color: #eaf3ff !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .wide-panel::before,
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .settings-panel::before,
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .daily-panel::before {
  display: none !important;
  content: none !important;
}
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .hint,
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .setting-note,
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .score-line {
  margin: 0 0 16px !important;
  padding: 13px 16px 13px 48px !important;
  position: relative !important;
  border-radius: 0 !important;
  background: linear-gradient(90deg, rgba(140,255,55,.10), rgba(16,223,255,.05), rgba(255,255,255,.02)) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  color: rgba(234,243,255,.82) !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  font-weight: 800 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important;
}
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .hint::before,
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .setting-note::before,
.screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .score-line::before {
  content: "i" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 34px !important;
  display: grid !important;
  place-items: center !important;
  color: #9cff47 !important;
  border-right: 1px solid rgba(255,255,255,.18) !important;
  font-weight: 1000 !important;
  font-size: 14px !important;
  text-shadow: 0 0 10px rgba(156,255,71,.42) !important;
}
#level-grid,
.world-gates-grid,
.story-grid,
.achievement-grid,
.quest-grid,
.vault-grid,
.arena-grid,
.power-room-grid,
.shop-grid,
.wardrobe-grid,
.profile-stats,
.profile-badges,
.save-slots-grid,
.guide-grid {
  gap: 10px !important;
}
.level-card,
.world-gate-card,
.story-grid article,
.achievement,
.quest-card,
.vault-card,
.arena-card,
.power-card,
.shop-card,
.skin-card,
.profile-stats article,
.profile-badges article,
.save-slot-card,
.guide-grid article,
.setting-row,
.daily-panel,
.intro-objectives span,
.cinematic-scenes article {
  border-radius: 0 !important;
  background: linear-gradient(180deg, rgba(8,28,44,.78), rgba(2,15,24,.66)) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 14px 28px rgba(0,0,0,.16) !important;
  color: #eaf3ff !important;
}
.level-card:hover,
.world-gate-card:hover,
.story-grid article:hover,
.achievement:hover,
.quest-card:hover,
.vault-card:hover,
.arena-card:hover,
.power-card:hover,
.shop-card:hover,
.skin-card:hover,
.profile-stats article:hover,
.profile-badges article:hover,
.save-slot-card:hover,
.guide-grid article:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(140,255,55,.46) !important;
  background: linear-gradient(180deg, rgba(16,50,53,.86), rgba(4,24,29,.72)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 18px 34px rgba(0,0,0,.22), 0 0 0 1px rgba(140,255,55,.12) !important;
}
.level-card strong,
.world-gate-card h3,
.story-grid strong,
.achievement strong,
.quest-card strong,
.vault-card strong,
.arena-card strong,
.power-card strong,
.shop-card strong,
.skin-card strong,
.profile-stats strong,
.profile-badges strong,
.save-slot-card h3,
.guide-grid strong {
  color: #fff !important;
  text-shadow: 0 2px 12px rgba(0,0,0,.25) !important;
}
.level-card span,
.level-card small,
.world-gate-card p,
.world-gate-card li,
.story-grid span,
.achievement span,
.quest-card span,
.vault-card span,
.arena-card span,
.power-card span,
.shop-card span,
.skin-card span,
.profile-stats span,
.profile-badges span,
.save-slot-card p,
.save-slot-card li,
.guide-grid span {
  color: rgba(207,224,255,.76) !important;
}
.world-wallet,
.shop-wallet {
  border-radius: 0 !important;
  background: linear-gradient(90deg, rgba(140,255,55,.12), rgba(16,223,255,.06), rgba(255,255,255,.03)) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  color: #eaf3ff !important;
}
.world-wallet strong,
.shop-wallet strong,
#wardrobe-active {
  color: #9cff47 !important;
  text-shadow: 0 0 12px rgba(156,255,71,.40) !important;
}
.settings-panel input,
.settings-panel select {
  border-radius: 0 !important;
  background: rgba(0,25,38,.72) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  color: #fff !important;
}
.settings-panel .btn,
.daily-panel .btn,
.world-actions .btn,
.slot-actions .btn,
.shop-card .btn,
.skin-card .btn,
.quest-card .btn,
.arena-card .btn,
.inline-actions .btn {
  border-radius: 0 !important;
}
#screen-daily .daily-panel {
  width: min(520px, calc(100vw - 56px)) !important;
  text-align: center !important;
}
#screen-cinematic .cinematic-panel,
#screen-level-intro .level-intro-panel {
  width: min(980px, calc(100vw - 56px)) !important;
}
@media (max-width: 820px) {
  .screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .wide-panel,
  .screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .settings-panel,
  .screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .daily-panel,
  .screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .cinematic-panel,
  .screen:not(#screen-main):not(#screen-pause):not(#screen-complete):not(#screen-over) .level-intro-panel {
    width: min(100%, calc(100vw - 20px)) !important;
    padding: 14px !important;
  }
}

/* v1.25.12 — open content pages: inner menu screens now render only their content.
   The old white/dark panel wrapper is removed from the HTML; header owns title/back. */
.screen.content-screen.active {
  display: block !important;
  place-items: initial !important;
  align-items: initial !important;
  justify-items: initial !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: max(108px, calc(var(--topbar-h) + 22px)) clamp(18px, 3vw, 42px) 54px !important;
  background:
    radial-gradient(circle at 12% 15%, rgba(140,255,55,.10), transparent 28%),
    radial-gradient(circle at 88% 8%, rgba(16,223,255,.08), transparent 30%),
    linear-gradient(180deg, rgba(0, 25, 38, .72), rgba(0, 12, 22, .82)) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.screen.content-screen > * {
  width: min(1320px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}
.screen.content-screen > .hint,
.screen.content-screen > .setting-note,
.screen.content-screen > .score-line,
.screen.content-screen > p:not([class]) {
  width: min(1120px, 100%) !important;
  margin-bottom: 14px !important;
}
#screen-daily.content-screen {
  text-align: center !important;
}
#screen-daily.content-screen > * {
  width: min(520px, 100%) !important;
}
#screen-daily.content-screen .daily-chest {
  width: 178px !important;
  margin: 0 auto 18px !important;
}
#screen-settings.content-screen > .setting-row,
#screen-settings.content-screen > .setting-note,
#screen-settings.content-screen > .btn,
#screen-credits.content-screen > .hint,
#screen-credits.content-screen > .full-link {
  width: min(680px, 100%) !important;
}
#screen-settings.content-screen input,
#screen-settings.content-screen select {
  border-radius: 0 !important;
  background: rgba(0,25,38,.72) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  color: #fff !important;
}
.screen.content-screen .arena-grid,
.screen.content-screen .power-room-grid,
.screen.content-screen .shop-grid,
.screen.content-screen .wardrobe-grid,
.screen.content-screen .world-gates-grid,
.screen.content-screen .quest-grid,
.screen.content-screen .vault-grid,
.screen.content-screen .achievement-grid,
.screen.content-screen .profile-stats,
.screen.content-screen .profile-badges,
.screen.content-screen .save-slots-grid,
.screen.content-screen .guide-grid,
.screen.content-screen .story-grid,
.screen.content-screen .level-grid {
  margin-top: 12px !important;
}
@media (max-width: 820px) {
  .screen.content-screen.active {
    padding: max(92px, calc(var(--topbar-h) + 18px)) 10px 42px !important;
  }
  .screen.content-screen > .hint,
  .screen.content-screen > .setting-note,
  .screen.content-screen > .score-line,
  .screen.content-screen > p:not([class]) {
    width: 100% !important;
  }
}

/* v1.25.13 — Tanki-inspired cards/buttons pass for every header-led page.
   Keeps the fixed header and open-content structure, but upgrades page content with rectangular game panels,
   left icon rails, vertical separators, stronger hover feedback and page-specific grids. */
:root {
  --page-panel-bg: linear-gradient(180deg, rgba(8, 28, 44, .88), rgba(2, 15, 24, .76));
  --page-panel-bg-hover: linear-gradient(180deg, rgba(16, 50, 53, .92), rgba(4, 24, 29, .80));
  --page-line: rgba(191, 213, 255, .24);
  --page-line-soft: rgba(191, 213, 255, .14);
  --page-green: #9cff47;
  --page-cyan: #10dfff;
  --page-gold: #ffd232;
  --page-red: #ff4c6a;
}
.screen.content-screen.active {
  padding: max(104px, calc(var(--topbar-h) + 24px)) clamp(22px, 3.4vw, 58px) 58px !important;
  background:
    radial-gradient(circle at 10% 16%, rgba(140,255,55,.12), transparent 28%),
    radial-gradient(circle at 90% 12%, rgba(16,223,255,.10), transparent 30%),
    linear-gradient(180deg, rgba(0,25,38,.74), rgba(0,12,22,.88)) !important;
}
.screen.content-screen.active::-webkit-scrollbar { width: 10px !important; }
.screen.content-screen.active::-webkit-scrollbar-track { background: rgba(255,255,255,.06) !important; }
.screen.content-screen.active::-webkit-scrollbar-thumb { background: linear-gradient(180deg, var(--page-green), var(--page-cyan)) !important; border-radius: 0 !important; }
.screen.content-screen > * {
  width: min(1440px, 100%) !important;
}
.screen.content-screen .hint,
.screen.content-screen .setting-note,
.screen.content-screen .score-line,
.screen.content-screen > p:not([class]) {
  width: min(1160px, 100%) !important;
  min-height: 54px !important;
  display: flex !important;
  align-items: center !important;
  margin: 0 auto 14px !important;
  padding: 12px 18px 12px 58px !important;
  border-radius: 0 !important;
  border: 1px solid var(--page-line-soft) !important;
  background: linear-gradient(90deg, rgba(140,255,55,.10), rgba(16,223,255,.06), rgba(255,255,255,.02)) !important;
  color: rgba(234,243,255,.82) !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  font-weight: 800 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 14px 28px rgba(0,0,0,.14) !important;
}
.screen.content-screen .hint::before,
.screen.content-screen .setting-note::before,
.screen.content-screen .score-line::before,
.screen.content-screen > p:not([class])::before {
  content: "i" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 42px !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid var(--page-line-soft) !important;
  color: var(--page-green) !important;
  font-size: 15px !important;
  font-weight: 1000 !important;
  text-shadow: 0 0 12px rgba(156,255,71,.45) !important;
}
.screen.content-screen .btn {
  min-height: 44px !important;
  border-radius: 0 !important;
  border: 1px solid rgba(191,213,255,.26) !important;
  padding: 11px 16px !important;
  color: #eaf3ff !important;
  background: linear-gradient(180deg, rgba(11,35,53,.92), rgba(3,18,29,.86)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 12px 24px rgba(0,0,0,.16) !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  font-size: 12px !important;
  font-weight: 1000 !important;
}
.screen.content-screen .btn:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(140,255,55,.55) !important;
  background: linear-gradient(180deg, rgba(18,61,51,.96), rgba(4,24,29,.88)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 16px 30px rgba(0,0,0,.22), 0 0 0 1px rgba(140,255,55,.12) !important;
}
.screen.content-screen .btn.primary {
  color: #04200f !important;
  background: linear-gradient(180deg, #9cff47 0%, #36d44f 55%, #14943b 100%) !important;
  border-color: rgba(204,255,140,.78) !important;
  text-shadow: 0 1px 0 rgba(255,255,255,.25) !important;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.34), 0 7px 0 rgba(7,96,39,.92), 0 18px 34px rgba(43,192,75,.22) !important;
}
.screen.content-screen .btn.primary:hover {
  box-shadow: inset 0 2px 0 rgba(255,255,255,.38), 0 10px 0 rgba(7,96,39,.92), 0 24px 38px rgba(43,192,75,.28) !important;
}
.screen.content-screen .btn.ghost {
  color: #bfd5ff !important;
  background: linear-gradient(180deg, rgba(10,31,48,.72), rgba(2,14,25,.68)) !important;
}
.screen.content-screen .btn.danger {
  color: #fff !important;
  border-color: rgba(255,124,148,.44) !important;
  background: linear-gradient(180deg, rgba(255,76,106,.95), rgba(168,27,61,.92)) !important;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.24), 0 7px 0 rgba(110,15,38,.92), 0 18px 34px rgba(168,27,61,.22) !important;
}
#level-grid,
.screen.content-screen .world-gates-grid,
.screen.content-screen .story-grid,
.screen.content-screen .achievement-grid,
.screen.content-screen .quest-grid,
.screen.content-screen .vault-grid,
.screen.content-screen .arena-grid,
.screen.content-screen .power-room-grid,
.screen.content-screen .shop-grid,
.screen.content-screen .wardrobe-grid,
.screen.content-screen .profile-stats,
.screen.content-screen .profile-badges,
.screen.content-screen .save-slots-grid,
.screen.content-screen .guide-grid {
  display: grid !important;
  gap: 10px !important;
  margin-top: 14px !important;
}
#level-grid { grid-template-columns: repeat(auto-fill, minmax(154px, 1fr)) !important; }
.screen.content-screen .arena-grid,
.screen.content-screen .power-room-grid,
.screen.content-screen .shop-grid,
.screen.content-screen .wardrobe-grid,
.screen.content-screen .world-gates-grid,
.screen.content-screen .save-slots-grid { grid-template-columns: repeat(auto-fill, minmax(282px, 1fr)) !important; }
.screen.content-screen .quest-grid,
.screen.content-screen .vault-grid,
.screen.content-screen .achievement-grid,
.screen.content-screen .guide-grid,
.screen.content-screen .story-grid,
.screen.content-screen .profile-stats,
.screen.content-screen .profile-badges { grid-template-columns: repeat(auto-fill, minmax(248px, 1fr)) !important; }
.screen.content-screen .level-card,
.screen.content-screen .world-gate-card,
.screen.content-screen .story-grid article,
.screen.content-screen .achievement,
.screen.content-screen .quest-card,
.screen.content-screen .vault-card,
.screen.content-screen .arena-card,
.screen.content-screen .power-card,
.screen.content-screen .shop-card,
.screen.content-screen .skin-card,
.screen.content-screen .profile-stats article,
.screen.content-screen .profile-badges article,
.screen.content-screen .save-slot-card,
.screen.content-screen .guide-grid article,
.screen.content-screen .setting-row,
.screen.content-screen .intro-objectives span,
.screen.content-screen .cinematic-scenes article {
  --card-icon: "◆";
  --card-accent: var(--page-green);
  position: relative !important;
  min-height: 78px !important;
  padding: 16px 16px 16px 66px !important;
  border-radius: 0 !important;
  border: 1px solid var(--page-line-soft) !important;
  background: var(--page-panel-bg) !important;
  color: #eaf3ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 14px 28px rgba(0,0,0,.16) !important;
  overflow: hidden !important;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease, background .16s ease !important;
}
.screen.content-screen .level-card::before,
.screen.content-screen .world-gate-card::before,
.screen.content-screen .story-grid article::before,
.screen.content-screen .achievement::before,
.screen.content-screen .quest-card::before,
.screen.content-screen .vault-card::before,
.screen.content-screen .arena-card::before,
.screen.content-screen .power-card::before,
.screen.content-screen .shop-card::before,
.screen.content-screen .skin-card::before,
.screen.content-screen .profile-stats article::before,
.screen.content-screen .profile-badges article::before,
.screen.content-screen .save-slot-card::before,
.screen.content-screen .guide-grid article::before,
.screen.content-screen .setting-row::before,
.screen.content-screen .intro-objectives span::before,
.screen.content-screen .cinematic-scenes article::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 50px !important;
  border-right: 1px solid var(--page-line-soft) !important;
  background:
    radial-gradient(circle at 50% 30%, rgba(156,255,71,.16), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02)) !important;
}
.screen.content-screen .level-card::after,
.screen.content-screen .world-gate-card::after,
.screen.content-screen .story-grid article::after,
.screen.content-screen .achievement::after,
.screen.content-screen .quest-card::after,
.screen.content-screen .vault-card::after,
.screen.content-screen .arena-card::after,
.screen.content-screen .power-card::after,
.screen.content-screen .shop-card::after,
.screen.content-screen .skin-card::after,
.screen.content-screen .profile-stats article::after,
.screen.content-screen .profile-badges article::after,
.screen.content-screen .save-slot-card::after,
.screen.content-screen .guide-grid article::after,
.screen.content-screen .setting-row::after,
.screen.content-screen .intro-objectives span::after,
.screen.content-screen .cinematic-scenes article::after {
  content: var(--card-icon) !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 50px !important;
  display: grid !important;
  place-items: center !important;
  color: var(--card-accent) !important;
  background: none !important;
  font-size: 22px !important;
  line-height: 1 !important;
  font-weight: 1000 !important;
  transform: none !important;
  opacity: 1 !important;
  text-shadow: 0 0 12px rgba(156,255,71,.35) !important;
  pointer-events: none !important;
}
.screen.content-screen .level-card:hover,
.screen.content-screen .world-gate-card:hover,
.screen.content-screen .story-grid article:hover,
.screen.content-screen .achievement:hover,
.screen.content-screen .quest-card:hover,
.screen.content-screen .vault-card:hover,
.screen.content-screen .arena-card:hover,
.screen.content-screen .power-card:hover,
.screen.content-screen .shop-card:hover,
.screen.content-screen .skin-card:hover,
.screen.content-screen .profile-stats article:hover,
.screen.content-screen .profile-badges article:hover,
.screen.content-screen .save-slot-card:hover,
.screen.content-screen .guide-grid article:hover,
.screen.content-screen .setting-row:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(140,255,55,.46) !important;
  background: var(--page-panel-bg-hover) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 20px 34px rgba(0,0,0,.22), 0 0 0 1px rgba(140,255,55,.12) !important;
}
.screen.content-screen .level-card { --card-icon: "▦"; --card-accent: #9cff47; min-height: 118px !important; padding: 14px 12px 14px 58px !important; }
.screen.content-screen .level-card.theme-lava { --card-accent: #ff8d42; }
.screen.content-screen .level-card.theme-sky { --card-accent: #10dfff; }
.screen.content-screen .level-card.theme-moon { --card-accent: #c9b5ff; }
.screen.content-screen .level-card.theme-root { --card-accent: #d6a65d; }
.screen.content-screen .level-card.theme-firefly { --card-accent: #ffe45d; }
.screen.content-screen .level-card.theme-shadow { --card-accent: #cf8cff; }
.screen.content-screen .world-gate-card { --card-icon: "◈"; --card-accent: #10dfff; min-height: 218px !important; }
.screen.content-screen .story-grid article { --card-icon: "☾"; --card-accent: #c9b5ff; }
.screen.content-screen .achievement { --card-icon: "★"; --card-accent: #ffd232; }
.screen.content-screen .achievement.locked { --card-icon: "⌁"; --card-accent: #7787a5; opacity: .76 !important; }
.screen.content-screen .quest-card { --card-icon: "★"; --card-accent: #ffd232; }
.screen.content-screen .quest-card.ready { --card-accent: #9cff47; }
.screen.content-screen .quest-card.claimed { --card-icon: "✓"; --card-accent: #10dfff; }
.screen.content-screen .quest-card.locked { --card-icon: "⌁"; --card-accent: #7787a5; }
.screen.content-screen .vault-card { --card-icon: "◆"; --card-accent: #c9b5ff; }
.screen.content-screen .vault-card.complete { --card-icon: "✓"; --card-accent: #9cff47; }
.screen.content-screen .arena-card { --card-icon: "⚔"; --card-accent: #ff9d42; min-height: 184px !important; }
.screen.content-screen .power-card { --card-icon: "✦"; --card-accent: #10dfff; min-height: 142px !important; }
.screen.content-screen .shop-card { --card-icon: "✚"; --card-accent: #ffd232; min-height: 220px !important; }
.screen.content-screen .shop-card.owned { --card-icon: "✓"; --card-accent: #9cff47; }
.screen.content-screen .skin-card { --card-icon: "◐"; --card-accent: #cf8cff; min-height: 230px !important; }
.screen.content-screen .skin-card.selected { --card-icon: "★"; --card-accent: #ffd232; }
.screen.content-screen .profile-stats article { --card-icon: "●"; --card-accent: #10dfff; }
.screen.content-screen .profile-badges article { --card-icon: "🏅"; --card-accent: #ffd232; }
.screen.content-screen .profile-badges article.locked { --card-icon: "⌁"; --card-accent: #7787a5; }
.screen.content-screen .save-slot-card { --card-icon: "▣"; --card-accent: #10dfff; min-height: 218px !important; }
.screen.content-screen .save-slot-card.active-slot { --card-icon: "✓"; --card-accent: #9cff47; }
.screen.content-screen .guide-grid article { --card-icon: "?"; --card-accent: #9cff47; }
.screen.content-screen .setting-row { --card-icon: "⚙"; --card-accent: #10dfff; max-width: 760px !important; min-height: 62px !important; margin-left: auto !important; margin-right: auto !important; }
.screen.content-screen .level-card strong { font-size: 28px !important; line-height: .9 !important; color: #fff !important; }
.screen.content-screen .level-card span,
.screen.content-screen .level-card small,
.screen.content-screen .level-card em { color: rgba(207,224,255,.78) !important; }
.screen.content-screen .level-card em { color: var(--page-gold) !important; font-style: normal !important; }
.screen.content-screen .level-card.locked { opacity: .56 !important; filter: grayscale(.45) !important; }
.screen.content-screen .shop-card-top,
.screen.content-screen .shop-card-bottom {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  position: relative !important;
  z-index: 2 !important;
}
.screen.content-screen .shop-icon {
  width: 38px !important;
  height: 38px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid var(--page-line-soft) !important;
  background: rgba(255,255,255,.08) !important;
  color: var(--card-accent) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12) !important;
}
.screen.content-screen .shop-tier,
.screen.content-screen .cost,
.screen.content-screen .level-medal,
.screen.content-screen .world-badge,
.screen.content-screen .slot-badge {
  display: inline-flex !important;
  width: max-content !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 9px !important;
  border-radius: 0 !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  background: rgba(255,255,255,.08) !important;
  color: var(--card-accent) !important;
  font-size: 10px !important;
  font-style: normal !important;
  font-weight: 1000 !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
}
.screen.content-screen .skin-preview {
  width: 58px !important;
  height: 58px !important;
  margin: 0 0 12px !important;
  border-radius: 0 !important;
  border: 1px solid var(--page-line-soft) !important;
  background: linear-gradient(180deg, var(--skin-a), var(--skin-b)) !important;
}
.screen.content-screen .vault-slots { margin-top: 12px !important; display: flex !important; flex-wrap: wrap !important; gap: 5px !important; }
.screen.content-screen .vault-slots i {
  width: 14px !important;
  height: 14px !important;
  border-radius: 0 !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background: rgba(255,255,255,.08) !important;
}
.screen.content-screen .vault-slots i.found { background: linear-gradient(180deg, var(--page-gold), #ff9d2e) !important; box-shadow: 0 0 12px rgba(255,210,50,.32) !important; }
.screen.content-screen .world-wallet,
.screen.content-screen .shop-wallet {
  width: min(1160px, 100%) !important;
  min-height: 64px !important;
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  margin: 0 auto 14px !important;
  padding: 10px 12px 10px 56px !important;
  position: relative !important;
  border-radius: 0 !important;
  border: 1px solid var(--page-line-soft) !important;
  background: linear-gradient(90deg, rgba(140,255,55,.12), rgba(16,223,255,.06), rgba(255,255,255,.02)) !important;
  color: #eaf3ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 14px 28px rgba(0,0,0,.16) !important;
}
.screen.content-screen .world-wallet::before,
.screen.content-screen .shop-wallet::before {
  content: "◈" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 42px !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid var(--page-line-soft) !important;
  color: var(--page-green) !important;
}
.screen.content-screen .world-wallet strong,
.screen.content-screen .shop-wallet strong,
.screen.content-screen #wardrobe-active {
  margin-right: auto !important;
  color: var(--page-green) !important;
  text-shadow: 0 0 14px rgba(156,255,71,.38) !important;
}
.screen.content-screen .setting-row span { color: #fff !important; font-weight: 1000 !important; }
.screen.content-screen .setting-row input[type="text"],
.screen.content-screen .setting-row select {
  min-height: 42px !important;
  border-radius: 0 !important;
  border: 1px solid var(--page-line-soft) !important;
  background: rgba(0,25,38,.78) !important;
  color: #fff !important;
}
.screen.content-screen .setting-row input[type="checkbox"] {
  width: 46px !important;
  height: 24px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  position: relative !important;
  border-radius: 0 !important;
  border: 1px solid var(--page-line-soft) !important;
  background: rgba(255,255,255,.08) !important;
  cursor: pointer !important;
}
.screen.content-screen .setting-row input[type="checkbox"]::before {
  content: "" !important;
  position: absolute !important;
  left: 3px !important;
  top: 3px !important;
  width: 16px !important;
  height: 16px !important;
  background: #bfd5ff !important;
  transition: transform .16s ease, background .16s ease !important;
}
.screen.content-screen .setting-row input[type="checkbox"]:checked { background: rgba(156,255,71,.20) !important; border-color: rgba(156,255,71,.55) !important; }
.screen.content-screen .setting-row input[type="checkbox"]:checked::before { transform: translateX(21px) !important; background: var(--page-green) !important; }
#screen-daily.content-screen .daily-chest {
  border-radius: 0 !important;
  border: 1px solid var(--page-line-soft) !important;
  background: var(--page-panel-bg) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 18px 34px rgba(0,0,0,.22) !important;
}
#screen-credits.content-screen .full-link,
#screen-settings.content-screen > .btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
@media (max-width: 980px) {
  .screen.content-screen .arena-grid,
  .screen.content-screen .power-room-grid,
  .screen.content-screen .shop-grid,
  .screen.content-screen .wardrobe-grid,
  .screen.content-screen .world-gates-grid,
  .screen.content-screen .save-slots-grid,
  .screen.content-screen .quest-grid,
  .screen.content-screen .vault-grid,
  .screen.content-screen .achievement-grid,
  .screen.content-screen .guide-grid,
  .screen.content-screen .story-grid,
  .screen.content-screen .profile-stats,
  .screen.content-screen .profile-badges { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important; }
  #level-grid { grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)) !important; }
}
@media (max-width: 640px) {
  .screen.content-screen.active { padding: max(92px, calc(var(--topbar-h) + 16px)) 10px 40px !important; }
  .screen.content-screen .world-wallet,
  .screen.content-screen .shop-wallet { flex-wrap: wrap !important; padding-left: 52px !important; }
  .screen.content-screen .arena-grid,
  .screen.content-screen .power-room-grid,
  .screen.content-screen .shop-grid,
  .screen.content-screen .wardrobe-grid,
  .screen.content-screen .world-gates-grid,
  .screen.content-screen .save-slots-grid,
  .screen.content-screen .quest-grid,
  .screen.content-screen .vault-grid,
  .screen.content-screen .achievement-grid,
  .screen.content-screen .guide-grid,
  .screen.content-screen .story-grid,
  .screen.content-screen .profile-stats,
  .screen.content-screen .profile-badges,
  #level-grid { grid-template-columns: 1fr !important; }
}

/* v1.25.14 — Inner pages premium polish pass.
   Keeps the open-content layout, but makes every internal page feel like a unified game dashboard:
   sharper Tanki-inspired cards, clearer buttons, stronger card states, cleaner spacing and better mobile grids. */
:root {
  --ui-bg-deep: rgba(0, 14, 22, .92);
  --ui-bg-mid: rgba(6, 28, 42, .86);
  --ui-line: rgba(191, 213, 255, .22);
  --ui-line-strong: rgba(191, 213, 255, .34);
  --ui-text: #ecf6ff;
  --ui-muted: rgba(207, 224, 255, .72);
  --ui-green: #9cff47;
  --ui-green-dark: #18883b;
  --ui-cyan: #10dfff;
  --ui-gold: #ffd232;
  --ui-purple: #c9b5ff;
}
.screen.content-screen.active {
  padding-top: max(108px, calc(var(--topbar-h) + 28px)) !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px) 0 0 / 64px 64px,
    linear-gradient(180deg, rgba(255,255,255,.035) 0 1px, transparent 1px) 0 0 / 64px 64px,
    radial-gradient(circle at 8% 12%, rgba(156,255,71,.14), transparent 29%),
    radial-gradient(circle at 88% 10%, rgba(16,223,255,.12), transparent 32%),
    linear-gradient(180deg, rgba(0, 25, 38, .88), rgba(0, 9, 18, .94)) !important;
}
.screen.content-screen.active::before {
  content: "";
  position: fixed;
  left: 0;
  right: 0;
  pointer-events: none;
  z-index: 0;
}
.screen.content-screen.active::before {
  top: var(--topbar-h);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(191,213,255,.32), transparent);
}
.screen.content-screen > * {
  position: relative !important;
  z-index: 1 !important;
}
.screen.content-screen .hint,
.screen.content-screen .setting-note,
.screen.content-screen .score-line,
.screen.content-screen > p:not([class]) {
  min-height: 48px !important;
  padding: 10px 16px 10px 58px !important;
  border-color: var(--ui-line) !important;
  background: linear-gradient(90deg, rgba(9, 34, 50, .92), rgba(4, 20, 32, .82)) !important;
  color: var(--ui-muted) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 16px 30px rgba(0,0,0,.18) !important;
}
.screen.content-screen .hint::before,
.screen.content-screen .setting-note::before,
.screen.content-screen .score-line::before,
.screen.content-screen > p:not([class])::before {
  width: 46px !important;
  background: linear-gradient(180deg, rgba(156,255,71,.13), rgba(16,223,255,.06)) !important;
  font-family: inherit !important;
}
.screen.content-screen .hint::after,
.screen.content-screen .setting-note::after,
.screen.content-screen .score-line::after,
.screen.content-screen > p:not([class])::after {
  content: "" !important;
  position: absolute !important;
  left: 46px !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 1px !important;
  background: var(--ui-line) !important;
}
.screen.content-screen .level-card,
.screen.content-screen .world-gate-card,
.screen.content-screen .story-grid article,
.screen.content-screen .achievement,
.screen.content-screen .quest-card,
.screen.content-screen .vault-card,
.screen.content-screen .arena-card,
.screen.content-screen .power-card,
.screen.content-screen .shop-card,
.screen.content-screen .skin-card,
.screen.content-screen .profile-stats article,
.screen.content-screen .profile-badges article,
.screen.content-screen .save-slot-card,
.screen.content-screen .guide-grid article,
.screen.content-screen .setting-row,
.screen.content-screen .intro-objectives span,
.screen.content-screen .cinematic-scenes article {
  background:
    linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(180deg, rgba(10, 38, 56, .92), rgba(2, 14, 24, .84)) !important;
  border-color: var(--ui-line) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 18px 36px rgba(0,0,0,.20) !important;
}
.screen.content-screen .level-card::before,
.screen.content-screen .world-gate-card::before,
.screen.content-screen .story-grid article::before,
.screen.content-screen .achievement::before,
.screen.content-screen .quest-card::before,
.screen.content-screen .vault-card::before,
.screen.content-screen .arena-card::before,
.screen.content-screen .power-card::before,
.screen.content-screen .shop-card::before,
.screen.content-screen .skin-card::before,
.screen.content-screen .profile-stats article::before,
.screen.content-screen .profile-badges article::before,
.screen.content-screen .save-slot-card::before,
.screen.content-screen .guide-grid article::before,
.screen.content-screen .setting-row::before,
.screen.content-screen .intro-objectives span::before,
.screen.content-screen .cinematic-scenes article::before {
  width: 54px !important;
  background:
    radial-gradient(circle at 50% 28%, color-mix(in srgb, var(--card-accent) 34%, transparent), transparent 54%),
    linear-gradient(180deg, rgba(255,255,255,.095), rgba(255,255,255,.02)) !important;
  border-right-color: var(--ui-line) !important;
}
.screen.content-screen .level-card::after,
.screen.content-screen .world-gate-card::after,
.screen.content-screen .story-grid article::after,
.screen.content-screen .achievement::after,
.screen.content-screen .quest-card::after,
.screen.content-screen .vault-card::after,
.screen.content-screen .arena-card::after,
.screen.content-screen .power-card::after,
.screen.content-screen .shop-card::after,
.screen.content-screen .skin-card::after,
.screen.content-screen .profile-stats article::after,
.screen.content-screen .profile-badges article::after,
.screen.content-screen .save-slot-card::after,
.screen.content-screen .guide-grid article::after,
.screen.content-screen .setting-row::after,
.screen.content-screen .intro-objectives span::after,
.screen.content-screen .cinematic-scenes article::after {
  width: 54px !important;
  font-size: 23px !important;
  text-shadow: 0 0 14px color-mix(in srgb, var(--card-accent) 48%, transparent) !important;
}
.screen.content-screen .level-card:hover,
.screen.content-screen .world-gate-card:hover,
.screen.content-screen .story-grid article:hover,
.screen.content-screen .achievement:hover,
.screen.content-screen .quest-card:hover,
.screen.content-screen .vault-card:hover,
.screen.content-screen .arena-card:hover,
.screen.content-screen .power-card:hover,
.screen.content-screen .shop-card:hover,
.screen.content-screen .skin-card:hover,
.screen.content-screen .profile-stats article:hover,
.screen.content-screen .profile-badges article:hover,
.screen.content-screen .save-slot-card:hover,
.screen.content-screen .guide-grid article:hover,
.screen.content-screen .setting-row:hover {
  transform: translateY(-3px) !important;
  border-color: color-mix(in srgb, var(--card-accent) 58%, rgba(191,213,255,.28)) !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.055) 0 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(180deg, rgba(18, 54, 60, .96), rgba(3, 21, 28, .88)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.17), 0 24px 44px rgba(0,0,0,.28), 0 0 0 1px color-mix(in srgb, var(--card-accent) 18%, transparent) !important;
}
.screen.content-screen .level-card strong,
.screen.content-screen .world-gate-card h3,
.screen.content-screen .story-grid strong,
.screen.content-screen .achievement strong,
.screen.content-screen .quest-card strong,
.screen.content-screen .vault-card strong,
.screen.content-screen .arena-card strong,
.screen.content-screen .power-card strong,
.screen.content-screen .shop-card strong,
.screen.content-screen .skin-card strong,
.screen.content-screen .profile-stats strong,
.screen.content-screen .profile-badges strong,
.screen.content-screen .save-slot-card h3,
.screen.content-screen .guide-grid strong {
  letter-spacing: .01em !important;
}
.screen.content-screen .world-gate-card ul,
.screen.content-screen .save-slot-card ul {
  display: grid !important;
  gap: 6px !important;
  margin: 12px 0 !important;
}
.screen.content-screen .world-gate-card li,
.screen.content-screen .save-slot-card li {
  border-radius: 0 !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.055) !important;
  color: rgba(224,238,255,.78) !important;
}
.screen.content-screen .btn {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  min-height: 46px !important;
}
.screen.content-screen .btn::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 auto 0 0 !important;
  width: 4px !important;
  background: var(--ui-cyan) !important;
  opacity: .75 !important;
  z-index: -1 !important;
}
.screen.content-screen .btn.primary::before { background: var(--ui-green) !important; }
.screen.content-screen .btn.danger::before { background: var(--ui-red, #ff4c6a) !important; }
.screen.content-screen .btn:hover::before { width: 100% !important; opacity: .16 !important; transition: width .18s ease, opacity .18s ease !important; }
.screen.content-screen .shop-card .btn,
.screen.content-screen .skin-card .btn,
.screen.content-screen .arena-card .btn,
.screen.content-screen .quest-card .btn,
.screen.content-screen .world-actions .btn,
.screen.content-screen .slot-actions .btn {
  width: 100% !important;
}
.screen.content-screen .shop-card.owned,
.screen.content-screen .quest-card.claimed,
.screen.content-screen .save-slot-card.active-slot,
.screen.content-screen .vault-card.complete,
.screen.content-screen .skin-card.selected {
  border-color: rgba(156,255,71,.42) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 20px 40px rgba(0,0,0,.22), 0 0 0 1px rgba(156,255,71,.10) !important;
}
.screen.content-screen .achievement.locked,
.screen.content-screen .quest-card.locked,
.screen.content-screen .level-card.locked,
.screen.content-screen .profile-badges article.locked {
  background: linear-gradient(180deg, rgba(18, 26, 36, .72), rgba(5, 12, 20, .68)) !important;
  border-color: rgba(191,213,255,.12) !important;
}
.screen.content-screen .skin-preview span {
  box-shadow: 0 0 0 2px rgba(255,255,255,.18) inset !important;
}
.screen.content-screen .profile-stats article,
.screen.content-screen .profile-badges article {
  min-height: 90px !important;
}
.screen.content-screen .profile-stats article strong {
  font-size: 20px !important;
  color: var(--ui-green) !important;
}
.screen.content-screen .profile-stats article span {
  text-transform: uppercase !important;
  letter-spacing: .075em !important;
  font-size: 11px !important;
}
.screen.content-screen .world-wallet,
.screen.content-screen .shop-wallet {
  background: linear-gradient(90deg, rgba(8, 34, 50, .96), rgba(3, 17, 28, .88)) !important;
  border-color: var(--ui-line) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 18px 36px rgba(0,0,0,.22) !important;
}
.screen.content-screen .world-wallet .btn,
.screen.content-screen .shop-wallet .btn {
  min-height: 40px !important;
}
#screen-levels.content-screen #level-grid {
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
}
#screen-levels.content-screen .level-card {
  min-height: 132px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}
#screen-levels.content-screen .level-card strong {
  font-size: 31px !important;
}
#screen-shop.content-screen .shop-grid,
#screen-wardrobe.content-screen .wardrobe-grid,
#screen-world-gates.content-screen .world-gates-grid,
#screen-save-slots.content-screen .save-slots-grid {
  grid-template-columns: repeat(auto-fill, minmax(305px, 1fr)) !important;
}
#screen-how.content-screen .guide-grid,
#screen-journal.content-screen .guide-grid {
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)) !important;
}
#screen-settings.content-screen .setting-row {
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  gap: 18px !important;
}
@media (max-width: 700px) {
  .screen.content-screen.active {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .screen.content-screen .level-card,
  .screen.content-screen .world-gate-card,
  .screen.content-screen .story-grid article,
  .screen.content-screen .achievement,
  .screen.content-screen .quest-card,
  .screen.content-screen .vault-card,
  .screen.content-screen .arena-card,
  .screen.content-screen .power-card,
  .screen.content-screen .shop-card,
  .screen.content-screen .skin-card,
  .screen.content-screen .profile-stats article,
  .screen.content-screen .profile-badges article,
  .screen.content-screen .save-slot-card,
  .screen.content-screen .guide-grid article,
  .screen.content-screen .setting-row {
    padding-left: 60px !important;
  }
  #screen-shop.content-screen .shop-grid,
  #screen-wardrobe.content-screen .wardrobe-grid,
  #screen-world-gates.content-screen .world-gates-grid,
  #screen-save-slots.content-screen .save-slots-grid,
  #screen-how.content-screen .guide-grid,
  #screen-journal.content-screen .guide-grid,
  #screen-levels.content-screen #level-grid {
    grid-template-columns: 1fr !important;
  }
}


/* v1.25.15 — Level Intro screen converted to the same open-content dashboard design.
   It no longer uses the old centered panel; the content is a Tanki-style launch card, objective cards and a full launch button. */
#screen-level-intro.level-launch-screen.active {
  display: block !important;
  place-items: initial !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
#screen-level-intro .level-launch-layout {
  width: min(1180px, 100%) !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  gap: 12px !important;
}
#screen-level-intro .level-launch-card {
  --card-icon: "▶";
  --card-accent: var(--ui-green, #9cff47);
  position: relative !important;
  display: grid !important;
  grid-template-columns: 116px minmax(0, 1fr) !important;
  min-height: 210px !important;
  border-radius: 0 !important;
  border: 1px solid var(--ui-line, rgba(191,213,255,.22)) !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(180deg, rgba(10, 38, 56, .92), rgba(2, 14, 24, .84)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 20px 44px rgba(0,0,0,.22) !important;
  overflow: hidden !important;
  color: var(--ui-text, #ecf6ff) !important;
}
#screen-level-intro .level-launch-card::before {
  content: "" !important;
  position: absolute !important;
  left: 116px !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 1px !important;
  background: var(--ui-line, rgba(191,213,255,.22)) !important;
}
#screen-level-intro .level-launch-rank {
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 4px !important;
  min-height: 100% !important;
  background:
    radial-gradient(circle at 50% 30%, rgba(156,255,71,.18), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,.095), rgba(255,255,255,.02)) !important;
}
#screen-level-intro .level-launch-rank strong {
  display: block !important;
  color: #fff !important;
  font-size: clamp(42px, 7vw, 78px) !important;
  line-height: .82 !important;
  font-weight: 1000 !important;
  letter-spacing: -.06em !important;
  text-shadow: 0 0 22px rgba(156,255,71,.32), 0 2px 12px rgba(0,0,0,.45) !important;
}
#screen-level-intro .level-launch-rank span {
  color: var(--ui-green, #9cff47) !important;
  font-size: 11px !important;
  font-weight: 1000 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}
#screen-level-intro .level-launch-copy {
  min-width: 0 !important;
  padding: clamp(18px, 3vw, 28px) !important;
  display: grid !important;
  align-content: center !important;
  gap: 12px !important;
}
#screen-level-intro .level-launch-copy .eyebrow {
  width: max-content !important;
  margin: 0 !important;
  padding: 7px 10px !important;
  border: 1px solid rgba(156,255,71,.30) !important;
  background: rgba(156,255,71,.08) !important;
  color: var(--ui-green, #9cff47) !important;
  font-size: 11px !important;
  line-height: 1 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  font-weight: 1000 !important;
}
#screen-level-intro .level-launch-copy h2 {
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(28px, 4vw, 54px) !important;
  line-height: .98 !important;
  font-weight: 1000 !important;
  letter-spacing: -.035em !important;
  text-shadow: 0 12px 34px rgba(0,0,0,.34) !important;
}
#screen-level-intro .level-launch-copy .score-line {
  width: 100% !important;
  margin: 2px 0 0 !important;
}
#screen-level-intro .intro-objectives {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  margin: 0 !important;
}
#screen-level-intro .intro-objectives span {
  --card-icon: "✦";
  --card-accent: var(--ui-cyan, #10dfff);
  min-height: 96px !important;
  display: flex !important;
  align-items: center !important;
  text-align: left !important;
  justify-content: flex-start !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
}
#screen-level-intro .intro-objectives span:nth-child(2) { --card-icon: "★"; --card-accent: var(--ui-gold, #ffd232); }
#screen-level-intro .intro-objectives span:nth-child(3) { --card-icon: "↧"; --card-accent: var(--ui-purple, #c9b5ff); }
#screen-level-intro .intro-objectives span:nth-child(4) { --card-icon: "⚡"; --card-accent: var(--ui-green, #9cff47); }
#screen-level-intro .level-launch-btn {
  width: 100% !important;
  min-height: 58px !important;
  margin: 0 !important;
  font-size: 14px !important;
  letter-spacing: .08em !important;
}
#screen-level-intro .level-launch-btn::after {
  content: "Press Enter / Start" !important;
  display: inline-block !important;
  margin-left: 12px !important;
  opacity: .65 !important;
  font-size: 11px !important;
  letter-spacing: .08em !important;
}
@media (max-width: 980px) {
  #screen-level-intro .intro-objectives { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 640px) {
  #screen-level-intro .level-launch-card { grid-template-columns: 82px minmax(0, 1fr) !important; min-height: 190px !important; }
  #screen-level-intro .level-launch-card::before { left: 82px !important; }
  #screen-level-intro .level-launch-rank strong { font-size: 42px !important; }
  #screen-level-intro .intro-objectives { grid-template-columns: 1fr !important; }
  #screen-level-intro .level-launch-copy { padding: 18px !important; }
  #screen-level-intro .level-launch-btn::after { display: none !important; }
}

/* v1.25.16 — continue page polish: Cinematic Intro, Daily Reward and lightweight overlays now follow the same header-led dashboard language. */
#screen-cinematic.cinematic-open-screen.active {
  display: block !important;
  place-items: initial !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
#screen-cinematic .cinematic-launch-layout {
  width: min(1240px, 100%) !important;
  margin: 0 auto !important;
  display: grid !important;
  gap: 12px !important;
}
#screen-cinematic .cinematic-scene-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(420px, 1.25fr) minmax(300px, .75fr) !important;
  min-height: 430px !important;
  border-radius: 0 !important;
  border: 1px solid var(--ui-line, rgba(191,213,255,.22)) !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(180deg, rgba(10, 38, 56, .92), rgba(2, 14, 24, .86)) !important;
  color: var(--ui-text, #ecf6ff) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 20px 44px rgba(0,0,0,.24) !important;
  overflow: hidden !important;
}
#screen-cinematic .cinematic-scene-card::after {
  content: "" !important;
  position: absolute !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 58.5% !important;
  width: 1px !important;
  background: var(--ui-line, rgba(191,213,255,.22)) !important;
  pointer-events: none !important;
}
#screen-cinematic .intro-game-stage {
  width: 100% !important;
  height: 100% !important;
  min-height: 430px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
#screen-cinematic .cinematic-copy-card {
  position: relative !important;
  z-index: 2 !important;
  display: grid !important;
  align-content: center !important;
  gap: 14px !important;
  padding: clamp(18px, 3vw, 30px) !important;
  background:
    radial-gradient(circle at 90% 10%, rgba(16,223,255,.12), transparent 35%),
    linear-gradient(180deg, rgba(5, 24, 38, .80), rgba(0, 12, 22, .72)) !important;
}
#screen-cinematic .cinematic-lead {
  width: 100% !important;
  margin: 0 !important;
  padding: 14px 16px 14px 58px !important;
  min-height: 78px !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  border: 1px solid var(--ui-line, rgba(191,213,255,.22)) !important;
  background: linear-gradient(90deg, rgba(9, 34, 50, .92), rgba(4, 20, 32, .82)) !important;
  color: var(--ui-muted, rgba(207,224,255,.72)) !important;
  font-size: 13px !important;
  line-height: 1.55 !important;
  font-weight: 800 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 14px 28px rgba(0,0,0,.16) !important;
}
#screen-cinematic .cinematic-lead::before {
  content: "i" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 46px !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid var(--ui-line, rgba(191,213,255,.22)) !important;
  color: var(--ui-green, #9cff47) !important;
  font-weight: 1000 !important;
  text-shadow: 0 0 14px rgba(156,255,71,.38) !important;
}
#screen-cinematic .cinematic-scenes {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
  margin: 0 !important;
}
#screen-cinematic .cinematic-scenes article {
  --card-icon: "✦";
  --card-accent: var(--ui-cyan, #10dfff);
  min-height: 92px !important;
  padding-left: 66px !important;
}
#screen-cinematic .cinematic-scenes article:nth-child(2) { --card-icon: "↧"; --card-accent: var(--ui-purple, #c9b5ff); }
#screen-cinematic .cinematic-scenes article:nth-child(3) { --card-icon: "❀"; --card-accent: var(--ui-green, #9cff47); }
#screen-cinematic .cinematic-scenes article > span {
  display: none !important;
}
#screen-cinematic .cinematic-scenes article em {
  display: block !important;
  margin-top: 4px !important;
  color: var(--ui-muted, rgba(207,224,255,.72)) !important;
  font-style: normal !important;
}
#screen-cinematic .cinematic-actions {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 260px) !important;
  gap: 10px !important;
  margin: 0 !important;
}
#screen-cinematic .cinematic-actions .btn {
  width: 100% !important;
  min-height: 58px !important;
}
#screen-daily.content-screen.active {
  display: grid !important;
  align-content: start !important;
  justify-items: center !important;
  gap: 12px !important;
}
#screen-daily.content-screen .daily-chest {
  width: min(520px, 100%) !important;
  height: 240px !important;
  margin: 0 auto !important;
  border: 1px solid var(--ui-line, rgba(191,213,255,.22)) !important;
  border-radius: 0 !important;
  background:
    radial-gradient(circle at 50% 44%, rgba(255,210,50,.22), transparent 32%),
    linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(180deg, rgba(10, 38, 56, .92), rgba(2, 14, 24, .84)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 22px 44px rgba(0,0,0,.26) !important;
  animation: none !important;
  overflow: hidden !important;
}
#screen-daily.content-screen .daily-chest::after {
  content: "REWARD" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 74px !important;
  display: grid !important;
  place-items: center !important;
  writing-mode: vertical-rl !important;
  transform: rotate(180deg) !important;
  border-left: 1px solid rgba(255,255,255,.14) !important;
  background: linear-gradient(180deg, rgba(255,210,50,.18), rgba(156,255,71,.08)) !important;
  color: var(--ui-gold, #ffd232) !important;
  letter-spacing: .18em !important;
  font-weight: 1000 !important;
}
#screen-daily.content-screen .score-line,
#screen-daily.content-screen #daily-reward-button {
  width: min(520px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
#screen-credits.content-screen.active {
  display: grid !important;
  align-content: start !important;
  justify-items: center !important;
  gap: 12px !important;
}
#screen-credits.content-screen .full-link {
  width: min(680px, 100%) !important;
  min-height: 58px !important;
}
@media (max-width: 980px) {
  #screen-cinematic .cinematic-scene-card {
    grid-template-columns: 1fr !important;
  }
  #screen-cinematic .cinematic-scene-card::after { display: none !important; }
  #screen-cinematic .intro-game-stage { min-height: 260px !important; height: 260px !important; }
}
@media (max-width: 640px) {
  #screen-cinematic .cinematic-actions { grid-template-columns: 1fr !important; }
  #screen-cinematic .intro-game-stage { min-height: 210px !important; height: 210px !important; }
  #screen-cinematic .cinematic-copy-card { padding: 12px !important; }
  #screen-daily.content-screen .daily-chest { height: 200px !important; }
}

/* v1.25.17 — Rewards Center + Battle Pass demo + premium page polish. */
#screen-daily.rewards-screen.active {
  display: block !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
#screen-daily.rewards-screen > * {
  width: min(1380px, 100%) !important;
}
.rewards-hero-card,
.battle-pass-panel,
.reward-tile,
.milestone-card,
.battle-pass-tier {
  position: relative !important;
  border-radius: 0 !important;
  border: 1px solid var(--page-line, rgba(191,213,255,.24)) !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(180deg, rgba(8, 31, 48, .92), rgba(1, 13, 22, .84)) !important;
  color: #ecf6ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 20px 42px rgba(0,0,0,.22) !important;
  overflow: hidden !important;
}
.rewards-hero-card {
  min-height: 230px !important;
  display: grid !important;
  grid-template-columns: 94px minmax(0, 1fr) minmax(280px, 420px) !important;
  margin: 0 auto 12px !important;
}
.rewards-hero-card::before,
.battle-pass-panel::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(circle at 18% 18%, rgba(156,255,71,.15), transparent 28%),
    radial-gradient(circle at 82% 10%, rgba(16,223,255,.12), transparent 30%) !important;
  pointer-events: none !important;
}
.rewards-hero-rail {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 8px !important;
  border-right: 1px solid var(--page-line, rgba(191,213,255,.24)) !important;
  background: radial-gradient(100% 100% at 0% 0%, rgba(255,204,0,.55), rgba(255,38,74,.18) 54%, rgba(255,38,74,0)) !important;
  text-align: center !important;
}
.rewards-hero-rail span { font-size: 36px !important; line-height: 1 !important; color: var(--page-gold, #ffd232) !important; text-shadow: 0 0 22px rgba(255,210,50,.34) !important; }
.rewards-hero-rail strong { font-size: 13px !important; letter-spacing: .18em !important; color: #fff !important; writing-mode: vertical-rl !important; transform: rotate(180deg) !important; text-transform: uppercase !important; }
.rewards-hero-rail em { font-style: normal !important; font-size: 10px !important; color: rgba(234,243,255,.58) !important; text-transform: uppercase !important; letter-spacing: .08em !important; }
.rewards-hero-main {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  align-content: center !important;
  gap: 12px !important;
  padding: clamp(18px, 3vw, 34px) !important;
  border-right: 1px solid var(--page-line, rgba(191,213,255,.24)) !important;
}
.rewards-kicker,
.battle-pass-label {
  width: max-content !important;
  margin: 0 !important;
  padding: 7px 10px !important;
  border: 1px solid rgba(156,255,71,.30) !important;
  background: rgba(156,255,71,.08) !important;
  color: var(--page-green, #9cff47) !important;
  font-size: 11px !important;
  line-height: 1 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
  font-weight: 1000 !important;
}
.rewards-hero-main .score-line {
  width: 100% !important;
  margin: 0 !important;
}
.rewards-hero-actions {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 180px 180px !important;
  gap: 10px !important;
}
.rewards-hero-actions .btn { width: 100% !important; min-height: 54px !important; }
.rewards-hero-stats {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
}
.rewards-hero-stats article {
  display: grid !important;
  align-content: center !important;
  gap: 4px !important;
  min-height: 74px !important;
  padding: 14px 18px !important;
  border-bottom: 1px solid var(--page-line-soft, rgba(191,213,255,.14)) !important;
  background: linear-gradient(90deg, rgba(255,255,255,.035), rgba(255,255,255,0)) !important;
}
.rewards-hero-stats article:last-child { border-bottom: 0 !important; }
.rewards-hero-stats span { color: rgba(191,213,255,.62) !important; text-transform: uppercase !important; font-size: 11px !important; font-weight: 900 !important; letter-spacing: .08em !important; }
.rewards-hero-stats strong { font-size: 34px !important; line-height: .95 !important; color: #fff !important; }
.rewards-hero-stats em { font-size: 12px !important; color: var(--page-green, #9cff47) !important; font-style: normal !important; font-weight: 900 !important; }
.reward-tile-grid,
.milestone-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)) !important;
  gap: 10px !important;
  margin: 12px auto !important;
}
.reward-tile,
.milestone-card {
  min-height: 174px !important;
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr) !important;
  grid-template-areas: "icon title" "icon desc" "icon action" !important;
  align-content: stretch !important;
  gap: 8px 12px !important;
  padding: 18px !important;
  padding-left: 76px !important;
}
.reward-tile::before,
.milestone-card::before {
  content: "" !important;
  position: absolute !important;
  left: 58px !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 1px !important;
  background: var(--page-line, rgba(191,213,255,.24)) !important;
}
.reward-tile > i,
.milestone-card > i {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 58px !important;
  height: 100% !important;
  display: grid !important;
  place-items: center !important;
  font-style: normal !important;
  font-size: 24px !important;
  color: var(--page-gold, #ffd232) !important;
  background: rgba(255,255,255,.035) !important;
}
.reward-tile strong,
.milestone-card strong { color: #fff !important; font-size: 18px !important; line-height: 1.05 !important; align-self: end !important; }
.reward-tile span,
.milestone-card span { color: rgba(207,224,255,.72) !important; line-height: 1.45 !important; font-size: 13px !important; font-weight: 750 !important; }
.reward-tile .btn,
.milestone-card .btn { width: 100% !important; align-self: end !important; }
.reward-tile.is-ready,
.milestone-card.ready:not(.claimed) { border-color: rgba(156,255,71,.46) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 20px 42px rgba(44,190,75,.12) !important; }
.milestone-card.claimed { opacity: .72 !important; }
.milestone-card em {
  display: block !important;
  color: rgba(191,213,255,.68) !important;
  font-style: normal !important;
  font-weight: 900 !important;
  font-size: 12px !important;
}
.mini-progress {
  height: 7px !important;
  background: rgba(255,255,255,.10) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  overflow: hidden !important;
}
.mini-progress b {
  display: block !important;
  height: 100% !important;
  background: linear-gradient(90deg, var(--page-green, #9cff47), var(--page-cyan, #10dfff)) !important;
}
.battle-pass-panel {
  margin: 12px auto !important;
  padding: 0 !important;
}
.battle-pass-summary {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 240px !important;
  gap: 12px !important;
  align-items: center !important;
  padding: 18px !important;
  border-bottom: 1px solid var(--page-line, rgba(191,213,255,.24)) !important;
}
.battle-pass-summary strong {
  display: block !important;
  margin-top: 8px !important;
  color: #fff !important;
  font-size: clamp(24px, 3vw, 38px) !important;
  letter-spacing: -.03em !important;
}
.battle-pass-summary em { color: rgba(207,224,255,.70) !important; font-style: normal !important; font-weight: 800 !important; }
.battle-pass-track {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-columns: repeat(6, minmax(150px, 1fr)) !important;
  gap: 0 !important;
  overflow-x: auto !important;
}
.battle-pass-tier {
  min-width: 160px !important;
  min-height: 210px !important;
  display: grid !important;
  justify-items: center !important;
  align-content: center !important;
  gap: 8px !important;
  padding: 16px !important;
  border-width: 0 1px 0 0 !important;
  box-shadow: none !important;
  background: linear-gradient(180deg, rgba(10,35,53,.72), rgba(2,14,24,.68)) !important;
}
.battle-pass-tier:last-child { border-right: 0 !important; }
.tier-level {
  width: 54px !important;
  height: 54px !important;
  display: grid !important;
  place-items: center !important;
  background: linear-gradient(180deg, rgba(156,255,71,.18), rgba(16,223,255,.08)) !important;
  border: 1px solid rgba(156,255,71,.28) !important;
}
.tier-level strong { color: #fff !important; font-size: 20px !important; line-height: .9 !important; }
.tier-level span { color: var(--page-green, #9cff47) !important; font-size: 9px !important; font-weight: 1000 !important; letter-spacing: .12em !important; }
.battle-pass-tier > i { font-style: normal !important; font-size: 28px !important; }
.battle-pass-tier > b { text-align: center !important; color: #fff !important; font-size: 15px !important; }
.battle-pass-tier > small { min-height: 28px !important; text-align: center !important; color: rgba(207,224,255,.68) !important; font-weight: 800 !important; }
.battle-pass-tier.unlocked:not(.premium-tier) { background: linear-gradient(180deg, rgba(20,62,47,.90), rgba(3,20,26,.78)) !important; }
.battle-pass-tier.claimed { opacity: .68 !important; }
.battle-pass-tier.premium-tier { background: linear-gradient(180deg, rgba(65,39,85,.82), rgba(22,13,34,.78)) !important; }
@media (max-width: 980px) {
  .rewards-hero-card { grid-template-columns: 74px minmax(0, 1fr) !important; }
  .rewards-hero-stats { grid-column: 1 / -1 !important; grid-template-columns: repeat(3, 1fr) !important; border-top: 1px solid var(--page-line, rgba(191,213,255,.24)) !important; }
  .rewards-hero-stats article { border-bottom: 0 !important; border-right: 1px solid var(--page-line-soft, rgba(191,213,255,.14)) !important; }
  .rewards-hero-stats article:last-child { border-right: 0 !important; }
  .rewards-hero-actions { grid-template-columns: 1fr !important; }
  .battle-pass-summary { grid-template-columns: 1fr !important; }
  .battle-pass-track { grid-template-columns: repeat(6, 165px) !important; }
}
@media (max-width: 640px) {
  .rewards-hero-card { grid-template-columns: 1fr !important; }
  .rewards-hero-rail { min-height: 74px !important; border-right: 0 !important; border-bottom: 1px solid var(--page-line, rgba(191,213,255,.24)) !important; grid-auto-flow: column !important; }
  .rewards-hero-rail strong { writing-mode: initial !important; transform: none !important; }
  .rewards-hero-main { border-right: 0 !important; }
  .rewards-hero-stats { grid-template-columns: 1fr !important; }
  .rewards-hero-stats article { border-right: 0 !important; border-bottom: 1px solid var(--page-line-soft, rgba(191,213,255,.14)) !important; }
}


/* v1.25.18 — Unified dashboard polish: text header, no floating homepage scene, cleaner pages. */
#menu-global-header .topbar-logo strong {
  letter-spacing: 0.01em !important;
  word-spacing: .05em !important;
}
#menu-global-header .topbar-logo:not(.is-page-title) strong {
  text-transform: none !important;
  font-weight: 1000 !important;
}
#screen-main.screen.active {
  place-items: center !important;
  overflow: auto !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(16,223,255,.13), transparent 34%),
    radial-gradient(circle at 18% 22%, rgba(156,255,71,.07), transparent 28%),
    linear-gradient(180deg, rgba(4,22,34,.94), rgba(1,8,16,.98)) !important;
}
#screen-main .menu-stage {
  width: min(1320px, calc(100vw - 64px)) !important;
  min-width: 0 !important;
  max-width: 1320px !important;
  margin: clamp(88px, 11vh, 128px) auto 42px !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-items: center !important;
  justify-items: stretch !important;
  z-index: 2 !important;
}
#screen-main .home-menu-panel {
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
#screen-main .berry-main-menu {
  width: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(220px, 300px) minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
}
#screen-main .berry-menu-grid {
  grid-template-columns: repeat(4, minmax(160px, 1fr)) !important;
  gap: 10px !important;
}
#screen-main .berry-play-button,
#screen-main .berry-menu-item {
  border-radius: 0 !important;
}
#screen-main .berry-play-button {
  min-height: 100% !important;
}
#screen-main .berry-menu-item {
  min-height: 86px !important;
}
.content-screen {
  width: 100% !important;
  padding: clamp(88px, 10vh, 126px) clamp(18px, 3vw, 44px) 42px !important;
  align-content: start !important;
  justify-content: center !important;
  overflow-y: auto !important;
}
.content-screen > :where(.hint, .score-line, p:not([class]), .shop-wallet, .world-wallet, .rewards-hero-card, .battle-pass-panel, .level-intro-card, .cinematic-dashboard, .daily-reward-card, .credits-card, .setting-note),
.content-screen > :where(.level-grid, .world-gates-grid, .story-grid, .achievement-grid, .quest-grid, .vault-grid, .arena-grid, .power-room-grid, .shop-grid, .wardrobe-grid, .profile-stats, .profile-badges, .save-slots-grid, .guide-grid, .reward-tile-grid, .milestone-grid) {
  width: min(1380px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.content-screen > .hint,
.content-screen > .setting-note,
.content-screen > p:not([class]) {
  position: relative !important;
  min-height: 54px !important;
  display: flex !important;
  align-items: center !important;
  padding: 14px 18px 14px 64px !important;
  margin-bottom: 12px !important;
  border: 1px solid rgba(191,213,255,.22) !important;
  background: linear-gradient(90deg, rgba(191,213,255,.08), rgba(191,213,255,.02)) !important;
  color: rgba(234,243,255,.78) !important;
  font-weight: 800 !important;
  line-height: 1.45 !important;
}
.content-screen > .hint::before,
.content-screen > .setting-note::before,
.content-screen > p:not([class])::before {
  content: "i" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 48px !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid rgba(191,213,255,.22) !important;
  color: #9cff47 !important;
  font-weight: 1000 !important;
  font-style: italic !important;
  background: rgba(255,255,255,.035) !important;
}
.content-screen .btn,
.content-screen button.btn,
.content-screen a.btn,
.content-screen .full-link {
  border-radius: 0 !important;
  min-height: 46px !important;
  text-transform: uppercase !important;
  letter-spacing: .05em !important;
  font-size: 12px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 10px 22px rgba(0,0,0,.18) !important;
}
.content-screen :where(.level-card, .world-gate-card, .achievement, .quest-card, .vault-card, .arena-card, .power-card, .shop-card, .skin-card, .profile-stats article, .profile-badges article, .save-slot-card, .guide-grid article, .story-grid article, .reward-tile, .milestone-card) {
  border-radius: 0 !important;
  border: 1px solid rgba(191,213,255,.24) !important;
  background: linear-gradient(180deg, rgba(9,31,47,.86), rgba(2,13,22,.82)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 16px 34px rgba(0,0,0,.18) !important;
}
.content-screen :where(.level-card, .world-gate-card, .achievement, .quest-card, .vault-card, .arena-card, .power-card, .shop-card, .skin-card, .profile-stats article, .profile-badges article, .save-slot-card, .guide-grid article, .story-grid article, .reward-tile, .milestone-card):hover {
  transform: translateY(-2px) !important;
  border-color: rgba(156,255,71,.44) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 22px 46px rgba(16,223,255,.08), 0 16px 34px rgba(0,0,0,.24) !important;
}
.content-screen :where(.world-gates-grid, .quest-grid, .vault-grid, .arena-grid, .power-room-grid, .shop-grid, .wardrobe-grid, .save-slots-grid, .guide-grid, .story-grid, .achievement-grid, .profile-stats, .profile-badges) {
  gap: 10px !important;
}
.content-screen .level-grid {
  grid-template-columns: repeat(auto-fill, minmax(172px, 1fr)) !important;
  gap: 10px !important;
}
.content-screen .level-card strong:first-child {
  color: #fff !important;
  text-shadow: 0 0 14px rgba(16,223,255,.18) !important;
}
.content-screen .shop-wallet,
.content-screen .world-wallet {
  border-radius: 0 !important;
  border: 1px solid rgba(191,213,255,.24) !important;
  background: linear-gradient(90deg, rgba(156,255,71,.10), rgba(16,223,255,.04)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 18px 34px rgba(0,0,0,.16) !important;
}
@media (max-width: 1280px) {
  #screen-main .menu-stage {
    width: min(1120px, calc(100vw - 36px)) !important;
    margin-top: clamp(110px, 13vh, 150px) !important;
  }
  #screen-main .berry-main-menu { grid-template-columns: 1fr !important; }
  #screen-main .berry-play-button { min-height: 105px !important; }
  #screen-main .berry-menu-grid { grid-template-columns: repeat(3, minmax(150px, 1fr)) !important; }
}
@media (max-width: 820px) {
  #screen-main .berry-menu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .content-screen { padding-inline: 12px !important; }
}

/* v1.25.19 — Homepage background effect cleanup.
   Removed the old global cloud/grass pseudo-background and applied a clean Tanki-style
   reward/background atmosphere only to the homepage. */
#screen-main.screen.active {
  position: absolute !important;
  isolation: isolate !important;
  overflow: hidden auto !important;
  background:
    radial-gradient(50% 100% at 50% 100%, rgba(57, 86, 115, .88) 0%, rgba(0, 25, 38, .92) 52%, rgba(0, 8, 15, .98) 100%),
    linear-gradient(180deg, #001926 0%, #00070d 100%) !important;
  backdrop-filter: none !important;
}
#screen-main.screen.active::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 50% 52%, rgba(140, 220, 255, .22) 0%, rgba(84, 147, 198, .10) 22%, transparent 48%),
    radial-gradient(circle at 18% 16%, rgba(156, 255, 71, .16), transparent 28%),
    radial-gradient(circle at 84% 18%, rgba(16, 223, 255, .14), transparent 28%),
    linear-gradient(110deg, transparent 0 17%, rgba(191, 213, 255, .055) 17.2% 17.6%, transparent 17.8% 36%, rgba(191, 213, 255, .045) 36.2% 36.6%, transparent 36.8% 67%, rgba(191, 213, 255, .04) 67.2% 67.6%, transparent 67.8% 100%);
  opacity: .95 !important;
}
#screen-main.screen.active::after {
  content: "" !important;
  position: absolute !important;
  inset: -12% !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, transparent 0 49%, rgba(191, 213, 255, .075) 50%, transparent 51% 100%),
    repeating-linear-gradient(90deg, rgba(191, 213, 255, .03) 0 1px, transparent 1px 12.5vw),
    repeating-linear-gradient(0deg, rgba(191, 213, 255, .022) 0 1px, transparent 1px 10vh);
  mask-image: radial-gradient(ellipse at center, #000 0 62%, transparent 82%);
  opacity: .58 !important;
  animation: homeRewardAura 13s ease-in-out infinite alternate;
}
#screen-main .menu-stage,
#screen-main .home-menu-panel,
#screen-main .berry-main-menu {
  position: relative !important;
  z-index: 2 !important;
}
@keyframes homeRewardAura {
  from { transform: translate3d(-1.5%, -1%, 0) scale(1.01); opacity: .46; }
  to { transform: translate3d(1.5%, 1%, 0) scale(1.04); opacity: .66; }
}



/* v1.25.20 — homepage no-scroll and faster menu hover */
/* The homepage fits inside one viewport, so it must never show a browser/default scrollbar. */
#screen-main.screen,
#screen-main.screen.active {
  overflow: hidden !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
  overscroll-behavior: none !important;
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
}
#screen-main.screen::-webkit-scrollbar,
#screen-main.screen.active::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

/* Keep the new Tanki-like background, but remove the heavy animated layer that made hover feel delayed. */
#screen-main.screen.active {
  background:
    radial-gradient(50% 100% at 50% 100%, rgba(57, 86, 115, .88) 0%, rgba(0, 25, 38, .92) 52%, rgba(0, 8, 15, .98) 100%),
    linear-gradient(180deg, #001926 0%, #00070d 100%) !important;
  backdrop-filter: none !important;
}
#screen-main.screen.active::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 50% 52%, rgba(140, 220, 255, .20) 0%, rgba(84, 147, 198, .09) 22%, transparent 48%),
    radial-gradient(circle at 18% 16%, rgba(156, 255, 71, .14), transparent 28%),
    radial-gradient(circle at 84% 18%, rgba(16, 223, 255, .12), transparent 28%),
    linear-gradient(110deg, transparent 0 17%, rgba(191, 213, 255, .045) 17.2% 17.55%, transparent 17.8% 36%, rgba(191, 213, 255, .035) 36.2% 36.55%, transparent 36.8% 67%, rgba(191, 213, 255, .032) 67.2% 67.55%, transparent 67.8% 100%) !important;
  opacity: .92 !important;
  transform: translateZ(0) !important;
}
#screen-main.screen.active::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background:
    repeating-linear-gradient(90deg, rgba(191, 213, 255, .022) 0 1px, transparent 1px 12.5vw),
    repeating-linear-gradient(0deg, rgba(191, 213, 255, .016) 0 1px, transparent 1px 10vh) !important;
  opacity: .34 !important;
  animation: none !important;
  transform: none !important;
  mask-image: none !important;
}

/* Make homepage menu hover instant and light. Do not animate gradients or large shadows. */
#screen-main .berry-play-button,
#screen-main .berry-menu-item {
  transition: transform .065s ease-out, border-color .065s ease-out, box-shadow .065s ease-out, filter .065s ease-out !important;
  will-change: transform !important;
  transform: translateZ(0) !important;
  backface-visibility: hidden !important;
  contain: paint !important;
}
#screen-main .berry-play-button:hover,
#screen-main .berry-menu-item:hover {
  transform: translate3d(0, -2px, 0) !important;
  filter: brightness(1.04) !important;
}
#screen-main .berry-play-button:active,
#screen-main .berry-menu-item:active {
  transform: translate3d(0, 1px, 0) !important;
  transition-duration: .035s !important;
}

/* Remove legacy decorative classes from affecting the unified homepage, even if old markup is restored later. */
#screen-main .orb,
#screen-main .gameplay-cloud,
#screen-main .hero-art,
#screen-main .home-stage-bg,
#screen-main .home-decor,
#screen-main .decor-tunnel,
#screen-main .decor-flower {
  display: none !important;
  animation: none !important;
  pointer-events: none !important;
}

@media (max-height: 760px) and (min-width: 900px) {
  #screen-main .menu-stage {
    transform: scale(.94) !important;
    transform-origin: center center !important;
  }
}


/* v1.25.22 — Pause, toast and scrollbar polish.
   Final dashboard pass: pause overlay in the new rectangular UI, modern toast above all layers,
   and site scrollbars styled like the XP progress bar with two green tones and square edges. */
#menu-global-header .topbar-logo strong {
  letter-spacing: 0.01em !important;
  text-transform: uppercase !important;
}

/* Global square scrollbars — two green tones, no rounded corners. */
html,
body,
.screen,
.screen.content-screen.active,
.panel,
.hud,
.notification-dropdown,
#level-grid,
.guide-grid,
.shop-grid,
.wardrobe-grid,
.quest-grid,
.world-gates-grid,
.vault-grid,
.profile-stats,
.profile-badges,
.save-slots-grid {
  scrollbar-width: thin !important;
  scrollbar-color: #9cff47 #062013 !important;
}
*::-webkit-scrollbar {
  width: 10px !important;
  height: 10px !important;
}
*::-webkit-scrollbar-track {
  background: linear-gradient(180deg, #04130d 0%, #082617 100%) !important;
  border-radius: 0 !important;
  box-shadow: inset 1px 0 0 rgba(255,255,255,.06) !important;
}
*::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #c9ff69 0%, #9cff47 48%, #167a37 100%) !important;
  border-radius: 0 !important;
  border: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.32), 0 0 12px rgba(156,255,71,.20) !important;
}
*::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(180deg, #e0ff8a 0%, #a9ff55 48%, #1aa342 100%) !important;
}
*::-webkit-scrollbar-corner,
*::-webkit-scrollbar-button {
  background: #04130d !important;
  width: 0 !important;
  height: 0 !important;
}
.screen.content-screen.active::-webkit-scrollbar-track,
.panel::-webkit-scrollbar-track,
.hud::-webkit-scrollbar-track,
#menu-global-header .notification-dropdown::-webkit-scrollbar-track {
  background: linear-gradient(180deg, #04130d 0%, #082617 100%) !important;
  border-radius: 0 !important;
}
.screen.content-screen.active::-webkit-scrollbar-thumb,
.panel::-webkit-scrollbar-thumb,
.hud::-webkit-scrollbar-thumb,
#menu-global-header .notification-dropdown::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #c9ff69 0%, #9cff47 48%, #167a37 100%) !important;
  border-radius: 0 !important;
  border: 0 !important;
}

/* Toast — new header/dashboard style and always above menu/game backgrounds. */
.toast,
.toast.toast-gameplay {
  position: fixed !important;
  left: auto !important;
  right: 22px !important;
  top: calc(var(--topbar-h, 80px) + 16px) !important;
  bottom: auto !important;
  z-index: 140 !important;
  max-width: min(390px, calc(100vw - 44px)) !important;
  min-height: 48px !important;
  display: flex !important;
  align-items: center !important;
  padding: 11px 16px 11px 58px !important;
  border-radius: 0 !important;
  border: 1px solid rgba(191,213,255,.26) !important;
  background:
    linear-gradient(90deg, rgba(156,255,71,.13), rgba(16,223,255,.06), rgba(255,255,255,.03)),
    linear-gradient(180deg, rgba(8,28,44,.96), rgba(2,14,24,.92)) !important;
  color: #ecf6ff !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  font-weight: 900 !important;
  text-align: left !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.35) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 18px 38px rgba(0,0,0,.34), 0 0 0 1px rgba(156,255,71,.08) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  opacity: 0 !important;
  transform: translateX(18px) !important;
  transition: opacity .16s ease, transform .16s ease !important;
  pointer-events: none !important;
}
.toast::before,
.toast.toast-gameplay::before {
  content: "i" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 42px !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid rgba(191,213,255,.22) !important;
  color: #9cff47 !important;
  font-size: 15px !important;
  font-weight: 1000 !important;
  text-shadow: 0 0 14px rgba(156,255,71,.42) !important;
}
.toast.show,
.toast.toast-gameplay.show {
  opacity: .98 !important;
  transform: translateX(0) !important;
}
.game-shell.is-playing .toast,
.game-shell.is-playing .toast.toast-gameplay {
  top: 18px !important;
}
@media (max-width: 760px) {
  .toast,
  .toast.toast-gameplay {
    top: auto !important;
    right: 12px !important;
    bottom: 92px !important;
    max-width: calc(100vw - 24px) !important;
    padding: 10px 14px 10px 54px !important;
  }
}

/* Pause screen — rebuilt in the same new dashboard style as the inner pages. */
#screen-pause.pause-dashboard-screen.active {
  display: grid !important;
  place-items: center !important;
  padding: 24px !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px) 0 0 / 64px 64px,
    linear-gradient(180deg, rgba(255,255,255,.035) 0 1px, transparent 1px) 0 0 / 64px 64px,
    radial-gradient(circle at 12% 16%, rgba(156,255,71,.16), transparent 30%),
    radial-gradient(circle at 86% 14%, rgba(16,223,255,.13), transparent 32%),
    rgba(0, 12, 22, .76) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.pause-dashboard-card {
  width: min(720px, calc(100vw - 34px)) !important;
  min-height: 188px !important;
  display: grid !important;
  grid-template-columns: 96px minmax(0, 1fr) !important;
  grid-template-areas:
    "rail copy"
    "rail actions" !important;
  border-radius: 0 !important;
  border: 1px solid rgba(191,213,255,.26) !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px) 0 0 / 30px 30px,
    linear-gradient(180deg, rgba(10,38,56,.96), rgba(2,14,24,.92)) !important;
  color: #ecf6ff !important;
  overflow: hidden !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 34px 80px rgba(0,0,0,.42) !important;
}
.pause-rail {
  grid-area: rail !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 8px !important;
  min-height: 188px !important;
  border-right: 1px solid rgba(191,213,255,.24) !important;
  background:
    radial-gradient(circle at 50% 22%, rgba(156,255,71,.22), transparent 58%),
    linear-gradient(180deg, rgba(156,255,71,.12), rgba(16,223,255,.05)) !important;
}
.pause-rail span {
  color: #9cff47 !important;
  font-size: 44px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  text-shadow: 0 0 20px rgba(156,255,71,.44) !important;
}
.pause-rail em {
  color: rgba(207,224,255,.76) !important;
  font-size: 10px !important;
  font-style: normal !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  font-weight: 1000 !important;
}
.pause-copy {
  grid-area: copy !important;
  display: grid !important;
  gap: 8px !important;
  padding: 28px 28px 14px !important;
}
.pause-copy strong {
  color: #fff !important;
  font-size: clamp(26px, 3vw, 42px) !important;
  line-height: 1 !important;
  font-weight: 1000 !important;
  letter-spacing: .01em !important;
  text-transform: uppercase !important;
}
.pause-copy span {
  max-width: 520px !important;
  color: rgba(207,224,255,.76) !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  font-weight: 800 !important;
}
.pause-actions {
  grid-area: actions !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  padding: 12px 28px 28px !important;
}
.pause-actions .btn {
  min-height: 48px !important;
  border-radius: 0 !important;
  border: 1px solid rgba(191,213,255,.26) !important;
  padding: 11px 12px !important;
  color: #eaf3ff !important;
  background: linear-gradient(180deg, rgba(11,35,53,.94), rgba(3,18,29,.88)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 12px 24px rgba(0,0,0,.18) !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  font-size: 12px !important;
  font-weight: 1000 !important;
}
.pause-actions .btn.primary {
  color: #04200f !important;
  background: linear-gradient(180deg, #c9ff69 0%, #9cff47 48%, #167a37 100%) !important;
  border-color: rgba(204,255,140,.78) !important;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.34), 0 7px 0 rgba(7,96,39,.92), 0 18px 34px rgba(43,192,75,.24) !important;
}
.pause-actions .btn:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(156,255,71,.55) !important;
}
@media (max-width: 680px) {
  .pause-dashboard-card {
    grid-template-columns: 72px minmax(0, 1fr) !important;
  }
  .pause-actions {
    grid-template-columns: 1fr !important;
    padding: 10px 18px 20px !important;
  }
  .pause-copy { padding: 20px 18px 10px !important; }
  .pause-rail { min-height: 236px !important; }
}


/* v1.25.23 — favicon, premium account, economy shop and header action layout. */
#menu-global-header .topbar-logo strong {
  letter-spacing: 0.01em !important;
  text-transform: uppercase !important;
}
#menu-global-header .topbar-actions {
  gap: 0 !important;
}
#menu-global-header .topbar-gift-btn,
#menu-global-header .notification-wrap,
#menu-global-header [data-action="fullscreen"] {
  order: 2;
}
#menu-global-header .topbar-currencies { order: 1; }
#menu-global-header .topbar-gift-btn { order: 2; }
#menu-global-header .notification-wrap { order: 3; }
#menu-global-header [data-action="fullscreen"] { order: 4; }
#menu-global-header #menu-nav-button { display: none !important; }
#menu-global-header .topbar-gift-btn svg,
#menu-global-header .premium-crown-svg,
#menu-global-header .gift-svg {
  width: 30px !important;
  height: 30px !important;
}
#menu-global-header .topbar-gift-btn path,
#menu-global-header .premium-crown-svg path,
#menu-global-header .premium-crown-svg circle,
#menu-global-header .gift-svg path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.1 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#menu-global-header .premium-crown-svg path:first-child,
#menu-global-header .premium-crown-svg circle {
  fill: currentColor !important;
  stroke: rgba(255,248,178,.95) !important;
  stroke-width: .65 !important;
}
#menu-global-header .topbar-context-btn.is-rewards {
  color: #ffd232 !important;
  background: radial-gradient(100% 100% at 0% 0%, rgba(255, 204, 0, 0.72) 0%, rgba(255, 38, 74, 0.42) 50%, rgba(255, 38, 74, 0) 100%) !important;
}
#menu-global-header .topbar-gift-btn {
  color: #9cff47 !important;
}
/* Store sections */
.shop-category-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 12px 0 18px;
}
.shop-category-strip span {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  padding: 0 12px;
  border: 1px solid rgba(191,213,255,.22);
  background: linear-gradient(180deg, rgba(12,38,58,.78), rgba(3,18,29,.72));
  color: rgba(225,240,255,.80);
  font-size: 10px;
  font-weight: 1000;
  letter-spacing: .09em;
  text-transform: uppercase;
}
#screen-shop #shop-grid.shop-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 18px !important;
}
.shop-section {
  display: grid;
  gap: 10px;
}
.shop-section-title {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid rgba(191,213,255,.22);
  background: linear-gradient(90deg, rgba(156,255,71,.10), rgba(16,223,255,.04), rgba(255,255,255,.02));
  padding: 0 14px;
}
.shop-section-title strong {
  color: #fff;
  font-size: 15px;
  font-weight: 1000;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.shop-section-title span {
  color: rgba(207,224,255,.66);
  font-size: 12px;
  font-weight: 850;
}
.shop-grid-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 10px;
}
.shop-product-card .shop-icon { color: #9cff47; }
.shop-product-card.owned .shop-icon { color: #ffd232; }
/* Premium account page */
.premium-account-screen.active {
  display: grid !important;
  align-items: center !important;
}
.premium-account-layout {
  width: min(1040px, calc(100vw - 42px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 14px;
}
.premium-account-hero,
.premium-economy-note {
  border: 1px solid rgba(191,213,255,.24);
  background:
    radial-gradient(circle at 50% 0%, rgba(255,43,72,.28), transparent 42%),
    linear-gradient(180deg, rgba(55,10,34,.88), rgba(4,18,30,.92));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 34px 80px rgba(0,0,0,.38);
  color: #ecf6ff;
}
.premium-account-hero {
  min-height: 430px;
  display: grid;
  place-items: center;
  gap: 18px;
  padding: 34px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.premium-account-hero::before,
.premium-account-hero::after {
  content: "";
  position: absolute;
  width: 280px;
  height: 640px;
  background: repeating-linear-gradient(-45deg, rgba(255,40,20,.95) 0 22px, rgba(255,105,0,.95) 22px 44px);
  opacity: .86;
  pointer-events: none;
}
.premium-account-hero::before { left: -160px; top: -210px; transform: rotate(45deg); }
.premium-account-hero::after { right: -160px; top: -210px; transform: rotate(-45deg); }
.premium-ribbon,
.premium-benefits,
.premium-buy-btn { position: relative; z-index: 2; }
.premium-ribbon { display: grid; gap: 8px; justify-items: center; }
.premium-ribbon span { font-size: 72px; color: #ffd232; text-shadow: 0 0 28px rgba(255,210,50,.48); }
.premium-ribbon strong { color: #fff; font-size: clamp(28px, 3vw, 42px); line-height: 1; font-weight: 1000; text-transform: uppercase; }
.premium-ribbon em { color: #ffd232; font-style: normal; font-size: 13px; font-weight: 1000; letter-spacing: .09em; text-transform: uppercase; }
.premium-benefits { width: min(430px, 100%); display: grid; gap: 8px; }
.premium-benefits article { display:flex; justify-content:space-between; gap: 14px; padding: 8px 0; border-bottom: 1px solid rgba(255,255,255,.15); }
.premium-benefits span { color: rgba(255,255,255,.90); font-size: 13px; font-weight: 850; text-align:left; }
.premium-benefits b { color: #ffe600; font-weight: 1000; order: 2; }
.premium-buy-btn { width:min(430px, 100%); min-height: 64px !important; display:flex !important; align-items:center !important; justify-content:space-between !important; border-radius:0 !important; }
.premium-buy-btn strong { font-size: 16px; text-transform: uppercase; }
.premium-buy-btn em { font-style: normal; font-size: 12px; opacity:.82; }
.premium-economy-note { padding: 22px; align-self: stretch; display:grid; align-content:center; gap:10px; }
.premium-economy-note strong { color:#fff; font-size:18px; text-transform:uppercase; }
.premium-economy-note p { margin:0; color:rgba(207,224,255,.76); line-height:1.55; font-weight:800; }
@media(max-width: 900px){ .premium-account-layout{ grid-template-columns:1fr; } .premium-account-hero{ min-height:360px; } }


/* v1.25.24 — complete screen and directional weapon polish. Gift icon rail rules moved to v1.25.26 scoped homepage fix. */
#screen-complete.complete-dashboard-screen.active {
  display: grid !important;
  place-items: center !important;
  padding: 24px !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px) 0 0 / 64px 64px,
    linear-gradient(180deg, rgba(255,255,255,.035) 0 1px, transparent 1px) 0 0 / 64px 64px,
    radial-gradient(circle at 14% 18%, rgba(156,255,71,.18), transparent 30%),
    radial-gradient(circle at 84% 16%, rgba(255,210,50,.17), transparent 31%),
    rgba(0, 12, 22, .78) !important;
}
.complete-dashboard-card {
  width: min(900px, calc(100vw - 34px)) !important;
  display: grid !important;
  grid-template-columns: 108px minmax(0, 1fr) !important;
  grid-template-areas:
    "rail main"
    "rail actions" !important;
  border-radius: 0 !important;
  border: 1px solid rgba(191,213,255,.26) !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px) 0 0 / 30px 30px,
    linear-gradient(180deg, rgba(10,38,56,.97), rgba(2,14,24,.94)) !important;
  color: #ecf6ff !important;
  overflow: hidden !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 34px 80px rgba(0,0,0,.45) !important;
}
.complete-rail {
  grid-area: rail !important;
  min-height: 330px !important;
  display: grid !important;
  place-items: center !important;
  align-content: center !important;
  gap: 9px !important;
  border-right: 1px solid rgba(191,213,255,.24) !important;
  background:
    radial-gradient(circle at 50% 22%, rgba(255,210,50,.28), transparent 58%),
    linear-gradient(180deg, rgba(156,255,71,.12), rgba(16,223,255,.05)) !important;
}
.complete-rail span {
  color: #ffd232 !important;
  font-size: 58px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  text-shadow: 0 0 22px rgba(255,210,50,.46) !important;
}
.complete-rail em {
  color: rgba(207,224,255,.76) !important;
  font-size: 10px !important;
  font-style: normal !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  font-weight: 1000 !important;
  writing-mode: vertical-rl !important;
  transform: rotate(180deg) !important;
}
.complete-main {
  grid-area: main !important;
  padding: 28px 30px 14px !important;
  display: grid !important;
  gap: 16px !important;
}
.complete-title-row {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 18px !important;
  padding-bottom: 14px !important;
  border-bottom: 1px solid rgba(191,213,255,.18) !important;
}
.complete-title-row small {
  display: block !important;
  color: #9cff47 !important;
  font-size: 11px !important;
  line-height: 1 !important;
  letter-spacing: .14em !important;
  text-transform: uppercase !important;
  font-weight: 1000 !important;
  margin-bottom: 7px !important;
}
.complete-title-row strong {
  display: block !important;
  color: #fff !important;
  font-size: clamp(30px, 3.8vw, 54px) !important;
  line-height: .96 !important;
  font-weight: 1000 !important;
  letter-spacing: .01em !important;
  text-transform: uppercase !important;
}
#screen-complete .complete-stars {
  min-width: 146px !important;
  text-align: right !important;
  color: #ffd232 !important;
  font-size: clamp(26px, 3.6vw, 42px) !important;
  line-height: 1 !important;
  letter-spacing: 3px !important;
  margin: 0 !important;
  text-shadow: 0 0 24px rgba(255,210,50,.52) !important;
  animation: starPulse 1.15s ease-in-out infinite !important;
}
.complete-score-line {
  margin: 0 !important;
  color: rgba(207,224,255,.72) !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  font-weight: 850 !important;
}
.complete-stat-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
.complete-stat-grid article {
  min-height: 76px !important;
  display: grid !important;
  align-content: center !important;
  gap: 6px !important;
  padding: 12px 13px !important;
  border-radius: 0 !important;
  border: 1px solid rgba(191,213,255,.22) !important;
  background: linear-gradient(180deg, rgba(12,38,58,.82), rgba(3,18,29,.78)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
}
.complete-stat-grid span {
  color: rgba(207,224,255,.62) !important;
  font-size: 10px !important;
  font-weight: 1000 !important;
  letter-spacing: .10em !important;
  text-transform: uppercase !important;
}
.complete-stat-grid strong {
  color: #fff !important;
  font-size: 17px !important;
  font-weight: 1000 !important;
  line-height: 1.1 !important;
}
#screen-complete .victory-ribbons {
  justify-content: flex-start !important;
  margin: 0 !important;
}
#screen-complete .victory-ribbons span {
  border-radius: 0 !important;
  color: #dff7ff !important;
  background: linear-gradient(180deg, rgba(12,38,58,.75), rgba(3,18,29,.70)) !important;
  border-color: rgba(191,213,255,.22) !important;
}
.complete-actions {
  grid-area: actions !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  padding: 12px 30px 30px !important;
}
.complete-actions .btn {
  min-height: 50px !important;
  border-radius: 0 !important;
  border: 1px solid rgba(191,213,255,.26) !important;
  padding: 11px 12px !important;
  color: #eaf3ff !important;
  background: linear-gradient(180deg, rgba(11,35,53,.94), rgba(3,18,29,.88)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 12px 24px rgba(0,0,0,.18) !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  font-size: 12px !important;
  font-weight: 1000 !important;
}
.complete-actions .btn.primary {
  color: #04200f !important;
  background: linear-gradient(180deg, #c9ff69 0%, #9cff47 48%, #167a37 100%) !important;
  border-color: rgba(204,255,140,.78) !important;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.34), 0 7px 0 rgba(7,96,39,.92), 0 18px 34px rgba(43,192,75,.24) !important;
}
.complete-actions .btn:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(156,255,71,.55) !important;
}
@media (max-width: 780px) {
  .complete-dashboard-card { grid-template-columns: 76px minmax(0, 1fr) !important; }
  .complete-rail { min-height: 420px !important; }
  .complete-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .complete-actions { grid-template-columns: 1fr !important; padding: 10px 20px 22px !important; }
  .complete-main { padding: 22px 20px 12px !important; }
  .complete-title-row { flex-direction: column !important; }
  #screen-complete .complete-stars { text-align: left !important; }
}


/* v1.25.25 — Rewards hotkey, economy tiles and extra dashboard polish. */
#menu-global-header .topbar-gift-btn {
  position: relative !important;
}
#menu-global-header .topbar-gift-btn .gift-hotkey {
  top: 6px !important;
  left: 6px !important;
  min-width: 22px !important;
  height: 18px !important;
  font-size: 12px !important;
  border: 1px solid rgba(255,255,255,.92) !important;
  box-shadow: 0 3px 10px rgba(0,0,0,.28) !important;
}
#menu-global-header .topbar-gift-btn:hover {
  color: #c9ff69 !important;
  background: linear-gradient(180deg, rgba(156,255,71,.10), rgba(16,223,255,.04)) !important;
}
#screen-shop .shop-economy-bar {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 10px 0 14px !important;
}
.economy-tile {
  min-height: 72px !important;
  display: grid !important;
  grid-template-columns: 48px minmax(0, 1fr) !important;
  align-items: center !important;
  border-radius: 0 !important;
  border: 1px solid rgba(191,213,255,.23) !important;
  background:
    linear-gradient(90deg, rgba(156,255,71,.10), rgba(16,223,255,.035)),
    linear-gradient(180deg, rgba(10,34,52,.92), rgba(2,14,24,.86)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
  overflow: hidden !important;
}
.economy-tile i {
  height: 100% !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid rgba(191,213,255,.20) !important;
  color: #9cff47 !important;
  font-style: normal !important;
  font-size: 22px !important;
  font-weight: 1000 !important;
  background: radial-gradient(circle at 50% 30%, rgba(156,255,71,.22), transparent 58%) !important;
}
.economy-tile div { min-width: 0 !important; padding: 0 10px !important; display: grid !important; gap: 2px !important; }
.economy-tile strong { color: #fff !important; font-size: 18px !important; line-height: 1 !important; font-weight: 1000 !important; }
.economy-tile span { color: #9cff47 !important; font-size: 10px !important; font-weight: 1000 !important; letter-spacing: .08em !important; text-transform: uppercase !important; }
.economy-tile small { color: rgba(207,224,255,.56) !important; font-size: 10px !important; font-weight: 800 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
.economy-ruby i { color: #ff5f7d !important; background: radial-gradient(circle at 50% 30%, rgba(255,95,125,.24), transparent 58%) !important; }
.economy-crystal i { color: #10dfff !important; background: radial-gradient(circle at 50% 30%, rgba(16,223,255,.24), transparent 58%) !important; }
.economy-star i { color: #ffd232 !important; background: radial-gradient(circle at 50% 30%, rgba(255,210,50,.24), transparent 58%) !important; }
.economy-key i { color: #d2b0ff !important; background: radial-gradient(circle at 50% 30%, rgba(210,176,255,.24), transparent 58%) !important; }
.shop-category-strip button {
  min-height: 34px !important;
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 12px !important;
  border: 1px solid rgba(191,213,255,.22) !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, rgba(12,38,58,.78), rgba(3,18,29,.72)) !important;
  color: rgba(225,240,255,.80) !important;
  font-size: 10px !important;
  font-weight: 1000 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}
.shop-category-strip button:hover {
  color: #07190e !important;
  border-color: rgba(204,255,140,.76) !important;
  background: linear-gradient(180deg, #c9ff69, #9cff47 58%, #167a37) !important;
}
#screen-over.game-over-dashboard-screen.active {
  display: grid !important;
  place-items: center !important;
  padding: 24px !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px) 0 0 / 64px 64px,
    linear-gradient(180deg, rgba(255,255,255,.035) 0 1px, transparent 1px) 0 0 / 64px 64px,
    radial-gradient(circle at 16% 22%, rgba(255,82,96,.18), transparent 32%),
    radial-gradient(circle at 82% 16%, rgba(16,223,255,.12), transparent 31%),
    rgba(0, 12, 22, .80) !important;
}
.game-over-rail {
  background:
    radial-gradient(circle at 50% 24%, rgba(255,82,96,.28), transparent 58%),
    linear-gradient(180deg, rgba(255,82,96,.12), rgba(16,223,255,.05)) !important;
}
.game-over-rail span { color: #ff5f7d !important; text-shadow: 0 0 22px rgba(255,82,96,.42) !important; }
.game-over-dashboard-card .complete-stars { color: rgba(207,224,255,.34) !important; animation: none !important; }
.game-over-tips article strong { font-size: 15px !important; }
@media (max-width: 880px) {
  #screen-shop .shop-economy-bar { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
  .economy-tile:last-child { grid-column: 1 / -1 !important; }
}
@media (max-width: 560px) {
  #screen-shop .shop-economy-bar { grid-template-columns: 1fr !important; }
}


/* v1.25.26 — Boss alert redesign, gift menu rail fix and micro-polish. */
#screen-main .berry-menu-item .menu-gift-icon {
  width: 44px !important;
  min-width: 44px !important;
  left: 0 !important;
  right: auto !important;
  height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  border-right: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  color: #9cff47 !important;
  z-index: 2 !important;
}
#screen-main .berry-menu-item .menu-gift-icon::before,
#screen-main .berry-menu-item .menu-gift-icon::after {
  content: none !important;
  display: none !important;
}
#screen-main .berry-menu-item .menu-gift-icon svg {
  width: 25px !important;
  height: 25px !important;
  overflow: visible !important;
}
#screen-main .berry-menu-item .menu-gift-icon path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.05 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

.boss-warning-overlay {
  position: fixed !important;
  left: 50% !important;
  top: calc(76px + env(safe-area-inset-top, 0px)) !important;
  transform: translateX(-50%) !important;
  width: min(620px, calc(100vw - 48px)) !important;
  min-width: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  z-index: 1600 !important;
  pointer-events: none !important;
  color: #ecf6ff !important;
  text-align: left !important;
  background:
    linear-gradient(90deg, rgba(156,255,71,.95) 0 5px, transparent 5px),
    linear-gradient(180deg, rgba(8,34,50,.97), rgba(2,14,24,.94)) !important;
  border: 1px solid rgba(191,213,255,.28) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(0,0,0,.35),
    0 24px 70px rgba(0,0,0,.42),
    0 0 0 1px rgba(156,255,71,.08) !important;
  overflow: hidden !important;
  animation: bossAlertSlideIn .24s ease-out both !important;
}
.boss-warning-overlay::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.045) 0 1px, transparent 1px) 0 0 / 34px 34px,
    radial-gradient(circle at 15% 50%, rgba(156,255,71,.15), transparent 34%),
    radial-gradient(circle at 85% 35%, rgba(16,223,255,.10), transparent 36%) !important;
  opacity: .95 !important;
  pointer-events: none !important;
}
.boss-warning-overlay::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg, #9cff47, #12dfef, #ffd232) !important;
  opacity: .95 !important;
}
.boss-warning-overlay .boss-alert-inner {
  position: relative !important;
  z-index: 1 !important;
  display: grid !important;
  grid-template-columns: 72px minmax(0, 1fr) !important;
  min-height: 72px !important;
}
.boss-warning-overlay .boss-alert-rail {
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid rgba(191,213,255,.22) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02)) !important;
}
.boss-warning-overlay .boss-alert-rail span {
  width: 34px !important;
  height: 34px !important;
  display: grid !important;
  place-items: center !important;
  font-weight: 1000 !important;
  color: #06101b !important;
  background: linear-gradient(180deg, #ffd232, #ff9c2f) !important;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.55), 0 0 24px rgba(255,210,50,.28) !important;
}
.boss-warning-overlay .boss-alert-copy {
  display: grid !important;
  align-content: center !important;
  gap: 5px !important;
  padding: 13px 18px 14px !important;
}
.boss-warning-overlay strong {
  display: block !important;
  font-size: clamp(15px, 1.4vw, 20px) !important;
  line-height: 1.05 !important;
  letter-spacing: .02em !important;
  text-transform: uppercase !important;
  color: #ffffff !important;
  text-shadow: 0 0 18px rgba(156,255,71,.12) !important;
}
.boss-warning-overlay span {
  display: block !important;
  margin: 0 !important;
  font-size: 13px !important;
  line-height: 1.25 !important;
  opacity: 1 !important;
  color: rgba(207,224,255,.80) !important;
  font-weight: 850 !important;
}
.boss-warning-overlay .boss-alert-bar {
  position: absolute !important;
  left: 72px !important;
  right: 0 !important;
  bottom: 0 !important;
  height: 3px !important;
  background: linear-gradient(90deg, #9cff47 0%, #18dfef 55%, rgba(255,255,255,.20) 55%, rgba(255,255,255,.06) 100%) !important;
}
@keyframes bossAlertSlideIn {
  from { opacity: 0; transform: translate(-50%, -12px) scale(.985); }
  to { opacity: 1; transform: translate(-50%, 0) scale(1); }
}
@media (max-width: 720px) {
  .boss-warning-overlay {
    top: calc(64px + env(safe-area-inset-top, 0px)) !important;
    width: calc(100vw - 20px) !important;
  }
  .boss-warning-overlay .boss-alert-inner {
    grid-template-columns: 56px minmax(0, 1fr) !important;
    min-height: 64px !important;
  }
  .boss-warning-overlay .boss-alert-bar { left: 56px !important; }
  .boss-warning-overlay .boss-alert-copy { padding: 10px 12px 12px !important; }
}

/* v1.25.27 — Gameplay HUD dashboard polish.
   Rebuilds the in-game HUD to match the new header system: full-width dark status bar,
   square cells, vertical separators, crisp icon rails, green progress-style accents and faster UI. */
.game-shell.is-playing #menu-global-header {
  display: none !important;
}
.game-shell.is-playing #hud.hud {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 58px !important;
  transform: none !important;
  z-index: 32 !important;
  display: flex;
  align-items: stretch !important;
  gap: 0 !important;
  padding: 0 env(safe-area-inset-right) 0 env(safe-area-inset-left) !important;
  border-radius: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(191, 213, 255, .28) !important;
  background:
    linear-gradient(180deg, rgba(0, 25, 38, .96) 0%, rgba(0, 15, 28, .72) 62%, rgba(0, 25, 38, .18) 100%) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .32), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}
.game-shell.is-playing #hud.hud.hidden {
  display: none !important;
}
.game-shell.is-playing #hud .hud-pill {
  min-width: 88px !important;
  min-height: 58px !important;
  height: 58px !important;
  display: grid !important;
  grid-template-columns: 28px auto !important;
  grid-template-rows: 21px 22px !important;
  align-items: center !important;
  column-gap: 9px !important;
  row-gap: 0 !important;
  padding: 7px 15px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-right: 1px solid rgba(191, 213, 255, .22) !important;
  background: linear-gradient(180deg, rgba(8, 20, 34, .56), rgba(5, 12, 23, .18)) !important;
  color: #eaf3ff !important;
  box-shadow: inset 1px 0 0 rgba(255, 255, 255, .04) !important;
  white-space: nowrap !important;
}
.game-shell.is-playing #hud .hud-pill:first-child {
  border-left: 1px solid rgba(191, 213, 255, .22) !important;
}
.game-shell.is-playing #hud .hud-pill i {
  grid-row: 1 / 3 !important;
  grid-column: 1 !important;
  width: 27px !important;
  height: 27px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-style: normal !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 1000 !important;
  letter-spacing: .03em !important;
  color: #bfff5a !important;
  text-shadow: 0 0 12px rgba(156, 255, 71, .42) !important;
}
.game-shell.is-playing #hud .hud-pill span {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: block !important;
  margin: 0 !important;
  color: rgba(191, 213, 255, .72) !important;
  font-size: 10px !important;
  line-height: 1.1 !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: .105em !important;
}
.game-shell.is-playing #hud .hud-pill strong {
  grid-column: 2 !important;
  grid-row: 2 !important;
  display: block !important;
  min-width: 0 !important;
  color: #f4fbff !important;
  font-size: 16px !important;
  line-height: 1.1 !important;
  font-weight: 1000 !important;
  letter-spacing: .01em !important;
  text-shadow: 0 0 14px rgba(255, 255, 255, .12) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.game-shell.is-playing #hud .hud-pill-level i,
.game-shell.is-playing #hud .hud-pill-coins i,
.game-shell.is-playing #hud .hud-pill-score i { color: #ffd84a !important; text-shadow: 0 0 14px rgba(255, 216, 74, .42) !important; }
.game-shell.is-playing #hud .hud-pill-crystals i { color: #26dcff !important; text-shadow: 0 0 14px rgba(38, 220, 255, .44) !important; }
.game-shell.is-playing #hud .hud-pill-keys i { color: #ff6c8d !important; text-shadow: 0 0 14px rgba(255, 108, 141, .42) !important; }
.game-shell.is-playing #hud .hud-pill-lives i { color: #ff4e73 !important; text-shadow: 0 0 14px rgba(255, 78, 115, .42) !important; }
.game-shell.is-playing #hud .hud-pill-time i { color: #b99cff !important; text-shadow: 0 0 14px rgba(185, 156, 255, .42) !important; }
.game-shell.is-playing #hud .power-pill {
  flex: 1 1 260px !important;
  min-width: 220px !important;
}
.game-shell.is-playing #hud .power-pill strong {
  max-width: min(44vw, 520px) !important;
}
.game-shell.is-playing #hud .hud-button {
  flex: 0 0 64px !important;
  width: 64px !important;
  min-width: 64px !important;
  height: 58px !important;
  margin: 0 0 0 auto !important;
  border: 0 !important;
  border-left: 1px solid rgba(191, 213, 255, .26) !important;
  border-right: 1px solid rgba(191, 213, 255, .20) !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, rgba(12, 30, 50, .66), rgba(7, 18, 31, .28)) !important;
  color: #bfd5ff !important;
  box-shadow: inset 1px 0 0 rgba(255, 255, 255, .06) !important;
  font-size: 24px !important;
  line-height: 1 !important;
  font-weight: 1000 !important;
  cursor: pointer !important;
  transition: color .12s ease, background .12s ease, text-shadow .12s ease !important;
}
.game-shell.is-playing #hud .hud-button:hover {
  color: #ffffff !important;
  background: linear-gradient(180deg, rgba(23, 70, 102, .80), rgba(8, 26, 42, .40)) !important;
  text-shadow: 0 0 16px rgba(191, 213, 255, .58) !important;
}
.game-shell.is-playing #hud::-webkit-scrollbar {
  height: 6px !important;
}
.game-shell.is-playing #hud::-webkit-scrollbar-track {
  background: rgba(4, 19, 13, .92) !important;
}
.game-shell.is-playing #hud::-webkit-scrollbar-thumb {
  background: linear-gradient(90deg, #167a37 0%, #9cff47 60%, #c9ff69 100%) !important;
}
.game-shell.is-playing #hud + #toast,
.game-shell.is-playing .toast {
  top: 72px !important;
}
@media (max-width: 920px) {
  .game-shell.is-playing #hud.hud {
    min-height: 52px !important;
  }
  .game-shell.is-playing #hud .hud-pill {
    min-width: 76px !important;
    height: 52px !important;
    min-height: 52px !important;
    grid-template-columns: 22px auto !important;
    padding: 6px 10px !important;
    column-gap: 7px !important;
  }
  .game-shell.is-playing #hud .hud-pill i {
    width: 22px !important;
    height: 22px !important;
    font-size: 11px !important;
  }
  .game-shell.is-playing #hud .hud-pill span {
    font-size: 9px !important;
  }
  .game-shell.is-playing #hud .hud-pill strong {
    font-size: 14px !important;
  }
  .game-shell.is-playing #hud .power-pill {
    min-width: 168px !important;
  }
  .game-shell.is-playing #hud .power-pill strong {
    max-width: 220px !important;
  }
  .game-shell.is-playing #hud .hud-button {
    width: 54px !important;
    min-width: 54px !important;
    height: 52px !important;
  }
}
@media (max-width: 680px) {
  .game-shell.is-playing #hud .hud-pill span {
    display: none !important;
  }
  .game-shell.is-playing #hud .hud-pill {
    grid-template-rows: 1fr !important;
    min-width: 64px !important;
  }
  .game-shell.is-playing #hud .hud-pill i {
    grid-row: 1 !important;
  }
  .game-shell.is-playing #hud .hud-pill strong {
    grid-row: 1 !important;
    align-self: center !important;
  }
}


/* v1.25.29 — Compact boss HP bars, reward center polish, hint separator cleanup and advanced protection shop. */
.screen.content-screen .hint::after,
.screen.content-screen .setting-note::after,
.screen.content-screen .score-line::after,
.screen.content-screen > p:not([class])::after,
.content-screen > .hint::after,
.content-screen > .setting-note::after,
.content-screen > p:not([class])::after {
  content: none !important;
  display: none !important;
}
.screen.content-screen .hint::before,
.screen.content-screen .setting-note::before,
.screen.content-screen .score-line::before,
.screen.content-screen > p:not([class])::before,
.content-screen > .hint::before,
.content-screen > .setting-note::before,
.content-screen > p:not([class])::before {
  border-right: 1px solid rgba(191,213,255,.22) !important;
  box-shadow: none !important;
}
.rewards-economy-row,
.reward-section-title {
  width: min(1380px, 100%) !important;
  margin: 12px auto !important;
}
.rewards-economy-row {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(160px, 1fr)) !important;
  border: 1px solid rgba(191,213,255,.24) !important;
  background: linear-gradient(180deg, rgba(8,31,48,.86), rgba(1,13,22,.78)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 18px 36px rgba(0,0,0,.18) !important;
}
.rewards-economy-row article {
  min-height: 82px !important;
  display: grid !important;
  align-content: center !important;
  gap: 3px !important;
  padding: 14px 18px !important;
  border-right: 1px solid rgba(191,213,255,.18) !important;
}
.rewards-economy-row article:last-child { border-right: 0 !important; }
.rewards-economy-row span,
.reward-section-title span {
  color: rgba(191,213,255,.62) !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  font-weight: 1000 !important;
  letter-spacing: .08em !important;
}
.rewards-economy-row strong {
  color: #fff !important;
  font-size: clamp(22px, 2.2vw, 34px) !important;
  line-height: .95 !important;
}
.rewards-economy-row em {
  color: #9cff47 !important;
  font-style: normal !important;
  font-size: 12px !important;
  font-weight: 900 !important;
}
.reward-section-title {
  min-height: 58px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  padding: 12px 18px !important;
  border: 1px solid rgba(191,213,255,.20) !important;
  background: linear-gradient(90deg, rgba(191,213,255,.06), rgba(191,213,255,.015)) !important;
}
.reward-section-title strong {
  color: #fff !important;
  font-size: 18px !important;
  letter-spacing: .01em !important;
}
.rewards-hero-card {
  border-color: rgba(156,255,71,.32) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 28px 56px rgba(0,0,0,.26), 0 0 0 1px rgba(156,255,71,.04) !important;
}
.rewards-hero-rail {
  background: linear-gradient(180deg, rgba(255,210,50,.26), rgba(156,255,71,.08)), radial-gradient(100% 100% at 0% 0%, rgba(255,204,0,.42), rgba(255,38,74,.12) 54%, rgba(255,38,74,0)) !important;
}
.battle-pass-track {
  scrollbar-width: thin !important;
  scrollbar-color: #9cff47 rgba(15,50,36,.55) !important;
}
.battle-pass-track::-webkit-scrollbar { height: 8px !important; }
.battle-pass-track::-webkit-scrollbar-track { background: rgba(15,50,36,.55) !important; border-radius: 0 !important; }
.battle-pass-track::-webkit-scrollbar-thumb { background: linear-gradient(90deg, #2fbf71, #9cff47) !important; border-radius: 0 !important; }
@media (max-width: 760px) {
  .rewards-economy-row { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .rewards-economy-row article:nth-child(2n) { border-right: 0 !important; }
  .reward-section-title { align-items: flex-start !important; flex-direction: column !important; }
}


/* Rare card collection v1.25.31 */
.card-collection-screen { gap: 1rem; }
.card-collection-wallet {
  display: grid;
  grid-template-columns: repeat(4, minmax(140px, 1fr));
  border: 1px solid rgba(191,213,255,.25);
  background: linear-gradient(180deg, rgba(0,25,38,.88), rgba(0,10,20,.78));
}
.card-collection-wallet article {
  min-height: 4.5rem;
  padding: 1rem 1.15rem;
  border-right: 1px solid rgba(191,213,255,.22);
  display: grid;
  gap: .25rem;
}
.card-collection-wallet article:last-child { border-right: 0; }
.card-collection-wallet span { color: rgba(191,213,255,.74); font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; }
.card-collection-wallet strong { color: #fff; font-size: 1.35rem; }
.rare-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)); gap: .85rem; }
.rare-card-set {
  min-height: 9rem;
  display: grid;
  grid-template-columns: 5.6rem 1fr auto;
  align-items: stretch;
  border: 1px solid rgba(191,213,255,.24);
  background: linear-gradient(180deg, rgba(4,20,32,.94), rgba(0,10,18,.88));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}
.rare-card-set.ready { border-color: rgba(61,240,116,.45); box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px rgba(61,240,116,.10); }
.rare-card-set.claimed { opacity: .82; }
.rare-card-rail {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  align-content: center;
  gap: .28rem;
  padding: .7rem;
  border-right: 1px solid rgba(191,213,255,.22);
  background: radial-gradient(circle at 30% 10%, rgba(61,240,116,.20), transparent 60%), rgba(0,25,38,.55);
}
.rare-card-rail i {
  height: 2rem;
  display: grid;
  place-items: center;
  font-style: normal;
  color: rgba(191,213,255,.35);
  border: 1px solid rgba(191,213,255,.18);
  background: rgba(2,12,22,.74);
}
.rare-card-rail i.found { color: #fff; border-color: rgba(61,240,116,.42); background: linear-gradient(180deg, rgba(61,240,116,.20), rgba(0,25,38,.82)); }
.rare-card-copy { padding: 1rem; display: grid; align-content: center; gap: .45rem; }
.rare-card-copy strong { color: #fff; font-size: 1.05rem; }
.rare-card-copy span { color: rgba(191,213,255,.78); line-height: 1.35; }
.rare-card-copy em { color: rgba(61,240,116,.86); font-style: normal; font-size: .84rem; }
.rare-card-set > .btn { align-self: center; margin-right: 1rem; min-width: 8.5rem; }
@media (max-width: 760px) {
  .card-collection-wallet { grid-template-columns: repeat(2, 1fr); }
  .rare-card-set { grid-template-columns: 4.8rem 1fr; }
  .rare-card-set > .btn { grid-column: 1 / -1; margin: 0 .8rem .8rem; }
}


/* v1.25.32 live systems */
.event-hero-grid,.pet-active-strip,.talent-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1px;margin-bottom:18px;background:rgba(191,213,255,.16);border-top:1px solid rgba(191,213,255,.22);border-bottom:1px solid rgba(191,213,255,.16)}
.event-hero-grid article,.pet-active-strip article,.talent-summary article{background:linear-gradient(180deg,rgba(0,28,42,.92),rgba(0,13,22,.92));padding:18px 20px;min-height:76px;display:flex;flex-direction:column;justify-content:center}
.event-hero-grid span,.pet-active-strip span,.talent-summary span{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:rgba(191,213,255,.72)}
.event-hero-grid strong,.pet-active-strip strong,.talent-summary strong{font-size:1.25rem;color:#fff}.event-hero-grid em,.pet-active-strip em,.talent-summary em{font-style:normal;color:#72ff9a;font-size:.82rem}
.event-grid,.pet-grid,.boss-book-grid,.talent-tree-grid,.chest-grid,.leaderboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1px;background:rgba(191,213,255,.16);border-top:1px solid rgba(191,213,255,.22);border-bottom:1px solid rgba(191,213,255,.16)}
.live-event-card,.pet-card,.boss-book-card,.talent-card,.chest-pack-card,.leader-row{position:relative;display:grid;gap:10px;background:linear-gradient(180deg,rgba(0,30,45,.94),rgba(0,10,18,.94));padding:18px 20px;min-height:158px;overflow:hidden;border-left:1px solid rgba(191,213,255,.18)}
.live-event-card::before,.pet-card::before,.boss-book-card::before,.talent-card::before,.chest-pack-card::before,.leader-row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,#74ff93,#106d42);opacity:.9}
.live-event-card i,.pet-card i,.chest-pack-card i{font-style:normal;width:3.2rem;height:3.2rem;display:grid;place-items:center;background:radial-gradient(circle at 30% 20%,rgba(116,255,147,.34),rgba(12,58,44,.14));box-shadow:inset -1px 0 rgba(255,255,255,.18),1px 0 rgba(255,255,255,.1);font-size:1.65rem;color:#fff}.live-event-card strong,.pet-card strong,.boss-book-card strong,.talent-card strong,.chest-pack-card strong,.leader-row strong{color:#fff;font-size:1.03rem}.live-event-card span,.pet-card span,.boss-book-card span,.talent-card span,.chest-pack-card span,.leader-row span{color:rgba(222,236,255,.78);line-height:1.45}.live-event-card em,.pet-card em,.boss-book-card em,.talent-card em,.chest-pack-card em,.leader-row em{font-style:normal;color:#72ff9a}.pet-card.selected,.talent-card.owned,.boss-book-card.defeated,.live-event-card.claimed{background:linear-gradient(180deg,rgba(10,55,45,.95),rgba(0,17,23,.95))}.pet-card.selected::before,.talent-card.owned::before,.boss-book-card.defeated::before,.live-event-card.claimed::before{background:linear-gradient(180deg,#ffe86b,#73ff97)}
.boss-book-card{grid-template-columns:5.4rem 1fr;align-items:center}.boss-book-card .btn{grid-column:1/-1}.boss-rail{height:5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid rgba(191,213,255,.25);background:radial-gradient(circle at 20% 0%,rgba(255,216,93,.28),transparent 62%)}.boss-rail strong{font-size:1.6rem}.boss-rail span{font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:rgba(191,213,255,.75)}
.talent-card{grid-template-columns:5.1rem 1fr;align-items:start}.talent-card .btn{grid-column:1/-1}.talent-rail{min-height:6.2rem;border-right:1px solid rgba(191,213,255,.25);display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center}.talent-rail i{font-style:normal;font-size:1.65rem}.talent-rail span{font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:rgba(191,213,255,.72)}
.chest-reward-display{margin-bottom:18px;min-height:86px;padding:18px 22px;background:linear-gradient(180deg,rgba(0,30,45,.94),rgba(0,10,18,.94));border-top:1px solid rgba(191,213,255,.22);border-bottom:1px solid rgba(191,213,255,.16);display:flex;align-items:center;justify-content:space-between;gap:18px}.chest-reward-display strong{font-size:1.25rem;color:#fff}.chest-reward-display span{color:#72ff9a}.chest-pack-card small{color:#bfe3ff}.leader-row{min-height:86px;grid-template-columns:4rem 1fr auto;align-items:center}.leader-row.empty{grid-template-columns:1fr}.leader-row strong{font-size:1.35rem;color:#72ff9a}.leader-row em{justify-self:end;color:#fff}.live-event-card.ready::after,.chest-pack-card.can-open::after{content:"READY";position:absolute;top:12px;right:14px;font-size:.62rem;letter-spacing:.08em;color:#72ff9a;opacity:.86}
@media(max-width:760px){.boss-book-card,.talent-card,.leader-row{grid-template-columns:1fr}.boss-rail,.talent-rail{border-right:0;border-bottom:1px solid rgba(191,213,255,.2);align-items:flex-start;padding-left:8px}.leader-row em{justify-self:start}}


/* v1.25.33 — Adventure Map, difficulty selector and cleaner progression dashboard */
.adventure-map-screen { gap: 18px !important; }
.adventure-map-summary,
.difficulty-selector {
  width: min(1380px, 100%) !important;
  margin: 0 auto 14px !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
  gap: 1px !important;
  background: rgba(191,213,255,.16) !important;
  border-top: 1px solid rgba(191,213,255,.22) !important;
  border-bottom: 1px solid rgba(191,213,255,.16) !important;
}
.adventure-map-summary article,
.difficulty-card {
  min-height: 72px !important;
  padding: 14px 18px !important;
  background: linear-gradient(180deg, rgba(0,30,45,.94), rgba(0,10,18,.94)) !important;
  border: 0 !important;
  border-left: 1px solid rgba(191,213,255,.16) !important;
  text-align: left !important;
}
.adventure-map-summary span,
.difficulty-card span {
  color: rgba(191,213,255,.72) !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  font-weight: 900 !important;
  font-size: 11px !important;
}
.adventure-map-summary strong,
.difficulty-card strong {
  color: #fff !important;
  font-size: clamp(18px, 2vw, 28px) !important;
  line-height: 1 !important;
}
.adventure-map-summary em { color: #72ff9a !important; font-style: normal !important; font-size: 12px !important; }
.difficulty-card { cursor: pointer !important; display: grid !important; gap: 5px !important; color: #fff !important; }
.difficulty-card.active { background: linear-gradient(180deg, rgba(14,76,58,.96), rgba(0,17,23,.96)) !important; box-shadow: inset 5px 0 0 #72ff9a !important; }
.difficulty-card:hover { background: linear-gradient(180deg, rgba(20,54,72,.98), rgba(0,18,28,.98)) !important; }
.adventure-map-grid {
  width: min(1380px, 100%) !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr)) !important;
  gap: 1px !important;
  background: rgba(191,213,255,.16) !important;
  border-top: 1px solid rgba(191,213,255,.22) !important;
  border-bottom: 1px solid rgba(191,213,255,.16) !important;
}
.adventure-world-node {
  position: relative !important;
  min-height: 126px !important;
  display: grid !important;
  grid-template-columns: 74px 1fr auto !important;
  align-items: stretch !important;
  gap: 0 !important;
  background: linear-gradient(180deg, rgba(0,30,45,.94), rgba(0,10,18,.95)) !important;
  overflow: hidden !important;
}
.adventure-world-node::before { content:"" !important; position:absolute !important; inset:0 auto 0 0 !important; width:5px !important; background: linear-gradient(180deg,#72ff9a,#106d42) !important; opacity:.9 !important; }
.adventure-world-node.locked { opacity: .68 !important; }
.adventure-world-node.complete::before { background: linear-gradient(180deg,#ffe96b,#72ff9a) !important; }
.adventure-world-node.active { box-shadow: inset 0 0 0 1px rgba(114,255,154,.22) !important; }
.map-node-rail { display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; border-right:1px solid rgba(191,213,255,.22) !important; background: radial-gradient(circle at 30% 0%,rgba(114,255,154,.22),transparent 70%), rgba(0,25,38,.42) !important; }
.map-node-rail strong { color:#fff !important; font-size:1.55rem !important; line-height:1 !important; }
.map-node-rail span { color:rgba(191,213,255,.72) !important; font-size:.62rem !important; font-weight:1000 !important; letter-spacing:.08em !important; }
.map-node-copy { padding: 16px 18px !important; display:grid !important; align-content:center !important; gap:7px !important; }
.map-node-copy strong { color:#fff !important; font-size:1rem !important; }
.map-node-copy span { color:rgba(222,236,255,.78) !important; font-size:.88rem !important; }
.map-node-copy em { color:#72ff9a !important; font-style:normal !important; font-size:.82rem !important; }
.map-node-progress { height: 8px !important; background: rgba(21,71,42,.55) !important; overflow:hidden !important; border:1px solid rgba(114,255,154,.18) !important; }
.map-node-progress i { display:block !important; height:100% !important; width: var(--map-progress) !important; background: linear-gradient(90deg,#2fbf71,#9cff47) !important; }
.adventure-world-node > .btn { align-self:center !important; margin-right:14px !important; min-width:92px !important; }
.level-launch-screen .difficulty-selector { margin-top: 4px !important; margin-bottom: 4px !important; }
.level-launch-screen .difficulty-card { min-height: 64px !important; }
.level-launch-screen .difficulty-card strong { font-size: 16px !important; }
@media(max-width:760px){
  .adventure-map-grid { grid-template-columns: 1fr !important; }
  .adventure-world-node { grid-template-columns: 66px 1fr !important; }
  .adventure-world-node > .btn { grid-column: 1 / -1 !important; margin: 0 12px 12px !important; }
}


/* v1.25.34 Loadout + Forge dashboard polish */
.loadout-summary,
.forge-summary{
  display:grid;
  grid-template-columns:repeat(4,minmax(160px,1fr));
  gap:10px;
  margin:0 0 14px;
}
.loadout-summary article,
.forge-summary article{
  min-height:64px;
  padding:12px 14px;
  background:linear-gradient(180deg,rgba(9,34,47,.86),rgba(1,13,20,.92));
  border-left:1px solid rgba(144,255,190,.5);
  box-shadow:inset 1px 0 0 rgba(255,255,255,.18), 0 14px 26px rgba(0,0,0,.18);
}
.loadout-summary span,
.forge-summary span{display:block;color:rgba(206,234,255,.62);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em}
.loadout-summary strong,
.forge-summary strong{display:block;color:#fff;font-size:1.1rem;margin:.15rem 0}
.loadout-summary em,
.forge-summary em{display:block;color:rgba(169,255,194,.72);font-style:normal;font-size:.78rem}
.loadout-section{margin:0 0 18px}
.loadout-section h3{margin:0 0 10px;color:#f2fbff;text-transform:uppercase;letter-spacing:.08em;font-size:.88rem}
.loadout-card-grid,
.forge-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:10px}
.loadout-card,
.forge-card{
  position:relative;
  min-height:176px;
  padding:16px 16px 14px 76px;
  background:linear-gradient(180deg,rgba(4,29,43,.92),rgba(0,12,20,.96));
  border:1px solid rgba(255,255,255,.11);
  border-left:0;
  box-shadow:inset 1px 0 0 rgba(255,255,255,.15), 0 16px 32px rgba(0,0,0,.22);
  overflow:hidden;
}
.loadout-card::before,
.forge-card::before{
  content:"";position:absolute;left:0;top:0;bottom:0;width:58px;
  background:radial-gradient(circle at 45% 25%,rgba(123,255,171,.32),transparent 48%),linear-gradient(180deg,rgba(14,70,82,.85),rgba(0,16,24,.94));
  border-right:1px solid rgba(255,255,255,.2);
}
.loadout-card i,
.forge-card i{position:absolute;left:0;top:0;width:58px;height:100%;display:grid;place-items:center;font-style:normal;font-size:1.6rem;color:#d9fff1;z-index:1}
.loadout-card strong,
.forge-card strong{display:block;color:#fff;font-size:1.02rem;line-height:1.15;margin-bottom:8px}
.loadout-card span,
.forge-card span{display:block;color:rgba(220,240,255,.72);font-size:.86rem;line-height:1.35;min-height:48px}
.loadout-card em,
.forge-card em{display:block;margin:11px 0;color:rgba(164,255,191,.75);font-size:.78rem;font-style:normal}
.loadout-card.active,
.forge-card.crafted{border-color:rgba(106,255,166,.58);box-shadow:inset 0 0 0 1px rgba(106,255,166,.2),0 16px 38px rgba(0,0,0,.24)}
.loadout-card.locked,
.forge-card:not(.can-craft):not(.crafted){opacity:.74}
.loadout-card:hover,
.forge-card:hover{transform:translateY(-1px);border-color:rgba(155,255,196,.42)}
@media (max-width: 900px){.loadout-summary,.forge-summary{grid-template-columns:repeat(2,minmax(0,1fr));}.loadout-card-grid,.forge-grid{grid-template-columns:1fr;}}


/* v1.25.35 Season Journey, Boss Rush and World Modifiers */
.season-summary,.boss-rush-summary,.modifier-summary{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1px;
  background:rgba(191,213,255,.16);border-top:1px solid rgba(191,213,255,.22);border-bottom:1px solid rgba(191,213,255,.16);margin-bottom:18px;
}
.season-summary article,.boss-rush-summary article,.modifier-summary article{
  min-height:74px;padding:14px 18px;background:linear-gradient(180deg,rgba(0,30,45,.94),rgba(0,10,18,.94));border-left:1px solid rgba(191,213,255,.16);display:grid;align-content:center;gap:4px;
}
.season-summary span,.boss-rush-summary span,.modifier-summary span{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:rgba(191,213,255,.68);font-weight:900}
.season-summary strong,.boss-rush-summary strong,.modifier-summary strong{font-size:1.22rem;color:#fff;line-height:1}
.season-summary em,.boss-rush-summary em,.modifier-summary em{font-style:normal;color:#72ff9a;font-size:.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.season-track,.boss-rush-grid,.modifier-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:1px;background:rgba(191,213,255,.16);border-top:1px solid rgba(191,213,255,.22);border-bottom:1px solid rgba(191,213,255,.16)}
.season-tier,.boss-rush-card,.modifier-card{position:relative;min-height:132px;background:linear-gradient(180deg,rgba(0,30,45,.94),rgba(0,10,18,.95));display:grid;align-items:stretch;overflow:hidden;border-left:1px solid rgba(191,213,255,.16)}
.season-tier{grid-template-columns:68px 52px 1fr auto}.boss-rush-card{grid-template-columns:70px 1fr auto}.modifier-card{padding:18px 18px 16px 82px;gap:8px;align-content:center}
.season-tier::before,.boss-rush-card::before,.modifier-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,#72ff9a,#106d42)}
.season-tier.ready,.boss-rush-card:not(.locked),.modifier-card.active{background:linear-gradient(180deg,rgba(7,48,42,.96),rgba(0,14,22,.95))}.season-tier.claimed{opacity:.78}.boss-rush-card.locked,.season-tier.locked{opacity:.62}.season-tier-rail,.boss-rush-rail{display:grid;place-items:center;border-right:1px solid rgba(191,213,255,.22);background:radial-gradient(circle at 30% 0%,rgba(114,255,154,.24),transparent 70%),rgba(0,25,38,.48)}
.season-tier-rail strong,.boss-rush-rail strong{font-size:1.55rem;color:#fff;line-height:1}.season-tier-rail span,.boss-rush-rail span{font-size:.6rem;color:rgba(191,213,255,.72);letter-spacing:.08em;font-weight:1000}.season-tier>i{font-style:normal;display:grid;place-items:center;font-size:1.45rem;color:#dfffee;border-right:1px solid rgba(191,213,255,.18)}
.season-tier-copy,.boss-rush-copy{display:grid;align-content:center;gap:6px;padding:14px 16px}.season-tier-copy strong,.boss-rush-copy strong,.modifier-card strong{color:#fff;font-size:1.02rem}.season-tier-copy span,.boss-rush-copy span,.modifier-card span{color:rgba(222,236,255,.75);font-size:.86rem;line-height:1.35}.season-tier-copy em,.boss-rush-copy em,.modifier-card em{color:#72ff9a;font-size:.78rem;font-style:normal}.season-tier>.btn,.boss-rush-card>.btn{align-self:center;margin-right:14px;min-width:86px}.modifier-card>i{position:absolute;left:5px;top:0;bottom:0;width:58px;display:grid;place-items:center;border-right:1px solid rgba(191,213,255,.2);background:radial-gradient(circle at 40% 20%,rgba(114,255,154,.22),transparent 65%),rgba(0,25,38,.5);font-style:normal;font-size:1.35rem;color:#fff}.modifier-card>.btn{justify-self:start;min-width:110px}
@media(max-width:760px){.season-tier,.boss-rush-card{grid-template-columns:58px 1fr}.season-tier>i{display:none}.season-tier>.btn,.boss-rush-card>.btn{grid-column:1/-1;margin:0 12px 12px}.modifier-card{padding-left:76px}.season-track,.boss-rush-grid,.modifier-grid{grid-template-columns:1fr}}


/* v1.25.36 — Lucky Wheel, Contracts and Bestiary polish */
.lucky-wheel-layout{display:grid;grid-template-columns:minmax(260px,360px) 1fr;gap:18px;width:min(1180px,calc(100vw - 48px));margin:0 auto;padding:12px 0 34px;}
.lucky-wheel-card,.lucky-reward-card,.contract-card,.bestiary-card,.contract-summary article{background:linear-gradient(180deg,rgba(0,34,48,.86),rgba(0,14,24,.94));border:1px solid rgba(184,255,216,.22);box-shadow:inset 1px 0 rgba(255,255,255,.18),0 18px 36px rgba(0,0,0,.22);}
.lucky-wheel-card{display:grid;gap:16px;align-content:start;padding:18px;min-height:430px;}
.lucky-wheel-orb{height:230px;display:grid;place-items:center;position:relative;overflow:hidden;background:radial-gradient(circle at 50% 45%,rgba(92,255,171,.28),rgba(0,20,34,.88) 62%);border-bottom:1px solid rgba(255,255,255,.16);}
.lucky-wheel-orb:before{content:"";position:absolute;inset:22px;border:2px solid rgba(117,255,166,.45);box-shadow:0 0 40px rgba(85,255,173,.25);transform:rotate(22deg);}
.lucky-wheel-orb span{position:absolute;font-size:9rem;line-height:1;color:rgba(103,255,166,.14);}
.lucky-wheel-orb strong{position:relative;text-align:center;color:#eafff1;letter-spacing:.08em;font-size:1.15rem;}
.lucky-wheel-orb.spinning:before{animation:berrySpin .7s ease-out;}
@keyframes berrySpin{from{transform:rotate(22deg) scale(.92)}to{transform:rotate(742deg) scale(1)}}
.lucky-wheel-copy strong{display:block;color:#fff;font-size:1.1rem}.lucky-wheel-copy span{display:block;color:rgba(217,238,255,.72);margin-top:4px;line-height:1.35}.lucky-wheel-rewards{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px}.lucky-reward-card{display:grid;grid-template-columns:58px 1fr;align-items:center;min-height:92px}.lucky-reward-card i,.contract-card i,.bestiary-card i{display:grid;place-items:center;align-self:stretch;border-right:1px solid rgba(255,255,255,.18);font-style:normal;color:#7cffae;font-size:1.55rem;background:linear-gradient(180deg,rgba(116,255,174,.14),rgba(0,0,0,0));}.lucky-reward-card div,.contract-card div,.bestiary-card div{padding:12px 14px}.lucky-reward-card strong,.contract-card strong,.bestiary-card strong{display:block;color:#fff}.lucky-reward-card span,.contract-card span,.bestiary-card span{display:block;color:rgba(217,238,255,.72);font-size:.86rem;margin-top:3px;line-height:1.35}.lucky-reward-card small,.bestiary-card small{color:#7cffae;text-transform:uppercase;font-size:.68rem;letter-spacing:.08em}.contract-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:min(980px,calc(100vw - 48px));margin:0 auto 16px}.contract-summary article{padding:14px 16px;display:grid;gap:2px}.contract-summary span{color:rgba(217,238,255,.65)}.contract-summary strong{color:#fff;font-size:1.6rem}.contract-summary em{color:#7cffae;font-style:normal}.contract-grid,.bestiary-grid{width:min(1180px,calc(100vw - 48px));margin:0 auto 34px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}.contract-card,.bestiary-card{display:grid;grid-template-columns:64px 1fr auto;align-items:stretch;min-height:112px}.contract-card button{align-self:center;margin-right:12px;white-space:nowrap}.contract-card.locked{opacity:.64}.contract-card.claimed{border-color:rgba(117,255,166,.38)}.bestiary-card{grid-template-columns:64px 1fr 72px}.bestiary-card em{display:block;color:#7cffae;font-style:normal;margin-top:8px;font-size:.78rem}.bestiary-card small{display:grid;place-items:center;border-left:1px solid rgba(255,255,255,.16);}.bestiary-card.danger-boss small{color:#ff7373}.bestiary-card.danger-high small{color:#ffd35a}.bestiary-card:hover,.contract-card:hover,.lucky-reward-card:hover{border-color:rgba(117,255,166,.55);background:linear-gradient(180deg,rgba(0,46,62,.94),rgba(0,18,30,.98));}
@media (max-width:800px){.lucky-wheel-layout{grid-template-columns:1fr}.contract-summary{grid-template-columns:1fr}.contract-card,.bestiary-card{grid-template-columns:54px 1fr}.contract-card button{grid-column:2;margin:0 12px 12px 0}.bestiary-card small{grid-column:2;border-left:0;place-items:start;padding:0 14px 12px}}



/* v1.25.37 — Inbox, promo codes and login calendar */
.calendar-summary,.mailbox-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;width:min(980px,calc(100vw - 48px));margin:0 auto 16px;}
.calendar-summary article,.mailbox-summary article{background:linear-gradient(180deg,rgba(0,34,48,.88),rgba(0,14,24,.94));border:1px solid rgba(184,255,216,.22);box-shadow:inset 1px 0 rgba(255,255,255,.18);padding:14px 16px;display:grid;gap:2px;}
.calendar-summary span,.mailbox-summary span{color:rgba(217,238,255,.65);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-weight:900;}
.calendar-summary strong,.mailbox-summary strong{color:#fff;font-size:1.55rem;line-height:1;}
.calendar-summary em,.mailbox-summary em{color:#7cffae;font-style:normal;font-size:.78rem;}
.calendar-grid,.mailbox-grid,.promo-grid{width:min(1180px,calc(100vw - 48px));margin:0 auto 34px;display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:12px;}
.calendar-card,.mail-card,.promo-card{position:relative;display:grid;grid-template-columns:64px 1fr auto;align-items:stretch;min-height:118px;background:linear-gradient(180deg,rgba(0,34,48,.86),rgba(0,14,24,.94));border:1px solid rgba(184,255,216,.22);box-shadow:inset 1px 0 rgba(255,255,255,.18),0 18px 36px rgba(0,0,0,.22);overflow:hidden;}
.calendar-card:before,.mail-card:before,.promo-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#7cffae,#0f7c48);}
.calendar-card i,.mail-card i,.promo-card i{display:grid;place-items:center;align-self:stretch;border-right:1px solid rgba(255,255,255,.18);font-style:normal;color:#7cffae;font-size:1.45rem;background:linear-gradient(180deg,rgba(116,255,174,.14),rgba(0,0,0,0));}
.calendar-card div,.mail-card div,.promo-card div{padding:13px 15px;display:grid;align-content:center;gap:4px;}
.calendar-card b{color:rgba(217,238,255,.65);font-size:.7rem;text-transform:uppercase;letter-spacing:.1em;}
.calendar-card strong,.mail-card strong,.promo-card strong{color:#fff;font-size:1rem;}
.calendar-card span,.mail-card span,.promo-card span{color:rgba(217,238,255,.72);font-size:.86rem;line-height:1.35;}
.calendar-card em,.mail-card em,.promo-card em{color:#7cffae;font-style:normal;font-size:.78rem;}
.calendar-card>.btn,.mail-card>.btn{align-self:center;margin-right:12px;white-space:nowrap;}
.calendar-card.locked,.mail-card.claimed,.promo-card.claimed{opacity:.68;}
.calendar-card.ready:hover,.mail-card.ready:hover,.promo-card:hover{border-color:rgba(117,255,166,.55);background:linear-gradient(180deg,rgba(0,46,62,.94),rgba(0,18,30,.98));}
.promo-console{width:min(780px,calc(100vw - 48px));margin:0 auto 16px;display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end;background:linear-gradient(180deg,rgba(0,34,48,.88),rgba(0,14,24,.94));border:1px solid rgba(184,255,216,.22);box-shadow:inset 1px 0 rgba(255,255,255,.18);padding:16px;}
.promo-console label{display:grid;gap:7px;}
.promo-console span{color:rgba(217,238,255,.7);font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-weight:900;}
.promo-console input{min-height:44px;background:rgba(0,10,18,.92);border:1px solid rgba(184,255,216,.25);color:#fff;padding:0 14px;font-weight:900;text-transform:uppercase;outline:none;}
.promo-console input:focus{border-color:rgba(124,255,174,.7);box-shadow:0 0 0 2px rgba(124,255,174,.10);}
.promo-card small{display:grid;place-items:center;border-left:1px solid rgba(255,255,255,.16);padding:0 16px;color:#7cffae;font-weight:1000;font-size:.68rem;letter-spacing:.1em;}
@media(max-width:760px){.calendar-summary,.mailbox-summary{grid-template-columns:1fr}.calendar-card,.mail-card,.promo-card{grid-template-columns:54px 1fr}.calendar-card>.btn,.mail-card>.btn{grid-column:2;margin:0 12px 12px 0}.promo-card small{grid-column:2;border-left:0;place-items:start;padding:0 14px 12px}.promo-console{grid-template-columns:1fr}}


/* v1.25.38 - Inventory / Market / Expeditions */
.inventory-summary,
.market-summary,
.expedition-summary {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:0;
  border-top:1px solid rgba(191,213,255,.22);
  border-bottom:1px solid rgba(191,213,255,.18);
  background:linear-gradient(180deg,rgba(0,25,38,.78),rgba(0,8,16,.52));
  margin:0 0 1.1rem;
}
.inventory-summary article,
.market-summary article,
.expedition-summary article {
  min-height:76px;
  padding:1rem 1.25rem;
  border-right:1px solid rgba(191,213,255,.18);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.inventory-summary strong,
.market-summary strong,
.expedition-summary strong { color:#dffff2; font-size:1.25rem; letter-spacing:.02em; }
.inventory-summary span,
.market-summary span,
.expedition-summary span { color:rgba(191,213,255,.76); font-size:.78rem; text-transform:uppercase; }
.inventory-grid,
.market-grid,
.expedition-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:0;
  border-top:1px solid rgba(191,213,255,.18);
  border-left:1px solid rgba(191,213,255,.12);
}
.inventory-panel,
.market-card,
.expedition-card {
  position:relative;
  min-height:156px;
  display:grid;
  grid-template-columns:4.75rem 1fr;
  gap:0;
  background:linear-gradient(180deg,rgba(0,25,38,.72),rgba(0,8,16,.64));
  border-right:1px solid rgba(191,213,255,.16);
  border-bottom:1px solid rgba(191,213,255,.14);
  overflow:hidden;
}
.inventory-panel::before,
.market-card::before,
.expedition-card::before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:linear-gradient(180deg,#7cffb5,#1fbf75);
  opacity:.65;
}
.inventory-panel > i,
.market-card > i,
.expedition-card > i {
  display:flex;
  align-items:center;
  justify-content:center;
  border-right:1px solid rgba(191,213,255,.2);
  color:#dffff2;
  font-style:normal;
  font-size:1.7rem;
  background:radial-gradient(circle at 50% 20%,rgba(124,255,181,.18),transparent 58%);
}
.inventory-panel > div,
.market-card > div,
.expedition-card > div { padding:1rem 1.05rem; display:flex; flex-direction:column; gap:.42rem; }
.inventory-panel strong,
.market-card strong,
.expedition-card strong { color:#fff; font-size:1rem; letter-spacing:.015em; }
.inventory-panel span,
.market-card span,
.expedition-card span { color:rgba(191,213,255,.78); font-size:.86rem; line-height:1.45; }
.market-card em,
.expedition-card em { color:#7cffb5; font-style:normal; font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; }
.market-card small,
.expedition-card small { color:rgba(223,255,242,.72); font-size:.78rem; }
.inventory-panel ul { list-style:none; display:grid; gap:.35rem; padding:0; margin:.45rem 0 0; }
.inventory-panel li { display:grid; grid-template-columns:1.1fr auto; gap:.4rem; padding:.42rem 0; border-top:1px solid rgba(191,213,255,.12); }
.inventory-panel li b { color:#dffff2; font-weight:700; }
.inventory-panel li em { color:#7cffb5; font-style:normal; font-weight:800; }
.inventory-panel li small { grid-column:1 / -1; color:rgba(191,213,255,.58); }
.market-card.can-buy,
.expedition-card.ready { background:linear-gradient(180deg,rgba(8,58,53,.72),rgba(0,18,24,.68)); }
.market-card.owned,
.expedition-card.owned { opacity:.78; }
.market-card .btn,
.expedition-card .btn { margin-top:auto; align-self:flex-start; }
@media (max-width: 820px){
  .inventory-grid,.market-grid,.expedition-grid{grid-template-columns:1fr;}
  .inventory-panel,.market-card,.expedition-card{grid-template-columns:3.7rem 1fr;}
}


/* v1.25.39 - Mastery, Trophy Room & Training Academy */
.mastery-summary,
.trophy-summary,
.academy-summary {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:0;
  margin:0 0 1rem;
  border-top:1px solid rgba(191,213,255,.22);
  border-bottom:1px solid rgba(191,213,255,.18);
  background:linear-gradient(180deg,rgba(0,25,38,.78),rgba(0,8,16,.56));
}
.mastery-summary article,
.trophy-summary article,
.academy-summary article {
  min-height:72px;
  padding:1rem 1.2rem;
  border-right:1px solid rgba(191,213,255,.16);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.mastery-summary strong,
.trophy-summary strong,
.academy-summary strong { color:#dffff2; font-size:1.35rem; letter-spacing:.02em; }
.mastery-summary span,
.trophy-summary span,
.academy-summary span { color:rgba(191,213,255,.74); font-size:.76rem; text-transform:uppercase; }
.mastery-grid,
.trophy-grid,
.academy-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
  gap:0;
  border-top:1px solid rgba(191,213,255,.18);
  border-left:1px solid rgba(191,213,255,.12);
}
.mastery-card,
.trophy-card,
.academy-card {
  position:relative;
  min-height:168px;
  display:grid;
  grid-template-columns:5rem 1fr;
  background:linear-gradient(180deg,rgba(0,25,38,.76),rgba(0,8,16,.66));
  border-right:1px solid rgba(191,213,255,.16);
  border-bottom:1px solid rgba(191,213,255,.14);
  overflow:hidden;
}
.mastery-card::before,
.trophy-card::before,
.academy-card::before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:linear-gradient(180deg,#7cffb5,#1fbf75);
  opacity:.55;
}
.mastery-card.ready::before,
.trophy-card.unlocked::before,
.academy-card.ready::before { opacity:1; box-shadow:0 0 18px rgba(124,255,181,.28); }
.mastery-card.claimed,
.trophy-card.claimed,
.academy-card.claimed { background:linear-gradient(180deg,rgba(0,45,35,.70),rgba(0,12,18,.64)); }
.trophy-card.locked,
.academy-card.locked { opacity:.72; }
.mastery-card > i,
.trophy-card > i,
.academy-card > i {
  display:flex;
  align-items:center;
  justify-content:center;
  border-right:1px solid rgba(191,213,255,.18);
  background:radial-gradient(circle at 50% 20%,rgba(124,255,181,.16),transparent 60%);
  color:#dffff2;
  font-style:normal;
  font-size:1.7rem;
}
.mastery-card > div,
.trophy-card > div,
.academy-card > div { padding:1rem 1.1rem; display:flex; flex-direction:column; gap:.38rem; }
.mastery-card em,
.trophy-card em,
.academy-card em { color:#7cffb5; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; font-style:normal; }
.mastery-card strong,
.trophy-card strong,
.academy-card strong { color:#fff; font-size:1rem; }
.mastery-card span,
.trophy-card span,
.academy-card span { color:rgba(214,231,255,.72); font-size:.86rem; line-height:1.45; }
.mastery-card small,
.trophy-card small,
.academy-card small { color:rgba(191,213,255,.72); font-size:.76rem; }
.mini-progress { height:6px; background:rgba(16,54,50,.82); border:1px solid rgba(191,213,255,.18); overflow:hidden; }
.mini-progress b { display:block; height:100%; background:linear-gradient(90deg,#7cffb5,#1fbf75); }
.mastery-card .btn,
.trophy-card .btn,
.academy-card .btn { margin-top:auto; width:100%; }
@media (max-width: 760px){
  .mastery-grid,.trophy-grid,.academy-grid{grid-template-columns:1fr;}
  .mastery-card,.trophy-card,.academy-card{grid-template-columns:4.35rem 1fr;}
}


/* v1.25.40 - Hero Titles, Secret Vault & Stats Lab */
.title-summary,
.vault-summary,
.stats-lab-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  gap:0;
  margin:0 0 1rem;
  border-top:1px solid rgba(191,213,255,.22);
  border-left:1px solid rgba(191,213,255,.12);
  background:linear-gradient(180deg,rgba(0,25,38,.82),rgba(0,8,16,.58));
}
.title-summary article,
.vault-summary article,
.stats-lab-grid article {
  min-height:76px;
  padding:1rem 1.15rem;
  border-right:1px solid rgba(191,213,255,.16);
  border-bottom:1px solid rgba(191,213,255,.12);
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.title-summary strong,
.vault-summary strong,
.stats-lab-grid strong { color:#dffff2; font-size:1.15rem; letter-spacing:.01em; }
.title-summary span,
.vault-summary span,
.stats-lab-grid span { color:rgba(191,213,255,.76); text-transform:uppercase; font-size:.72rem; }
.stats-lab-grid em { color:rgba(223,255,242,.62); font-style:normal; font-size:.78rem; margin-top:.16rem; }
.title-grid,
.secret-vault-grid {
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(310px,1fr));
  gap:0;
  border-top:1px solid rgba(191,213,255,.18);
  border-left:1px solid rgba(191,213,255,.12);
}
.hero-title-card,
.secret-vault-card {
  position:relative;
  min-height:186px;
  display:grid;
  grid-template-columns:5.2rem 1fr;
  background:linear-gradient(180deg,rgba(0,25,38,.78),rgba(0,8,16,.66));
  border-right:1px solid rgba(191,213,255,.16);
  border-bottom:1px solid rgba(191,213,255,.14);
  overflow:hidden;
}
.hero-title-card::before,
.secret-vault-card::before {
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:linear-gradient(180deg,#7cffb5,#1fbf75);
  opacity:.45;
}
.hero-title-card.ready::before,
.hero-title-card.selected::before,
.secret-vault-card.ready::before { opacity:1; box-shadow:0 0 18px rgba(124,255,181,.28); }
.hero-title-card.selected,
.secret-vault-card.opened { background:linear-gradient(180deg,rgba(0,48,37,.72),rgba(0,12,18,.66)); }
.hero-title-card.locked,
.secret-vault-card.locked { opacity:.76; }
.hero-title-card > i,
.secret-vault-card > i {
  display:flex;
  align-items:center;
  justify-content:center;
  border-right:1px solid rgba(191,213,255,.18);
  background:radial-gradient(circle at 50% 20%,rgba(124,255,181,.18),transparent 62%);
  color:#dffff2;
  font-size:2rem;
  font-style:normal;
}
.hero-title-card > div,
.secret-vault-card > div { padding:1rem 1.05rem; display:flex; flex-direction:column; gap:.42rem; }
.hero-title-card em { color:#7cffb5; font-style:normal; font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; }
.hero-title-card strong,
.secret-vault-card strong { color:#f4fff9; font-size:1.05rem; }
.hero-title-card span,
.secret-vault-card span { color:rgba(191,213,255,.78); line-height:1.35; }
.hero-title-card small,
.secret-vault-card small,
.secret-vault-card em { color:rgba(223,255,242,.68); font-style:normal; }
.hero-title-card .btn,
.secret-vault-card .btn { margin-top:.25rem; width:100%; }
.stats-lab-panels {
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:0;
  border-top:1px solid rgba(191,213,255,.18);
  border-left:1px solid rgba(191,213,255,.12);
}
.stats-panel {
  padding:1.1rem;
  background:linear-gradient(180deg,rgba(0,25,38,.78),rgba(0,8,16,.64));
  border-right:1px solid rgba(191,213,255,.16);
  border-bottom:1px solid rgba(191,213,255,.12);
}
.stats-panel > strong { display:block; color:#f4fff9; margin-bottom:.85rem; }
.stats-panel ul { list-style:none; margin:0; padding:0; display:grid; gap:0; }
.stats-panel li { display:flex; justify-content:space-between; gap:1rem; padding:.68rem 0; border-top:1px solid rgba(191,213,255,.1); color:rgba(191,213,255,.78); }
.stats-panel li b { color:#dffff2; font-weight:800; text-align:right; }
.system-chip-grid { display:flex; flex-wrap:wrap; gap:.55rem; }
.system-chip-grid span { padding:.52rem .7rem; border:1px solid rgba(124,255,181,.28); background:rgba(0,25,38,.58); color:#dffff2; text-transform:none; font-size:.82rem; }
@media (max-width:900px){ .stats-lab-panels{grid-template-columns:1fr;} .hero-title-card,.secret-vault-card{grid-template-columns:4.4rem 1fr;} }


/* v1.25.41 — Scrollable, complete homepage menu polish.
   The homepage now keeps the global screen fixed while only the menu list scrolls.
   This makes all added pages reachable without changing the unified dashboard background. */
#screen-main.screen,
#screen-main.screen.active {
  overflow: hidden !important;
  display: grid !important;
  place-items: center !important;
  padding: calc(var(--topbar-h) + 20px) clamp(12px, 2vw, 30px) 24px !important;
}
#screen-main .menu-stage {
  width: min(1500px, calc(100vw - clamp(24px, 4vw, 70px))) !important;
  min-width: 0 !important;
  max-width: 1500px !important;
  height: calc(100vh - var(--topbar-h) - 44px) !important;
  max-height: calc(100vh - var(--topbar-h) - 44px) !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  overflow: hidden !important;
}
#screen-main .home-menu-panel {
  height: 100% !important;
  overflow: hidden !important;
}
#screen-main .berry-main-menu {
  height: 100% !important;
  display: grid !important;
  grid-template-columns: minmax(170px, 220px) minmax(0, 1fr) !important;
  grid-template-rows: minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
  overflow: hidden !important;
}
#screen-main .berry-play-button {
  min-height: 0 !important;
  height: auto !important;
  padding: 18px 18px !important;
  justify-content: center !important;
  box-shadow: inset 0 2px 0 rgba(255,255,255,.38), 0 5px 0 rgba(9,85,32,.95), 0 18px 34px rgba(30,166,58,.22) !important;
}
#screen-main .berry-play-button strong {
  font-size: clamp(28px, 3.1vw, 44px) !important;
  letter-spacing: -.045em !important;
}
#screen-main .berry-play-button em {
  font-size: 10px !important;
  margin-top: 8px !important;
}
#screen-main .berry-menu-grid {
  height: 100% !important;
  max-height: 100% !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  padding: 0 12px 2px 0 !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(178px, 1fr)) !important;
  align-content: start !important;
  gap: 8px !important;
  scrollbar-gutter: stable !important;
  scrollbar-width: thin !important;
  scrollbar-color: #9cff47 #061a10 !important;
}
#screen-main .berry-menu-grid::-webkit-scrollbar {
  width: 10px !important;
  height: 10px !important;
  display: block !important;
}
#screen-main .berry-menu-grid::-webkit-scrollbar-track {
  background: linear-gradient(180deg, #04130d 0%, #082617 100%) !important;
  border-radius: 0 !important;
}
#screen-main .berry-menu-grid::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #c9ff69 0%, #9cff47 48%, #167a37 100%) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 0 12px rgba(156,255,71,.18) !important;
}
#screen-main .berry-menu-grid::-webkit-scrollbar-button,
#screen-main .berry-menu-grid::-webkit-scrollbar-corner {
  width: 0 !important;
  height: 0 !important;
  background: #04130d !important;
}
#screen-main .berry-menu-section-title {
  grid-column: 1 / -1 !important;
  min-height: 26px !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 11px !important;
  margin: 2px 0 0 !important;
  border-left: 3px solid #9cff47 !important;
  border-top: 1px solid rgba(191,213,255,.10) !important;
  border-bottom: 1px solid rgba(191,213,255,.08) !important;
  background: linear-gradient(90deg, rgba(140,255,55,.12), rgba(16,223,255,.05), transparent 70%) !important;
  color: rgba(223,255,242,.86) !important;
  font-size: 11px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  letter-spacing: .13em !important;
  text-transform: uppercase !important;
}
#screen-main .berry-menu-item {
  min-height: 70px !important;
  padding: 10px 10px 10px 54px !important;
  transition: transform .12s ease, border-color .12s ease, background .12s ease, box-shadow .12s ease !important;
}
#screen-main .berry-menu-item i,
#screen-main .berry-menu-item::before {
  width: 42px !important;
}
#screen-main .berry-menu-item span {
  font-size: 13px !important;
}
#screen-main .berry-menu-item small {
  font-size: 10.5px !important;
}
@media (min-width: 1680px) {
  #screen-main .menu-stage { width: min(1640px, calc(100vw - 80px)) !important; }
  #screen-main .berry-main-menu { grid-template-columns: minmax(180px, 230px) minmax(0, 1fr) !important; }
  #screen-main .berry-menu-grid { grid-template-columns: repeat(4, minmax(185px, 1fr)) !important; }
}
@media (max-width: 1180px) {
  #screen-main .berry-main-menu {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto minmax(0, 1fr) !important;
  }
  #screen-main .berry-play-button {
    min-height: 74px !important;
    height: 74px !important;
  }
  #screen-main .berry-menu-grid {
    height: calc(100% - 86px) !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 680px) {
  #screen-main.screen.active { padding: calc(var(--topbar-h) + 14px) 10px 16px !important; }
  #screen-main .menu-stage { width: calc(100vw - 20px) !important; height: calc(100vh - var(--topbar-h) - 30px) !important; }
  #screen-main .berry-menu-grid { grid-template-columns: 1fr !important; padding-right: 8px !important; }
  #screen-main .berry-play-button { height: 66px !important; min-height: 66px !important; padding: 12px 16px !important; }
  #screen-main .berry-play-button strong { font-size: 28px !important; }
}


/* v1.25.42 — Smart homepage navigator.
   Adds search, category chips, lighter hover and no whole-page scrolling. */
#screen-main .berry-main-menu {
  grid-template-rows: auto minmax(0, 1fr) !important;
}
#screen-main .berry-play-button {
  grid-column: 1 !important;
  grid-row: 1 / span 2 !important;
}
#screen-main .home-menu-toolbar {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: grid !important;
  grid-template-columns: minmax(250px, .72fr) minmax(260px, 1fr) auto !important;
  align-items: center !important;
  gap: 8px !important;
  min-height: 52px !important;
  padding: 0 12px 8px 0 !important;
  border-bottom: 1px solid rgba(191,213,255,.16) !important;
}
#screen-main .home-menu-search-wrap {
  min-width: 0 !important;
  height: 44px !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) 28px !important;
  align-items: center !important;
  border: 1px solid rgba(191,213,255,.22) !important;
  border-left: 3px solid rgba(156,255,71,.86) !important;
  background: linear-gradient(180deg, rgba(8,28,39,.86), rgba(0,12,20,.88)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}
#screen-main .home-menu-search-wrap svg {
  width: 19px !important;
  height: 19px !important;
  margin-left: 11px !important;
  stroke: #c9ff69 !important;
  stroke-width: 2.2 !important;
  fill: none !important;
  opacity: .95 !important;
}
#screen-main .home-menu-search-wrap input {
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: #f4fff8 !important;
  font: 800 13px/1 var(--font, inherit) !important;
  letter-spacing: .01em !important;
}
#screen-main .home-menu-search-wrap input::placeholder { color: rgba(223,255,242,.48) !important; }
#screen-main .home-menu-search-wrap kbd {
  justify-self: end !important;
  margin-right: 8px !important;
  min-width: 20px !important;
  height: 20px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(191,213,255,.25) !important;
  background: rgba(191,213,255,.08) !important;
  color: rgba(223,255,242,.66) !important;
  font: 900 11px/1 var(--font, inherit) !important;
}
#screen-main .home-menu-filterbar {
  min-width: 0 !important;
  display: flex !important;
  gap: 6px !important;
  overflow-x: auto !important;
  scrollbar-width: none !important;
}
#screen-main .home-menu-filterbar::-webkit-scrollbar { display: none !important; }
#screen-main .menu-filter-chip {
  flex: 0 0 auto !important;
  height: 34px !important;
  padding: 0 11px !important;
  border: 1px solid rgba(191,213,255,.18) !important;
  border-radius: 0 !important;
  background: rgba(4,18,28,.74) !important;
  color: rgba(223,255,242,.72) !important;
  font: 1000 10.5px/1 var(--font, inherit) !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
  transition: background .12s ease, border-color .12s ease, color .12s ease !important;
}
#screen-main .menu-filter-chip:hover,
#screen-main .menu-filter-chip.active {
  color: #f8fff2 !important;
  border-color: rgba(156,255,71,.56) !important;
  background: linear-gradient(180deg, rgba(56,116,32,.68), rgba(13,52,29,.76)) !important;
}
#screen-main .home-menu-count {
  height: 34px !important;
  padding: 0 10px !important;
  display: grid !important;
  place-items: center !important;
  border-left: 1px solid rgba(191,213,255,.24) !important;
  color: rgba(223,255,242,.66) !important;
  font: 1000 10px/1 var(--font, inherit) !important;
  letter-spacing: .11em !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}
#screen-main .berry-menu-grid {
  grid-column: 2 !important;
  grid-row: 2 !important;
  min-height: 0 !important;
  transition: none !important;
}
#screen-main .berry-menu-item.is-menu-hidden,
#screen-main .berry-menu-section-title.is-menu-hidden { display: none !important; }
#screen-main .berry-menu-item mark {
  background: rgba(156,255,71,.22) !important;
  color: #f7ffe6 !important;
  padding: 0 2px !important;
}
#screen-main .home-menu-empty {
  grid-column: 1 / -1 !important;
  display: none !important;
  min-height: 160px !important;
  border: 1px solid rgba(191,213,255,.16) !important;
  border-left: 3px solid rgba(156,255,71,.70) !important;
  background: linear-gradient(180deg, rgba(7,25,35,.78), rgba(0,11,18,.86)) !important;
  color: rgba(223,255,242,.72) !important;
  place-items: center !important;
  text-align: center !important;
  font: 900 13px/1.4 var(--font, inherit) !important;
}
#screen-main .home-menu-empty.is-visible { display: grid !important; }
#screen-main .home-menu-empty strong { color: #c9ff69 !important; display: block !important; font-size: 18px !important; margin-bottom: 6px !important; }
@media (max-width: 1180px) {
  #screen-main .berry-main-menu { grid-template-rows: auto auto minmax(0, 1fr) !important; }
  #screen-main .berry-play-button { grid-column: 1 !important; grid-row: 1 !important; }
  #screen-main .home-menu-toolbar { grid-column: 1 !important; grid-row: 2 !important; grid-template-columns: 1fr !important; padding: 0 8px 8px 0 !important; }
  #screen-main .berry-menu-grid { grid-column: 1 !important; grid-row: 3 !important; height: 100% !important; }
  #screen-main .home-menu-count { justify-content: start !important; place-items: center start !important; border-left: 3px solid rgba(156,255,71,.56) !important; }
}
@media (max-width: 680px) {
  #screen-main .home-menu-toolbar { min-height: 126px !important; }
  #screen-main .home-menu-search-wrap { height: 42px !important; }
  #screen-main .menu-filter-chip { height: 32px !important; }
}


/* v1.25.43 — Quick access and recent-page polish for the homepage navigator. */
#screen-main .berry-main-menu {
  grid-template-rows: auto auto auto minmax(0, 1fr) !important;
}
#screen-main .berry-play-button {
  grid-row: 1 / span 4 !important;
}
#screen-main .home-menu-quickbar,
#screen-main .home-menu-recent {
  grid-column: 2 !important;
}
#screen-main .home-menu-quickbar {
  grid-row: 2 !important;
  min-width: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  gap: 7px !important;
  padding: 0 12px 4px 0 !important;
}
#screen-main .home-quick-card {
  min-width: 0 !important;
  height: 58px !important;
  display: grid !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  grid-template-rows: 1fr 1fr !important;
  align-items: center !important;
  text-align: left !important;
  border: 1px solid rgba(191,213,255,.16) !important;
  border-left: 3px solid rgba(156,255,71,.76) !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, rgba(10,33,43,.78), rgba(2,14,22,.88)) !important;
  color: #eafff4 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
  cursor: pointer !important;
  padding: 0 9px 0 0 !important;
  transition: transform .10s ease, border-color .10s ease, background .10s ease, box-shadow .10s ease !important;
}
#screen-main .home-quick-card:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(156,255,71,.52) !important;
  background: linear-gradient(180deg, rgba(21,55,42,.88), rgba(5,24,18,.92)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 8px 18px rgba(0,0,0,.18) !important;
}
#screen-main .home-quick-card i {
  grid-row: 1 / span 2 !important;
  width: 38px !important;
  height: 100% !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid rgba(191,213,255,.18) !important;
  color: #c9ff69 !important;
  font-style: normal !important;
  font-weight: 1000 !important;
}
#screen-main .home-quick-card .menu-gift-icon svg {
  width: 20px !important;
  height: 20px !important;
  stroke: #c9ff69 !important;
  fill: none !important;
  stroke-width: 1.9 !important;
}
#screen-main .home-quick-card strong {
  min-width: 0 !important;
  align-self: end !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  font: 1000 12px/1 var(--font, inherit) !important;
  letter-spacing: .035em !important;
  text-transform: uppercase !important;
}
#screen-main .home-quick-card span {
  min-width: 0 !important;
  align-self: start !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
  color: rgba(223,255,242,.58) !important;
  font: 850 10px/1.2 var(--font, inherit) !important;
}
#screen-main .home-quick-card.is-continue {
  border-left-color: rgba(255,229,85,.92) !important;
  background: linear-gradient(180deg, rgba(54,50,14,.82), rgba(13,28,18,.88)) !important;
}
#screen-main .home-quick-card.is-continue i { color: #ffe96a !important; }
#screen-main .home-menu-recent {
  grid-row: 3 !important;
  min-height: 34px !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  padding: 0 12px 6px 0 !important;
  scrollbar-width: none !important;
}
#screen-main .home-menu-recent::-webkit-scrollbar { display: none !important; }
#screen-main .home-menu-recent.is-empty { display: none !important; }
#screen-main .home-menu-recent-label {
  flex: 0 0 auto !important;
  padding: 0 10px !important;
  height: 28px !important;
  display: grid !important;
  place-items: center !important;
  border-left: 3px solid rgba(156,255,71,.55) !important;
  color: rgba(223,255,242,.58) !important;
  font: 1000 10px/1 var(--font, inherit) !important;
  letter-spacing: .11em !important;
  text-transform: uppercase !important;
}
#screen-main .home-recent-chip {
  flex: 0 0 auto !important;
  height: 28px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(191,213,255,.18) !important;
  border-radius: 0 !important;
  background: rgba(5,20,29,.74) !important;
  color: rgba(241,255,247,.78) !important;
  font: 900 10.5px/1 var(--font, inherit) !important;
  cursor: pointer !important;
}
#screen-main .home-recent-chip:hover {
  color: #f8fff2 !important;
  border-color: rgba(156,255,71,.45) !important;
  background: rgba(17,55,32,.82) !important;
}
#screen-main .home-recent-clear {
  flex: 0 0 auto !important;
  height: 28px !important;
  padding: 0 8px !important;
  border: 0 !important;
  border-left: 1px solid rgba(191,213,255,.20) !important;
  background: transparent !important;
  color: rgba(223,255,242,.44) !important;
  font: 1000 10px/1 var(--font, inherit) !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}
#screen-main .home-recent-clear:hover { color: #c9ff69 !important; }
#screen-main .berry-menu-grid {
  grid-row: 4 !important;
}
@media (max-width: 1320px) {
  #screen-main .home-menu-quickbar { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  #screen-main .home-quick-card { height: 52px !important; }
}
@media (max-width: 1180px) {
  #screen-main .berry-main-menu { grid-template-rows: auto auto auto auto minmax(0, 1fr) !important; }
  #screen-main .berry-play-button { grid-column: 1 !important; grid-row: 1 !important; }
  #screen-main .home-menu-toolbar { grid-column: 1 !important; grid-row: 2 !important; }
  #screen-main .home-menu-quickbar { grid-column: 1 !important; grid-row: 3 !important; padding: 0 8px 4px 0 !important; }
  #screen-main .home-menu-recent { grid-column: 1 !important; grid-row: 4 !important; padding: 0 8px 6px 0 !important; }
  #screen-main .berry-menu-grid { grid-column: 1 !important; grid-row: 5 !important; height: 100% !important; }
}
@media (max-width: 680px) {
  #screen-main .home-menu-quickbar { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #screen-main .home-quick-card { height: 48px !important; grid-template-columns: 34px minmax(0, 1fr) !important; }
  #screen-main .home-quick-card i { width: 34px !important; }
}


/* v1.25.44 — Smart Goal Board, claimable menu badges and goal tracker page. */
#screen-main .home-smart-panel {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 8px !important;
  margin: 10px 0 9px !important;
  width: 100% !important;
}
#screen-main .home-smart-card {
  min-height: 72px !important;
  display: grid !important;
  grid-template-columns: 46px 1fr !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px 12px 10px 0 !important;
  border: 1px solid rgba(191,213,255,.20) !important;
  background: linear-gradient(180deg, rgba(0,25,38,.72), rgba(0,14,24,.70)) !important;
  color: #eaf3ff !important;
  text-align: left !important;
  cursor: pointer !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 22px rgba(0,0,0,.14) !important;
  transition: transform .12s ease, border-color .12s ease, background .12s ease !important;
}
#screen-main .home-smart-card:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(140,255,55,.52) !important;
  background: linear-gradient(180deg, rgba(8,48,43,.84), rgba(0,20,30,.78)) !important;
}
#screen-main .home-smart-card > i {
  height: 100% !important;
  min-height: 52px !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid rgba(191,213,255,.20) !important;
  color: var(--page-green) !important;
  font-style: normal !important;
  font-size: 18px !important;
  text-shadow: 0 0 12px rgba(156,255,71,.38) !important;
}
#screen-main .home-smart-card strong {
  display: block !important;
  font-size: 12px !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
  letter-spacing: .04em !important;
  color: #fff !important;
}
#screen-main .home-smart-card span span {
  display: block !important;
  margin-top: 4px !important;
  font-size: 11px !important;
  line-height: 1.25 !important;
  color: rgba(234,243,255,.66) !important;
  font-weight: 800 !important;
}
#screen-main .home-smart-card.is-ready > i { color: #ffd232 !important; text-shadow: 0 0 16px rgba(255,210,50,.48) !important; }
#screen-main .berry-menu-item[data-menu-badge]::after,
#screen-main .home-quick-card[data-menu-badge]::after {
  content: attr(data-menu-badge) !important;
  position: absolute !important;
  right: 8px !important;
  top: 7px !important;
  min-width: 22px !important;
  height: 20px !important;
  padding: 0 6px !important;
  display: grid !important;
  place-items: center !important;
  background: linear-gradient(180deg, #9cff47, #27c94c) !important;
  color: #06210f !important;
  border-left: 1px solid rgba(255,255,255,.45) !important;
  border-bottom: 1px solid rgba(0,0,0,.25) !important;
  font-size: 10px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  box-shadow: 0 0 16px rgba(156,255,71,.28) !important;
}
.goal-tracker-summary,
.goal-tracker-grid { width: min(1440px, 100%) !important; margin-inline: auto !important; }
.goal-tracker-summary {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 10px !important;
  margin-bottom: 14px !important;
}
.goal-tracker-summary article,
.goal-tracker-card {
  position: relative !important;
  display: grid !important;
  grid-template-columns: 58px 1fr !important;
  gap: 14px !important;
  align-items: center !important;
  border: 1px solid var(--page-line-soft) !important;
  background: var(--page-panel-bg) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 18px 32px rgba(0,0,0,.16) !important;
}
.goal-tracker-summary article { min-height: 76px !important; padding: 12px 14px 12px 0 !important; }
.goal-tracker-card { min-height: 148px !important; padding: 16px 16px 16px 0 !important; }
.goal-tracker-summary article i,
.goal-tracker-card > i {
  height: 100% !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid var(--page-line-soft) !important;
  color: var(--page-green) !important;
  font-style: normal !important;
  font-size: 22px !important;
}
.goal-tracker-summary article strong,
.goal-tracker-card strong { color:#fff !important; text-transform: uppercase !important; letter-spacing:.035em !important; }
.goal-tracker-summary article span,
.goal-tracker-card span { color: rgba(234,243,255,.70) !important; font-size: 12px !important; font-weight: 800 !important; }
.goal-tracker-grid { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(310px, 1fr)) !important; gap: 12px !important; }
.goal-progress-line { height: 8px !important; margin: 10px 0 !important; background: rgba(255,255,255,.10) !important; overflow: hidden !important; }
.goal-progress-line i { display:block !important; height:100% !important; width: var(--goal-pct, 0%) !important; background: linear-gradient(90deg, var(--page-green), var(--page-cyan)) !important; }
.goal-tracker-card footer { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:10px !important; }
.goal-tracker-card em { color: var(--page-gold) !important; font-style: normal !important; font-size: 12px !important; font-weight: 1000 !important; }
.goal-tracker-card.is-claimed { opacity: .62 !important; }
.goal-tracker-card.is-ready { border-color: rgba(156,255,71,.45) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 0 0 1px rgba(156,255,71,.10), 0 20px 38px rgba(0,0,0,.20) !important; }
@media (max-width: 1040px) { #screen-main .home-smart-panel { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 620px) { #screen-main .home-smart-panel { grid-template-columns: 1fr !important; } .goal-tracker-grid { grid-template-columns: 1fr !important; } }


/* v1.25.45 Premium Completion Systems */
.secret-levels-screen, .mini-quests-screen { padding-top: calc(var(--menu-topbar-height, 6rem) + 2rem); }
.secret-level-grid article,
.mini-quest-grid article,
.secret-level-summary article,
.mini-quest-summary article {
  background: linear-gradient(180deg, rgba(4, 24, 36, .94), rgba(1, 12, 20, .96));
  border-top: 1px solid rgba(191, 213, 255, .18);
  border-bottom: 1px solid rgba(0, 0, 0, .52);
  box-shadow: inset 4px 0 0 rgba(78, 244, 137, .72), 0 1rem 2.6rem rgba(0, 0, 0, .28);
}
.secret-level-summary, .mini-quest-summary { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:1px; margin:0 auto 1rem; width:min(1180px, calc(100vw - 2rem)); }
.secret-level-summary article, .mini-quest-summary article { padding:1rem; }
.secret-level-summary span, .mini-quest-summary span { color:#9fb6c8; font-size:.78rem; text-transform:uppercase; letter-spacing:.06em; }
.secret-level-summary strong, .mini-quest-summary strong { display:block; color:#fff; font-size:1.4rem; }
.secret-level-grid, .mini-quest-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:1px; width:min(1180px, calc(100vw - 2rem)); margin:0 auto; }
.secret-level-grid article, .mini-quest-grid article { padding:1.1rem; display:grid; gap:.65rem; min-height:190px; }
.secret-level-grid article.ready, .mini-quest-grid article.ready { box-shadow: inset 4px 0 0 #9dff5f, 0 1rem 2.6rem rgba(0,0,0,.28); }
.secret-level-grid article.locked, .mini-quest-grid article.locked { opacity:.62; }
.secret-level-grid strong, .mini-quest-grid strong { color:#fff; font-size:1.08rem; }
.secret-level-grid span, .mini-quest-grid span { color:#b7cfff; line-height:1.4; }
.rarity-pill { display:inline-flex; align-items:center; justify-content:center; width:max-content; padding:.2rem .55rem; border-left:1px solid currentColor; color:#8cff9a; background:rgba(255,255,255,.04); font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; }
.rarity-common{color:#b7cfff}.rarity-rare{color:#63d9ff}.rarity-epic{color:#d987ff}.rarity-legendary{color:#ffd66b}.rarity-mythic{color:#ff7a9b}
.chest-opening-overlay { position:fixed; inset:0; z-index:90; display:none; place-items:center; background:rgba(0,8,16,.68); }
.chest-opening-overlay.open { display:grid; }
.chest-opening-card { width:min(760px, calc(100vw - 2rem)); background:linear-gradient(180deg, rgba(3,26,38,.98), rgba(0,12,20,.98)); border-top:1px solid rgba(191,213,255,.22); box-shadow:inset 4px 0 0 #8cff9a, 0 2rem 5rem rgba(0,0,0,.45); padding:1.5rem; text-align:center; }
.chest-opening-lid { width:6rem; height:6rem; margin:0 auto 1rem; display:grid; place-items:center; color:#9dff5f; font-size:3rem; background:radial-gradient(circle at 50% 35%, rgba(157,255,95,.22), rgba(11,52,36,.85)); border-left:1px solid rgba(191,213,255,.22); animation: chestPop .64s cubic-bezier(.2,1.4,.3,1); }
.chest-opening-copy small { display:block; color:#8cff9a; text-transform:uppercase; letter-spacing:.09em; font-weight:900; }
.chest-opening-copy strong { display:block; color:#fff; font-size:2rem; margin:.25rem 0 1rem; }
.chest-opening-rewards { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:1px; margin:1rem 0; }
.chest-opening-rewards article { background:rgba(255,255,255,.045); padding:1rem; border-left:1px solid rgba(191,213,255,.18); }
.chest-opening-rewards i { display:block; font-size:1.7rem; font-style:normal; }
.chest-opening-rewards strong { display:block; color:#fff; }
.chest-opening-rewards span { color:#b7cfff; font-size:.82rem; }
@keyframes chestPop { 0%{transform:scale(.68) translateY(24px); filter:brightness(.6)} 100%{transform:scale(1) translateY(0); filter:brightness(1)} }
.achievement-popup { position:fixed; right:1rem; top:7rem; z-index:95; display:flex; align-items:center; gap:.85rem; min-width:min(360px, calc(100vw - 2rem)); padding:.85rem 1rem; background:linear-gradient(180deg, rgba(4,24,36,.98), rgba(0,11,19,.98)); border-top:1px solid rgba(191,213,255,.20); box-shadow:inset 4px 0 0 #9dff5f, 0 1rem 2.4rem rgba(0,0,0,.35); transform:translateX(calc(100% + 2rem)); opacity:0; transition:.28s ease; pointer-events:none; }
.achievement-popup.show { transform:translateX(0); opacity:1; }
.achievement-popup i { font-style:normal; font-size:1.9rem; }
.achievement-popup small { display:block; color:#8cff9a; text-transform:uppercase; letter-spacing:.08em; font-weight:900; }
.achievement-popup strong { display:block; color:#fff; }
.achievement-popup span { color:#b7cfff; font-size:.85rem; }
.rare-card-set .rare-card-rarity { margin-left:.5rem; }
.rare-card-set.mythic { box-shadow: inset 4px 0 0 #ff7a9b, 0 1rem 2.6rem rgba(0,0,0,.28); }
@media (max-width: 760px){ .loading-main{grid-template-columns:1fr}.loading-map-preview{min-height:160px}.loading-reward-row{grid-template-columns:1fr}.achievement-popup{top:5rem;right:.5rem;left:.5rem;min-width:0} }


/* v1.25.46 - World Ambience & Sound Studio */
.world-ambience-layer {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
  --ambience-a: rgba(68, 214, 255, .22);
  --ambience-b: rgba(78, 255, 163, .18);
  --ambience-c: rgba(10, 32, 52, .88);
  --ambience-line: rgba(159, 240, 255, .16);
  background:
    radial-gradient(circle at 14% 18%, var(--ambience-a), transparent 28%),
    radial-gradient(circle at 82% 24%, var(--ambience-b), transparent 30%),
    linear-gradient(180deg, rgba(1, 10, 20, .20), var(--ambience-c));
  opacity: .9;
}
.game-shell .world-ambience-layer { display: none !important; }
.world-ambience-layer .ambience-orb,
.world-ambience-layer .ambience-line,
.world-ambience-layer .ambience-particles { position: absolute; display: block; }
.world-ambience-layer .ambience-orb { width: 34vmax; height: 34vmax; border-radius: 50%; filter: blur(18px); opacity: .55; mix-blend-mode: screen; }
.world-ambience-layer .ambience-orb.a { left: -12vmax; top: 12vh; background: var(--ambience-a); animation: ambienceFloatA 13s ease-in-out infinite; }
.world-ambience-layer .ambience-orb.b { right: -11vmax; bottom: -6vmax; background: var(--ambience-b); animation: ambienceFloatB 16s ease-in-out infinite; }
.world-ambience-layer .ambience-line { height: 1px; left: 0; right: 0; background: linear-gradient(90deg, transparent, var(--ambience-line), transparent); transform: rotate(-7deg); opacity: .8; }
.world-ambience-layer .ambience-line.l1 { top: 28%; animation: ambienceSlide 9s linear infinite; }
.world-ambience-layer .ambience-line.l2 { top: 68%; animation: ambienceSlide 12s linear reverse infinite; }
.world-ambience-layer .ambience-particles { inset: 0; opacity: .34; background-image: radial-gradient(circle, rgba(255,255,255,.4) 0 1px, transparent 1.6px); background-size: 46px 46px; animation: ambienceStars 24s linear infinite; }
.world-ambience-layer[data-ambience="forest"] { --ambience-a: rgba(64, 255, 143, .22); --ambience-b: rgba(242, 218, 82, .18); --ambience-c: rgba(2, 30, 24, .86); --ambience-line: rgba(146, 255, 202, .22); }
.world-ambience-layer[data-ambience="aqua"] { --ambience-a: rgba(48, 210, 255, .26); --ambience-b: rgba(74, 255, 219, .18); --ambience-c: rgba(1, 22, 44, .88); --ambience-line: rgba(104, 231, 255, .24); }
.world-ambience-layer[data-ambience="lava"] { --ambience-a: rgba(255, 93, 38, .26); --ambience-b: rgba(255, 193, 70, .18); --ambience-c: rgba(42, 8, 5, .88); --ambience-line: rgba(255, 160, 76, .25); }
.world-ambience-layer[data-ambience="frost"] { --ambience-a: rgba(180, 232, 255, .26); --ambience-b: rgba(113, 156, 255, .18); --ambience-c: rgba(7, 18, 48, .88); --ambience-line: rgba(210, 244, 255, .25); }
.world-ambience-layer[data-ambience="neon"] { --ambience-a: rgba(255, 45, 215, .24); --ambience-b: rgba(28, 236, 255, .20); --ambience-c: rgba(9, 4, 35, .90); --ambience-line: rgba(100, 244, 255, .30); }
.world-ambience-layer[data-ambience="shadow"] { --ambience-a: rgba(124, 79, 255, .24); --ambience-b: rgba(46, 246, 174, .13); --ambience-c: rgba(7, 5, 22, .93); --ambience-line: rgba(158, 126, 255, .23); }
.world-ambience-layer[data-ambience="storm"] { --ambience-a: rgba(108, 165, 255, .24); --ambience-b: rgba(255, 255, 255, .13); --ambience-c: rgba(2, 16, 35, .90); --ambience-line: rgba(194, 218, 255, .30); }
.world-ambience-layer[data-ambience="moon"] { --ambience-a: rgba(205, 180, 255, .22); --ambience-b: rgba(255, 223, 116, .12); --ambience-c: rgba(10, 9, 42, .91); --ambience-line: rgba(229, 213, 255, .24); }
.world-ambience-layer[data-ambience="cosmos"] { --ambience-a: rgba(118, 95, 255, .25); --ambience-b: rgba(255, 95, 191, .16); --ambience-c: rgba(3, 3, 20, .94); --ambience-line: rgba(180, 158, 255, .28); }
body[data-ambience-motion="low"] .world-ambience-layer * { animation-duration: 60s !important; }
body[data-ambience-motion="off"] .world-ambience-layer * { animation: none !important; }
@keyframes ambienceFloatA { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(8vw,-4vh) scale(1.08); } }
@keyframes ambienceFloatB { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(-7vw,3vh) scale(.95); } }
@keyframes ambienceSlide { from { transform: translateX(-18%) rotate(-7deg); } to { transform: translateX(18%) rotate(-7deg); } }
@keyframes ambienceStars { from { background-position: 0 0; } to { background-position: 92px 138px; } }
.ambience-summary, .sound-preview-card { display: grid; gap: 8px; padding: 18px 20px; background: linear-gradient(180deg, rgba(10, 24, 38, .96), rgba(3, 12, 24, .94)); border: 1px solid rgba(255,255,255,.18); box-shadow: inset 5px 0 0 rgba(82, 235, 154, .75); }
.ambience-summary strong, .sound-preview-card strong { color: #fff; text-transform: uppercase; letter-spacing: .04em; }
.ambience-summary span, .sound-preview-card span { color: rgba(222, 240, 255, .74); }
.ambience-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; width: min(1180px, 100%); }
.ambience-card { position: relative; min-height: 122px; display: grid; grid-template-columns: 62px 1fr; gap: 14px; align-items: center; padding: 14px 16px; background: linear-gradient(180deg, rgba(8, 24, 36, .96), rgba(2, 9, 20, .96)); border: 1px solid rgba(255,255,255,.16); color: white; cursor: pointer; text-align: left; transition: transform .12s ease, border-color .12s ease, background .12s ease; }
.ambience-card::before { content:""; width: 52px; height: 52px; border: 1px solid rgba(255,255,255,.22); background: radial-gradient(circle at 30% 25%, var(--card-a, #65e8ff), transparent 45%), radial-gradient(circle at 72% 70%, var(--card-b, #52eb9a), transparent 48%), rgba(255,255,255,.06); }
.ambience-card strong { display: block; text-transform: uppercase; letter-spacing: .035em; }
.ambience-card span { display: block; color: rgba(222,240,255,.72); font-size: .9rem; margin-top: 3px; }
.ambience-card em { color: #6dff9b; font-style: normal; font-size: .78rem; text-transform: uppercase; letter-spacing: .08em; }
.ambience-card:hover, .ambience-card.active { transform: translateX(3px); border-color: rgba(105, 255, 172, .45); background: linear-gradient(180deg, rgba(10, 38, 48, .98), rgba(4, 16, 28, .98)); }
.sound-studio-grid { width: min(980px, 100%); display: grid; gap: 12px; }
.sound-range-row { grid-template-columns: minmax(150px, .6fr) 1fr auto !important; }
.sound-range-row input[type="range"] { width: 100%; accent-color: #58ee91; }
.sound-range-row strong { color: #72ff9c; min-width: 54px; text-align: right; }
.sound-preview-actions { display: flex; gap: 10px; flex-wrap: wrap; }


/* v1.25.47 — Cinematic island Adventure Map */
.adventure-map-legend{
  width:min(1380px,100%) !important;
  margin:0 auto 14px !important;
  display:flex !important;
  flex-wrap:wrap !important;
  gap:1px !important;
  background:rgba(191,213,255,.14) !important;
  border-top:1px solid rgba(191,213,255,.22) !important;
  border-bottom:1px solid rgba(191,213,255,.14) !important;
}
.adventure-map-legend span{
  min-height:38px !important;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  padding:0 14px !important;
  background:linear-gradient(180deg,rgba(0,30,45,.94),rgba(0,10,18,.94)) !important;
  color:rgba(222,236,255,.82) !important;
  font-size:12px !important;
  font-weight:900 !important;
  letter-spacing:.03em !important;
  text-transform:uppercase !important;
}
.adventure-map-legend i{width:11px;height:11px;display:block;background:#72ff9a;box-shadow:0 0 12px rgba(114,255,154,.45)}
.adventure-map-legend .map-active i{background:#ffe96b;box-shadow:0 0 12px rgba(255,233,107,.5)}
.adventure-map-legend .map-complete i{background:linear-gradient(135deg,#ffe96b,#72ff9a)}
.adventure-map-legend .map-locked i{background:#526275;box-shadow:none}.adventure-map-legend .map-secret i{background:#9a74ff;box-shadow:0 0 12px rgba(154,116,255,.5)}
.adventure-island-route{
  width:min(1380px,100%) !important;
  min-height:440px !important;
  margin:0 auto 18px !important;
  position:relative !important;
  display:grid !important;
  grid-template-columns:repeat(10,1fr) !important;
  gap:18px 14px !important;
  padding:34px 30px !important;
  overflow:hidden !important;
  background:
    radial-gradient(circle at 20% 18%,rgba(114,255,154,.16),transparent 30%),
    radial-gradient(circle at 78% 26%,rgba(61,218,255,.14),transparent 34%),
    radial-gradient(circle at 45% 85%,rgba(154,116,255,.12),transparent 35%),
    linear-gradient(180deg,rgba(0,32,48,.94),rgba(0,10,18,.96)) !important;
  border-top:1px solid rgba(191,213,255,.22) !important;
  border-bottom:1px solid rgba(191,213,255,.16) !important;
}
.adventure-island-route::before{
  content:"";position:absolute;inset:34px 42px;opacity:.2;pointer-events:none;
  background:repeating-linear-gradient(135deg,transparent 0 52px,rgba(191,213,255,.32) 53px 55px,transparent 56px 104px);
  mask-image:linear-gradient(90deg,transparent,black 10%,black 90%,transparent);
}
.island-node{
  position:relative !important;
  z-index:1 !important;
  min-height:96px !important;
  border:0 !important;
  cursor:pointer !important;
  color:#fff !important;
  display:grid !important;
  grid-template-rows:auto 1fr auto !important;
  place-items:center !important;
  gap:5px !important;
  background:linear-gradient(180deg,rgba(0,38,54,.96),rgba(0,13,21,.96)) !important;
  border-left:1px solid rgba(191,213,255,.18) !important;
  box-shadow:inset 0 0 0 1px rgba(191,213,255,.09),0 12px 28px rgba(0,0,0,.22) !important;
  isolation:isolate !important;
  transition:transform .12s ease, filter .12s ease, background .12s ease !important;
}
.island-node::before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,#72ff9a,#106d42);z-index:2}.island-node::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:linear-gradient(90deg,#2fbf71,#9cff47);width:var(--map-progress);z-index:3}
.island-node:hover{transform:translateY(-2px) !important;filter:brightness(1.08) !important}.island-node strong{font-size:1.15rem;line-height:1;color:#fff}.island-node i{font-style:normal;font-size:1.85rem;line-height:1}.island-node em{font-style:normal;font-size:.58rem;color:rgba(222,236,255,.72);letter-spacing:.08em;text-transform:uppercase;font-weight:1000}.island-glow{position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 50% 14%,rgba(114,255,154,.22),transparent 62%)}
.island-node.active::before{background:linear-gradient(180deg,#ffe96b,#72ff9a)}.island-node.active .island-glow{background:radial-gradient(circle at 50% 12%,rgba(255,233,107,.36),rgba(114,255,154,.12) 42%,transparent 68%)}.island-node.complete::before{background:linear-gradient(180deg,#ffe96b,#7cff87)}.island-node.complete{background:linear-gradient(180deg,rgba(20,62,48,.98),rgba(0,16,23,.96)) !important}.island-node.locked{opacity:.58;filter:saturate(.6)}.island-node.locked::before,.island-node.locked::after{background:#526275}.secret-dot{position:absolute;right:8px;top:7px;width:20px;height:20px;display:grid;place-items:center;background:#9a74ff;color:#fff;font-size:.62rem;box-shadow:0 0 16px rgba(154,116,255,.5)}
.island-node.theme-aqua .island-glow,.adventure-world-node.theme-aqua .map-node-rail{background:radial-gradient(circle at 50% 12%,rgba(61,218,255,.32),transparent 70%)}.island-node.theme-lava::before,.adventure-world-node.theme-lava::before{background:linear-gradient(180deg,#ffcf5a,#ff4a3f)!important}.island-node.theme-frost::before,.adventure-world-node.theme-frost::before{background:linear-gradient(180deg,#dff6ff,#70b8ff)!important}.island-node.theme-neon::before,.adventure-world-node.theme-neon::before{background:linear-gradient(180deg,#ff69ff,#4de7ff)!important}.island-node.theme-shadow::before,.adventure-world-node.theme-shadow::before{background:linear-gradient(180deg,#9a74ff,#243152)!important}.island-node.theme-storm::before,.adventure-world-node.theme-storm::before{background:linear-gradient(180deg,#ffe96b,#3ddaff)!important}.island-node.theme-moon::before,.adventure-world-node.theme-moon::before{background:linear-gradient(180deg,#d4c8ff,#7f6cff)!important}.island-node.theme-cosmos::before,.adventure-world-node.theme-cosmos::before{background:linear-gradient(180deg,#fff,#9a74ff 40%,#3ddaff)!important}.island-node.theme-firefly::before,.adventure-world-node.theme-firefly::before{background:linear-gradient(180deg,#f9ff7a,#72ff9a)!important}.island-node.theme-root::before,.adventure-world-node.theme-root::before{background:linear-gradient(180deg,#b78355,#72ff9a)!important}
@media(max-width:1180px){.adventure-island-route{grid-template-columns:repeat(5,1fr)!important}.island-node{min-height:86px!important}}
@media(max-width:760px){.adventure-island-route{grid-template-columns:repeat(2,1fr)!important;padding:18px!important;gap:10px!important}.island-node{min-height:74px!important}.adventure-map-legend span{flex:1 1 150px!important}}


/* v1.25.48 — Accessibility, Performance & Data Manager */
.quality-summary-grid,
.publisher-checklist-grid{
  width:min(1380px,100%) !important;
  margin:0 auto 14px !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr)) !important;
  gap:1px !important;
  background:rgba(191,213,255,.14) !important;
  border-top:1px solid rgba(191,213,255,.22) !important;
  border-bottom:1px solid rgba(191,213,255,.14) !important;
}
.quality-summary-grid article,
.publisher-checklist-grid article{
  min-height:70px !important;
  padding:14px 16px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:center !important;
  background:linear-gradient(180deg,rgba(0,30,45,.96),rgba(0,12,20,.96)) !important;
  border-left:1px solid rgba(191,213,255,.10) !important;
}
.quality-summary-grid span,
.publisher-checklist-grid span{font-size:.72rem !important;color:rgba(222,236,255,.64) !important;text-transform:uppercase !important;letter-spacing:.08em !important;font-weight:900 !important}.quality-summary-grid strong{font-size:1.22rem !important;color:#fff !important}.quality-summary-grid em{font-style:normal !important;color:#78ff9c !important;font-size:.78rem !important}.publisher-checklist-grid strong{font-size:.94rem!important;color:#fff!important}.quality-card-grid{width:min(1380px,100%) !important;margin:0 auto !important;display:grid !important;grid-template-columns:repeat(auto-fit,minmax(280px,1fr)) !important;gap:1px !important;background:rgba(191,213,255,.14) !important;border-top:1px solid rgba(191,213,255,.18) !important;border-bottom:1px solid rgba(191,213,255,.12) !important}.quality-tool-card{min-height:118px !important;display:grid !important;grid-template-columns:72px minmax(0,1fr) auto !important;align-items:stretch !important;background:linear-gradient(180deg,rgba(0,32,48,.96),rgba(0,12,20,.96)) !important;color:#fff !important;overflow:hidden !important;position:relative !important}.quality-tool-card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:linear-gradient(180deg,#3ddaff,#225a71);opacity:.78}.quality-tool-card.active::before{background:linear-gradient(180deg,#c7ff5a,#35e08a)}.quality-tool-card>i{font-style:normal;display:grid;place-items:center;font-size:1.75rem;background:radial-gradient(circle at 50% 22%,rgba(120,255,156,.22),rgba(0,0,0,0) 72%);border-right:1px solid rgba(191,213,255,.15)}.quality-tool-card>div{padding:16px 16px 14px;display:flex;flex-direction:column;gap:5px}.quality-tool-card strong{font-size:1rem;color:#fff}.quality-tool-card span{color:rgba(222,236,255,.74);font-size:.86rem;line-height:1.42}.quality-tool-card em{color:#78ff9c;font-size:.72rem;font-style:normal;text-transform:uppercase;letter-spacing:.08em;font-weight:1000}.quality-tool-card .btn{align-self:center;margin-right:14px;white-space:nowrap}.save-tools-layout{width:min(1380px,100%) !important;margin:0 auto !important;display:grid !important;grid-template-columns:minmax(0,1fr) 220px !important;gap:1px !important;background:rgba(191,213,255,.14) !important}.save-tools-layout textarea{min-height:340px !important;resize:vertical !important;border:0 !important;outline:0 !important;background:linear-gradient(180deg,rgba(0,30,45,.96),rgba(0,12,20,.96)) !important;color:#dff6ff !important;font:600 13px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace !important;padding:18px !important;box-shadow:inset 0 0 0 1px rgba(191,213,255,.10) !important}.save-tools-actions{display:flex !important;flex-direction:column !important;gap:1px !important;background:rgba(0,0,0,.22) !important}.save-tools-actions .btn{height:64px !important;border-radius:0 !important;margin:0 !important}.berri-reduced-motion *, .berri-reduced-motion *::before, .berri-reduced-motion *::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important}.berri-high-contrast .content-screen article,.berri-high-contrast .berry-menu-item,.berri-high-contrast .home-quick-card{box-shadow:inset 0 0 0 1px rgba(255,255,255,.28) !important}.berri-high-contrast .hint{color:#fff !important}.berri-large-ui{font-size:17px !important}.berri-large-ui .berry-menu-item{min-height:82px !important}.berri-large-ui .content-screen{font-size:1.04rem !important}.berri-color-safe .ready,.berri-color-safe .active,.berri-color-safe .selected{outline:2px dashed rgba(120,255,156,.55) !important;outline-offset:-4px}.berri-color-safe .locked{outline:2px dotted rgba(255,255,255,.25) !important;outline-offset:-4px}.berri-simplified-bg #world-ambience-layer{display:none !important}.berri-simplified-bg .home-bg-effect::before,.berri-simplified-bg .home-bg-effect::after{display:none !important}
@media(max-width:760px){.quality-tool-card{grid-template-columns:56px 1fr !important}.quality-tool-card .btn{grid-column:1/-1;margin:0 12px 12px !important}.save-tools-layout{grid-template-columns:1fr !important}.save-tools-actions{display:grid!important;grid-template-columns:repeat(3,1fr)!important}.save-tools-actions .btn{height:54px!important}}


/* v1.25.49 — Localization, Controls & Publisher Dashboard */
.localization-preview-grid,
.publisher-dashboard-grid{
  width:min(1380px,100%) !important;
  margin:14px auto 0 !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr)) !important;
  gap:1px !important;
  background:rgba(191,213,255,.14) !important;
  border-top:1px solid rgba(191,213,255,.20) !important;
  border-bottom:1px solid rgba(191,213,255,.12) !important;
}
.localization-preview-grid article,
.publisher-dashboard-card{
  min-height:118px !important;
  padding:18px 18px 16px 78px !important;
  background:linear-gradient(180deg,rgba(0,32,48,.96),rgba(0,12,20,.96)) !important;
  color:#fff !important;
  position:relative !important;
  overflow:hidden !important;
  border-left:1px solid rgba(191,213,255,.12) !important;
}
.localization-preview-grid article::before,
.publisher-dashboard-card::before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;top:0 !important;bottom:0 !important;
  width:58px !important;
  background:radial-gradient(circle at 50% 20%,rgba(120,255,156,.24),transparent 70%),linear-gradient(180deg,rgba(191,213,255,.08),rgba(0,0,0,.12)) !important;
  border-right:1px solid rgba(191,213,255,.14) !important;
}
.localization-preview-grid article::after,
.publisher-dashboard-card::after{
  content:attr(data-icon) !important;
  position:absolute !important;
  left:0 !important;top:0 !important;
  width:58px !important;height:100% !important;
  display:grid !important;place-items:center !important;
  color:#78ff9c !important;
  font-weight:1000 !important;
  font-size:1.35rem !important;
}
.localization-preview-grid strong,
.publisher-dashboard-card strong{display:block !important;font-size:1rem !important;color:#fff !important;margin-bottom:5px !important}
.localization-preview-grid span,
.publisher-dashboard-card span{display:block !important;color:rgba(222,236,255,.72) !important;font-size:.86rem !important;line-height:1.45 !important}
.localization-preview-grid em,
.publisher-dashboard-card em{display:block !important;margin-top:10px !important;color:#78ff9c !important;font-size:.72rem !important;font-style:normal !important;letter-spacing:.08em !important;text-transform:uppercase !important;font-weight:1000 !important}
.publisher-dashboard-card.complete::before{background:linear-gradient(180deg,rgba(120,255,156,.28),rgba(0,0,0,.08)) !important}.publisher-dashboard-card.warning::before{background:linear-gradient(180deg,rgba(255,233,107,.28),rgba(0,0,0,.08)) !important}.publisher-dashboard-card.pending::before{background:linear-gradient(180deg,rgba(61,218,255,.20),rgba(0,0,0,.08)) !important}
.control-center-screen .quality-tool-card kbd{display:inline-grid;place-items:center;min-width:28px;height:24px;padding:0 8px;margin-right:5px;background:rgba(191,213,255,.13);border-left:1px solid rgba(191,213,255,.22);border-right:1px solid rgba(0,0,0,.24);color:#fff;font-weight:1000;font-size:.72rem;letter-spacing:.04em}.control-center-screen .publisher-checklist-grid article{min-height:82px!important}.control-center-screen .publisher-checklist-grid code{color:#78ff9c;font-weight:1000}.berri-control-compact .mobile-controls{transform:scale(.92);transform-origin:right bottom}.berri-control-large .mobile-controls{transform:scale(1.08);transform-origin:right bottom}.berri-aim-assist #hud::after{content:"AIM ASSIST";position:absolute;right:72px;bottom:-19px;color:rgba(120,255,156,.76);font-size:.55rem;font-weight:1000;letter-spacing:.13em}.localization-screen .quality-tool-card.active>i{color:#78ff9c}.localization-screen .quality-tool-card.active::before{background:linear-gradient(180deg,#78ff9c,#2fbf71)}
@media(max-width:760px){.localization-preview-grid,.publisher-dashboard-grid{grid-template-columns:1fr!important}.localization-preview-grid article,.publisher-dashboard-card{padding-left:70px!important}.berri-aim-assist #hud::after{display:none!important}}


/* v1.25.50 — Theme Studio, Screenshot Studio & QA Center */
:root{--berri-accent:#78ff9c;--berri-accent-2:#2fbf71;--berri-accent-soft:rgba(120,255,156,.18)}
body[data-theme-accent="aqua"]{--berri-accent:#63e9ff;--berri-accent-2:#2597ff;--berri-accent-soft:rgba(99,233,255,.18)}
body[data-theme-accent="amber"]{--berri-accent:#ffe66d;--berri-accent-2:#f5a623;--berri-accent-soft:rgba(255,230,109,.18)}
body[data-theme-accent="ruby"]{--berri-accent:#ff6b8a;--berri-accent-2:#ff2f66;--berri-accent-soft:rgba(255,107,138,.18)}
body[data-theme-accent="violet"]{--berri-accent:#b58cff;--berri-accent-2:#7a5cff;--berri-accent-soft:rgba(181,140,255,.18)}
body[data-theme-accent="mono"]{--berri-accent:#dfefff;--berri-accent-2:#8fa8c8;--berri-accent-soft:rgba(223,239,255,.14)}
body[data-theme-accent] .topbar-xp i,
body[data-theme-accent] .goal-progress-line i,
body[data-theme-accent] .mini-progress b{background:linear-gradient(90deg,var(--berri-accent),var(--berri-accent-2)) !important}
body[data-theme-accent] .btn.primary,
body[data-theme-accent] .berry-play-button strong{color:#001926 !important;background:linear-gradient(180deg,var(--berri-accent),var(--berri-accent-2)) !important}
body[data-theme-accent] .quality-tool-card.active::before,
body[data-theme-accent] .publisher-dashboard-card.complete::before{background:linear-gradient(180deg,var(--berri-accent),var(--berri-accent-2)) !important}
body[data-theme-accent] .theme-swatch.active{outline:2px solid var(--berri-accent) !important;box-shadow:0 0 0 1px rgba(255,255,255,.18),0 0 32px var(--berri-accent-soft) !important}
body[data-theme-accent] ::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--berri-accent),var(--berri-accent-2)) !important}
.theme-studio-grid,
.theme-preview-grid,
.screenshot-studio-grid,
.qa-check-grid{width:min(1380px,100%) !important;margin:14px auto 0 !important;display:grid !important;grid-template-columns:repeat(auto-fit,minmax(255px,1fr)) !important;gap:1px !important;background:rgba(191,213,255,.16) !important;border-top:1px solid rgba(191,213,255,.20) !important;border-bottom:1px solid rgba(191,213,255,.12) !important}
.theme-swatch,
.theme-preview-card,
.screenshot-card,
.qa-card{min-height:122px !important;padding:17px 17px 16px 78px !important;background:linear-gradient(180deg,rgba(0,32,48,.96),rgba(0,12,20,.97)) !important;color:#fff !important;position:relative !important;overflow:hidden !important;border-left:1px solid rgba(191,213,255,.12) !important;text-align:left !important}
.theme-swatch::before,
.theme-preview-card::before,
.screenshot-card::before,
.qa-card::before{content:"" !important;position:absolute !important;left:0 !important;top:0 !important;bottom:0 !important;width:58px !important;background:linear-gradient(180deg,var(--swatch-a,var(--berri-accent)),var(--swatch-b,var(--berri-accent-2))) !important;border-right:1px solid rgba(191,213,255,.18) !important;opacity:.92 !important}
.theme-swatch::after,
.theme-preview-card::after,
.screenshot-card::after,
.qa-card::after{content:attr(data-icon) !important;position:absolute !important;left:0 !important;top:0 !important;width:58px !important;height:100% !important;display:grid !important;place-items:center !important;color:#001926 !important;font-weight:1000 !important;font-size:1.25rem !important;text-shadow:0 1px 0 rgba(255,255,255,.35) !important}
.theme-swatch strong,
.theme-preview-card strong,
.screenshot-card strong,
.qa-card strong{display:block !important;font-size:1rem !important;color:#fff !important;margin-bottom:5px !important}
.theme-swatch span,
.theme-preview-card span,
.screenshot-card span,
.qa-card span{display:block !important;color:rgba(222,236,255,.72) !important;font-size:.86rem !important;line-height:1.45 !important}
.theme-swatch em,
.theme-preview-card em,
.screenshot-card em,
.qa-card em{display:block !important;margin-top:10px !important;color:var(--berri-accent) !important;font-size:.72rem !important;font-style:normal !important;text-transform:uppercase !important;letter-spacing:.08em !important;font-weight:1000 !important}
.theme-swatch{cursor:pointer !important;border:0 !important;font:inherit !important}.theme-swatch:hover,.screenshot-card:hover,.qa-card:hover,.theme-preview-card:hover{filter:brightness(1.08) !important}.qa-card.pass::before{background:linear-gradient(180deg,#78ff9c,#2fbf71) !important}.qa-card.warn::before{background:linear-gradient(180deg,#ffe66d,#f5a623) !important}.qa-card.fail::before{background:linear-gradient(180deg,#ff6b8a,#ff2f66) !important}.screenshot-card footer{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}.screenshot-card kbd,.qa-card kbd{display:inline-grid;place-items:center;min-width:28px;height:24px;padding:0 8px;background:rgba(191,213,255,.12);border-left:1px solid rgba(191,213,255,.20);color:#fff;font-size:.7rem;font-weight:1000}.theme-preview-card .preview-bars{height:8px;margin-top:12px;display:grid;grid-template-columns:2fr 1.3fr .8fr;gap:1px}.theme-preview-card .preview-bars i{background:linear-gradient(90deg,var(--berri-accent),var(--berri-accent-2));display:block}.theme-preview-card .preview-bars i:nth-child(2){opacity:.65}.theme-preview-card .preview-bars i:nth-child(3){opacity:.38}
@media(max-width:760px){.theme-studio-grid,.theme-preview-grid,.screenshot-studio-grid,.qa-check-grid{grid-template-columns:1fr!important}.theme-swatch,.theme-preview-card,.screenshot-card,.qa-card{padding-left:70px!important}}


/* v1.25.52 — Critical menu/screen routing fix.
   The homepage was being forced visible by an old selector (#screen-main.screen),
   so it stayed behind content pages. Keep it rendered only while active. */
.screen[hidden] { display: none !important; visibility: hidden !important; pointer-events: none !important; }
#screen-main.screen:not(.active) {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
#screen-main.screen.active {
  display: grid !important;
  visibility: visible !important;
  pointer-events: auto !important;
}
.screen.content-screen.active,
.screen.compact.active:not(#screen-main) {
  background-color: #001926 !important;
}
#screen-main .berry-main-menu,
#screen-main .berry-menu-grid,
#screen-main .home-menu-toolbar,
#screen-main .home-menu-quickbar,
#screen-main .home-menu-recent,
#screen-main .home-smart-panel {
  backface-visibility: hidden !important;
  transform: translateZ(0);
}


/* v1.25.53 — Homepage menu cleanup and input routing fix.
   Quick Access and Smart Recommendations were removed because the main menu now carries all routes. */
#screen-main .home-menu-quickbar,
#screen-main .home-smart-panel {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
#screen-main .berry-main-menu {
  grid-template-rows: auto auto minmax(0, 1fr) !important;
}
#screen-main .berry-play-button {
  grid-row: 1 / span 3 !important;
}
#screen-main .home-menu-toolbar {
  grid-column: 2 !important;
  grid-row: 1 !important;
}
#screen-main .home-menu-recent {
  grid-column: 2 !important;
  grid-row: 2 !important;
}
#screen-main .berry-menu-grid {
  grid-column: 2 !important;
  grid-row: 3 !important;
  height: 100% !important;
}
#screen-main .berry-play-button strong,
body[data-theme-accent] #screen-main .berry-play-button strong {
  color: #ffffff !important;
  background: transparent !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #ffffff !important;
  text-shadow: 0 3px 0 rgba(0,0,0,.24), 0 0 18px rgba(255,255,255,.18) !important;
}
#screen-main .berry-play-button em,
body[data-theme-accent] #screen-main .berry-play-button em {
  color: rgba(255,255,255,.82) !important;
  background: transparent !important;
}
@media (max-width: 1180px) {
  #screen-main .berry-main-menu {
    grid-template-rows: auto auto auto minmax(0, 1fr) !important;
  }
  #screen-main .berry-play-button { grid-column: 1 !important; grid-row: 1 !important; }
  #screen-main .home-menu-toolbar { grid-column: 1 !important; grid-row: 2 !important; }
  #screen-main .home-menu-recent { grid-column: 1 !important; grid-row: 3 !important; }
  #screen-main .berry-menu-grid { grid-column: 1 !important; grid-row: 4 !important; }
}


/* v1.25.54 — Featured homepage routes and page content polish.
   Large cards for Quick Start, Adventure Map, World Gates and Level Map. */
#screen-main .berry-main-menu {
  grid-template-rows: auto auto auto minmax(0, 1fr) !important;
  grid-template-columns: minmax(190px, 240px) minmax(0, 1fr) !important;
  gap: 10px !important;
}
#screen-main .berry-play-button {
  grid-column: 1 !important;
  grid-row: 1 / span 4 !important;
  min-height: 100% !important;
  height: 100% !important;
  padding: 18px 14px !important;
  background: linear-gradient(180deg, rgba(83, 191, 62, .95), rgba(16, 106, 47, .98)) !important;
  border: 1px solid rgba(210,255,154,.58) !important;
  border-left: 4px solid #d9ff72 !important;
}
#screen-main .berry-play-button strong {
  color: #fff !important;
  font-size: clamp(34px, 4.4vw, 62px) !important;
  letter-spacing: -.04em !important;
}
#screen-main .home-feature-cards {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  min-height: 118px !important;
  padding: 0 12px 0 0 !important;
}
#screen-main .home-feature-card {
  position: relative !important;
  min-width: 0 !important;
  height: 118px !important;
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr) auto !important;
  align-items: stretch !important;
  border: 1px solid rgba(191,213,255,.20) !important;
  border-left: 4px solid rgba(156,255,71,.86) !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, rgba(11,38,50,.88), rgba(2,14,22,.96)) !important;
  color: #f4fff8 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 18px 32px rgba(0,0,0,.16) !important;
  cursor: pointer !important;
  overflow: hidden !important;
  padding: 0 !important;
  text-align: left !important;
  transition: transform .11s ease, border-color .11s ease, background .11s ease, box-shadow .11s ease !important;
}
#screen-main .home-feature-card:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(201,255,105,.58) !important;
  background: linear-gradient(180deg, rgba(19,62,55,.92), rgba(3,22,25,.98)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 22px 34px rgba(0,0,0,.22), 0 0 22px rgba(156,255,71,.10) !important;
}
#screen-main .home-feature-card::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: linear-gradient(110deg, rgba(255,255,255,.09), transparent 34%, rgba(156,255,71,.05) 100%) !important;
  opacity: .72 !important;
}
#screen-main .home-feature-card i {
  height: 100% !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid rgba(191,213,255,.20) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(0,0,0,.08)) !important;
  color: #c9ff69 !important;
  font: 1000 26px/1 var(--font, inherit) !important;
  font-style: normal !important;
  text-shadow: 0 0 12px rgba(156,255,71,.22) !important;
}
#screen-main .home-feature-card span {
  min-width: 0 !important;
  align-self: center !important;
  padding: 0 12px !important;
  display: grid !important;
  gap: 8px !important;
}
#screen-main .home-feature-card strong {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #ffffff !important;
  font: 1000 clamp(15px, 1.25vw, 20px)/1 var(--font, inherit) !important;
  letter-spacing: .025em !important;
  text-transform: uppercase !important;
}
#screen-main .home-feature-card em {
  color: rgba(223,255,242,.64) !important;
  font: 850 11.5px/1.3 var(--font, inherit) !important;
  font-style: normal !important;
}
#screen-main .home-feature-card b {
  align-self: start !important;
  justify-self: end !important;
  margin: 10px 10px 0 0 !important;
  min-width: 34px !important;
  height: 24px !important;
  display: grid !important;
  place-items: center !important;
  border-left: 1px solid rgba(191,213,255,.24) !important;
  color: #c9ff69 !important;
  font: 1000 10px/1 var(--font, inherit) !important;
  letter-spacing: .08em !important;
}
#screen-main .home-feature-card.is-quick { border-left-color: #ffe66c !important; background: linear-gradient(180deg, rgba(55,49,19,.92), rgba(12,32,22,.96)) !important; }
#screen-main .home-feature-card.is-quick i,
#screen-main .home-feature-card.is-quick b { color: #ffe66c !important; }
#screen-main .home-feature-card.is-map { border-left-color: #70f5ff !important; }
#screen-main .home-feature-card.is-map i,
#screen-main .home-feature-card.is-map b { color: #70f5ff !important; }
#screen-main .home-feature-card.is-worlds { border-left-color: #d18aff !important; }
#screen-main .home-feature-card.is-worlds i,
#screen-main .home-feature-card.is-worlds b { color: #d18aff !important; }
#screen-main .home-feature-card.is-levels { border-left-color: #9cff47 !important; }
#screen-main .home-menu-toolbar {
  grid-column: 2 !important;
  grid-row: 2 !important;
  padding-top: 0 !important;
}
#screen-main .home-menu-recent {
  grid-column: 2 !important;
  grid-row: 3 !important;
}
#screen-main .berry-menu-grid {
  grid-column: 2 !important;
  grid-row: 4 !important;
}
#screen-main .berry-menu-item {
  min-height: 76px !important;
}
#screen-main .berry-menu-section-title {
  margin-top: 6px !important;
}
/* Page polish: larger readable dashboard cards without outer panels. */
.screen.content-screen.active {
  padding-left: clamp(18px, 3.4vw, 58px) !important;
  padding-right: clamp(18px, 3.4vw, 58px) !important;
}
.content-screen .hint,
.content-screen .setting-note,
.content-screen > p:not([class]) {
  max-width: 1120px !important;
  min-height: 46px !important;
  display: flex !important;
  align-items: center !important;
  border-left: 4px solid rgba(156,255,71,.78) !important;
  border-top: 1px solid rgba(191,213,255,.12) !important;
  border-bottom: 1px solid rgba(191,213,255,.10) !important;
  background: linear-gradient(90deg, rgba(156,255,71,.10), rgba(8,30,38,.56), transparent) !important;
  color: rgba(238,255,247,.74) !important;
  padding: 10px 16px !important;
  margin: 0 0 14px !important;
}
.level-grid, .world-gates-grid, .quest-grid, .achievement-grid, .vault-grid, .arena-grid, .power-room-grid, .shop-grid, .wardrobe-grid, .profile-stats, .profile-badges, .save-slots-grid, .guide-grid {
  gap: 12px !important;
}
.world-gate-card, .quest-card, .achievement, .vault-card, .arena-card, .power-card, .shop-card, .skin-card, .save-slot-card, .guide-grid article, .profile-stats article, .profile-badges article {
  min-height: 96px !important;
  border-radius: 0 !important;
  border-left-width: 4px !important;
  transition: transform .12s ease, border-color .12s ease, background .12s ease, box-shadow .12s ease !important;
}
.world-gate-card:hover, .quest-card:hover, .achievement:hover, .vault-card:hover, .arena-card:hover, .power-card:hover, .shop-card:hover, .skin-card:hover, .save-slot-card:hover, .guide-grid article:hover, .profile-stats article:hover, .profile-badges article:hover {
  transform: translateY(-1px) !important;
  border-left-color: #c9ff69 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 16px 30px rgba(0,0,0,.18) !important;
}
.btn, .content-screen button.btn, .content-screen a.btn {
  border-radius: 0 !important;
  min-height: 40px !important;
}
@media (max-width: 1420px) {
  #screen-main .home-feature-cards { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; min-height: 220px !important; }
  #screen-main .home-feature-card { height: 105px !important; }
}
@media (max-width: 1180px) {
  #screen-main .berry-main-menu {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto auto auto minmax(0, 1fr) !important;
  }
  #screen-main .berry-play-button { grid-column: 1 !important; grid-row: 1 !important; min-height: 76px !important; height: 76px !important; }
  #screen-main .home-feature-cards { grid-column: 1 !important; grid-row: 2 !important; padding-right: 8px !important; }
  #screen-main .home-menu-toolbar { grid-column: 1 !important; grid-row: 3 !important; }
  #screen-main .home-menu-recent { grid-column: 1 !important; grid-row: 4 !important; }
  #screen-main .berry-menu-grid { grid-column: 1 !important; grid-row: 5 !important; }
}
@media (max-width: 680px) {
  #screen-main .home-feature-cards { grid-template-columns: 1fr !important; min-height: auto !important; }
  #screen-main .home-feature-card { height: 82px !important; grid-template-columns: 48px minmax(0, 1fr) auto !important; }
  #screen-main .home-feature-card i { font-size: 20px !important; }
  #screen-main .home-feature-card em { display: none !important; }
}

/* v1.25.55 — Shop page cleanup: stable icon rail, header-style currency icons and no duplicated wallet block. */
#screen-shop.content-screen > .shop-overview-card,
#screen-shop.content-screen > .shop-economy-bar,
#screen-shop.content-screen > .shop-category-strip,
#screen-shop.content-screen > #shop-grid {
  width: min(1380px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
#screen-shop .shop-overview-card {
  min-height: 72px !important;
  display: grid !important;
  grid-template-columns: 56px minmax(0, 1fr) !important;
  align-items: stretch !important;
  margin: 0 auto 10px !important;
  border: 1px solid rgba(191,213,255,.24) !important;
  border-radius: 0 !important;
  background:
    linear-gradient(90deg, rgba(156,255,71,.13), rgba(16,223,255,.055), rgba(255,255,255,.018)),
    linear-gradient(180deg, rgba(9,31,47,.92), rgba(2,13,22,.86)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 18px 34px rgba(0,0,0,.18) !important;
  color: #eaf3ff !important;
  overflow: hidden !important;
}
#screen-shop .shop-overview-card > i {
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid rgba(191,213,255,.22) !important;
  color: #9cff47 !important;
  font-style: normal !important;
  font-weight: 1000 !important;
  font-size: 22px !important;
  background: radial-gradient(circle at 50% 28%, rgba(156,255,71,.22), transparent 62%) !important;
}
#screen-shop .shop-overview-card > div {
  display: grid !important;
  gap: 4px !important;
  padding: 13px 16px !important;
  min-width: 0 !important;
}
#screen-shop .shop-overview-card strong {
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  font-weight: 1000 !important;
}
#screen-shop .shop-overview-card span {
  color: rgba(207,224,255,.68) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-weight: 850 !important;
}
#screen-shop .shop-economy-bar {
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}
#screen-shop .economy-tile i svg,
#screen-shop .shop-icon svg,
#screen-shop .shop-currency-icon {
  width: 24px !important;
  height: 24px !important;
  display: block !important;
  overflow: visible !important;
}
#screen-shop .economy-tile i svg *,
#screen-shop .shop-icon svg *,
#screen-shop .shop-currency-icon * {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.05 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#screen-shop .shop-emoji-icon {
  display: grid !important;
  place-items: center !important;
  width: 100% !important;
  height: 100% !important;
  font-size: 22px !important;
  line-height: 1 !important;
}
#screen-shop .shop-section {
  gap: 12px !important;
}
#screen-shop .shop-section-title {
  position: sticky !important;
  top: 0 !important;
  z-index: 3 !important;
  backdrop-filter: none !important;
}
#screen-shop .shop-grid-row {
  grid-template-columns: repeat(auto-fit, minmax(285px, 1fr)) !important;
  gap: 12px !important;
}
#screen-shop .shop-card {
  --shop-rail: 62px;
  min-height: 210px !important;
  padding: 18px 18px 18px calc(var(--shop-rail) + 20px) !important;
  border-left-width: 1px !important;
  overflow: hidden !important;
  isolation: isolate !important;
}
#screen-shop .shop-card::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: var(--shop-rail) !important;
  height: auto !important;
  opacity: 1 !important;
  transform: none !important;
  border-right: 1px solid rgba(191,213,255,.23) !important;
  background:
    radial-gradient(circle at 50% 22%, color-mix(in srgb, var(--card-accent, #9cff47) 30%, transparent), transparent 62%),
    linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.018)) !important;
  box-shadow: none !important;
  pointer-events: none !important;
  z-index: 0 !important;
}
#screen-shop .shop-card::after {
  content: none !important;
  display: none !important;
}
#screen-shop .shop-card:hover::before {
  width: var(--shop-rail) !important;
  opacity: 1 !important;
  transform: none !important;
}
#screen-shop .shop-card > * {
  position: relative !important;
  z-index: 2 !important;
}
#screen-shop .shop-card .shop-card-top {
  min-height: 40px !important;
}
#screen-shop .shop-card .shop-icon {
  position: absolute !important;
  left: calc((var(--shop-rail) - 38px) / -1 - 20px + 12px) !important;
  top: 0 !important;
  width: 38px !important;
  height: 38px !important;
  display: grid !important;
  place-items: center !important;
  border: 0 !important;
  background: transparent !important;
  color: var(--card-accent, #9cff47) !important;
  box-shadow: none !important;
  z-index: 4 !important;
  pointer-events: none !important;
}
#screen-shop .shop-card .shop-tier {
  margin-left: auto !important;
}
#screen-shop .shop-card strong {
  margin-top: 12px !important;
  color: #fff !important;
  font-size: 16px !important;
}
#screen-shop .shop-card span {
  color: rgba(207,224,255,.68) !important;
}
#screen-shop .shop-card .cost {
  color: var(--card-accent, #9cff47) !important;
}
#screen-shop .shop-product-card[data-currency="coin"],
#screen-shop .economy-coin { --card-accent: #ffd232; }
#screen-shop .economy-crystal { --card-accent: #10dfff; }
#screen-shop .economy-ruby { --card-accent: #ff5f7d; }
#screen-shop .economy-star { --card-accent: #ffd232; }
#screen-shop .economy-key { --card-accent: #d2b0ff; }
#screen-shop .economy-tile i {
  font-size: 0 !important;
  color: var(--card-accent, #9cff47) !important;
}
@media (max-width: 720px) {
  #screen-shop .shop-grid-row { grid-template-columns: 1fr !important; }
  #screen-shop .shop-card { --shop-rail: 54px; padding-left: 72px !important; }
  #screen-shop .shop-card .shop-icon { left: -58px !important; }
  #screen-shop .shop-overview-card { grid-template-columns: 48px minmax(0,1fr) !important; }
}
#screen-shop .shop-card .shop-icon { left: calc((var(--shop-rail) + 20px) * -1 + 12px) !important; }
@media (max-width: 720px) { #screen-shop .shop-card .shop-icon { left: calc((var(--shop-rail) + 18px) * -1 + 8px) !important; } }
#screen-shop .shop-product-card[data-currency="coin"] { --card-accent: #ffd232 !important; }
#screen-shop .shop-product-card[data-currency="crystal"] { --card-accent: #10dfff !important; }
#screen-shop .shop-product-card[data-currency="ruby"] { --card-accent: #ff5f7d !important; }
#screen-shop .shop-product-card[data-currency="star"] { --card-accent: #ffd232 !important; }
#screen-shop .shop-product-card[data-currency="key"] { --card-accent: #d2b0ff !important; }
#screen-shop .shop-product-card[data-currency="gift"] { --card-accent: #9cff47 !important; }

/* v1.25.56 — Homepage featured card spacing and menu icon cleanup. */
#screen-main .home-feature-card {
  grid-template-columns: 58px minmax(0, 1fr) 72px !important;
}
#screen-main .home-feature-card b {
  align-self: stretch !important;
  justify-self: stretch !important;
  margin: 0 !important;
  min-width: 0 !important;
  height: auto !important;
  padding: 0 8px 0 16px !important;
  display: grid !important;
  place-items: center !important;
  border-left: 1px solid rgba(191,213,255,.18) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(0,0,0,.10)) !important;
  position: relative !important;
  z-index: 2 !important;
}
#screen-main .home-feature-card span {
  padding-right: 16px !important;
}
#screen-main .berry-menu-item .menu-svg-icon {
  width: 44px !important;
  min-width: 44px !important;
  height: 100% !important;
  display: grid !important;
  place-items: center !important;
  color: #9cff47 !important;
  font-style: normal !important;
}
#screen-main .berry-menu-item .menu-svg-icon svg {
  width: 27px !important;
  height: 27px !important;
  overflow: visible !important;
}
#screen-main .berry-menu-item .menu-svg-icon path,
#screen-main .berry-menu-item .menu-svg-icon circle {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.9 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#screen-main .berry-menu-item .menu-trophy-icon { color: #ffe66c !important; }
#screen-main .berry-menu-item .menu-pet-icon { color: #78d9ff !important; }
#screen-main .berry-menu-item .menu-skill-icon { color: #d18aff !important; }


/* v1.25.57 — Mini Quests readability, unified menu SVG colors and vertical feature-card edge labels. */
#screen-mini-quests .mini-quest-grid article em,
#screen-mini-quests .mini-quest-grid article .cost,
.mini-quest-grid article em {
  color: #9cff47 !important;
  background: linear-gradient(90deg, rgba(156,255,71,.14), rgba(16,223,255,.08)) !important;
  border: 1px solid rgba(156,255,71,.28) !important;
  padding: 7px 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content !important;
  font-style: normal !important;
  font-weight: 1000 !important;
  letter-spacing: .04em !important;
  text-shadow: 0 0 10px rgba(156,255,71,.20) !important;
}
#screen-mini-quests .mini-quest-grid article.locked em,
.mini-quest-grid article.locked em {
  color: rgba(210,255,226,.86) !important;
  background: rgba(191,213,255,.08) !important;
  border-color: rgba(191,213,255,.18) !important;
}
#screen-main .berry-menu-item .menu-svg-icon,
#screen-main .berry-menu-item .menu-trophy-icon,
#screen-main .berry-menu-item .menu-pet-icon,
#screen-main .berry-menu-item .menu-skill-icon {
  color: #8cff37 !important;
  text-shadow: 0 0 10px rgba(140,255,55,.45) !important;
}
#screen-main .berry-menu-item:hover .menu-svg-icon,
#screen-main .berry-menu-item:hover .menu-trophy-icon,
#screen-main .berry-menu-item:hover .menu-pet-icon,
#screen-main .berry-menu-item:hover .menu-skill-icon {
  color: #c9ff69 !important;
}
#screen-main .berry-menu-item .menu-svg-icon path,
#screen-main .berry-menu-item .menu-svg-icon circle {
  stroke: currentColor !important;
}
#screen-main .home-feature-card {
  grid-template-columns: 58px 38px minmax(0, 1fr) !important;
}
#screen-main .home-feature-card i {
  grid-column: 1 !important;
  grid-row: 1 !important;
  z-index: 2 !important;
}
#screen-main .home-feature-card b {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: stretch !important;
  justify-self: stretch !important;
  margin: 0 !important;
  padding: 0 !important;
  min-width: 0 !important;
  height: auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-left: 0 !important;
  border-right: 1px solid rgba(191,213,255,.18) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(0,0,0,.12)) !important;
  writing-mode: vertical-rl !important;
  transform: rotate(180deg) !important;
  white-space: nowrap !important;
  letter-spacing: .12em !important;
  font-size: 10px !important;
  line-height: 1 !important;
  overflow: hidden !important;
  position: relative !important;
  z-index: 3 !important;
}
#screen-main .home-feature-card span {
  grid-column: 3 !important;
  grid-row: 1 !important;
  padding: 0 16px !important;
  align-self: center !important;
}
#screen-main .home-feature-card:hover b {
  background: linear-gradient(180deg, rgba(156,255,71,.08), rgba(0,0,0,.10)) !important;
}
@media (max-width: 720px) {
  #screen-main .home-feature-card {
    grid-template-columns: 48px 34px minmax(0, 1fr) !important;
  }
  #screen-main .home-feature-card b {
    font-size: 9px !important;
    letter-spacing: .09em !important;
  }
  #screen-main .home-feature-card span {
    padding: 0 12px !important;
  }
}

/* v1.25.58 — Rewards Center layout fix, remove player-facing Distribution page, clean featured route spines. */
#screen-daily.rewards-screen.active {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  align-items: stretch !important;
  padding: calc(var(--menu-header-height, 86px) + 22px) clamp(18px, 3vw, 42px) 34px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
#screen-daily.rewards-screen > * {
  width: min(1480px, 100%) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
#screen-daily .reward-dashboard-grid,
#screen-daily #weekly-reward-grid,
#screen-daily #milestone-reward-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
  gap: 12px !important;
  width: min(1480px, 100%) !important;
  margin: 0 auto 12px !important;
  align-items: stretch !important;
}
#screen-daily .reward-tile,
#screen-daily .milestone-card {
  position: relative !important;
  min-height: 156px !important;
  display: grid !important;
  grid-template-columns: 70px minmax(0, 1fr) !important;
  grid-template-rows: auto auto minmax(8px, auto) auto auto !important;
  gap: 6px 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  overflow: hidden !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.035) 0 1px, transparent 1px) 0 0/28px 28px,
    linear-gradient(180deg, rgba(8,31,48,.94), rgba(1,13,22,.94)) !important;
}
#screen-daily .reward-tile::before,
#screen-daily .milestone-card::before {
  display: none !important;
  content: none !important;
}
#screen-daily .reward-tile > i,
#screen-daily .milestone-card > i {
  position: static !important;
  grid-column: 1 !important;
  grid-row: 1 / -1 !important;
  width: 70px !important;
  min-width: 70px !important;
  height: 100% !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid rgba(191,213,255,.22) !important;
  background: radial-gradient(100% 100% at 0 0, rgba(156,255,71,.16), rgba(255,255,255,.035) 52%, rgba(0,0,0,.10)) !important;
  color: #c9ff69 !important;
  font-size: 25px !important;
  line-height: 1 !important;
  font-style: normal !important;
  z-index: 1 !important;
}
#screen-daily .reward-tile strong,
#screen-daily .milestone-card strong {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: end !important;
  padding: 16px 16px 0 !important;
  margin: 0 !important;
  color: #fff !important;
  font-size: 17px !important;
  line-height: 1.15 !important;
}
#screen-daily .reward-tile span,
#screen-daily .milestone-card span {
  grid-column: 2 !important;
  grid-row: 2 !important;
  padding: 0 16px !important;
  margin: 0 !important;
  color: rgba(224,239,255,.74) !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
}
#screen-daily .milestone-card .mini-progress {
  grid-column: 2 !important;
  grid-row: 3 !important;
  margin: 4px 16px 0 !important;
  width: calc(100% - 32px) !important;
}
#screen-daily .milestone-card em {
  grid-column: 2 !important;
  grid-row: 4 !important;
  margin: 0 16px !important;
  color: #c9ff69 !important;
  font-style: normal !important;
  font-size: 12px !important;
  font-weight: 1000 !important;
  letter-spacing: .04em !important;
}
#screen-daily .reward-tile .btn,
#screen-daily .milestone-card .btn {
  grid-column: 2 !important;
  grid-row: 5 !important;
  width: auto !important;
  min-height: 42px !important;
  margin: 6px 16px 16px !important;
  align-self: end !important;
}
#screen-daily .reward-tile.is-ready > i,
#screen-daily .milestone-card.ready:not(.claimed) > i {
  background: radial-gradient(100% 100% at 0 0, rgba(255,210,50,.26), rgba(156,255,71,.12) 58%, rgba(0,0,0,.12)) !important;
  color: #ffe66c !important;
}
#screen-daily .milestone-card.claimed {
  opacity: .82 !important;
}
#screen-daily .milestone-card.claimed .btn {
  color: rgba(230,245,255,.68) !important;
}

#screen-main .home-feature-card {
  grid-template-columns: 64px minmax(0, 1fr) !important;
}
#screen-main .home-feature-card i {
  display: none !important;
}
#screen-main .home-feature-card b {
  grid-column: 1 !important;
  grid-row: 1 !important;
  align-self: stretch !important;
  justify-self: stretch !important;
  width: 64px !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-left: 0 !important;
  border-right: 1px solid rgba(191,213,255,.22) !important;
  background: radial-gradient(100% 100% at 0 0, rgba(156,255,71,.14), rgba(255,255,255,.035) 55%, rgba(0,0,0,.10)) !important;
  writing-mode: vertical-rl !important;
  transform: rotate(180deg) !important;
  color: #c9ff69 !important;
  font-size: 11px !important;
  line-height: 1 !important;
  letter-spacing: .15em !important;
  text-align: center !important;
  white-space: nowrap !important;
  z-index: 3 !important;
}
#screen-main .home-feature-card span {
  grid-column: 2 !important;
  grid-row: 1 !important;
  padding: 0 16px !important;
}
#screen-main .home-feature-card.is-quick b { color: #ffe66c !important; background: radial-gradient(100% 100% at 0 0, rgba(255,230,108,.20), rgba(255,255,255,.035) 58%, rgba(0,0,0,.10)) !important; }
#screen-main .home-feature-card.is-map b { color: #70f5ff !important; background: radial-gradient(100% 100% at 0 0, rgba(112,245,255,.18), rgba(255,255,255,.035) 58%, rgba(0,0,0,.10)) !important; }
#screen-main .home-feature-card.is-worlds b { color: #d18aff !important; background: radial-gradient(100% 100% at 0 0, rgba(209,138,255,.17), rgba(255,255,255,.035) 58%, rgba(0,0,0,.10)) !important; }
#screen-main .home-feature-card.is-levels b { color: #9cff47 !important; }
@media (max-width: 720px) {
  #screen-main .home-feature-card { grid-template-columns: 54px minmax(0, 1fr) !important; }
  #screen-main .home-feature-card b { width: 54px !important; font-size: 10px !important; letter-spacing: .12em !important; }
}

/* v1.25.59 — final header visibility safety fix.
   The header must be visible on menu/internal pages even if JS boot is delayed,
   and hidden only during real gameplay. */
#game-shell:not(.is-playing) > #menu-global-header.global-menu-topbar,
#game-shell.has-menu-screen:not(.is-playing) > #menu-global-header.global-menu-topbar {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}
#game-shell.is-playing > #menu-global-header.global-menu-topbar {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
#game-shell:not(.is-playing) .screen.active {
  padding-top: max(92px, calc(var(--topbar-h) + 18px)) !important;
}
#game-shell:not(.is-playing) #screen-main.screen.active {
  padding-top: max(92px, calc(var(--topbar-h) + 18px)) !important;
}

/* v1.25.60 — Header data preload + unified notification/read states. */
#menu-global-header .notification-dropdown article {
  grid-template-columns: 52px minmax(0,1fr) 72px !important;
}
#menu-global-header .notification-dropdown article.is-read {
  opacity: .68 !important;
}
#menu-global-header .notification-dropdown article.is-active:not(.is-read) {
  background: linear-gradient(90deg, rgba(140,255,55,.10), rgba(16,223,255,.04), transparent) !important;
}
#menu-global-header .notification-dropdown .notif-icon svg,
#menu-global-header .notification-read-btn svg {
  width: 22px !important;
  height: 22px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.85 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#menu-global-header .notification-dropdown .notif-icon {
  color: var(--topbar-accent, #9cff47) !important;
  filter: drop-shadow(0 0 8px rgba(140,255,55,.22)) !important;
}
#menu-global-header .notification-dropdown .notif-quest,
#menu-global-header .notification-dropdown .notif-daily { color: #ffd95a !important; }
#menu-global-header .notification-dropdown .notif-xp { color: #10dfff !important; }
#menu-global-header .notification-dropdown .notif-bridge,
#menu-global-header .notification-dropdown .notif-world { color: #a7ff71 !important; }
#menu-global-header .notification-read-btn {
  align-self: stretch !important;
  min-width: 72px !important;
  border: 0 !important;
  border-left: 1px solid var(--topbar-line) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #9cff47 !important;
  font-size: 11px !important;
  font-weight: 1000 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  cursor: pointer !important;
}
#menu-global-header .notification-read-btn:hover:not(:disabled) {
  background: rgba(140,255,55,.10) !important;
  color: #fff !important;
}
#menu-global-header .notification-read-btn:disabled {
  color: rgba(207,224,255,.42) !important;
  cursor: default !important;
}
#menu-global-header .notification-panel-head {
  grid-template-columns: auto auto auto !important;
}
#menu-global-header .notification-read-all {
  height: 32px !important;
  padding: 0 12px !important;
  border: 1px solid var(--topbar-line) !important;
  border-radius: 0 !important;
  background: rgba(255,255,255,.04) !important;
  color: #eaf3ff !important;
  font-size: 10px !important;
  font-weight: 1000 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  cursor: pointer !important;
}
#menu-global-header .notification-read-all:hover { background: rgba(140,255,55,.10) !important; color: #fff !important; }
#menu-global-header .currency-cell,
#menu-global-header .currency-add {
  -webkit-user-select: none !important;
  user-select: none !important;
}
@media (max-width: 620px) {
  #menu-global-header .notification-dropdown article { grid-template-columns: 48px minmax(0,1fr) 58px !important; }
  #menu-global-header .notification-read-btn { min-width: 58px !important; font-size: 10px !important; }
  #menu-global-header .notification-panel-head { padding: 0 12px !important; }
  #menu-global-header .notification-read-all { padding: 0 8px !important; }
}

/* v1.25.61 — Critical Theme Studio boot fix + Level Intro rank spine polish. */
body[data-theme-accent="emerald"]{--berri-accent:#78ff9c;--berri-accent-2:#2fbf71;--berri-accent-soft:rgba(120,255,156,.18)}
#screen-level-intro .level-launch-card {
  grid-template-columns: 82px minmax(0, 1fr) !important;
}
#screen-level-intro .level-launch-card::before {
  left: 82px !important;
}
#screen-level-intro .level-launch-rank {
  min-width: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background:
    radial-gradient(100% 100% at 0 0, rgba(156,255,71,.18), rgba(255,255,255,.035) 58%, rgba(0,0,0,.12)),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.015)) !important;
  border-right: 1px solid rgba(191,213,255,.22) !important;
}
#screen-level-intro .level-launch-rank-spine {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 12px !important;
  writing-mode: vertical-rl !important;
  transform: rotate(180deg) !important;
  white-space: nowrap !important;
  text-align: center !important;
}
#screen-level-intro .level-launch-rank strong {
  display: inline-block !important;
  max-width: none !important;
  color: #ffffff !important;
  font-size: clamp(26px, 4.3vw, 46px) !important;
  line-height: 1 !important;
  font-weight: 1000 !important;
  letter-spacing: .02em !important;
  text-shadow: 0 0 18px rgba(156,255,71,.30), 0 2px 10px rgba(0,0,0,.45) !important;
}
#screen-level-intro .level-launch-rank span {
  display: inline-block !important;
  color: var(--ui-green, #9cff47) !important;
  font-size: 11px !important;
  line-height: 1 !important;
  font-weight: 1000 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
}
@media (max-width: 640px) {
  #screen-level-intro .level-launch-card { grid-template-columns: 62px minmax(0, 1fr) !important; }
  #screen-level-intro .level-launch-card::before { left: 62px !important; }
  #screen-level-intro .level-launch-rank strong { font-size: clamp(22px, 9vw, 34px) !important; }
  #screen-level-intro .level-launch-rank span { font-size: 9px !important; letter-spacing: .13em !important; }
}


/* v1.25.62 — Button click safety: never let decorative layers or disabled audio block UI actions. */
#menu-global-header button,
#screen-main button,
.screen.active button,
.screen.active [data-action],
.screen.active [data-difficulty],
.screen.active [data-buy],
.screen.active [data-shop-buy],
.screen.active [data-skin-buy],
.screen.active [data-skin-select],
.screen.active [data-reward-claim] {
  pointer-events: auto !important;
  touch-action: manipulation !important;
}
.world-ambience-layer,
.world-ambience-layer *,
.screen.active::before,
.screen.active::after,
#screen-main.screen.active::before,
#screen-main.screen.active::after,
.home-bg-effect,
.home-bg-effect::before,
.home-bg-effect::after,
.level-launch-card::before,
.level-launch-btn::after {
  pointer-events: none !important;
}
.chest-opening-overlay[aria-hidden="true"]:not(.open),
.achievement-popup[aria-hidden="true"]:not(.show) {
  pointer-events: none !important;
}


/* v1.25.63 — Objective rail restore + premium icon/page polish. */
#screen-level-intro .intro-objectives span {
  padding: 14px 14px 14px 70px !important;
}
#screen-level-intro .intro-objectives span::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 56px !important;
  border-right: 1px solid rgba(191,213,255,.22) !important;
  background:
    radial-gradient(circle at 50% 28%, color-mix(in srgb, var(--card-accent) 32%, transparent), transparent 54%),
    linear-gradient(180deg, rgba(255,255,255,.095), rgba(255,255,255,.02)) !important;
}
#screen-level-intro .intro-objectives span::after {
  width: 56px !important;
  font-size: 22px !important;
  text-shadow: 0 0 14px color-mix(in srgb, var(--card-accent) 42%, transparent) !important;
}
#screen-level-intro .intro-objectives span:nth-child(1) { --card-icon: "◈"; --card-accent: var(--ui-cyan, #10dfff); }
#screen-level-intro .intro-objectives span:nth-child(2) { --card-icon: "❤"; --card-accent: var(--ui-gold, #ffd232); }
#screen-level-intro .intro-objectives span:nth-child(3) { --card-icon: "↗"; --card-accent: var(--ui-purple, #c9b5ff); }
#screen-level-intro .intro-objectives span:nth-child(4) { --card-icon: "⚡"; --card-accent: var(--ui-green, #9cff47); }

#menu-global-header .premium-crown-svg {
  width: 32px !important;
  height: 32px !important;
  filter: drop-shadow(0 0 12px rgba(255,210,50,.24));
}
#menu-global-header .premium-crown-svg path:first-child {
  fill: rgba(255,173,32,.18) !important;
  stroke: rgba(255,239,186,.96) !important;
  stroke-width: .9 !important;
}
#menu-global-header .premium-crown-svg path,
#menu-global-header .premium-crown-svg circle {
  stroke-width: 1.85 !important;
}
#menu-global-header .topbar-context-btn.is-rewards {
  position: relative;
  overflow: hidden;
  color: #ffd232 !important;
  background:
    radial-gradient(circle at 20% 20%, rgba(255,236,160,.45), transparent 34%),
    radial-gradient(circle at 80% 80%, rgba(255,87,34,.22), transparent 38%),
    linear-gradient(180deg, rgba(76,28,8,.88), rgba(35,14,6,.92)) !important;
  border-color: rgba(255,210,50,.34) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 10px 22px rgba(0,0,0,.24), 0 0 0 1px rgba(255,210,50,.08) !important;
}
#menu-global-header .topbar-context-btn.is-rewards::before {
  content: "";
  position: absolute;
  inset: 1px;
  background: linear-gradient(135deg, rgba(255,255,255,.14), rgba(255,255,255,0) 45%);
  pointer-events: none;
}
#menu-global-header .topbar-context-btn.is-rewards:hover {
  transform: translateY(-1px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 14px 24px rgba(0,0,0,.28), 0 0 20px rgba(255,210,50,.18) !important;
}

.premium-account-layout {
  width: min(1120px, calc(100vw - 42px));
  grid-template-columns: minmax(0, 1.16fr) 340px;
  gap: 16px;
}
.premium-account-hero,
.premium-economy-note {
  border-radius: 0 !important;
}
.premium-account-hero {
  min-height: 470px;
  padding: 38px;
  background:
    radial-gradient(circle at 50% -8%, rgba(255,210,50,.22), transparent 36%),
    radial-gradient(circle at 16% 18%, rgba(255,97,58,.16), transparent 26%),
    radial-gradient(circle at 84% 14%, rgba(173,105,255,.16), transparent 28%),
    linear-gradient(180deg, rgba(55,10,34,.88), rgba(4,18,30,.94));
}
.premium-account-hero::before,
.premium-account-hero::after {
  opacity: .18;
  background: repeating-linear-gradient(-45deg, rgba(255,255,255,.9) 0 10px, rgba(255,255,255,0) 10px 20px);
}
.premium-orb {
  width: 124px;
  height: 124px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  position: relative;
  z-index: 2;
  border: 1px solid rgba(255,226,139,.34);
  background:
    radial-gradient(circle at 50% 38%, rgba(255,255,255,.38), rgba(255,255,255,0) 42%),
    radial-gradient(circle at 50% 60%, rgba(255,210,50,.92), rgba(255,117,50,.88) 60%, rgba(86,24,13,.92));
  box-shadow: inset 0 2px 12px rgba(255,255,255,.22), 0 22px 48px rgba(0,0,0,.32), 0 0 30px rgba(255,210,50,.18);
}
.premium-orb::before,
.premium-orb::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  inset: -10px;
  border: 1px solid rgba(255,226,139,.12);
}
.premium-orb::after { inset: -22px; border-color: rgba(255,255,255,.07); }
.premium-orb span {
  color: #fff8d5;
  font-size: 56px;
  line-height: 1;
  text-shadow: 0 0 18px rgba(255,255,255,.24), 0 10px 20px rgba(0,0,0,.24);
}
.premium-ribbon { gap: 10px; }
.premium-ribbon span { font-size: 26px; line-height: 1; }
.premium-ribbon strong { font-size: clamp(30px, 3.1vw, 46px); letter-spacing: .02em; }
.premium-ribbon em {
  padding: 6px 12px;
  border: 1px solid rgba(255,210,50,.26);
  background: rgba(255,210,50,.08);
  color: #ffe07d;
}
.premium-hero-copy {
  position: relative;
  z-index: 2;
  width: min(560px, 100%);
  display: grid;
  gap: 10px;
}
.premium-kicker {
  margin: 0;
  color: #ffe07d;
  font-size: 12px;
  font-weight: 1000;
  letter-spacing: .22em;
  text-transform: uppercase;
}
.premium-lead {
  margin: 0;
  color: rgba(236,246,255,.86);
  font-size: 15px;
  line-height: 1.62;
  font-weight: 800;
}
.premium-benefits-grid {
  width: min(560px, 100%);
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.premium-benefits-grid article {
  min-height: 78px;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 14px 14px 16px;
  border: 1px solid rgba(191,213,255,.18);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  border-bottom: 1px solid rgba(191,213,255,.18);
  flex-direction: column;
}
.premium-benefits-grid b { order: 0; font-size: 18px; color: #ffe07d; }
.premium-benefits-grid span { font-size: 12px; line-height: 1.45; }
.premium-buy-btn {
  width: min(560px, 100%);
  min-height: 68px !important;
  padding-inline: 18px !important;
  background: linear-gradient(180deg, #ffd24a, #ffaf2a) !important;
  color: #43220d !important;
  box-shadow: 0 18px 34px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.42) !important;
}
.premium-buy-btn strong,
.premium-buy-btn em { color: inherit !important; }
.premium-economy-note {
  padding: 24px;
  gap: 14px;
  background:
    radial-gradient(circle at 100% 0, rgba(255,210,50,.12), transparent 30%),
    linear-gradient(180deg, rgba(10, 28, 44, .96), rgba(3, 14, 24, .94));
}
.premium-note-head {
  display: flex;
  align-items: center;
  gap: 10px;
}
.premium-note-head span {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  font-size: 18px;
  color: #ffe07d;
  border: 1px solid rgba(255,210,50,.24);
  background: rgba(255,210,50,.08);
}
.premium-mini-grid {
  display: grid;
  gap: 10px;
  margin-top: 4px;
}
.premium-mini-grid article {
  display: grid;
  gap: 6px;
  padding: 12px 14px;
  border: 1px solid rgba(191,213,255,.16);
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
}
.premium-mini-grid b { color: #fff; font-size: 13px; text-transform: uppercase; letter-spacing: .06em; }
.premium-mini-grid span { color: rgba(207,224,255,.76); font-size: 12px; line-height: 1.45; font-weight: 800; }
@media (max-width: 900px) {
  .premium-account-layout { grid-template-columns: 1fr; }
  .premium-account-hero { min-height: 420px; padding: 28px 18px; }
  .premium-benefits-grid { grid-template-columns: 1fr; }
}


/* v1.25.64 — Royal premium upgrade pass. */
@keyframes premiumHeaderGlow {
  0%,100% { box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 10px 22px rgba(0,0,0,.24), 0 0 0 1px rgba(255,210,50,.08), 0 0 0 rgba(255,210,50,0); }
  50% { box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 14px 28px rgba(0,0,0,.28), 0 0 0 1px rgba(255,210,50,.12), 0 0 22px rgba(255,210,50,.18); }
}
@keyframes premiumHeaderSweep {
  0% { transform: translateX(-140%) skewX(-22deg); opacity: 0; }
  14% { opacity: .55; }
  50% { opacity: .14; }
  100% { transform: translateX(180%) skewX(-22deg); opacity: 0; }
}
@keyframes premiumOrbPulse {
  0%,100% { transform: translateY(0) scale(1); box-shadow: inset 0 2px 12px rgba(255,255,255,.22), 0 22px 48px rgba(0,0,0,.32), 0 0 30px rgba(255,210,50,.18); }
  50% { transform: translateY(-4px) scale(1.02); box-shadow: inset 0 2px 12px rgba(255,255,255,.25), 0 28px 56px rgba(0,0,0,.36), 0 0 40px rgba(255,210,50,.24); }
}
@keyframes premiumBuySheen {
  0% { transform: translateX(-145%) skewX(-22deg); opacity: 0; }
  10% { opacity: .65; }
  45% { opacity: .18; }
  100% { transform: translateX(175%) skewX(-22deg); opacity: 0; }
}
@keyframes premiumBuyPulse {
  0%,100% { transform: translateY(0); box-shadow: 0 18px 34px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.42); }
  50% { transform: translateY(-2px); box-shadow: 0 24px 40px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.46), 0 0 24px rgba(255,193,52,.20); }
}
@keyframes premiumCardGlow {
  0%,100% { box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 18px 34px rgba(0,0,0,.18); }
  50% { box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 24px 40px rgba(0,0,0,.22), 0 0 18px rgba(255,210,50,.10); }
}

#menu-global-header .topbar-context-btn.is-rewards {
  animation: premiumHeaderGlow 3.2s ease-in-out infinite;
}
#menu-global-header .topbar-context-btn.is-rewards::after {
  content: "";
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: 0;
  width: 42%;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,250,211,.72), rgba(255,255,255,0));
  pointer-events: none;
  animation: premiumHeaderSweep 4.6s linear infinite;
}
#menu-global-header .premium-crown-svg {
  filter: drop-shadow(0 0 12px rgba(255,210,50,.24)) drop-shadow(0 0 18px rgba(255,186,80,.18));
}
#menu-global-header .premium-crown-svg circle,
#menu-global-header .premium-crown-svg path:not(:first-child) {
  stroke: #fff4c4 !important;
}

.premium-account-screen.active {
  background:
    radial-gradient(circle at 12% 16%, rgba(255,106,61,.10), transparent 24%),
    radial-gradient(circle at 88% 14%, rgba(255,210,50,.10), transparent 22%),
    radial-gradient(circle at 52% 108%, rgba(173,105,255,.08), transparent 28%),
    linear-gradient(180deg, rgba(6,18,31,.82), rgba(2,10,18,.92)) !important;
}
.premium-account-layout {
  width: min(1140px, calc(100vw - 38px));
  gap: 18px;
}
.premium-account-hero,
.premium-economy-note {
  border-color: rgba(255,214,119,.16) !important;
}
.premium-account-hero {
  min-height: 500px;
  padding: 40px 38px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 38px 90px rgba(0,0,0,.40), 0 0 0 1px rgba(255,210,50,.06) !important;
}
.premium-account-hero::before,
.premium-account-hero::after {
  opacity: .16;
}
.premium-orb {
  animation: premiumOrbPulse 3.6s ease-in-out infinite;
}
.premium-ribbon strong {
  text-shadow: 0 10px 26px rgba(0,0,0,.26), 0 0 18px rgba(255,210,50,.08);
}
.premium-ribbon em {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 8px 16px rgba(0,0,0,.18);
}
.premium-kicker {
  color: #ffe79a;
}
.premium-lead {
  color: rgba(245,249,255,.90);
}
.premium-stat-strip {
  width: min(560px, 100%);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  position: relative;
  z-index: 2;
}
.premium-stat-strip article {
  min-height: 76px;
  display: grid;
  align-content: center;
  gap: 6px;
  padding: 12px 14px;
  border: 1px solid rgba(255,214,119,.18);
  background: linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.03));
  animation: premiumCardGlow 3.8s ease-in-out infinite;
}
.premium-stat-strip article:nth-child(2) { animation-delay: .25s; }
.premium-stat-strip article:nth-child(3) { animation-delay: .5s; }
.premium-stat-strip b {
  color: #fff2b6;
  font-size: 13px;
  font-weight: 1000;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.premium-stat-strip span {
  color: rgba(229,241,255,.82);
  font-size: 12px;
  line-height: 1.35;
  font-weight: 850;
}
.premium-benefits-grid article,
.premium-mini-grid article {
  border-color: rgba(255,214,119,.16);
}
.premium-benefits-grid article {
  animation: premiumCardGlow 4.2s ease-in-out infinite;
}
.premium-benefits-grid article:nth-child(2) { animation-delay: .2s; }
.premium-benefits-grid article:nth-child(3) { animation-delay: .4s; }
.premium-benefits-grid article:nth-child(4) { animation-delay: .6s; }
.premium-buy-btn {
  position: relative;
  overflow: hidden;
  animation: premiumBuyPulse 3.2s ease-in-out infinite;
}
.premium-buy-btn::before {
  content: "";
  position: absolute;
  top: -24%;
  bottom: -24%;
  left: 0;
  width: 34%;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,253,228,.82), rgba(255,255,255,0));
  transform: translateX(-145%) skewX(-22deg);
  pointer-events: none;
  animation: premiumBuySheen 4.8s linear infinite;
}
.premium-buy-btn .hotkey-badge {
  background: rgba(67,34,13,.12) !important;
  border-color: rgba(67,34,13,.20) !important;
}
.premium-buy-btn:hover {
  transform: translateY(-2px) !important;
}
.premium-economy-note {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 28px 70px rgba(0,0,0,.34), 0 0 0 1px rgba(255,210,50,.05) !important;
}
.premium-note-head strong {
  letter-spacing: .06em;
}
@media (max-width: 900px) {
  .premium-account-hero { min-height: 440px; padding: 28px 18px; }
  .premium-stat-strip { grid-template-columns: 1fr; }
}


/* v1.25.65 — Cinematic premium page + active status + royal battle pass. */
@keyframes premiumSceneFloat {
  0%,100% { transform: translate3d(0,0,0) scale(1); opacity: .9; }
  50% { transform: translate3d(0,-6px,0) scale(1.03); opacity: 1; }
}
@keyframes premiumSparkle {
  0%,100% { transform: translateY(0) scale(.9); opacity: .18; }
  50% { transform: translateY(-12px) scale(1.08); opacity: .42; }
}
@keyframes premiumWave {
  0% { transform: translateX(-10%) translateY(0); }
  50% { transform: translateX(2%) translateY(-10px); }
  100% { transform: translateX(-10%) translateY(0); }
}
@keyframes royalAura {
  0%,100% { box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 38px 90px rgba(0,0,0,.40), 0 0 0 1px rgba(255,210,50,.06), 0 0 0 rgba(255,210,50,0); }
  50% { box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 42px 96px rgba(0,0,0,.42), 0 0 0 1px rgba(255,210,50,.08), 0 0 30px rgba(255,210,50,.10); }
}
@keyframes royalBadgePulse {
  0%,100% { transform: scale(1); box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 8px 16px rgba(0,0,0,.18); }
  50% { transform: scale(1.02); box-shadow: inset 0 1px 0 rgba(255,255,255,.20), 0 12px 22px rgba(0,0,0,.22), 0 0 18px rgba(255,210,50,.18); }
}
@keyframes battlePassShine {
  0% { transform: translateX(-150%) skewX(-22deg); opacity: 0; }
  16% { opacity: .55; }
  50% { opacity: .18; }
  100% { transform: translateX(180%) skewX(-22deg); opacity: 0; }
}

.premium-account-screen.active {
  position: relative;
  overflow: hidden;
}
.premium-account-screen.active::before,
.premium-account-screen.active::after {
  content: "";
  position: absolute;
  inset: auto;
  pointer-events: none;
}
.premium-account-screen.active::before {
  left: -12%;
  bottom: -14%;
  width: 46vw;
  height: 46vw;
  max-width: 520px;
  max-height: 520px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,210,50,.12), rgba(255,210,50,0) 68%);
  filter: blur(10px);
  animation: premiumSceneFloat 9s ease-in-out infinite;
}
.premium-account-screen.active::after {
  right: -10%;
  top: -12%;
  width: 34vw;
  height: 34vw;
  max-width: 380px;
  max-height: 380px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(173,105,255,.10), rgba(173,105,255,0) 68%);
  filter: blur(8px);
  animation: premiumSceneFloat 10s ease-in-out infinite reverse;
}
.premium-account-hero {
  animation: royalAura 4.4s ease-in-out infinite;
}
.premium-cinematic-bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 1;
}
.premium-cinematic-bg::before,
.premium-cinematic-bg::after {
  content: "";
  position: absolute;
  inset: auto;
}
.premium-cinematic-bg::before {
  left: -12%;
  right: -12%;
  bottom: 12%;
  height: 140px;
  background: radial-gradient(ellipse at center, rgba(255,210,50,.10), rgba(255,210,50,0) 66%);
  filter: blur(10px);
  animation: premiumWave 8s ease-in-out infinite;
}
.premium-cinematic-bg::after {
  right: -8%;
  top: 12%;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.10), rgba(255,255,255,0) 68%);
  filter: blur(6px);
  animation: premiumSceneFloat 7s ease-in-out infinite;
}
.premium-star {
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255,244,199,.85);
  box-shadow: 0 0 14px rgba(255,230,136,.35);
  animation: premiumSparkle 3.8s ease-in-out infinite;
}
.premium-star::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 22px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(255,245,201,.82), transparent);
  transform: translate(-50%,-50%);
}
.premium-star::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1px;
  height: 22px;
  background: linear-gradient(180deg, transparent, rgba(255,245,201,.82), transparent);
  transform: translate(-50%,-50%);
}
.premium-star-a { top: 16%; left: 12%; }
.premium-star-b { top: 24%; right: 16%; animation-delay: .4s; }
.premium-star-c { bottom: 26%; left: 18%; animation-delay: .8s; }
.premium-star-d { bottom: 18%; right: 22%; animation-delay: 1.2s; }
.premium-star-e { top: 46%; right: 38%; animation-delay: 1.6s; }
.premium-orb,
.premium-ribbon,
.premium-hero-copy,
.premium-stat-strip,
.premium-benefits,
.premium-buy-btn { position: relative; z-index: 2; }

#premium-status-label {
  transition: all .22s ease;
}
#screen-premium-account.is-premium-active #premium-status-label,
#premium-account-hero.is-premium-active #premium-status-label {
  color: #fff5c7 !important;
  background: linear-gradient(180deg, rgba(255,210,50,.18), rgba(255,210,50,.08));
  border-color: rgba(255,210,50,.34) !important;
  animation: royalBadgePulse 3s ease-in-out infinite;
}
#premium-account-hero.is-premium-active .premium-ribbon strong {
  color: #fff7da;
}
#premium-account-hero.is-premium-active .premium-orb {
  box-shadow: inset 0 2px 14px rgba(255,255,255,.28), 0 30px 62px rgba(0,0,0,.38), 0 0 40px rgba(255,210,50,.28);
}
.premium-buy-btn.active-state {
  background: linear-gradient(180deg, rgba(255,244,194,.18), rgba(255,227,130,.10)) !important;
  color: #fff0b6 !important;
  border-color: rgba(255,210,50,.26) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 24px rgba(0,0,0,.22), 0 0 24px rgba(255,210,50,.14) !important;
}
.premium-buy-btn.active-state::before {
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,245,198,.34), rgba(255,255,255,0));
}
.premium-buy-btn.active-state .hotkey-badge {
  color: #5c3909 !important;
  background: rgba(255,236,164,.92) !important;
  border-color: rgba(255,210,50,.28) !important;
}

.battle-pass-panel {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,214,119,.16) !important;
  background:
    radial-gradient(circle at 12% 16%, rgba(255,210,50,.10), transparent 20%),
    radial-gradient(circle at 88% 14%, rgba(173,105,255,.10), transparent 20%),
    linear-gradient(180deg, rgba(12,26,42,.96), rgba(3,12,22,.96)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 28px 70px rgba(0,0,0,.34), 0 0 0 1px rgba(255,210,50,.04) !important;
}
.battle-pass-panel::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 18%;
  background: linear-gradient(90deg, rgba(255,255,255,.05), rgba(255,255,255,0));
  pointer-events: none;
}
.battle-pass-summary {
  border-bottom-color: rgba(255,214,119,.14) !important;
}
.battle-pass-summary strong {
  text-shadow: 0 10px 24px rgba(0,0,0,.24);
}
.battle-pass-premium-buy {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, #ffd24a, #ffaf2a) !important;
  color: #43220d !important;
  box-shadow: 0 18px 34px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.42) !important;
}
.battle-pass-premium-buy::before {
  content: "";
  position: absolute;
  top: -24%;
  bottom: -24%;
  left: 0;
  width: 36%;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,253,228,.82), rgba(255,255,255,0));
  transform: translateX(-145%) skewX(-22deg);
  pointer-events: none;
  animation: battlePassShine 5s linear infinite;
}
.battle-pass-track {
  padding: 6px 0 0 !important;
}
.battle-pass-tier {
  position: relative;
  overflow: hidden;
  min-height: 226px !important;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease !important;
}
.battle-pass-tier::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: linear-gradient(180deg, rgba(255,210,50,.80), rgba(255,210,50,0));
  opacity: .46;
}
.battle-pass-tier::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,0) 38%);
  pointer-events: none;
}
.battle-pass-tier:hover {
  transform: translateY(-3px);
  box-shadow: 0 24px 44px rgba(0,0,0,.28), 0 0 18px rgba(255,210,50,.08) !important;
}
.battle-pass-tier.unlocked:not(.premium-tier) {
  background: linear-gradient(180deg, rgba(31,77,55,.94), rgba(5,23,26,.86)) !important;
}
.battle-pass-tier.premium-tier {
  background:
    radial-gradient(circle at 50% 0, rgba(255,210,50,.10), transparent 36%),
    linear-gradient(180deg, rgba(66,31,90,.88), rgba(22,13,34,.84)) !important;
}
.battle-pass-tier.premium-open {
  background:
    radial-gradient(circle at 50% 0, rgba(255,210,50,.18), transparent 38%),
    linear-gradient(180deg, rgba(88,52,24,.94), rgba(33,18,13,.88)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 22px 40px rgba(0,0,0,.24), 0 0 20px rgba(255,210,50,.10) !important;
}
.battle-pass-tier.premium-open::before {
  background: linear-gradient(180deg, rgba(255,226,143,.88), rgba(255,210,50,0));
  opacity: .72;
}
.tier-level {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 10px 20px rgba(0,0,0,.18);
}
.battle-pass-tier.premium-open .tier-level {
  background: linear-gradient(180deg, rgba(255,224,125,.26), rgba(255,171,72,.10)) !important;
  border-color: rgba(255,214,119,.34) !important;
}
.battle-pass-tier > i { text-shadow: 0 0 16px rgba(255,210,50,.12); }
.battle-pass-tier.premium-open > i { color: #ffe79a !important; text-shadow: 0 0 18px rgba(255,210,50,.28); }
.battle-pass-tier > small { line-height: 1.35 !important; }
@media (max-width: 980px) {
  .battle-pass-tier { min-height: 214px !important; }
}


/* v1.25.66 — Gameplay canvas isolation fix.
   Canvas is a gameplay-only renderer. It must not leak under premium/menu pages.
   The old world ambience DOM layer is deprecated and hidden everywhere. */
#game-shell > #game {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  display: none !important;
  width: 100% !important;
  height: 100% !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
#game-shell.is-playing > #game {
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
}
#game-shell:not(.is-playing) > #game {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}
#game-shell > #world-ambience-layer,
#world-ambience-layer,
.world-ambience-layer,
.world-ambience-layer * {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}


/* v1.25.67 — UI background isolation fix.
   The old sky gradient must not be applied globally to menus/content pages.
   It is now reserved only for the real gameplay state. */
html,
body {
  background:
    radial-gradient(circle at 14% 12%, rgba(255,210,50,.10), transparent 24%),
    radial-gradient(circle at 86% 14%, rgba(173,105,255,.10), transparent 26%),
    radial-gradient(circle at 48% 104%, rgba(16,223,255,.06), transparent 32%),
    linear-gradient(180deg, #071522 0%, #03101c 56%, #020812 100%) !important;
}
body.berri-gameplay-active {
  background: linear-gradient(180deg, var(--game-sky-top) 0%, var(--game-sky-mid) 48%, var(--game-sky-bottom) 100%) !important;
}
#game-shell:not(.is-playing) {
  background:
    radial-gradient(circle at 12% 16%, rgba(255,210,50,.08), transparent 25%),
    radial-gradient(circle at 88% 12%, rgba(173,105,255,.08), transparent 26%),
    linear-gradient(180deg, rgba(7,21,34,.98), rgba(2,8,18,.98)) !important;
}
#game-shell.is-playing {
  background: linear-gradient(180deg, var(--game-sky-top) 0%, var(--game-sky-mid) 48%, var(--game-sky-bottom) 100%) !important;
}
.screen.active {
  background-clip: padding-box !important;
}


/* v1.25.68 — Premium Account scroll/full-height fix + loading screen removal.
   Premium is a normal scrollable UI page, while the old loading screen is removed from flow. */
html,
body {
  min-height: 100% !important;
  overflow-x: hidden !important;
}
body:not(.berri-gameplay-active) {
  min-height: 100vh !important;
  background-attachment: fixed !important;
}
#game-shell:not(.is-playing) {
  min-height: 100vh !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background:
    radial-gradient(circle at 14% 12%, rgba(255,210,50,.10), transparent 24%),
    radial-gradient(circle at 86% 14%, rgba(173,105,255,.10), transparent 26%),
    radial-gradient(circle at 48% 104%, rgba(16,223,255,.07), transparent 32%),
    linear-gradient(180deg, #071522 0%, #03101c 58%, #020812 100%) !important;
  background-attachment: fixed !important;
}
#screen-premium-account.premium-account-screen.active {
  display: block !important;
  width: 100% !important;
  min-height: 100vh !important;
  height: auto !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: calc(var(--menu-topbar-height, 6rem) + 24px) 0 56px !important;
  align-items: initial !important;
  place-items: initial !important;
  background:
    radial-gradient(circle at 12% 16%, rgba(255,106,61,.12), transparent 24%),
    radial-gradient(circle at 88% 14%, rgba(255,210,50,.12), transparent 22%),
    radial-gradient(circle at 52% 108%, rgba(173,105,255,.09), transparent 30%),
    linear-gradient(180deg, rgba(6,18,31,.98), rgba(2,10,18,.98)) !important;
}
#screen-premium-account .premium-account-layout {
  margin: 0 auto !important;
}
#screen-premium-account::before,
#screen-premium-account::after {
  pointer-events: none !important;
}
#screen-loading,
.loading-screen,
.premium-loading-card,
.loading-rail,
.loading-main,
.loading-map-preview,
.loading-copy,
.loading-progress,
.loading-reward-row {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
@media (max-width: 900px) {
  #screen-premium-account.premium-account-screen.active {
    padding: calc(var(--menu-topbar-height, 5.5rem) + 18px) 14px 44px !important;
  }
  #screen-premium-account .premium-account-layout {
    width: min(100%, 720px) !important;
  }
}


/* v1.25.69 — Restore Premium Account to the original clean page style. */
#screen-premium-account.premium-account-screen.active {
  display: grid !important;
  align-items: center !important;
  justify-items: center !important;
  min-height: 100dvh !important;
  height: auto !important;
  overflow-y: auto !important;
  padding: clamp(18px, 3vw, 34px) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,43,72,.10), transparent 36%),
    linear-gradient(180deg, rgba(5, 14, 26, .98), rgba(2, 8, 16, .98)) !important;
}
#screen-premium-account.premium-account-screen.active::before,
#screen-premium-account.premium-account-screen.active::after,
#screen-premium-account .premium-cinematic-bg,
#screen-premium-account .premium-orb,
#screen-premium-account .premium-hero-copy,
#screen-premium-account .premium-stat-strip,
#screen-premium-account .premium-mini-grid,
#screen-premium-account .premium-note-head {
  display: none !important;
  content: none !important;
}
#screen-premium-account .premium-account-layout {
  width: min(1040px, calc(100vw - 42px)) !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 320px !important;
  gap: 14px !important;
}
#screen-premium-account .premium-account-hero,
#screen-premium-account .premium-economy-note {
  border-radius: 0 !important;
  border: 1px solid rgba(191,213,255,.24) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,43,72,.28), transparent 42%),
    linear-gradient(180deg, rgba(55,10,34,.88), rgba(4,18,30,.92)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 34px 80px rgba(0,0,0,.38) !important;
  color: #ecf6ff !important;
  animation: none !important;
  transform: none !important;
}
#screen-premium-account .premium-account-hero {
  min-height: 430px !important;
  display: grid !important;
  place-items: center !important;
  gap: 18px !important;
  padding: 34px !important;
  text-align: center !important;
  position: relative !important;
  overflow: hidden !important;
}
#screen-premium-account .premium-account-hero::before,
#screen-premium-account .premium-account-hero::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  width: 280px !important;
  height: 640px !important;
  background: repeating-linear-gradient(-45deg, rgba(255,40,20,.95) 0 22px, rgba(255,105,0,.95) 22px 44px) !important;
  opacity: .86 !important;
  pointer-events: none !important;
  border-radius: 0 !important;
  filter: none !important;
  animation: none !important;
}
#screen-premium-account .premium-account-hero::before { left: -160px !important; top: -210px !important; transform: rotate(45deg) !important; }
#screen-premium-account .premium-account-hero::after { right: -160px !important; top: -210px !important; transform: rotate(-45deg) !important; }
#screen-premium-account .premium-ribbon,
#screen-premium-account .premium-benefits,
#screen-premium-account .premium-buy-btn { position: relative !important; z-index: 2 !important; }
#screen-premium-account .premium-ribbon { display: grid !important; gap: 8px !important; justify-items: center !important; }
#screen-premium-account .premium-ribbon span {
  display: block !important;
  font-size: 72px !important;
  line-height: 1 !important;
  color: #ffd232 !important;
  text-shadow: 0 0 28px rgba(255,210,50,.48) !important;
}
#screen-premium-account .premium-ribbon strong {
  color: #fff !important;
  font-size: clamp(28px, 3vw, 42px) !important;
  line-height: 1 !important;
  font-weight: 1000 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
}
#screen-premium-account .premium-ribbon em,
#screen-premium-account #premium-status-label {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #ffd232 !important;
  font-style: normal !important;
  font-size: 13px !important;
  font-weight: 1000 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
  animation: none !important;
  box-shadow: none !important;
}
#screen-premium-account .premium-benefits {
  width: min(430px, 100%) !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 8px !important;
}
#screen-premium-account .premium-benefits article {
  min-height: auto !important;
  display: flex !important;
  flex-direction: row !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 8px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.15) !important;
  background: transparent !important;
  box-shadow: none !important;
  animation: none !important;
}
#screen-premium-account .premium-benefits span {
  color: rgba(255,255,255,.90) !important;
  font-size: 13px !important;
  font-weight: 850 !important;
  line-height: 1.35 !important;
  text-align: left !important;
}
#screen-premium-account .premium-benefits b {
  color: #ffe600 !important;
  font-size: inherit !important;
  font-weight: 1000 !important;
  order: 2 !important;
}
#screen-premium-account .premium-buy-btn {
  width: min(430px, 100%) !important;
  min-height: 64px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  border-radius: 0 !important;
  padding-inline: 18px !important;
  background: linear-gradient(180deg, var(--ui-green, #9cff47), #2fbf71) !important;
  color: #082113 !important;
  box-shadow: none !important;
  animation: none !important;
  overflow: visible !important;
}
#screen-premium-account .premium-buy-btn::before,
#screen-premium-account .premium-buy-btn::after { content: none !important; display: none !important; }
#screen-premium-account .premium-buy-btn strong { font-size: 16px !important; text-transform: uppercase !important; color: inherit !important; }
#screen-premium-account .premium-buy-btn em { font-style: normal !important; font-size: 12px !important; opacity: .82 !important; color: inherit !important; }
#screen-premium-account .premium-economy-note {
  padding: 22px !important;
  align-self: stretch !important;
  display: grid !important;
  align-content: center !important;
  gap: 10px !important;
}
#screen-premium-account .premium-economy-note strong {
  color:#fff !important;
  font-size:18px !important;
  letter-spacing: 0 !important;
  text-transform:uppercase !important;
}
#screen-premium-account .premium-economy-note p {
  margin:0 !important;
  color:rgba(207,224,255,.76) !important;
  line-height:1.55 !important;
  font-weight:800 !important;
}
@media(max-width: 900px){
  #screen-premium-account .premium-account-layout{ grid-template-columns:1fr !important; }
  #screen-premium-account .premium-account-hero{ min-height:360px !important; }
}

/* v1.25.70 — Canvas boot restore.
   WebGL canvas must never be display:none/visibility:hidden, otherwise the renderer can fail.
   UI pages stay visually clean by covering the canvas, while gameplay fades it back to full opacity. */
#game-shell > #game,
#game-shell:not(.is-playing) > #game,
#game-shell.is-playing > #game {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  display: block !important;
  visibility: visible !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
}
#game-shell:not(.is-playing) > #game {
  opacity: 0.001 !important;
}
#game-shell.is-playing > #game,
body.berri-gameplay-active #game-shell > #game {
  opacity: 1 !important;
}
#game-shell > .screen,
#game-shell > #menu-global-header,
#game-shell > #hud,
#game-shell > #mobile-controls,
#game-shell > #pause-menu,
#game-shell > #toast {
  position: relative;
  z-index: 2;
}
#game-shell.is-playing > #hud,
#game-shell.is-playing > #mobile-controls,
#game-shell.is-playing > #pause-menu,
#game-shell.is-playing > #toast {
  z-index: 5;
}


/* v1.25.71 — Canvas live backgrounds for pause, results and homepage.
   Canvas stays alive for WebGL boot, and is visible in gameplay-related overlays. */
#game-shell.is-canvas-live > #game,
#game-shell.is-canvas-live:not(.is-playing) > #game,
body.berri-canvas-live #game-shell > #game {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: none !important;
}
#game-shell.is-home-canvas > #game,
body.berri-home-canvas #game-shell > #game {
  opacity: .48 !important;
  filter: saturate(1.08) brightness(.76) contrast(1.04) !important;
}
#game-shell.is-result-canvas > #game,
body.berri-result-canvas #game-shell > #game {
  opacity: 1 !important;
  filter: saturate(1.04) brightness(.82) contrast(1.02) !important;
}
#game-shell.is-playing > #game,
body.berri-gameplay-active #game-shell > #game {
  opacity: 1 !important;
  filter: none !important;
}

/* Homepage can use the canvas as its living background instead of the old static panel. */
#game-shell.is-home-canvas #screen-main.screen.active,
body.berri-home-canvas #screen-main.screen.active {
  background:
    radial-gradient(circle at 16% 12%, rgba(255,255,255,.10), transparent 26%),
    linear-gradient(135deg, rgba(6,14,31,.58), rgba(15,31,48,.38)) !important;
  backdrop-filter: blur(5px) saturate(1.04) !important;
}
#game-shell.is-home-canvas #screen-main .menu-stage,
body.berri-home-canvas #screen-main .menu-stage {
  position: relative !important;
  z-index: 3 !important;
}

/* Pause and result screens should feel like overlays over the frozen/animated game scene. */
#game-shell.is-result-canvas #screen-pause.screen.active,
#game-shell.is-result-canvas #screen-complete.screen.active,
#game-shell.is-result-canvas #screen-over.screen.active,
body.berri-result-canvas #screen-pause.screen.active,
body.berri-result-canvas #screen-complete.screen.active,
body.berri-result-canvas #screen-over.screen.active {
  background:
    radial-gradient(circle at 50% 14%, rgba(255,255,255,.10), transparent 28%),
    linear-gradient(180deg, rgba(0,8,18,.34), rgba(0,8,18,.68)) !important;
  backdrop-filter: blur(4px) saturate(1.06) !important;
}
#game-shell.is-result-canvas #screen-pause > *,
#game-shell.is-result-canvas #screen-complete > *,
#game-shell.is-result-canvas #screen-over > *,
body.berri-result-canvas #screen-pause > *,
body.berri-result-canvas #screen-complete > *,
body.berri-result-canvas #screen-over > * {
  position: relative !important;
  z-index: 4 !important;
}


/* v1.25.72 — Canvas overlay restore + soft animated homepage background.
   Pause / Level Complete / Game Over render above the live game canvas.
   Homepage keeps canvas alive but visually hidden, using a brighter animated menu background instead. */
@keyframes berrigoHomeAuraFloat {
  0%, 100% { transform: translate3d(0,0,0) scale(1); opacity: .72; }
  50% { transform: translate3d(0,-18px,0) scale(1.06); opacity: .96; }
}
@keyframes berrigoHomeGridDrift {
  0% { background-position: 0 0, 0 0, 0 0; }
  100% { background-position: 0 0, 46px 46px, -64px 52px; }
}

/* Homepage: hide the gameplay canvas again. It stays rendered for WebGL safety, but not visible. */
#game-shell.is-home-canvas > #game,
body.berri-home-canvas #game-shell > #game {
  display: block !important;
  visibility: visible !important;
  opacity: 0.001 !important;
  filter: none !important;
  pointer-events: none !important;
}

/* Gameplay overlays: pause/results/game-over must sit over the visible canvas. */
#game-shell.is-result-canvas > #game,
body.berri-result-canvas #game-shell > #game,
#game-shell.is-canvas-live:not(.is-home-canvas) > #game,
body.berri-canvas-live:not(.berri-home-canvas) #game-shell > #game {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  filter: saturate(1.02) brightness(.84) contrast(1.02) !important;
  pointer-events: none !important;
}
#game-shell.is-playing > #game,
body.berri-gameplay-active #game-shell > #game {
  opacity: 1 !important;
  filter: none !important;
}

/* Homepage background: lighter, animated, menu-friendly, without the raw game scene. */
#game-shell.is-home-canvas,
body.berri-home-canvas #game-shell {
  background:
    radial-gradient(circle at 14% 13%, rgba(156,255,71,.22), transparent 28%),
    radial-gradient(circle at 82% 10%, rgba(16,223,255,.18), transparent 30%),
    radial-gradient(circle at 50% 105%, rgba(255,210,50,.12), transparent 34%),
    linear-gradient(180deg, #102946 0%, #0a1d36 52%, #061425 100%) !important;
  background-size: 100% 100%, 110% 110%, 100% 100%, 100% 100% !important;
  animation: berrigoHomeAuraFloat 9s ease-in-out infinite !important;
}
#game-shell.is-home-canvas::before,
body.berri-home-canvas #game-shell::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 50% 20%, rgba(255,255,255,.11), transparent 28%),
    linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.038) 1px, transparent 1px) !important;
  background-size: 100% 100%, 46px 46px, 46px 46px !important;
  opacity: .72 !important;
  animation: berrigoHomeGridDrift 18s linear infinite !important;
}
#game-shell.is-home-canvas #screen-main.screen.active,
body.berri-home-canvas #screen-main.screen.active {
  background:
    radial-gradient(circle at 18% 14%, rgba(255,255,255,.12), transparent 28%),
    radial-gradient(circle at 86% 20%, rgba(16,223,255,.10), transparent 26%),
    linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.018)) !important;
  backdrop-filter: none !important;
}
#game-shell.is-home-canvas #screen-main .menu-stage,
body.berri-home-canvas #screen-main .menu-stage,
#game-shell.is-home-canvas > #menu-global-header,
body.berri-home-canvas #game-shell > #menu-global-header {
  position: relative !important;
  z-index: 3 !important;
}

/* Result/pause screens: keep old feel from screenshots — panels over darkened game scene. */
#game-shell.is-result-canvas #screen-pause.screen.active,
#game-shell.is-result-canvas #screen-complete.screen.active,
#game-shell.is-result-canvas #screen-over.screen.active,
body.berri-result-canvas #screen-pause.screen.active,
body.berri-result-canvas #screen-complete.screen.active,
body.berri-result-canvas #screen-over.screen.active {
  background:
    radial-gradient(circle at 50% 12%, rgba(255,255,255,.08), transparent 28%),
    linear-gradient(180deg, rgba(0, 9, 22, .28), rgba(0, 8, 18, .62)) !important;
  backdrop-filter: blur(2px) saturate(1.05) !important;
}
#game-shell.is-result-canvas #screen-pause > *,
#game-shell.is-result-canvas #screen-complete > *,
#game-shell.is-result-canvas #screen-over > *,
body.berri-result-canvas #screen-pause > *,
body.berri-result-canvas #screen-complete > *,
body.berri-result-canvas #screen-over > * {
  position: relative !important;
  z-index: 4 !important;
}


/* v1.25.73 — Fix canvas visibility for Level Intro/Pause/Complete/Game Over + remove bad homepage animation. */
/* Homepage: no animated aura/grid. Keep canvas alive, but visually hidden. */
#game-shell.is-home-canvas,
body.berri-home-canvas #game-shell {
  background:
    radial-gradient(circle at 14% 12%, rgba(156,255,71,.10), transparent 24%),
    radial-gradient(circle at 86% 16%, rgba(16,223,255,.09), transparent 26%),
    linear-gradient(180deg, #0b2139 0%, #071a30 54%, #04111f 100%) !important;
  animation: none !important;
}
#game-shell.is-home-canvas::before,
body.berri-home-canvas #game-shell::before {
  content: none !important;
  display: none !important;
  animation: none !important;
  background: none !important;
}
#game-shell.is-home-canvas > #game,
body.berri-home-canvas #game-shell > #game {
  display: block !important;
  visibility: visible !important;
  opacity: 0.001 !important;
  filter: none !important;
  pointer-events: none !important;
}
#game-shell.is-home-canvas #screen-main.screen.active,
body.berri-home-canvas #screen-main.screen.active {
  background: transparent !important;
  backdrop-filter: none !important;
}

/* Gameplay overlays: Level Intro, Pause, Complete and Game Over must be drawn over the live canvas. */
#game-shell.is-canvas-live:not(.is-home-canvas) > #game,
#game-shell.is-result-canvas:not(.is-home-canvas) > #game,
body.berri-canvas-live:not(.berri-home-canvas) #game-shell > #game,
body.berri-result-canvas:not(.berri-home-canvas) #game-shell > #game {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  filter: saturate(1.02) brightness(.84) contrast(1.02) !important;
  pointer-events: none !important;
}
#game-shell.is-playing > #game,
body.berri-gameplay-active #game-shell > #game {
  opacity: 1 !important;
  filter: none !important;
}
#game-shell.is-result-canvas #screen-level-intro.screen.active,
#game-shell.is-result-canvas #screen-pause.screen.active,
#game-shell.is-result-canvas #screen-complete.screen.active,
#game-shell.is-result-canvas #screen-over.screen.active,
body.berri-result-canvas #screen-level-intro.screen.active,
body.berri-result-canvas #screen-pause.screen.active,
body.berri-result-canvas #screen-complete.screen.active,
body.berri-result-canvas #screen-over.screen.active {
  background:
    radial-gradient(circle at 50% 12%, rgba(255,255,255,.08), transparent 28%),
    linear-gradient(180deg, rgba(0, 9, 22, .28), rgba(0, 8, 18, .62)) !important;
  backdrop-filter: blur(2px) saturate(1.05) !important;
}
#game-shell.is-result-canvas #screen-level-intro > *,
#game-shell.is-result-canvas #screen-pause > *,
#game-shell.is-result-canvas #screen-complete > *,
#game-shell.is-result-canvas #screen-over > *,
body.berri-result-canvas #screen-level-intro > *,
body.berri-result-canvas #screen-pause > *,
body.berri-result-canvas #screen-complete > *,
body.berri-result-canvas #screen-over > * {
  position: relative !important;
  z-index: 4 !important;
}


/* v1.25.74 — stable canvas overlays + header back + fine scrollbars.
   Fixes the undefined pauseOrResult class toggle from v1.25.73 and makes canvas visibility deterministic. */
#game-shell > #game {
  display: block !important;
  visibility: visible !important;
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 1 !important;
  pointer-events: none !important;
  opacity: 0.001 !important;
  filter: none !important;
}

/* Homepage and normal menu pages: keep WebGL alive, but do not use the raw gameplay canvas as background. */
#game-shell.is-home-canvas > #game,
body.berri-home-canvas #game-shell > #game,
#game-shell.has-menu-screen:not(.is-canvas-live):not(.is-playing) > #game,
body:not(.berri-canvas-live):not(.berri-gameplay-active) #game-shell > #game {
  opacity: 0.001 !important;
  filter: none !important;
}

/* Real gameplay and gameplay overlays: Level Intro, Pause, Level Complete, Game Over. */
#game-shell.is-playing > #game,
#game-shell.is-canvas-live:not(.is-home-canvas) > #game,
#game-shell.is-result-canvas:not(.is-home-canvas) > #game,
body.berri-gameplay-active #game-shell > #game,
body.berri-canvas-live:not(.berri-home-canvas) #game-shell > #game,
body.berri-result-canvas:not(.berri-home-canvas) #game-shell > #game {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  filter: none !important;
}

/* Overlay screens sit above the live canvas, like the earlier working version. */
#game-shell > .screen {
  z-index: 4 !important;
}
#game-shell > #hud,
#game-shell > #pause-menu,
#game-shell > #mobile-controls,
#game-shell > #toast {
  z-index: 12 !important;
}
#game-shell > #menu-global-header.global-menu-topbar {
  z-index: 40 !important;
}
#game-shell.is-result-canvas #screen-level-intro.screen.active,
#game-shell.is-result-canvas #screen-pause.screen.active,
#game-shell.is-result-canvas #screen-complete.screen.active,
#game-shell.is-result-canvas #screen-over.screen.active,
body.berri-result-canvas #screen-level-intro.screen.active,
body.berri-result-canvas #screen-pause.screen.active,
body.berri-result-canvas #screen-complete.screen.active,
body.berri-result-canvas #screen-over.screen.active {
  background: linear-gradient(180deg, rgba(0, 8, 18, .26), rgba(0, 8, 18, .62)) !important;
  backdrop-filter: none !important;
}
#game-shell.is-result-canvas #screen-level-intro > *,
#game-shell.is-result-canvas #screen-pause > *,
#game-shell.is-result-canvas #screen-complete > *,
#game-shell.is-result-canvas #screen-over > *,
body.berri-result-canvas #screen-level-intro > *,
body.berri-result-canvas #screen-pause > *,
body.berri-result-canvas #screen-complete > *,
body.berri-result-canvas #screen-over > * {
  position: relative !important;
  z-index: 6 !important;
}

/* Header back button: always show the Z/back slot on inner pages. */
#menu-global-header .topbar-context-btn {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}
#menu-global-header .topbar-context-btn.is-back {
  color: #bfd5ff !important;
  background: transparent !important;
}
#menu-global-header .topbar-context-btn.is-back .context-hotkey {
  display: inline-grid !important;
  opacity: 1 !important;
  visibility: visible !important;
}

/* Fine scrollbars restored: slimmer than the global 10px/18px rules. */
html,
body,
.screen,
.screen.content-screen.active,
.panel,
.hud,
.notification-dropdown,
#level-grid,
.guide-grid,
.shop-grid,
.wardrobe-grid,
.quest-grid,
.world-gates-grid,
.vault-grid,
.profile-stats,
.profile-badges,
.save-slots-grid,
#screen-main .berry-menu-grid,
.battle-pass-track {
  scrollbar-width: thin !important;
  scrollbar-color: rgba(156,255,71,.78) rgba(4,19,13,.72) !important;
}
*::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
}
.wide-panel::-webkit-scrollbar,
.panel::-webkit-scrollbar,
.hud::-webkit-scrollbar,
.shop-panel::-webkit-scrollbar,
.power-room-panel::-webkit-scrollbar,
.quest-panel::-webkit-scrollbar,
.vault-panel::-webkit-scrollbar,
.arena-panel::-webkit-scrollbar,
.journal-panel::-webkit-scrollbar,
.wardrobe-panel::-webkit-scrollbar,
.profile-panel::-webkit-scrollbar,
.settings-panel::-webkit-scrollbar,
#screen-main .berry-menu-grid::-webkit-scrollbar,
.battle-pass-track::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
}
*::-webkit-scrollbar-track,
#screen-main .berry-menu-grid::-webkit-scrollbar-track,
.battle-pass-track::-webkit-scrollbar-track {
  background: rgba(4,19,13,.72) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
*::-webkit-scrollbar-thumb,
#screen-main .berry-menu-grid::-webkit-scrollbar-thumb,
.battle-pass-track::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(201,255,105,.92), rgba(44,183,88,.92)) !important;
  border-radius: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}
*::-webkit-scrollbar-button,
*::-webkit-scrollbar-corner,
#screen-main .berry-menu-grid::-webkit-scrollbar-button,
#screen-main .berry-menu-grid::-webkit-scrollbar-corner {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}


/* v1.25.75 — restore full viewport canvas overlays and stable page height.
   Pause / Complete / Game Over / Level Intro are again centered over the live game canvas.
   Homepage stays static and does not use the raw gameplay canvas. */
html,
body {
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: linear-gradient(180deg, var(--game-sky-top) 0%, var(--game-sky-mid) 48%, var(--game-sky-bottom) 100%) !important;
}
body:not(.berri-gameplay-active):not(.berri-canvas-live):not(.berri-result-canvas) {
  background:
    radial-gradient(circle at 14% 12%, rgba(156,255,71,.10), transparent 24%),
    radial-gradient(circle at 86% 16%, rgba(16,223,255,.09), transparent 26%),
    linear-gradient(180deg, #0b2139 0%, #071a30 54%, #04111f 100%) !important;
}
#game-shell {
  position: relative !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  overflow: hidden !important;
  background: linear-gradient(180deg, var(--game-sky-top) 0%, var(--game-sky-mid) 48%, var(--game-sky-bottom) 100%) !important;
}
#game-shell.has-menu-screen:not(.is-playing):not(.is-canvas-live):not(.is-result-canvas) {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  background:
    radial-gradient(circle at 14% 12%, rgba(156,255,71,.10), transparent 24%),
    radial-gradient(circle at 86% 16%, rgba(16,223,255,.09), transparent 26%),
    linear-gradient(180deg, #0b2139 0%, #071a30 54%, #04111f 100%) !important;
}
#game-shell > #game {
  display: block !important;
  visibility: visible !important;
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 1 !important;
  pointer-events: none !important;
  opacity: 0.001 !important;
  filter: none !important;
}
#game-shell.is-home-canvas > #game,
body.berri-home-canvas #game-shell > #game,
#game-shell.has-menu-screen:not(.is-canvas-live):not(.is-result-canvas):not(.is-playing) > #game,
body:not(.berri-canvas-live):not(.berri-gameplay-active):not(.berri-result-canvas) #game-shell > #game {
  opacity: 0.001 !important;
  filter: none !important;
}
#game-shell.is-playing > #game,
#game-shell.is-canvas-live:not(.is-home-canvas) > #game,
#game-shell.is-result-canvas:not(.is-home-canvas) > #game,
body.berri-gameplay-active #game-shell > #game,
body.berri-canvas-live:not(.berri-home-canvas) #game-shell > #game,
body.berri-result-canvas:not(.berri-home-canvas) #game-shell > #game {
  opacity: 1 !important;
  visibility: visible !important;
  display: block !important;
}
#game-shell.is-result-canvas > #game,
body.berri-result-canvas #game-shell > #game {
  filter: saturate(1.02) brightness(.88) contrast(1.02) !important;
}
#game-shell.is-playing > #game,
body.berri-gameplay-active #game-shell > #game {
  filter: none !important;
}

/* Homepage: static background only; no animated aura/grid and no visible raw canvas. */
#game-shell.is-home-canvas,
body.berri-home-canvas #game-shell {
  background:
    radial-gradient(circle at 14% 12%, rgba(156,255,71,.10), transparent 24%),
    radial-gradient(circle at 86% 16%, rgba(16,223,255,.09), transparent 26%),
    linear-gradient(180deg, #0b2139 0%, #071a30 54%, #04111f 100%) !important;
  animation: none !important;
}
#game-shell.is-home-canvas::before,
body.berri-home-canvas #game-shell::before {
  content: none !important;
  display: none !important;
  animation: none !important;
  background: none !important;
}
#game-shell.is-home-canvas #screen-main.screen.active,
body.berri-home-canvas #screen-main.screen.active {
  background: transparent !important;
  backdrop-filter: none !important;
}

/* Full-height transparent layer over the canvas for gameplay overlay pages. */
#game-shell.is-result-canvas {
  overflow: hidden !important;
}
#game-shell.is-result-canvas #screen-level-intro.screen.active,
#game-shell.is-result-canvas #screen-pause.screen.active,
#game-shell.is-result-canvas #screen-complete.screen.active,
#game-shell.is-result-canvas #screen-over.screen.active,
body.berri-result-canvas #screen-level-intro.screen.active,
body.berri-result-canvas #screen-pause.screen.active,
body.berri-result-canvas #screen-complete.screen.active,
body.berri-result-canvas #screen-over.screen.active {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100vh !important;
  min-height: 100dvh !important;
  display: grid !important;
  place-items: center !important;
  align-items: center !important;
  justify-items: center !important;
  overflow: hidden !important;
  padding: calc(var(--menu-topbar-height, 92px) + 18px) clamp(16px, 3vw, 30px) clamp(18px, 3vw, 30px) !important;
  z-index: 4 !important;
  background: linear-gradient(180deg, rgba(0, 8, 18, .34), rgba(0, 8, 18, .66)) !important;
  backdrop-filter: none !important;
}
#game-shell.is-result-canvas #screen-level-intro.screen.active {
  background: linear-gradient(180deg, rgba(0, 8, 18, .20), rgba(0, 8, 18, .48)) !important;
}
#game-shell.is-result-canvas #screen-pause > *,
#game-shell.is-result-canvas #screen-complete > *,
#game-shell.is-result-canvas #screen-over > *,
#game-shell.is-result-canvas #screen-level-intro > *,
body.berri-result-canvas #screen-pause > *,
body.berri-result-canvas #screen-complete > *,
body.berri-result-canvas #screen-over > *,
body.berri-result-canvas #screen-level-intro > * {
  position: relative !important;
  z-index: 6 !important;
  margin: 0 auto !important;
}
#game-shell.is-result-canvas .pause-dashboard-card,
#game-shell.is-result-canvas .complete-dashboard-card,
body.berri-result-canvas .pause-dashboard-card,
body.berri-result-canvas .complete-dashboard-card {
  transform: none !important;
  margin: 0 auto !important;
}
#game-shell.is-result-canvas .level-launch-layout,
body.berri-result-canvas .level-launch-layout {
  margin: 0 auto !important;
}

/* Keep header on top of overlay screens. */
#game-shell > #menu-global-header.global-menu-topbar {
  z-index: 40 !important;
}
#game-shell > .screen { z-index: 4 !important; }
#game-shell > #hud,
#game-shell > #pause-menu,
#game-shell > #mobile-controls,
#game-shell > #toast { z-index: 12 !important; }


/* v1.25.76 — Difficulty click, header fit, premium icon and recent chips removal. */
#difficulty-selector,
#difficulty-selector .difficulty-card,
#screen-level-intro #difficulty-selector,
#screen-level-intro #difficulty-selector .difficulty-card {
  pointer-events: auto !important;
  touch-action: manipulation !important;
  position: relative !important;
  z-index: 32 !important;
}
#difficulty-selector .difficulty-card {
  cursor: pointer !important;
  user-select: none !important;
}
#screen-main .home-menu-recent,
#home-menu-recent {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  height: 0 !important;
  min-height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* Header compact-safe layout: keep Back/Premium fully inside the viewport. */
#menu-global-header.global-menu-topbar {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  grid-template-columns: minmax(260px, .95fr) minmax(150px, 255px) minmax(0, 1.25fr) !important;
  overflow: visible !important;
}
#menu-global-header.global-menu-topbar,
#menu-global-header.global-menu-topbar * {
  box-sizing: border-box !important;
}
#menu-global-header .topbar-player,
#menu-global-header .topbar-logo,
#menu-global-header .topbar-actions {
  min-width: 0 !important;
  max-width: 100% !important;
}
#menu-global-header .topbar-logo {
  padding-inline: 18px !important;
  overflow: hidden !important;
}
#menu-global-header .topbar-logo strong {
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#menu-global-header .topbar-context-btn,
#menu-global-header .icon-btn {
  width: 60px !important;
  flex: 0 0 60px !important;
  min-width: 60px !important;
  max-width: 60px !important;
}
#menu-global-header .topbar-rank,
#menu-global-header .topbar-avatar {
  width: 72px !important;
  flex: 0 0 72px !important;
  min-width: 72px !important;
}
#menu-global-header .topbar-player-copy {
  padding-inline: 12px !important;
}
#menu-global-header .topbar-xp {
  width: min(190px, 17vw) !important;
}
#menu-global-header .topbar-actions {
  justify-content: flex-end !important;
  overflow: visible !important;
}
#menu-global-header .topbar-currencies {
  min-width: 248px !important;
  max-width: 322px !important;
  flex: 1 1 248px !important;
  grid-template-columns: repeat(2, minmax(94px, 1fr)) !important;
}
#menu-global-header .currency-cell {
  grid-template-columns: 22px minmax(0,1fr) 22px !important;
  gap: 6px !important;
  padding-inline: 8px !important;
}
#menu-global-header .currency-cell strong {
  font-size: 15px !important;
}
#menu-global-header .currency-add {
  width: 22px !important;
  height: 22px !important;
}
@media (max-width: 1320px) {
  #menu-global-header.global-menu-topbar {
    grid-template-columns: minmax(250px, .9fr) minmax(0, 1.1fr) !important;
  }
  #menu-global-header .topbar-logo { display: none !important; }
  #menu-global-header .topbar-currencies { min-width: 232px !important; flex-basis: 232px !important; }
}
@media (max-width: 760px) {
  #menu-global-header.global-menu-topbar { grid-template-columns: minmax(0, 1fr) auto !important; }
  #menu-global-header .topbar-context-btn,
  #menu-global-header .icon-btn { width: 48px !important; flex-basis: 48px !important; min-width: 48px !important; max-width: 48px !important; }
  #menu-global-header .topbar-rank,
  #menu-global-header .topbar-avatar { width: 54px !important; flex-basis: 54px !important; min-width: 54px !important; }
}

/* Premium header button: restore the red/yellow premium look and remove brown overrides. */
#menu-global-header .topbar-context-btn.is-rewards {
  position: relative !important;
  overflow: hidden !important;
  cursor: pointer !important;
  color: #ffd232 !important;
  background: radial-gradient(100% 100% at 0% 0%, rgba(255, 204, 0, 0.75) 0%, rgba(255, 38, 74, 0.52) 50%, rgba(255, 38, 74, 0) 100%) !important;
  box-shadow: rgba(255, 255, 255, 0.25) 1px 0 0 0, inset 0 1px 0 rgba(255,255,255,.12) !important;
  border-color: rgba(255,255,255,.24) !important;
  filter: none !important;
}
#menu-global-header .topbar-context-btn.is-rewards::before,
#menu-global-header .topbar-context-btn.is-rewards::after {
  content: none !important;
  display: none !important;
  animation: none !important;
}
#menu-global-header .premium-header-icon {
  width: 2em !important;
  height: 2em !important;
  display: block !important;
  background-image: url('../assets/icons/premiumIcon.svg') !important;
  background-repeat: no-repeat !important;
  background-size: contain !important;
  background-position: center !important;
  filter: drop-shadow(0 0 10px rgba(255,210,50,.55)) !important;
}
#menu-global-header .topbar-context-btn.is-back .premium-header-icon { display: none !important; }
#menu-global-header .topbar-context-btn.is-back {
  background: transparent !important;
  color: #bfd5ff !important;
}
#menu-global-header .topbar-context-btn.is-back svg {
  display: block !important;
}

/* Finer scrollbars restored. */
html, body, .screen, .screen.content-screen.active, .panel, .hud, .wide-panel,
.shop-panel, .power-room-panel, .quest-panel, .vault-panel, .arena-panel,
.journal-panel, .wardrobe-panel, .profile-panel, .settings-panel,
#screen-main .berry-menu-grid, .battle-pass-track, #menu-global-header .notification-dropdown {
  scrollbar-width: thin !important;
  scrollbar-color: rgba(156,255,71,.72) rgba(4,19,13,.58) !important;
}
*::-webkit-scrollbar,
.screen.content-screen.active::-webkit-scrollbar,
.panel::-webkit-scrollbar,
.hud::-webkit-scrollbar,
.wide-panel::-webkit-scrollbar,
.shop-panel::-webkit-scrollbar,
.power-room-panel::-webkit-scrollbar,
.quest-panel::-webkit-scrollbar,
.vault-panel::-webkit-scrollbar,
.arena-panel::-webkit-scrollbar,
.journal-panel::-webkit-scrollbar,
.wardrobe-panel::-webkit-scrollbar,
.profile-panel::-webkit-scrollbar,
.settings-panel::-webkit-scrollbar,
#screen-main .berry-menu-grid::-webkit-scrollbar,
.battle-pass-track::-webkit-scrollbar,
#menu-global-header .notification-dropdown::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
}
*::-webkit-scrollbar-track,
#screen-main .berry-menu-grid::-webkit-scrollbar-track,
.battle-pass-track::-webkit-scrollbar-track {
  background: rgba(4,19,13,.58) !important;
  border-radius: 999px !important;
}
*::-webkit-scrollbar-thumb,
#screen-main .berry-menu-grid::-webkit-scrollbar-thumb,
.battle-pass-track::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(156,255,71,.82), rgba(47,191,113,.78)) !important;
  border-radius: 999px !important;
  border: 1px solid rgba(0,0,0,.18) !important;
}
*::-webkit-scrollbar-button,
*::-webkit-scrollbar-corner,
#screen-main .berry-menu-grid::-webkit-scrollbar-button,
#screen-main .berry-menu-grid::-webkit-scrollbar-corner {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}


/* v1.25.77 — Header Premium icon visibility + reliable header click zones + restored minimum blocks. */
#menu-global-header.global-menu-topbar {
  pointer-events: auto !important;
  z-index: 120 !important;
  grid-template-columns: minmax(340px, .95fr) minmax(220px, 290px) minmax(520px, 1.25fr) !important;
  overflow: visible !important;
}
#menu-global-header.global-menu-topbar::before,
#menu-global-header.global-menu-topbar::after,
#menu-global-header .topbar-player::before,
#menu-global-header .topbar-player::after,
#menu-global-header .topbar-actions::before,
#menu-global-header .topbar-actions::after {
  pointer-events: none !important;
}
#menu-global-header,
#menu-global-header * {
  pointer-events: auto !important;
}
#menu-global-header .topbar-player {
  min-width: 340px !important;
  width: 100% !important;
  flex-shrink: 0 !important;
}
#menu-global-header .topbar-logo {
  min-width: 220px !important;
  width: 100% !important;
  flex-shrink: 0 !important;
}
#menu-global-header .topbar-actions {
  min-width: 520px !important;
  width: 100% !important;
  flex-shrink: 0 !important;
  overflow: visible !important;
  position: relative !important;
  z-index: 3 !important;
}
#menu-global-header .topbar-context-btn,
#menu-global-header .icon-btn,
#menu-global-header .currency-add,
#menu-global-header .currency-cell,
#menu-global-header .notification-wrap,
#menu-global-header #notification-button {
  pointer-events: auto !important;
  position: relative !important;
  z-index: 5 !important;
  cursor: pointer !important;
}
#menu-global-header .topbar-context-btn,
#menu-global-header .icon-btn {
  width: 64px !important;
  min-width: 64px !important;
  max-width: 64px !important;
  flex: 0 0 64px !important;
}
#menu-global-header .topbar-rank,
#menu-global-header .topbar-avatar {
  width: 78px !important;
  min-width: 78px !important;
  flex: 0 0 78px !important;
}
#menu-global-header .topbar-player-copy {
  min-width: 150px !important;
  flex: 1 1 150px !important;
}
#menu-global-header .topbar-currencies {
  min-width: 260px !important;
  max-width: 340px !important;
  flex: 1 1 260px !important;
}
#menu-global-header .premium-header-icon,
#menu-global-header .premium-header-icon-svg {
  width: 34px !important;
  height: 34px !important;
  display: block !important;
  opacity: 1 !important;
  visibility: visible !important;
  position: relative !important;
  z-index: 2 !important;
  fill: #001926 !important;
  stroke: none !important;
  filter: drop-shadow(0 0 10px rgba(255,210,50,.58)) !important;
}
#menu-global-header .premium-header-icon-svg path,
#menu-global-header .premium-header-icon-svg circle {
  fill: #001926 !important;
  stroke: none !important;
}
#menu-global-header .topbar-context-btn.is-rewards {
  background: radial-gradient(100% 100% at 0% 0%, rgba(255, 204, 0, 0.78) 0%, rgba(255, 38, 74, 0.55) 50%, rgba(255, 38, 74, 0.02) 100%) !important;
  color: #ffd232 !important;
  border-left: 1px solid rgba(255,255,255,.22) !important;
  border-right: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: rgba(255, 255, 255, 0.25) 1px 0 0 0, inset 0 1px 0 rgba(255,255,255,.12) !important;
}
#menu-global-header .topbar-context-btn.is-rewards:hover .premium-header-icon-svg {
  transform: scale(1.04) !important;
}
#menu-global-header .topbar-context-btn.is-back .premium-header-icon,
#menu-global-header .topbar-context-btn.is-back .premium-header-icon-svg {
  display: none !important;
}
#menu-global-header .topbar-context-btn.is-back svg {
  display: block !important;
  width: 30px !important;
  height: 30px !important;
}
#menu-global-header .notification-dropdown {
  pointer-events: auto !important;
  z-index: 180 !important;
}
@media (max-width: 1320px) {
  #menu-global-header.global-menu-topbar {
    grid-template-columns: minmax(330px, 1fr) minmax(420px, auto) !important;
  }
  #menu-global-header .topbar-logo { display: none !important; }
  #menu-global-header .topbar-player { min-width: 330px !important; }
  #menu-global-header .topbar-actions { min-width: 420px !important; }
  #menu-global-header .topbar-currencies { min-width: 230px !important; max-width: 285px !important; flex-basis: 230px !important; }
}
@media (max-width: 860px) {
  #menu-global-header.global-menu-topbar {
    grid-template-columns: minmax(0, 1fr) auto !important;
  }
  #menu-global-header .topbar-player { min-width: 0 !important; }
  #menu-global-header .topbar-actions { min-width: 0 !important; }
  #menu-global-header .topbar-currencies { display: none !important; }
  #menu-global-header .topbar-context-btn,
  #menu-global-header .icon-btn {
    width: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
    flex-basis: 50px !important;
  }
  #menu-global-header .premium-header-icon-svg { width: 28px !important; height: 28px !important; }
}


/* v1.25.78 — Homepage header click and stable header blocks fix.
   Home screen is a full-screen absolute layer; it must not capture clicks above the fixed header.
   Only real menu content remains clickable. */
#game-shell > #menu-global-header.global-menu-topbar {
  position: fixed !important;
  inset: 0 0 auto 0 !important;
  width: 100vw !important;
  max-width: 100vw !important;
  height: var(--topbar-h, 86px) !important;
  min-height: var(--topbar-h, 86px) !important;
  z-index: 999 !important;
  pointer-events: auto !important;
  overflow: visible !important;
  box-sizing: border-box !important;
}
#game-shell > #menu-global-header.global-menu-topbar,
#game-shell > #menu-global-header.global-menu-topbar * {
  pointer-events: auto !important;
  box-sizing: border-box !important;
}
/* Do not let the homepage glass layer steal clicks from the fixed header. */
#screen-main.screen.active {
  pointer-events: none !important;
}
#screen-main.screen.active .menu-stage,
#screen-main.screen.active .menu-stage *,
#screen-main.screen.active .home-menu-panel,
#screen-main.screen.active .home-menu-panel *,
#screen-main.screen.active .berry-main-menu,
#screen-main.screen.active .berry-main-menu * {
  pointer-events: auto !important;
}
/* Header column proportions with real minimums, but without forcing viewport overflow. */
#menu-global-header.global-menu-topbar {
  grid-template-columns: minmax(320px, .95fr) minmax(210px, 285px) minmax(455px, 1.2fr) !important;
}
#menu-global-header .topbar-player {
  min-width: 320px !important;
  flex: 1 1 320px !important;
}
#menu-global-header .topbar-logo {
  min-width: 210px !important;
  flex: 0 1 285px !important;
}
#menu-global-header .topbar-actions {
  min-width: 455px !important;
  flex: 1 1 455px !important;
  z-index: 1001 !important;
}
#menu-global-header .topbar-context-btn,
#menu-global-header .topbar-gift-btn,
#menu-global-header #notification-button,
#menu-global-header [data-action="fullscreen"],
#menu-global-header #menu-nav-button,
#menu-global-header .currency-add,
#menu-global-header .currency-cell {
  pointer-events: auto !important;
  cursor: pointer !important;
  touch-action: manipulation !important;
  user-select: none !important;
  position: relative !important;
  z-index: 1002 !important;
}
#menu-global-header .topbar-context-btn,
#menu-global-header .icon-btn {
  width: 64px !important;
  min-width: 64px !important;
  max-width: 64px !important;
  flex: 0 0 64px !important;
}
#menu-global-header .topbar-currencies {
  min-width: 250px !important;
  max-width: 330px !important;
  flex: 1 1 250px !important;
}
#menu-global-header .premium-header-icon-svg {
  display: block !important;
  width: 34px !important;
  height: 34px !important;
  opacity: 1 !important;
  visibility: visible !important;
}
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg path,
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg circle {
  fill: #081321 !important;
  stroke: none !important;
}
#menu-global-header .topbar-context-btn.is-rewards {
  background: radial-gradient(100% 100% at 0% 0%, rgba(255, 204, 0, .78) 0%, rgba(255, 38, 74, .56) 52%, rgba(255, 38, 74, .04) 100%) !important;
}
@media (max-width: 1320px) {
  #menu-global-header.global-menu-topbar {
    grid-template-columns: minmax(300px, 1fr) minmax(405px, auto) !important;
  }
  #menu-global-header .topbar-logo { display: none !important; }
  #menu-global-header .topbar-player { min-width: 300px !important; }
  #menu-global-header .topbar-actions { min-width: 405px !important; }
  #menu-global-header .topbar-currencies { min-width: 220px !important; max-width: 280px !important; flex-basis: 220px !important; }
  #menu-global-header .topbar-context-btn,
  #menu-global-header .icon-btn { width: 58px !important; min-width: 58px !important; max-width: 58px !important; flex-basis: 58px !important; }
}
@media (max-width: 860px) {
  #menu-global-header.global-menu-topbar {
    grid-template-columns: minmax(0, 1fr) auto !important;
  }
  #menu-global-header .topbar-player,
  #menu-global-header .topbar-actions { min-width: 0 !important; }
  #menu-global-header .topbar-currencies { display: none !important; }
  #menu-global-header .topbar-context-btn,
  #menu-global-header .icon-btn { width: 50px !important; min-width: 50px !important; max-width: 50px !important; flex-basis: 50px !important; }
}


/* v1.25.79 — Premium/Back header icon alignment and color fix.
   The previous override made the inline Premium crown dark and slightly larger than
   Notifications/Fullscreen. Keep the same button geometry for Back/Premium and
   use the same visual icon size as the other header icon buttons. */
#menu-global-header .topbar-context-btn {
  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;
  max-width: 56px !important;
  flex: 0 0 56px !important;
  padding: 0 !important;
  margin: 0 !important;
  display: grid !important;
  place-items: center !important;
  align-items: center !important;
  justify-items: center !important;
  line-height: 1 !important;
  text-align: center !important;
  box-sizing: border-box !important;
}
#menu-global-header .topbar-context-btn > svg,
#menu-global-header .topbar-context-btn.is-back > svg,
#menu-global-header .topbar-context-btn.is-rewards > svg,
#menu-global-header .topbar-context-btn .premium-header-icon-svg {
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  min-height: 26px !important;
  max-width: 26px !important;
  max-height: 26px !important;
  display: block !important;
  margin: 0 !important;
  position: static !important;
  transform: none !important;
}
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg,
#menu-global-header .premium-header-icon-svg {
  fill: #fff4bd !important;
  stroke: rgba(255,255,255,.42) !important;
  stroke-width: 1.4 !important;
  filter: drop-shadow(0 0 8px rgba(255, 221, 82, .52)) !important;
}
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg path,
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg circle,
#menu-global-header .premium-header-icon-svg path,
#menu-global-header .premium-header-icon-svg circle {
  fill: #fff4bd !important;
  stroke: rgba(255,255,255,.42) !important;
  stroke-width: 1.4 !important;
}
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg circle,
#menu-global-header .premium-header-icon-svg circle {
  fill: #ff3157 !important;
  stroke: rgba(255,255,255,.72) !important;
}
#menu-global-header .topbar-context-btn.is-back {
  background: transparent !important;
  color: #bfd5ff !important;
}
#menu-global-header .topbar-context-btn.is-back svg {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.65 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#menu-global-header .topbar-context-btn.is-rewards:hover .premium-header-icon-svg {
  transform: none !important;
}
#menu-global-header .topbar-context-btn .context-hotkey {
  position: absolute !important;
  top: 6px !important;
  left: 6px !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 4 !important;
}
#menu-global-header .topbar-player {
  min-width: 296px !important;
  flex: 0 1 360px !important;
}
#menu-global-header #menu-header-title,
#menu-global-header .topbar-logo {
  min-width: 220px !important;
  flex: 1 1 260px !important;
}
#menu-global-header .topbar-actions {
  min-width: 420px !important;
  flex: 1 1 520px !important;
}
@media (max-width: 1320px) {
  #menu-global-header .topbar-context-btn {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    flex-basis: 52px !important;
  }
  #menu-global-header .topbar-context-btn > svg,
  #menu-global-header .topbar-context-btn.is-back > svg,
  #menu-global-header .topbar-context-btn.is-rewards > svg,
  #menu-global-header .topbar-context-btn .premium-header-icon-svg {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
    min-height: 24px !important;
    max-width: 24px !important;
    max-height: 24px !important;
  }
  #menu-global-header .topbar-player {
    min-width: 260px !important;
  }
  #menu-global-header .topbar-actions {
    min-width: 340px !important;
  }
}


/* v1.25.80 — Header premium button full-height + notification z-index authority.
   Keep the premium and back buttons in the same geometry as the rest of the fixed header. */
#menu-global-header.global-menu-topbar {
  z-index: 9000 !important;
  overflow: visible !important;
  isolation: isolate !important;
}
#menu-global-header .topbar-player,
#menu-global-header .topbar-actions,
#menu-global-header .notification-wrap {
  overflow: visible !important;
}
#menu-global-header .topbar-context-btn,
#menu-global-header .icon-btn,
#menu-global-header .topbar-gift-btn,
#menu-global-header #notification-button,
#menu-global-header [data-action="fullscreen"] {
  width: 72px !important;
  min-width: 72px !important;
  max-width: 72px !important;
  height: 100% !important;
  min-height: var(--topbar-h, 86px) !important;
  max-height: var(--topbar-h, 86px) !important;
  flex: 0 0 72px !important;
  display: grid !important;
  place-items: center !important;
  align-items: center !important;
  justify-items: center !important;
  align-self: stretch !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1 !important;
  box-sizing: border-box !important;
}
#menu-global-header .topbar-context-btn.is-rewards {
  color: #fff6bd !important;
  background:
    radial-gradient(100% 100% at 0% 0%, rgba(255, 204, 0, .78) 0%, rgba(255, 38, 74, .56) 52%, rgba(255, 38, 74, .04) 100%) !important;
  box-shadow: inset 1px 0 0 rgba(255,255,255,.25), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg,
#menu-global-header .premium-header-icon-svg {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  max-width: 34px !important;
  max-height: 34px !important;
  display: block !important;
  margin: 0 !important;
  position: static !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  fill: #fff5bf !important;
  stroke: rgba(255,255,255,.72) !important;
  stroke-width: 1.7 !important;
  filter: drop-shadow(0 0 9px rgba(255,221,82,.55)) drop-shadow(0 2px 3px rgba(0,0,0,.30)) !important;
}
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg path,
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg circle,
#menu-global-header .premium-header-icon-svg path,
#menu-global-header .premium-header-icon-svg circle {
  fill: #fff5bf !important;
  stroke: rgba(255,255,255,.72) !important;
  stroke-width: 1.7 !important;
}
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg circle,
#menu-global-header .premium-header-icon-svg circle {
  fill: #ff3157 !important;
  stroke: #fff5bf !important;
  stroke-width: 1.4 !important;
}
#menu-global-header .topbar-context-btn.is-back svg,
#menu-global-header .topbar-gift-btn svg,
#menu-global-header #notification-button svg,
#menu-global-header [data-action="fullscreen"] svg {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  min-height: 30px !important;
  max-width: 30px !important;
  max-height: 30px !important;
  margin: 0 !important;
  display: block !important;
  position: static !important;
  transform: none !important;
}
#menu-global-header .topbar-context-btn .context-hotkey,
#menu-global-header .hotkey-badge {
  z-index: 5 !important;
}
#menu-global-header .notification-dropdown,
#notification-dropdown.notification-dropdown {
  position: fixed !important;
  top: calc(var(--topbar-h, 86px) + 10px) !important;
  right: 92px !important;
  z-index: 100000 !important;
  pointer-events: none;
}
#menu-global-header .notification-dropdown.open,
#notification-dropdown.notification-dropdown.open {
  pointer-events: auto !important;
}
#screen-main .home-menu-panel,
#screen-main .berry-main-menu,
#screen-main .home-feature-cards,
#screen-main .home-menu-grid,
#screen-main .menu-stage {
  z-index: 20 !important;
}
@media (max-width: 1320px) {
  #menu-global-header .topbar-context-btn,
  #menu-global-header .icon-btn,
  #menu-global-header .topbar-gift-btn,
  #menu-global-header #notification-button,
  #menu-global-header [data-action="fullscreen"] {
    width: 62px !important;
    min-width: 62px !important;
    max-width: 62px !important;
    flex-basis: 62px !important;
    height: 100% !important;
    min-height: var(--topbar-h, 86px) !important;
    max-height: var(--topbar-h, 86px) !important;
  }
  #menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg,
  #menu-global-header .premium-header-icon-svg {
    width: 31px !important;
    height: 31px !important;
    min-width: 31px !important;
    min-height: 31px !important;
    max-width: 31px !important;
    max-height: 31px !important;
  }
  #menu-global-header .topbar-context-btn.is-back svg,
  #menu-global-header .topbar-gift-btn svg,
  #menu-global-header #notification-button svg,
  #menu-global-header [data-action="fullscreen"] svg {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
  }
}
@media (max-width: 860px) {
  #menu-global-header .topbar-context-btn,
  #menu-global-header .icon-btn,
  #menu-global-header .topbar-gift-btn,
  #menu-global-header #notification-button,
  #menu-global-header [data-action="fullscreen"] {
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    flex-basis: 52px !important;
  }
  #menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg,
  #menu-global-header .premium-header-icon-svg {
    width: 27px !important;
    height: 27px !important;
    min-width: 27px !important;
    min-height: 27px !important;
    max-width: 27px !important;
    max-height: 27px !important;
  }
}


/* v1.25.81 — Header icon color/size + notification portal authority. */
#game-shell > #menu-global-header.global-menu-topbar,
#menu-global-header.global-menu-topbar {
  z-index: 2147483000 !important;
  overflow: visible !important;
  isolation: auto !important;
}
#menu-global-header .topbar-context-btn,
#menu-global-header .topbar-context-btn.is-rewards,
#menu-global-header .topbar-context-btn.is-back,
#menu-global-header .topbar-gift-btn,
#menu-global-header #notification-button,
#menu-global-header [data-action="fullscreen"] {
  width: 72px !important;
  min-width: 72px !important;
  max-width: 72px !important;
  height: var(--topbar-h, 86px) !important;
  min-height: var(--topbar-h, 86px) !important;
  max-height: var(--topbar-h, 86px) !important;
  flex: 0 0 72px !important;
  display: grid !important;
  place-items: center !important;
  align-items: center !important;
  justify-items: center !important;
  align-self: stretch !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  line-height: 1 !important;
}
#menu-global-header .topbar-context-btn.is-back,
#menu-global-header .topbar-gift-btn,
#menu-global-header #notification-button,
#menu-global-header [data-action="fullscreen"] {
  color: #cfe0ff !important;
  background: transparent !important;
}
#menu-global-header .topbar-gift-btn svg,
#menu-global-header #notification-button svg,
#menu-global-header [data-action="fullscreen"] svg,
#menu-global-header .topbar-context-btn.is-back svg {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  min-height: 30px !important;
  max-width: 30px !important;
  max-height: 30px !important;
  display: block !important;
  margin: 0 !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.65 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  filter: none !important;
}
#menu-global-header .topbar-gift-btn path,
#menu-global-header .gift-svg path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.35 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#menu-global-header .topbar-context-btn.is-rewards {
  color: #fff6bd !important;
  background: radial-gradient(100% 100% at 0% 0%, rgba(255, 204, 0, .78) 0%, rgba(255, 38, 74, .56) 52%, rgba(255, 38, 74, .04) 100%) !important;
  box-shadow: inset 1px 0 0 rgba(255,255,255,.25), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg,
#menu-global-header .premium-header-icon-svg {
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  min-height: 58px !important;
  max-width: 58px !important;
  max-height: 58px !important;
  display: block !important;
  margin: 0 !important;
  position: static !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  overflow: visible !important;
  fill: #fff6bd !important;
  stroke: rgba(255,255,255,.58) !important;
  stroke-width: 1.7 !important;
  filter: drop-shadow(0 0 9px rgba(255,221,82,.52)) drop-shadow(0 2px 3px rgba(0,0,0,.30)) !important;
}
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg path,
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg circle,
#menu-global-header .premium-header-icon-svg path,
#menu-global-header .premium-header-icon-svg circle {
  fill: #fff6bd !important;
  stroke: rgba(255,255,255,.58) !important;
  stroke-width: 1.7 !important;
}
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg circle,
#menu-global-header .premium-header-icon-svg circle {
  fill: #ff3157 !important;
  stroke: #fff6bd !important;
  stroke-width: 1.5 !important;
}
#menu-global-header .topbar-context-btn .context-hotkey,
#menu-global-header .hotkey-badge {
  z-index: 6 !important;
}
#notification-dropdown.notification-dropdown,
body > #notification-dropdown.notification-dropdown,
#menu-global-header .notification-dropdown {
  position: fixed !important;
  top: calc(var(--topbar-h, 86px) + 10px) !important;
  right: 92px !important;
  z-index: 2147483647 !important;
  pointer-events: none !important;
  isolation: isolate !important;
}
#notification-dropdown.notification-dropdown.open,
body > #notification-dropdown.notification-dropdown.open,
#menu-global-header .notification-dropdown.open {
  pointer-events: auto !important;
}
#screen-main .home-menu-panel,
#screen-main .berry-main-menu,
#screen-main .home-feature-cards,
#screen-main .home-menu-grid,
#screen-main .menu-stage {
  z-index: 3 !important;
}
#notification-dropdown .notification-read-all,
#notification-dropdown .notification-read-btn {
  pointer-events: auto !important;
  cursor: pointer !important;
  position: relative !important;
  z-index: 2 !important;
}
@media (max-width: 1320px) {
  #menu-global-header .topbar-context-btn,
  #menu-global-header .topbar-context-btn.is-rewards,
  #menu-global-header .topbar-context-btn.is-back,
  #menu-global-header .topbar-gift-btn,
  #menu-global-header #notification-button,
  #menu-global-header [data-action="fullscreen"] {
    width: 62px !important;
    min-width: 62px !important;
    max-width: 62px !important;
    flex-basis: 62px !important;
  }
  #menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg,
  #menu-global-header .premium-header-icon-svg {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    min-height: 52px !important;
    max-width: 52px !important;
    max-height: 52px !important;
  }
  #menu-global-header .topbar-gift-btn svg,
  #menu-global-header #notification-button svg,
  #menu-global-header [data-action="fullscreen"] svg,
  #menu-global-header .topbar-context-btn.is-back svg {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
  }
}
@media (max-width: 860px) {
  #menu-global-header .topbar-context-btn,
  #menu-global-header .topbar-context-btn.is-rewards,
  #menu-global-header .topbar-context-btn.is-back,
  #menu-global-header .topbar-gift-btn,
  #menu-global-header #notification-button,
  #menu-global-header [data-action="fullscreen"] {
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    flex-basis: 52px !important;
  }
  #menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg,
  #menu-global-header .premium-header-icon-svg {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    max-width: 46px !important;
    max-height: 46px !important;
  }
}


/* v1.25.84 — clean header height, supplied Premium SVG, and single notification UI authority. */
:root {
  --topbar-h: 78px !important;
}
#menu-global-header.global-menu-topbar {
  height: var(--topbar-h) !important;
  min-height: var(--topbar-h) !important;
  z-index: 2147483000 !important;
  overflow: visible !important;
}
#menu-global-header .topbar-context-btn,
#menu-global-header .topbar-context-btn.is-rewards,
#menu-global-header .topbar-context-btn.is-back,
#menu-global-header .topbar-gift-btn,
#menu-global-header #notification-button,
#menu-global-header [data-action="fullscreen"],
#menu-global-header #menu-nav-button {
  width: 66px !important;
  min-width: 66px !important;
  max-width: 66px !important;
  height: var(--topbar-h) !important;
  min-height: var(--topbar-h) !important;
  max-height: var(--topbar-h) !important;
  flex: 0 0 66px !important;
  display: grid !important;
  place-items: center !important;
  align-items: center !important;
  justify-items: center !important;
  align-self: stretch !important;
  padding: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  border-radius: 0 !important;
  line-height: 1 !important;
}
#menu-global-header .topbar-rank,
#menu-global-header .topbar-avatar {
  height: var(--topbar-h) !important;
  min-height: var(--topbar-h) !important;
  max-height: var(--topbar-h) !important;
  width: 78px !important;
  flex-basis: 78px !important;
  display: grid !important;
  place-content: center !important;
  align-self: stretch !important;
}
#menu-global-header .topbar-context-btn.is-rewards {
  color: #ffcc00 !important;
  background: radial-gradient(100% 100% at 0% 0%, rgba(255,204,0,.75) 0%, rgba(255,38,74,.50) 50%, rgba(255,38,74,0) 100%) !important;
  box-shadow: inset 1px 0 0 rgba(255,255,255,.25), inset 0 1px 0 rgba(255,255,255,.10) !important;
}
#menu-global-header .premium-header-icon-svg { display: none !important; }
#menu-global-header .premium-header-icon-img {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  max-width: 34px !important;
  max-height: 34px !important;
  display: block !important;
  object-fit: contain !important;
  margin: 0 !important;
  padding: 0 !important;
  position: static !important;
  transform: none !important;
  filter: drop-shadow(0 0 9px rgba(255,204,0,.50)) drop-shadow(0 2px 3px rgba(0,0,0,.28)) !important;
}
#menu-global-header .topbar-context-btn.is-back .premium-header-icon-img {
  display: none !important;
}
#menu-global-header .topbar-gift-btn svg,
#menu-global-header #notification-button svg,
#menu-global-header [data-action="fullscreen"] svg,
#menu-global-header #menu-nav-button svg,
#menu-global-header .topbar-context-btn.is-back svg {
  width: 29px !important;
  height: 29px !important;
  min-width: 29px !important;
  min-height: 29px !important;
  max-width: 29px !important;
  max-height: 29px !important;
  display: block !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  stroke-width: 2.55 !important;
}
#menu-global-header .topbar-gift-btn,
#menu-global-header #notification-button,
#menu-global-header [data-action="fullscreen"],
#menu-global-header #menu-nav-button,
#menu-global-header .topbar-context-btn.is-back {
  color: #cfe0ff !important;
  background: transparent !important;
}
#menu-global-header .topbar-gift-btn path,
#menu-global-header .gift-svg path {
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.35 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#menu-global-header .hotkey-badge,
#menu-global-header .context-hotkey,
#menu-global-header .gift-hotkey {
  top: 6px !important;
  left: 6px !important;
}

/* Notification portal: one clean UI, even after the dropdown is moved to <body>. */
#notification-dropdown.notification-dropdown,
body > #notification-dropdown.notification-dropdown {
  all: unset !important;
  box-sizing: border-box !important;
  position: fixed !important;
  top: calc(var(--topbar-h, 78px) + 1px) !important;
  right: 0 !important;
  width: min(420px, calc(100vw - 18px)) !important;
  max-height: min(430px, calc(100vh - var(--topbar-h, 78px) - 18px)) !important;
  overflow: auto !important;
  display: block !important;
  opacity: 0 !important;
  transform: translateY(-8px) !important;
  pointer-events: none !important;
  z-index: 2147483647 !important;
  padding: 0 !important;
  border-radius: 0 0 0 18px !important;
  background: linear-gradient(180deg, rgba(0,25,38,.985) 0%, rgba(0,18,31,.975) 100%) !important;
  color: #eaf3ff !important;
  border-left: 1px solid rgba(255,255,255,.24) !important;
  border-bottom: 1px solid rgba(255,255,255,.24) !important;
  box-shadow: 0 28px 70px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.10) !important;
  transition: opacity .16s ease, transform .16s ease !important;
  font-family: inherit !important;
}
#notification-dropdown.notification-dropdown.open,
body > #notification-dropdown.notification-dropdown.open {
  opacity: 1 !important;
  transform: translateY(0) !important;
  pointer-events: auto !important;
}
#notification-dropdown .notification-panel-head {
  min-height: 54px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 0 16px !important;
  border-bottom: 1px solid rgba(255,255,255,.18) !important;
  background: linear-gradient(90deg, rgba(140,255,55,.13), rgba(16,223,255,.07), transparent) !important;
}
#notification-dropdown .notification-panel-head span {
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 1000 !important;
  text-transform: uppercase !important;
  letter-spacing: .03em !important;
}
#notification-dropdown .notification-panel-head small {
  color: #9cff47 !important;
  font-size: 11px !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
}
#notification-dropdown .notification-read-all {
  min-height: 30px !important;
  border: 1px solid rgba(140,255,55,.28) !important;
  background: rgba(140,255,55,.08) !important;
  color: #cfffbd !important;
  padding: 0 10px !important;
  font-size: 10px !important;
  font-weight: 1000 !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  cursor: pointer !important;
}
#notification-dropdown .notification-list {
  display: grid !important;
  gap: 0 !important;
}
#notification-dropdown article {
  display: grid !important;
  grid-template-columns: 52px minmax(0,1fr) 66px !important;
  min-height: 72px !important;
  gap: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #eaf3ff !important;
  box-shadow: none !important;
}
#notification-dropdown article:hover {
  background: linear-gradient(90deg, rgba(140,255,55,.10), rgba(16,223,255,.05), transparent) !important;
}
#notification-dropdown article.is-read {
  opacity: .58 !important;
}
#notification-dropdown .notif-icon {
  min-height: 72px !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid rgba(255,255,255,.18) !important;
  font-style: normal !important;
  color: #ffd232 !important;
}
#notification-dropdown .notif-icon svg,
#notification-dropdown .notification-read-btn svg {
  width: 22px !important;
  height: 22px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.35 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#notification-dropdown article > div {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  padding: 10px 14px !important;
}
#notification-dropdown b {
  color: #fff !important;
  font-size: 14px !important;
  line-height: 1.15 !important;
  font-weight: 1000 !important;
}
#notification-dropdown small {
  display: block !important;
  margin-top: 4px !important;
  color: rgba(207,224,255,.74) !important;
  font-size: 12px !important;
  line-height: 1.25 !important;
  font-weight: 800 !important;
}
#notification-dropdown .notification-read-btn {
  align-self: center !important;
  justify-self: center !important;
  min-width: 52px !important;
  min-height: 30px !important;
  border: 1px solid rgba(140,255,55,.24) !important;
  background: rgba(140,255,55,.08) !important;
  color: #cfffbd !important;
  font-size: 10px !important;
  font-weight: 1000 !important;
  text-transform: uppercase !important;
  cursor: pointer !important;
}
#notification-dropdown .notification-read-btn:disabled {
  cursor: default !important;
  opacity: .66 !important;
}
#notification-dropdown::-webkit-scrollbar { width: 6px !important; }
#notification-dropdown::-webkit-scrollbar-track { background: rgba(255,255,255,.08) !important; }
#notification-dropdown::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #9cff47, #10dfff) !important; border-radius: 999px !important; }
#screen-main .home-menu-panel,
#screen-main .berry-main-menu,
#screen-main .home-feature-cards,
#screen-main .home-menu-grid,
#screen-main .menu-stage {
  z-index: 1 !important;
}
@media (max-width: 1320px) {
  :root { --topbar-h: 76px !important; }
  #menu-global-header .topbar-context-btn,
  #menu-global-header .topbar-context-btn.is-rewards,
  #menu-global-header .topbar-context-btn.is-back,
  #menu-global-header .topbar-gift-btn,
  #menu-global-header #notification-button,
  #menu-global-header [data-action="fullscreen"],
  #menu-global-header #menu-nav-button {
    width: 60px !important;
    min-width: 60px !important;
    max-width: 60px !important;
    flex-basis: 60px !important;
  }
  #menu-global-header .premium-header-icon-img { width: 32px !important; height: 32px !important; min-width:32px !important; min-height:32px !important; }
}
@media (max-width: 860px) {
  :root { --topbar-h: 72px !important; }
  #menu-global-header .topbar-context-btn,
  #menu-global-header .topbar-context-btn.is-rewards,
  #menu-global-header .topbar-context-btn.is-back,
  #menu-global-header .topbar-gift-btn,
  #menu-global-header #notification-button,
  #menu-global-header [data-action="fullscreen"],
  #menu-global-header #menu-nav-button {
    width: 50px !important;
    min-width: 50px !important;
    max-width: 50px !important;
    flex-basis: 50px !important;
  }
  #notification-dropdown.notification-dropdown { left: 8px !important; right: 8px !important; width: auto !important; border-radius: 0 0 16px 16px !important; }
}


/* v1.25.85 — stable Premium SVG + compact F11 hotkey badge. */
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-svg,
#menu-global-header .premium-header-icon-svg {
  display: none !important;
}
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-img,
#menu-global-header .premium-header-icon-img {
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  max-width: 34px !important;
  max-height: 34px !important;
  display: block !important;
  object-fit: contain !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  opacity: 1 !important;
  filter: drop-shadow(0 0 9px rgba(255,204,0,.54)) drop-shadow(0 2px 3px rgba(0,0,0,.26)) !important;
}
#menu-global-header .topbar-context-btn.is-back .premium-header-icon-img {
  display: none !important;
}
#menu-global-header .hotkey-badge,
#menu-global-header .context-hotkey,
#menu-global-header .gift-hotkey {
  box-sizing: border-box !important;
  top: 6px !important;
  left: 6px !important;
  min-width: 18px !important;
  width: auto !important;
  height: 18px !important;
  padding: 0 5px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
}
#menu-global-header [data-action="fullscreen"] .hotkey-badge {
  min-width: 26px !important;
  height: 18px !important;
  padding: 0 4px !important;
  font-size: 10px !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
  transform: none !important;
}


/* v1.25.86 — Notifications N hotkey + uniform header icon size. */
#menu-global-header .notification-hotkey {
  box-sizing: border-box !important;
  top: 6px !important;
  left: 6px !important;
  min-width: 18px !important;
  height: 18px !important;
  padding: 0 5px !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
}
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-img,
#menu-global-header .premium-header-icon-img,
#menu-global-header #notification-button > svg,
#menu-global-header .topbar-gift-btn > svg,
#menu-global-header .topbar-gift-btn .gift-svg,
#menu-global-header [data-action="fullscreen"] > svg {
  width: 28px !important;
  height: 28px !important;
  min-width: 28px !important;
  min-height: 28px !important;
  max-width: 28px !important;
  max-height: 28px !important;
  transform: none !important;
  display: block !important;
  object-fit: contain !important;
}
#menu-global-header .topbar-context-btn.is-rewards .premium-header-icon-img,
#menu-global-header .premium-header-icon-img {
  filter: drop-shadow(0 0 7px rgba(255,204,0,.46)) drop-shadow(0 2px 3px rgba(0,0,0,.24)) !important;
}
#menu-global-header #notification-button > svg,
#menu-global-header .topbar-gift-btn > svg,
#menu-global-header [data-action="fullscreen"] > svg {
  stroke-width: 2.55 !important;
}


/* v1.25.87 — Settings hub cleanup + safe local saves + notification icon balance. */
.settings-hub-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap: 12px !important;
  margin: 16px 0 18px !important;
}
.settings-hub-card {
  min-height: 108px !important;
  display: grid !important;
  grid-template-columns: 44px minmax(0,1fr) !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  gap: 4px 12px !important;
  padding: 14px !important;
  border: 1px solid rgba(191,213,255,.16) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025)) !important;
  color: #eaf3ff !important;
  cursor: pointer !important;
  text-align: left !important;
}
.settings-hub-card:hover { border-color: rgba(156,255,71,.34) !important; box-shadow: 0 16px 28px rgba(0,0,0,.18), 0 0 18px rgba(156,255,71,.08) !important; }
.settings-hub-card i { grid-row: 1 / span 2 !important; width: 44px !important; height: 44px !important; display: grid !important; place-items: center !important; color: #9cff47 !important; font-style: normal !important; font-size: 22px !important; border: 1px solid rgba(156,255,71,.22) !important; background: rgba(156,255,71,.06) !important; }
.settings-hub-card strong { color: #fff !important; font-size: 14px !important; line-height: 1.2 !important; font-weight: 1000 !important; }
.settings-hub-card span { color: rgba(207,224,255,.76) !important; font-size: 12px !important; line-height: 1.35 !important; font-weight: 800 !important; }
.credits-company-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
  gap: 12px !important;
  margin: 18px 0 !important;
}
.credits-company-grid article {
  display: grid !important;
  gap: 7px !important;
  padding: 16px !important;
  border: 1px solid rgba(191,213,255,.16) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.025)) !important;
}
.credits-company-grid span { color: rgba(207,224,255,.72) !important; font-size: 11px !important; font-weight: 950 !important; text-transform: uppercase !important; letter-spacing: .12em !important; }
.credits-company-grid strong { color: #fff !important; font-size: 17px !important; font-weight: 1000 !important; }
.credits-company-grid em { color: rgba(207,224,255,.76) !important; font-style: normal !important; font-size: 12px !important; line-height: 1.45 !important; font-weight: 800 !important; }
#menu-global-header #notification-button > svg {
  width: 25px !important;
  height: 25px !important;
  min-width: 25px !important;
  min-height: 25px !important;
  max-width: 25px !important;
  max-height: 25px !important;
  stroke-width: 2.35 !important;
}
#menu-global-header .topbar-gift-btn > svg,
#menu-global-header .topbar-gift-btn .gift-svg,
#menu-global-header [data-action="fullscreen"] > svg {
  width: 27px !important;
  height: 27px !important;
  min-width: 27px !important;
  min-height: 27px !important;
  max-width: 27px !important;
  max-height: 27px !important;
}
#menu-global-header .premium-header-icon-img {
  width: 27px !important;
  height: 27px !important;
  min-width: 27px !important;
  min-height: 27px !important;
  max-width: 27px !important;
  max-height: 27px !important;
}


/* v1.25.88 — Settings Hub inline sections and one-line sound controls. */
#screen-settings.settings-screen {
  align-items: stretch !important;
  justify-content: flex-start !important;
  overflow-y: auto !important;
}
#screen-settings .settings-page-shell {
  width: min(1280px, calc(100vw - 36px)) !important;
  margin: 0 auto !important;
  display: grid !important;
  gap: 16px !important;
}
#screen-settings .settings-page-head {
  min-height: 104px !important;
  display: flex !important;
  align-items: center !important;
  padding: 22px 24px !important;
  border: 1px solid rgba(191,213,255,.16) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(156,255,71,.10), transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.026)) !important;
  box-shadow: 0 18px 34px rgba(0,0,0,.18), inset 0 1px 0 rgba(255,255,255,.08) !important;
}
#screen-settings .settings-page-head div {
  display: grid !important;
  gap: 5px !important;
}
#screen-settings .settings-eyebrow {
  color: #9cff47 !important;
  font-size: 12px !important;
  font-weight: 1000 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
}
#screen-settings .settings-page-head strong {
  color: #fff !important;
  font-size: clamp(32px, 4vw, 54px) !important;
  line-height: .95 !important;
  font-weight: 1000 !important;
  letter-spacing: -.055em !important;
}
#screen-settings .settings-page-head em {
  max-width: 760px !important;
  color: rgba(222,236,255,.74) !important;
  font-size: 14px !important;
  line-height: 1.45 !important;
  font-style: normal !important;
  font-weight: 800 !important;
}
#screen-settings .settings-section-card {
  display: grid !important;
  gap: 14px !important;
  padding: 18px !important;
  border: 1px solid rgba(191,213,255,.15) !important;
  background:
    radial-gradient(circle at 100% 0%, rgba(88,216,255,.06), transparent 26%),
    linear-gradient(180deg, rgba(255,255,255,.062), rgba(255,255,255,.024)) !important;
  box-shadow: 0 16px 30px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
#screen-settings .settings-section-title {
  display: grid !important;
  grid-template-columns: 46px minmax(0,1fr) !important;
  align-items: center !important;
  gap: 12px !important;
}
#screen-settings .settings-section-title i {
  width: 46px !important;
  height: 46px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(156,255,71,.22) !important;
  background: rgba(156,255,71,.06) !important;
  color: #9cff47 !important;
  font-style: normal !important;
  font-size: 21px !important;
}
#screen-settings .settings-section-title strong {
  display: block !important;
  color: #fff !important;
  font-size: 18px !important;
  line-height: 1.1 !important;
  font-weight: 1000 !important;
}
#screen-settings .settings-section-title span {
  display: block !important;
  margin-top: 4px !important;
  color: rgba(222,236,255,.70) !important;
  font-size: 13px !important;
  line-height: 1.35 !important;
  font-weight: 800 !important;
}
#screen-settings .settings-section-grid.compact {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
  gap: 10px !important;
}
#screen-settings .setting-row {
  min-height: 54px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  border: 1px solid rgba(191,213,255,.12) !important;
  background: rgba(255,255,255,.035) !important;
  color: #eaf3ff !important;
}
#screen-settings .setting-row > span {
  min-width: 0 !important;
  color: rgba(234,243,255,.90) !important;
  font-size: 13px !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
}
#screen-settings .setting-row input[type="text"],
#screen-settings .setting-row select {
  min-width: 160px !important;
  max-width: 100% !important;
  height: 34px !important;
  border: 1px solid rgba(191,213,255,.16) !important;
  background: rgba(0,18,28,.52) !important;
  color: #fff !important;
  padding: 0 10px !important;
}
#screen-settings .language-setting-row {
  display: flex !important;
  justify-content: space-between !important;
  gap: 14px !important;
}
#screen-settings .sound-range-row {
  display: grid !important;
  grid-template-columns: minmax(150px, 220px) minmax(160px, 1fr) 58px !important;
  align-items: center !important;
  gap: 14px !important;
  min-height: 58px !important;
  padding: 0 14px !important;
}
#screen-settings .sound-range-row input[type="range"] {
  width: 100% !important;
  min-width: 140px !important;
  height: 22px !important;
  margin: 0 !important;
  accent-color: #58ee91 !important;
}
#screen-settings .sound-range-row strong {
  width: 58px !important;
  min-width: 58px !important;
  color: #72ff9c !important;
  font-size: 13px !important;
  line-height: 1 !important;
  text-align: right !important;
  white-space: nowrap !important;
}
#screen-settings .settings-sound-studio-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}
#screen-settings .sound-preview-card {
  margin-top: 0 !important;
}
#screen-settings .quality-summary-grid,
#screen-settings .quality-card-grid,
#screen-settings .publisher-checklist-grid,
#screen-settings .localization-preview-grid {
  margin-top: 0 !important;
}
#screen-settings .danger-zone {
  border-color: rgba(255,91,112,.24) !important;
  background:
    radial-gradient(circle at 0 0, rgba(255,91,112,.10), transparent 30%),
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.018)) !important;
}
#screen-settings .danger-zone .settings-section-title i {
  color: #ff5b70 !important;
  border-color: rgba(255,91,112,.24) !important;
  background: rgba(255,91,112,.08) !important;
}
#menu-global-header #notification-button svg {
  width: 25px !important;
  height: 25px !important;
}
@media (max-width: 760px) {
  #screen-settings .settings-page-shell {
    width: min(100%, calc(100vw - 20px)) !important;
  }
  #screen-settings .settings-page-head,
  #screen-settings .settings-section-card {
    padding: 14px !important;
  }
  #screen-settings .settings-section-grid.compact {
    grid-template-columns: 1fr !important;
  }
  #screen-settings .sound-range-row {
    grid-template-columns: minmax(116px, 150px) minmax(100px, 1fr) 50px !important;
    gap: 10px !important;
  }
  #screen-settings .sound-range-row > span {
    white-space: normal !important;
  }
}


/* v1.25.89 — faster Settings Hub + fixed sound preview controls. */
#screen-settings.settings-screen {
  scroll-behavior: auto !important;
  contain: layout style !important;
}
#screen-settings .settings-page-shell {
  gap: 12px !important;
  padding-bottom: 28px !important;
}
#screen-settings .settings-page-head {
  min-height: 82px !important;
  padding: 16px 20px !important;
  border-radius: 0 !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
#screen-settings .settings-page-head strong {
  font-size: clamp(28px, 3.1vw, 42px) !important;
}
#screen-settings .settings-page-head em {
  font-size: 13px !important;
}
#screen-settings .settings-section-card {
  gap: 12px !important;
  padding: 14px !important;
  border-radius: 0 !important;
  contain: content !important;
  content-visibility: auto !important;
  contain-intrinsic-size: 220px !important;
  transition: none !important;
  animation: none !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.05) !important;
}
#screen-settings .settings-section-title {
  grid-template-columns: 40px minmax(0,1fr) !important;
  gap: 10px !important;
}
#screen-settings .settings-section-title i {
  width: 40px !important;
  height: 40px !important;
  font-size: 20px !important;
}
#screen-settings .settings-section-title strong {
  font-size: 15px !important;
}
#screen-settings .settings-section-title span {
  font-size: 12px !important;
}
#screen-settings .settings-sound-studio-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}
#screen-settings .sound-range-row {
  display: grid !important;
  grid-template-columns: minmax(150px, 190px) minmax(180px, 1fr) 58px !important;
  align-items: center !important;
  gap: 14px !important;
  min-height: 44px !important;
  padding: 0 12px !important;
}
#screen-settings .sound-range-row > span {
  white-space: nowrap !important;
  margin: 0 !important;
  min-width: 0 !important;
}
#screen-settings .sound-range-row input[type="range"] {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}
#screen-settings .sound-range-row strong {
  min-width: 54px !important;
  text-align: right !important;
  white-space: nowrap !important;
}
#screen-settings .sound-preview-card {
  display: grid !important;
  grid-template-columns: minmax(190px, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 64px !important;
  padding: 12px !important;
  border-radius: 0 !important;
  box-shadow: inset 4px 0 0 rgba(82,235,154,.75) !important;
}
#screen-settings .sound-preview-card > strong,
#screen-settings .sound-preview-card > span {
  grid-column: 1 !important;
}
#screen-settings .sound-preview-card > span {
  font-size: 12px !important;
  line-height: 1.35 !important;
}
#screen-settings .sound-preview-actions {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  display: flex !important;
  justify-content: flex-end !important;
  align-items: center !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
}
#screen-settings .sound-preview-actions .btn {
  min-height: 36px !important;
  padding: 0 14px !important;
  white-space: nowrap !important;
}
#screen-settings .quality-card-grid,
#screen-settings .publisher-checklist-grid,
#screen-settings .localization-preview-grid,
#screen-settings .quality-summary-grid {
  contain: content !important;
}
#screen-settings .quality-tool-card,
#screen-settings .publisher-checklist-grid article,
#screen-settings .localization-preview-grid article,
#screen-settings .quality-summary-grid article {
  transition: none !important;
  animation: none !important;
}
@media (max-width: 760px) {
  #screen-settings .settings-page-shell {
    width: min(100%, calc(100vw - 18px)) !important;
  }
  #screen-settings .sound-range-row {
    grid-template-columns: 1fr 54px !important;
    gap: 8px 10px !important;
    padding: 10px 12px !important;
  }
  #screen-settings .sound-range-row > span {
    grid-column: 1 / -1 !important;
  }
  #screen-settings .sound-preview-card {
    grid-template-columns: 1fr !important;
  }
  #screen-settings .sound-preview-actions {
    grid-column: 1 !important;
    grid-row: auto !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
  }
}

/* v1.25.91 — restore classic Settings design; only fix layout, wrapping and inline sound tests. */
#screen-settings .settings-page-head,
#screen-settings .settings-section-card,
#screen-settings .setting-row,
#screen-settings .quality-tool-card,
#screen-settings .publisher-checklist-grid article,
#screen-settings .localization-preview-grid article,
#screen-settings .quality-summary-grid article,
#screen-settings .credits-company-grid article {
  min-width: 0 !important;
}
#screen-settings .settings-section-title > div,
#screen-settings .quality-tool-card > div,
#screen-settings .publisher-checklist-grid article,
#screen-settings .localization-preview-grid article,
#screen-settings .quality-summary-grid article,
#screen-settings .credits-company-grid article {
  min-width: 0 !important;
  max-width: 100% !important;
}
#screen-settings .settings-page-head em,
#screen-settings .settings-section-title span,
#screen-settings .setting-row > span,
#screen-settings .quality-tool-card strong,
#screen-settings .quality-tool-card span,
#screen-settings .quality-tool-card em,
#screen-settings .publisher-checklist-grid article,
#screen-settings .localization-preview-grid article,
#screen-settings .quality-summary-grid article,
#screen-settings .credits-company-grid article,
#screen-settings .hint,
#screen-settings .setting-note {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
  word-break: normal !important;
}
#screen-settings .settings-section-title strong,
#screen-settings .settings-section-title span {
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#screen-settings .settings-section-title span {
  white-space: normal !important;
}
#screen-settings .settings-sound-studio-grid {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 10px !important;
}
#screen-settings .sound-range-row.sound-test-row {
  display: grid !important;
  grid-template-columns: minmax(150px, 190px) minmax(180px, 1fr) 58px minmax(220px, auto) !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 46px !important;
  padding: 0 12px !important;
}
#screen-settings .sound-range-row.sound-test-row > span {
  white-space: nowrap !important;
  margin: 0 !important;
  min-width: 0 !important;
}
#screen-settings .sound-range-row.sound-test-row input[type="range"] {
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
}
#screen-settings .sound-range-row.sound-test-row > strong {
  min-width: 54px !important;
  width: 54px !important;
  text-align: right !important;
  white-space: nowrap !important;
}
#screen-settings .sound-inline-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
  min-width: 0 !important;
}
#screen-settings .sound-inline-actions .btn {
  min-height: 34px !important;
  height: 34px !important;
  padding: 0 12px !important;
  font-size: 12px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
#screen-settings .sound-preview-card {
  display: none !important;
}
#screen-settings .quality-card-grid,
#screen-settings .publisher-checklist-grid,
#screen-settings .localization-preview-grid,
#screen-settings .quality-summary-grid,
#screen-settings .credits-company-grid {
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
}
#screen-settings .quality-tool-card {
  grid-template-columns: 44px minmax(0, 1fr) auto !important;
}
#screen-settings .quality-tool-card .btn {
  justify-self: end !important;
  white-space: nowrap !important;
}
@media (max-width: 980px) {
  #screen-settings .sound-range-row.sound-test-row {
    grid-template-columns: minmax(130px, 170px) minmax(130px, 1fr) 54px !important;
    min-height: 58px !important;
    padding: 10px 12px !important;
  }
  #screen-settings .sound-inline-actions {
    grid-column: 2 / -1 !important;
    justify-content: flex-start !important;
  }
  #screen-settings .quality-tool-card {
    grid-template-columns: 42px minmax(0, 1fr) !important;
  }
  #screen-settings .quality-tool-card .btn {
    grid-column: 1 / -1 !important;
    justify-self: stretch !important;
  }
}
@media (max-width: 760px) {
  #screen-settings .sound-range-row.sound-test-row {
    grid-template-columns: 1fr 54px !important;
    gap: 8px 10px !important;
    padding: 10px 12px !important;
  }
  #screen-settings .sound-range-row.sound-test-row > span {
    grid-column: 1 / -1 !important;
    white-space: normal !important;
  }
  #screen-settings .sound-range-row.sound-test-row input[type="range"] {
    grid-column: 1 !important;
  }
  #screen-settings .sound-range-row.sound-test-row > strong {
    grid-column: 2 !important;
  }
  #screen-settings .sound-inline-actions {
    grid-column: 1 / -1 !important;
    justify-content: flex-start !important;
  }
  #screen-settings .sound-inline-actions .btn {
    flex: 1 1 auto !important;
  }
}


/* v1.25.93 — Settings layout/contact polish, form style and clipped header title fix. */
#menu-global-header .topbar-logo.is-page-title {
  justify-content: center !important;
  overflow: visible !important;
}
#menu-global-header .topbar-logo.is-page-title strong {
  display: block !important;
  line-height: 1.18 !important;
  padding: 2px 0 5px !important;
  margin: 0 !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}
#menu-global-header .topbar-logo strong {
  padding-bottom: 4px !important;
}

#screen-settings .settings-page-shell,
#screen-settings .settings-page-head,
#screen-settings .settings-section-card,
#screen-settings .settings-section-card *,
#screen-settings .setting-row,
#screen-settings .quality-tool-card,
#screen-settings .credits-company-grid article {
  box-sizing: border-box !important;
}
#screen-settings .settings-page-head strong {
  line-height: 1.06 !important;
  padding-bottom: 4px !important;
}
#screen-settings .settings-section-title {
  grid-template-columns: 46px minmax(0, 1fr) !important;
  align-items: center !important;
}
#screen-settings .settings-section-title > div,
#screen-settings .settings-section-title strong,
#screen-settings .settings-section-title span {
  min-width: 0 !important;
  max-width: 100% !important;
}
#screen-settings .settings-section-title strong,
#screen-settings .settings-section-title span,
#screen-settings .quality-tool-card strong,
#screen-settings .quality-tool-card span,
#screen-settings .quality-tool-card em,
#screen-settings .credits-company-grid article strong,
#screen-settings .credits-company-grid article em,
#screen-settings .hint,
#screen-settings .setting-note {
  overflow-wrap: anywhere !important;
  word-break: normal !important;
  white-space: normal !important;
}
#screen-settings .settings-section-title strong {
  overflow: visible !important;
  text-overflow: clip !important;
  line-height: 1.15 !important;
}

/* Setting rows keep the original left icon rail, but content starts after it. */
#screen-settings .setting-row {
  --settings-rail: 58px;
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(118px, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
  min-height: 58px !important;
  padding: 10px 14px 10px calc(var(--settings-rail) + 14px) !important;
  overflow: hidden !important;
}
#screen-settings .setting-row::before,
#screen-settings .setting-row::after {
  width: var(--settings-rail) !important;
}
#screen-settings .setting-row > span {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  align-self: center !important;
}
#screen-settings .settings-section-grid.compact {
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
  gap: 10px !important;
}

/* Inputs/selects use the same visual language as the settings cards, not the orange underline style. */
#screen-settings input[type="text"],
#screen-settings select {
  min-width: 0 !important;
  width: min(100%, 320px) !important;
  height: 38px !important;
  border: 1px solid rgba(191,213,255,.18) !important;
  border-radius: 0 !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.025)),
    rgba(4, 22, 34, .72) !important;
  color: #eaf3ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 0 transparent !important;
  border-bottom-color: rgba(191,213,255,.18) !important;
  outline: none !important;
  padding: 0 12px !important;
  font-weight: 900 !important;
}
#screen-settings select {
  padding-right: 34px !important;
  cursor: pointer !important;
}
#screen-settings input[type="text"]:focus,
#screen-settings select:focus {
  border-color: rgba(156,255,71,.48) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 2px rgba(156,255,71,.10) !important;
}
#screen-settings .language-setting-row {
  display: grid !important;
  grid-template-columns: minmax(118px, 1fr) minmax(190px, 320px) !important;
  justify-content: stretch !important;
}
#screen-settings .language-setting-row select {
  width: 100% !important;
  justify-self: end !important;
}

/* Sound rows: label, slider, value and preview buttons stay aligned without overlapping the icon rail. */
#screen-settings .sound-range-row.sound-test-row {
  --settings-rail: 58px;
  display: grid !important;
  grid-template-columns: minmax(145px, 190px) minmax(160px, 1fr) 58px minmax(180px, auto) !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 58px !important;
  padding: 10px 14px 10px calc(var(--settings-rail) + 14px) !important;
}
#screen-settings .sound-range-row.sound-test-row > span {
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}
#screen-settings .sound-range-row.sound-test-row input[type="range"] {
  width: 100% !important;
  min-width: 0 !important;
}
#screen-settings .sound-range-row.sound-test-row > strong {
  width: 58px !important;
  min-width: 58px !important;
  text-align: right !important;
  white-space: nowrap !important;
}
#screen-settings .sound-inline-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  min-width: 0 !important;
}
#screen-settings .sound-inline-actions .btn {
  min-width: 0 !important;
  min-height: 32px !important;
  height: 32px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

/* Cards generated by controls/performance/accessibility keep readable text and buttons inside their blocks. */
#screen-settings .quality-card-grid {
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)) !important;
}
#screen-settings .quality-summary-grid,
#screen-settings .publisher-checklist-grid,
#screen-settings .credits-company-grid {
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
}
#screen-settings .quality-tool-card {
  display: grid !important;
  grid-template-columns: 50px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 0 !important;
  overflow: hidden !important;
}
#screen-settings .quality-tool-card i {
  grid-column: 1 !important;
  flex: none !important;
}
#screen-settings .quality-tool-card > div {
  grid-column: 2 !important;
  min-width: 0 !important;
  max-width: 100% !important;
}
#screen-settings .quality-tool-card .btn,
#screen-settings .quality-tool-card button {
  grid-column: 3 !important;
  min-width: 86px !important;
  max-width: 130px !important;
  justify-self: end !important;
  white-space: nowrap !important;
}
#screen-settings .credits-company-grid article {
  min-height: 96px !important;
}
#screen-settings .credits-company-grid article strong,
#screen-settings .credits-company-grid article em {
  display: block !important;
  max-width: 100% !important;
  line-height: 1.35 !important;
}
#screen-settings #support-link,
#screen-settings a[href="https://migo.systems"] {
  width: fit-content !important;
  max-width: 100% !important;
}

@media (max-width: 1180px) {
  #screen-settings .sound-range-row.sound-test-row {
    grid-template-columns: minmax(140px, 170px) minmax(140px, 1fr) 56px !important;
  }
  #screen-settings .sound-inline-actions {
    grid-column: 2 / -1 !important;
    justify-content: flex-start !important;
  }
}
@media (max-width: 860px) {
  #screen-settings .settings-section-grid.compact,
  #screen-settings .quality-card-grid,
  #screen-settings .quality-summary-grid,
  #screen-settings .publisher-checklist-grid,
  #screen-settings .credits-company-grid {
    grid-template-columns: 1fr !important;
  }
  #screen-settings .quality-tool-card {
    grid-template-columns: 48px minmax(0, 1fr) !important;
  }
  #screen-settings .quality-tool-card .btn,
  #screen-settings .quality-tool-card button {
    grid-column: 2 !important;
    justify-self: start !important;
    max-width: none !important;
  }
}
@media (max-width: 760px) {
  #screen-settings .setting-row,
  #screen-settings .language-setting-row,
  #screen-settings .sound-range-row.sound-test-row {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 12px 12px 12px calc(var(--settings-rail, 58px) + 12px) !important;
  }
  #screen-settings .setting-row > span,
  #screen-settings .sound-range-row.sound-test-row > span {
    white-space: normal !important;
  }
  #screen-settings .language-setting-row select,
  #screen-settings input[type="text"],
  #screen-settings select {
    width: 100% !important;
    justify-self: stretch !important;
  }
  #screen-settings .sound-range-row.sound-test-row > strong {
    width: auto !important;
    min-width: 0 !important;
    text-align: left !important;
  }
  #screen-settings .sound-inline-actions {
    grid-column: 1 !important;
  }
}

/* v1.25.94 — Settings option cards spacing/readability fix. */
#screen-settings .quality-card-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr)) !important;
  gap: 12px !important;
  background: transparent !important;
  border: 0 !important;
  margin-top: 12px !important;
}
#screen-settings .quality-summary-grid,
#screen-settings .publisher-checklist-grid {
  gap: 10px !important;
  background: transparent !important;
  border: 0 !important;
}
#screen-settings .quality-tool-card {
  min-height: 132px !important;
  height: auto !important;
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr) minmax(96px, auto) !important;
  align-items: stretch !important;
  column-gap: 0 !important;
  row-gap: 0 !important;
  padding: 0 !important;
  border: 1px solid rgba(191, 213, 255, .18) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(156,255,71,.06), transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.022)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 10px 20px rgba(0,0,0,.12) !important;
  overflow: hidden !important;
}
#screen-settings .quality-tool-card + .quality-tool-card {
  margin-top: 0 !important;
}
#screen-settings .quality-tool-card::before {
  width: 4px !important;
  z-index: 1 !important;
}
#screen-settings .quality-tool-card > i {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 58px !important;
  min-width: 58px !important;
  height: 100% !important;
  min-height: 132px !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid rgba(191,213,255,.16) !important;
  background: radial-gradient(circle at 50% 34%, rgba(34,220,255,.22), rgba(255,255,255,.035) 68%, rgba(255,255,255,.015)) !important;
  color: #83ff48 !important;
  font-style: normal !important;
  font-size: 24px !important;
  line-height: 1 !important;
  text-shadow: 0 0 12px rgba(156,255,71,.32) !important;
}
#screen-settings .quality-tool-card > div {
  grid-column: 2 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 16px 16px 14px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 7px !important;
  overflow: hidden !important;
}
#screen-settings .quality-tool-card strong {
  display: block !important;
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
  letter-spacing: 0 !important;
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
}
#screen-settings .quality-tool-card span {
  display: block !important;
  color: rgba(222,236,255,.78) !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
  font-weight: 850 !important;
  max-width: 100% !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  white-space: normal !important;
}
#screen-settings .quality-tool-card em {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 5px !important;
  color: #78ff9c !important;
  font-size: 11px !important;
  line-height: 1.35 !important;
  font-style: normal !important;
  text-transform: none !important;
  letter-spacing: .02em !important;
  white-space: normal !important;
  overflow: visible !important;
}
#screen-settings .quality-tool-card kbd {
  display: inline-grid !important;
  place-items: center !important;
  min-width: 30px !important;
  height: 24px !important;
  padding: 0 8px !important;
  margin: 0 !important;
  border: 1px solid rgba(191,213,255,.22) !important;
  background: rgba(191,213,255,.10) !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 1000 !important;
  letter-spacing: .02em !important;
  line-height: 1 !important;
}
#screen-settings .quality-tool-card .btn,
#screen-settings .quality-tool-card button {
  grid-column: 3 !important;
  align-self: center !important;
  justify-self: end !important;
  margin: 0 14px 0 0 !important;
  min-width: 88px !important;
  max-width: 132px !important;
  min-height: 36px !important;
  height: 36px !important;
  padding: 0 14px !important;
  white-space: nowrap !important;
  font-size: 12px !important;
  line-height: 1 !important;
}
#screen-settings .quality-tool-card.active {
  border-color: rgba(156,255,71,.32) !important;
  background:
    radial-gradient(circle at 0% 0%, rgba(156,255,71,.12), transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.026)) !important;
}
#screen-settings .quality-tool-card.active > i {
  color: #9cff47 !important;
  background: radial-gradient(circle at 50% 34%, rgba(156,255,71,.22), rgba(255,255,255,.04) 70%) !important;
}
@media (max-width: 1180px) {
  #screen-settings .quality-card-grid {
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
  }
  #screen-settings .quality-tool-card {
    grid-template-columns: 56px minmax(0, 1fr) !important;
    min-height: 146px !important;
  }
  #screen-settings .quality-tool-card > i {
    width: 56px !important;
    min-width: 56px !important;
    min-height: 146px !important;
  }
  #screen-settings .quality-tool-card .btn,
  #screen-settings .quality-tool-card button {
    grid-column: 2 !important;
    justify-self: start !important;
    margin: 0 0 14px 16px !important;
  }
  #screen-settings .quality-tool-card > div {
    padding-bottom: 10px !important;
  }
}
@media (max-width: 760px) {
  #screen-settings .quality-card-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  #screen-settings .quality-tool-card {
    grid-template-columns: 52px minmax(0, 1fr) !important;
    min-height: 0 !important;
  }
  #screen-settings .quality-tool-card > i {
    width: 52px !important;
    min-width: 52px !important;
    min-height: 132px !important;
  }
  #screen-settings .quality-tool-card > div {
    padding: 14px 12px 10px 14px !important;
  }
  #screen-settings .quality-tool-card .btn,
  #screen-settings .quality-tool-card button {
    width: calc(100% - 14px) !important;
    max-width: none !important;
    justify-self: stretch !important;
    margin: 0 14px 12px 14px !important;
  }
}


/* v1.25.95 — Settings readability, compact stats and portal-ready company card. */
#screen-settings .settings-page-shell {
  width: min(1320px, calc(100vw - 34px)) !important;
}
#screen-settings .settings-section-card {
  overflow: visible !important;
}
#screen-settings .setting-row,
#screen-settings .language-setting-row,
#screen-settings .sound-range-row.sound-test-row {
  --settings-rail: 68px !important;
  position: relative !important;
  overflow: hidden !important;
  padding-left: calc(var(--settings-rail) + 18px) !important;
}
#screen-settings .setting-row::before,
#screen-settings .setting-row::after {
  width: var(--settings-rail) !important;
  pointer-events: none !important;
}
#screen-settings .setting-row > *,
#screen-settings .sound-range-row.sound-test-row > * {
  position: relative !important;
  z-index: 2 !important;
  min-width: 0 !important;
}
#screen-settings .setting-row > span {
  overflow: visible !important;
  text-overflow: clip !important;
  white-space: normal !important;
  line-height: 1.18 !important;
  padding-right: 6px !important;
}
#screen-settings input[type="text"],
#screen-settings select {
  background: linear-gradient(180deg, rgba(191,213,255,.10), rgba(191,213,255,.045)), rgba(3,20,31,.78) !important;
  border: 1px solid rgba(191,213,255,.22) !important;
  color: #f4f9ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}
#screen-settings select option {
  background: #061523 !important;
  color: #eaf3ff !important;
}
#screen-settings .settings-stat-list,
#screen-settings .quality-summary-grid.settings-stat-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
  gap: 10px !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
#screen-settings .settings-stat-card,
#screen-settings .settings-stat-list > article {
  min-height: 82px !important;
  display: grid !important;
  align-content: center !important;
  gap: 6px !important;
  padding: 14px 16px !important;
  border: 1px solid rgba(191,213,255,.16) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025)) !important;
  box-shadow: inset 4px 0 0 rgba(156,255,71,.50), inset 0 1px 0 rgba(255,255,255,.06) !important;
  overflow: hidden !important;
}
#screen-settings .settings-stat-card span,
#screen-settings .settings-stat-list > article span {
  color: rgba(222,236,255,.68) !important;
  font-size: 11px !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
  letter-spacing: .09em !important;
  font-weight: 950 !important;
  white-space: normal !important;
}
#screen-settings .settings-stat-card strong,
#screen-settings .settings-stat-list > article strong {
  color: #fff !important;
  font-size: 18px !important;
  line-height: 1.1 !important;
  font-weight: 1000 !important;
  white-space: normal !important;
}
#screen-settings .settings-stat-card em,
#screen-settings .settings-stat-list > article em {
  color: #78ff9c !important;
  font-size: 12px !important;
  line-height: 1.25 !important;
  font-style: normal !important;
  font-weight: 850 !important;
  white-space: normal !important;
}
#screen-settings .settings-control-reference,
#screen-settings .publisher-checklist-grid.settings-control-reference {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)) !important;
  gap: 10px !important;
  margin-top: 0 !important;
  background: transparent !important;
  border: 0 !important;
}
#screen-settings .settings-ref-card,
#screen-settings .settings-control-reference > article {
  min-height: 74px !important;
  display: grid !important;
  gap: 6px !important;
  align-content: center !important;
  padding: 13px 15px !important;
  border: 1px solid rgba(191,213,255,.15) !important;
  background: linear-gradient(180deg, rgba(34,220,255,.07), rgba(255,255,255,.025)) !important;
  box-shadow: inset 4px 0 0 rgba(34,220,255,.46) !important;
}
#screen-settings .settings-ref-card strong,
#screen-settings .settings-control-reference > article strong {
  color: #fff !important;
  font-size: 14px !important;
  line-height: 1.18 !important;
  font-weight: 1000 !important;
  white-space: normal !important;
}
#screen-settings .settings-ref-card span,
#screen-settings .settings-control-reference > article span {
  color: #bfe8ff !important;
  font-size: 12px !important;
  line-height: 1.3 !important;
  font-weight: 900 !important;
  white-space: normal !important;
}
#screen-settings .quality-card-grid {
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)) !important;
  gap: 12px !important;
}
#screen-settings .quality-tool-card.settings-choice-card,
#screen-settings .quality-tool-card {
  min-height: 126px !important;
  grid-template-columns: 58px minmax(0, 1fr) minmax(92px, auto) !important;
}
#screen-settings .quality-tool-card > div {
  padding: 14px 14px 13px 15px !important;
  overflow: visible !important;
}
#screen-settings .quality-tool-card span,
#screen-settings .quality-tool-card em {
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
}
#screen-settings .quality-tool-card .btn,
#screen-settings .quality-tool-card button {
  min-width: 88px !important;
  max-width: 124px !important;
}
#screen-settings .clean-company-grid,
#screen-settings .credits-company-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
  gap: 10px !important;
  background: transparent !important;
  border: 0 !important;
}
#screen-settings .credits-company-grid article {
  min-height: 92px !important;
  display: grid !important;
  align-content: center !important;
  gap: 7px !important;
  padding: 14px 16px !important;
  border: 1px solid rgba(191,213,255,.16) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.024)) !important;
  box-shadow: inset 4px 0 0 rgba(156,255,71,.42) !important;
}
#screen-settings .credits-company-grid article span {
  color: rgba(222,236,255,.66) !important;
  font-size: 11px !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  font-weight: 1000 !important;
}
#screen-settings .credits-company-grid article strong {
  color: #fff !important;
  font-size: 16px !important;
  line-height: 1.18 !important;
  font-weight: 1000 !important;
}
#screen-settings .credits-company-grid article em {
  color: #bfe8ff !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
  font-style: normal !important;
  font-weight: 850 !important;
}
#screen-settings .hint:empty,
#screen-settings .settings-section-card[aria-label="Credits and company"] .hint {
  display: none !important;
}
#screen-settings #support-link {
  margin-top: 2px !important;
  width: fit-content !important;
}
@media (max-width: 1180px) {
  #screen-settings .quality-card-grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important; }
  #screen-settings .quality-tool-card.settings-choice-card,
  #screen-settings .quality-tool-card { grid-template-columns: 56px minmax(0, 1fr) !important; }
  #screen-settings .quality-tool-card .btn,
  #screen-settings .quality-tool-card button { grid-column: 2 !important; justify-self: start !important; margin: 0 0 14px 15px !important; }
}
@media (max-width: 760px) {
  #screen-settings .setting-row,
  #screen-settings .language-setting-row,
  #screen-settings .sound-range-row.sound-test-row { --settings-rail: 58px !important; padding-left: calc(var(--settings-rail) + 12px) !important; }
  #screen-settings .settings-stat-list,
  #screen-settings .settings-control-reference,
  #screen-settings .quality-card-grid,
  #screen-settings .credits-company-grid { grid-template-columns: 1fr !important; }
}



/* v1.25.97 — Settings classic layout repair: comfortable 2-column rows, no cramped text. */
#screen-settings .settings-page-shell {
  width: min(1420px, calc(100vw - 34px)) !important;
  max-width: 1420px !important;
}
#screen-settings .settings-section-card {
  padding: 18px !important;
  overflow: visible !important;
}
#screen-settings .settings-section-title {
  margin-bottom: 14px !important;
}

/* General/settings rows: keep the classic card look, but use fewer wider columns. */
#screen-settings .settings-section-grid.compact {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(420px, 1fr)) !important;
  gap: 12px 14px !important;
  background: transparent !important;
  border: 0 !important;
  align-items: stretch !important;
}
#screen-settings .settings-section-grid.compact .setting-row:not(.sound-range-row),
#screen-settings .language-setting-row {
  display: grid !important;
  grid-template-columns: 68px minmax(180px, 1fr) minmax(148px, auto) !important;
  grid-template-rows: 1fr !important;
  align-items: center !important;
  min-height: 68px !important;
  max-width: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 16px 0 0 !important;
  gap: 0 !important;
  overflow: hidden !important;
}
#screen-settings .settings-section-grid.compact .setting-row:not(.sound-range-row)::before,
#screen-settings .settings-section-grid.compact .setting-row:not(.sound-range-row)::after,
#screen-settings .language-setting-row::before,
#screen-settings .language-setting-row::after {
  grid-column: 1 !important;
  grid-row: 1 !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 68px !important;
  height: 100% !important;
  pointer-events: none !important;
}
#screen-settings .settings-section-grid.compact .setting-row:not(.sound-range-row) > span,
#screen-settings .language-setting-row > span {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: center !important;
  display: block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0 18px !important;
  margin: 0 !important;
  color: #fff !important;
  text-align: left !important;
  line-height: 1.15 !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
}
#screen-settings .settings-section-grid.compact .setting-row:not(.sound-range-row) input[type="checkbox"] {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  align-self: center !important;
  width: 42px !important;
  min-width: 42px !important;
  height: 24px !important;
  margin: 0 !important;
}
#screen-settings .settings-section-grid.compact .setting-row:not(.sound-range-row) input[type="text"],
#screen-settings .settings-section-grid.compact .setting-row:not(.sound-range-row) select,
#screen-settings .language-setting-row select {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: stretch !important;
  align-self: center !important;
  width: 100% !important;
  min-width: 170px !important;
  max-width: 280px !important;
  height: 44px !important;
  padding: 0 14px !important;
  border-radius: 0 !important;
  background: linear-gradient(180deg, rgba(191,213,255,.10), rgba(191,213,255,.045)), rgba(3,20,31,.78) !important;
  border: 1px solid rgba(191,213,255,.22) !important;
  color: #f4f9ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}
#screen-settings .language-setting-row {
  width: min(760px, 100%) !important;
  grid-template-columns: 68px minmax(180px, 1fr) minmax(220px, 280px) !important;
}

/* Sound rows stay one full line and keep preview buttons near the relevant slider. */
#screen-settings .sound-range-row.sound-test-row {
  display: grid !important;
  grid-template-columns: 68px minmax(150px, 210px) minmax(180px, 1fr) 64px minmax(230px, auto) !important;
  align-items: center !important;
  gap: 12px !important;
  min-height: 70px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 10px 0 !important;
  padding: 0 16px 0 0 !important;
  overflow: hidden !important;
}
#screen-settings .sound-range-row.sound-test-row::before,
#screen-settings .sound-range-row.sound-test-row::after {
  grid-column: 1 !important;
  grid-row: 1 !important;
  left: 0 !important;
  width: 68px !important;
  height: 100% !important;
}
#screen-settings .sound-range-row.sound-test-row > span {
  grid-column: 2 !important;
  padding: 0 4px 0 18px !important;
  line-height: 1.15 !important;
  white-space: normal !important;
}
#screen-settings .sound-range-row.sound-test-row input[type="range"] {
  grid-column: 3 !important;
  min-width: 150px !important;
  width: 100% !important;
}
#screen-settings .sound-range-row.sound-test-row > strong {
  grid-column: 4 !important;
  min-width: 54px !important;
  text-align: right !important;
  white-space: nowrap !important;
}
#screen-settings .sound-range-row.sound-test-row .sound-inline-actions {
  grid-column: 5 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  min-width: 0 !important;
}
#screen-settings .sound-inline-actions .btn {
  min-width: 74px !important;
  height: 34px !important;
  padding: 0 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

/* Wider, readable option cards for Keyboard, FPS, Accessibility. */
#screen-settings .quality-card-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(420px, 1fr)) !important;
  gap: 14px !important;
  background: transparent !important;
  border: 0 !important;
}
#screen-settings .quality-tool-card.settings-choice-card,
#screen-settings .quality-tool-card {
  min-height: 112px !important;
  display: grid !important;
  grid-template-columns: 64px minmax(0, 1fr) minmax(96px, auto) !important;
  grid-template-rows: 1fr !important;
  align-items: stretch !important;
  overflow: hidden !important;
}
#screen-settings .quality-tool-card > i {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 64px !important;
  min-width: 64px !important;
  height: 100% !important;
}
#screen-settings .quality-tool-card > div {
  grid-column: 2 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
  padding: 14px 16px !important;
  align-self: center !important;
}
#screen-settings .quality-tool-card strong,
#screen-settings .quality-tool-card span,
#screen-settings .quality-tool-card em {
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
}
#screen-settings .quality-tool-card em {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  align-items: center !important;
}
#screen-settings .quality-tool-card .btn,
#screen-settings .quality-tool-card button {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: center !important;
  align-self: center !important;
  min-width: 96px !important;
  max-width: 132px !important;
  height: 38px !important;
  margin: 0 14px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

#screen-settings .settings-stat-list,
#screen-settings .quality-summary-grid.settings-stat-list,
#screen-settings .settings-control-reference,
#screen-settings .publisher-checklist-grid.settings-control-reference {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(280px, 1fr)) !important;
  gap: 12px !important;
  background: transparent !important;
  border: 0 !important;
}
#screen-settings .credits-company-grid,
#screen-settings .clean-company-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(280px, 1fr)) !important;
  gap: 12px !important;
  background: transparent !important;
  border: 0 !important;
}
#screen-settings .settings-ref-card,
#screen-settings .settings-control-reference > article,
#screen-settings .settings-stat-card,
#screen-settings .settings-stat-list > article,
#screen-settings .credits-company-grid article {
  min-width: 0 !important;
  overflow: hidden !important;
}

#screen-settings #support-link,
#screen-settings a.full-link#support-link {
  min-height: 48px !important;
  height: 48px !important;
  padding: 0 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  vertical-align: middle !important;
  line-height: 1 !important;
  text-align: center !important;
}

@media (max-width: 1120px) {
  #screen-settings .settings-section-grid.compact,
  #screen-settings .quality-card-grid,
  #screen-settings .settings-stat-list,
  #screen-settings .quality-summary-grid.settings-stat-list,
  #screen-settings .settings-control-reference,
  #screen-settings .publisher-checklist-grid.settings-control-reference,
  #screen-settings .credits-company-grid,
  #screen-settings .clean-company-grid {
    grid-template-columns: 1fr !important;
  }
  #screen-settings .sound-range-row.sound-test-row {
    grid-template-columns: 68px minmax(150px, 220px) minmax(180px, 1fr) 64px !important;
  }
  #screen-settings .sound-range-row.sound-test-row .sound-inline-actions {
    grid-column: 2 / -1 !important;
    padding-left: 18px !important;
    margin-top: -4px !important;
  }
}
@media (max-width: 760px) {
  #screen-settings .settings-page-shell { width: min(100%, calc(100vw - 18px)) !important; }
  #screen-settings .settings-section-card { padding: 14px !important; }
  #screen-settings .settings-section-grid.compact .setting-row:not(.sound-range-row),
  #screen-settings .language-setting-row {
    grid-template-columns: 58px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    min-height: 88px !important;
    padding: 10px 12px 10px 0 !important;
  }
  #screen-settings .settings-section-grid.compact .setting-row:not(.sound-range-row)::before,
  #screen-settings .settings-section-grid.compact .setting-row:not(.sound-range-row)::after,
  #screen-settings .language-setting-row::before,
  #screen-settings .language-setting-row::after {
    width: 58px !important;
  }
  #screen-settings .settings-section-grid.compact .setting-row:not(.sound-range-row) > span,
  #screen-settings .language-setting-row > span {
    grid-column: 2 !important;
    grid-row: 1 !important;
    padding: 0 0 8px 12px !important;
  }
  #screen-settings .settings-section-grid.compact .setting-row:not(.sound-range-row) input[type="checkbox"],
  #screen-settings .settings-section-grid.compact .setting-row:not(.sound-range-row) input[type="text"],
  #screen-settings .settings-section-grid.compact .setting-row:not(.sound-range-row) select,
  #screen-settings .language-setting-row select {
    grid-column: 2 !important;
    grid-row: 2 !important;
    justify-self: start !important;
    margin-left: 12px !important;
    width: min(100% - 12px, 320px) !important;
  }
  #screen-settings .sound-range-row.sound-test-row {
    grid-template-columns: 58px minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto auto !important;
    padding: 12px 12px 12px 0 !important;
  }
  #screen-settings .sound-range-row.sound-test-row::before,
  #screen-settings .sound-range-row.sound-test-row::after { width: 58px !important; }
  #screen-settings .sound-range-row.sound-test-row > span,
  #screen-settings .sound-range-row.sound-test-row input[type="range"],
  #screen-settings .sound-range-row.sound-test-row > strong,
  #screen-settings .sound-range-row.sound-test-row .sound-inline-actions {
    grid-column: 2 !important;
    padding-left: 12px !important;
    margin-left: 0 !important;
    text-align: left !important;
  }
  #screen-settings .quality-tool-card.settings-choice-card,
  #screen-settings .quality-tool-card {
    grid-template-columns: 58px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
  }
  #screen-settings .quality-tool-card > i { width: 58px !important; min-width: 58px !important; grid-row: 1 / span 2 !important; }
  #screen-settings .quality-tool-card .btn,
  #screen-settings .quality-tool-card button { grid-column: 2 !important; grid-row: 2 !important; justify-self: start !important; margin: 0 0 14px 16px !important; }
}


/* v1.25.98 — Settings General returns to clean 3-column layout; Language moved into General. */
#screen-settings .settings-section-card[aria-label="Language settings"] {
  display: none !important;
}
#screen-settings .settings-section-card[aria-label="General settings"] .settings-section-grid.compact {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(330px, 1fr)) !important;
  gap: 12px 14px !important;
  align-items: stretch !important;
}
#screen-settings .settings-section-card[aria-label="General settings"] .setting-row,
#screen-settings .settings-section-card[aria-label="General settings"] .language-setting-row {
  display: grid !important;
  grid-template-columns: 68px minmax(118px, 1fr) minmax(112px, auto) !important;
  min-height: 68px !important;
  width: 100% !important;
  padding: 0 14px 0 0 !important;
  gap: 0 !important;
  align-items: center !important;
  overflow: hidden !important;
}
#screen-settings .settings-section-card[aria-label="General settings"] .setting-row::before,
#screen-settings .settings-section-card[aria-label="General settings"] .setting-row::after {
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 68px !important;
  height: 100% !important;
}
#screen-settings .settings-section-card[aria-label="General settings"] .setting-row > span {
  grid-column: 2 !important;
  grid-row: 1 !important;
  min-width: 0 !important;
  max-width: 100% !important;
  padding: 0 14px 0 18px !important;
  margin: 0 !important;
  line-height: 1.16 !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
  align-self: center !important;
}
#screen-settings .settings-section-card[aria-label="General settings"] .setting-row input[type="checkbox"] {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: end !important;
  align-self: center !important;
  width: 42px !important;
  min-width: 42px !important;
  height: 24px !important;
  margin: 0 !important;
}
#screen-settings .settings-section-card[aria-label="General settings"] .setting-row input[type="text"],
#screen-settings .settings-section-card[aria-label="General settings"] .setting-row select {
  grid-column: 3 !important;
  grid-row: 1 !important;
  justify-self: stretch !important;
  align-self: center !important;
  width: min(100%, 250px) !important;
  min-width: 150px !important;
  max-width: 250px !important;
  height: 40px !important;
}
#screen-settings .settings-section-card[aria-label="General settings"] .language-setting-row {
  width: 100% !important;
}
@media (max-width: 1320px) {
  #screen-settings .settings-section-card[aria-label="General settings"] .settings-section-grid.compact {
    grid-template-columns: repeat(2, minmax(330px, 1fr)) !important;
  }
}
@media (max-width: 860px) {
  #screen-settings .settings-section-card[aria-label="General settings"] .settings-section-grid.compact {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 760px) {
  #screen-settings .settings-section-card[aria-label="General settings"] .setting-row,
  #screen-settings .settings-section-card[aria-label="General settings"] .language-setting-row {
    grid-template-columns: 58px minmax(0, 1fr) !important;
    grid-template-rows: auto auto !important;
    min-height: 88px !important;
    padding: 10px 12px 10px 0 !important;
  }
  #screen-settings .settings-section-card[aria-label="General settings"] .setting-row::before,
  #screen-settings .settings-section-card[aria-label="General settings"] .setting-row::after {
    width: 58px !important;
  }
  #screen-settings .settings-section-card[aria-label="General settings"] .setting-row > span {
    grid-column: 2 !important;
    grid-row: 1 !important;
    padding: 0 0 8px 12px !important;
  }
  #screen-settings .settings-section-card[aria-label="General settings"] .setting-row input[type="checkbox"],
  #screen-settings .settings-section-card[aria-label="General settings"] .setting-row input[type="text"],
  #screen-settings .settings-section-card[aria-label="General settings"] .setting-row select {
    grid-column: 2 !important;
    grid-row: 2 !important;
    justify-self: start !important;
    margin-left: 12px !important;
    width: min(100% - 12px, 320px) !important;
    max-width: 320px !important;
  }
}


/* v1.25.99 — Settings: 4-column stat/reference/company blocks on wide screens. */
#screen-settings #control-summary.settings-stat-list,
#screen-settings #performance-summary.settings-stat-list,
#screen-settings #accessibility-summary.settings-stat-list,
#screen-settings #control-reference.settings-control-reference,
#screen-settings .credits-company-grid.clean-company-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 12px !important;
  width: 100% !important;
  background: transparent !important;
  border: 0 !important;
}

#screen-settings #control-summary .settings-stat-card,
#screen-settings #performance-summary .settings-stat-card,
#screen-settings #accessibility-summary .settings-stat-card,
#screen-settings #control-reference .settings-ref-card,
#screen-settings .credits-company-grid.clean-company-grid article {
  min-width: 0 !important;
  width: 100% !important;
  min-height: 86px !important;
  overflow: hidden !important;
}

#screen-settings #control-summary .settings-stat-card span,
#screen-settings #control-summary .settings-stat-card strong,
#screen-settings #control-summary .settings-stat-card em,
#screen-settings #performance-summary .settings-stat-card span,
#screen-settings #performance-summary .settings-stat-card strong,
#screen-settings #performance-summary .settings-stat-card em,
#screen-settings #accessibility-summary .settings-stat-card span,
#screen-settings #accessibility-summary .settings-stat-card strong,
#screen-settings #accessibility-summary .settings-stat-card em,
#screen-settings #control-reference .settings-ref-card strong,
#screen-settings #control-reference .settings-ref-card span,
#screen-settings .credits-company-grid.clean-company-grid article span,
#screen-settings .credits-company-grid.clean-company-grid article strong,
#screen-settings .credits-company-grid.clean-company-grid article em {
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  hyphens: none !important;
}

@media (max-width: 1320px) {
  #screen-settings #control-summary.settings-stat-list,
  #screen-settings #performance-summary.settings-stat-list,
  #screen-settings #accessibility-summary.settings-stat-list,
  #screen-settings #control-reference.settings-control-reference,
  #screen-settings .credits-company-grid.clean-company-grid {
    grid-template-columns: repeat(2, minmax(260px, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  #screen-settings #control-summary.settings-stat-list,
  #screen-settings #performance-summary.settings-stat-list,
  #screen-settings #accessibility-summary.settings-stat-list,
  #screen-settings #control-reference.settings-control-reference,
  #screen-settings .credits-company-grid.clean-company-grid {
    grid-template-columns: 1fr !important;
  }
}

/* v1.26.1 — Premium Shop + Missions only.
   Header/topbar and all other content pages keep the previous BerriGo layout. */
:root {
  --v126-panel: rgba(25, 36, 49, .92);
  --v126-panel-2: rgba(35, 48, 63, .92);
  --v126-line: rgba(191, 213, 255, .22);
  --v126-line-strong: rgba(224, 238, 255, .38);
  --v126-text: #f5f9ff;
  --v126-muted: rgba(215, 230, 255, .74);
  --v126-green: #67ff28;
  --v126-cyan: #11ddff;
  --v126-gold: #ffd119;
  --v126-red: #ff596c;
  --v126-blue: #a8c5ff;
}

/* Premium SHOP: left category rail, cinematic resource stage, larger product/resource tiles. */
#screen-shop.screen.content-screen.active {
  --shop-accent: var(--v126-gold);
  --shop-glow: rgba(255, 161, 23, .24);
  --shop-stage-symbol: "♕";
  --shop-accent-rgb: 255, 209, 25;
  display: grid !important;
  grid-template-columns: minmax(270px, 356px) minmax(0, 1fr) !important;
  grid-template-rows: auto auto 1fr !important;
  gap: 16px 24px !important;
  align-items: start !important;
  min-height: 100dvh !important;
  padding: calc(var(--topbar-h, 86px) + 26px) clamp(18px, 3vw, 34px) 34px !important;
  overflow-y: auto !important;
  background:
    radial-gradient(circle at 39% 42%, var(--shop-glow), transparent 34%),
    radial-gradient(circle at 72% 17%, rgba(17,221,255,.11), transparent 31%),
    linear-gradient(90deg, rgba(9, 39, 55, .84), rgba(1, 7, 12, .98) 64%) !important;
}
#screen-shop.screen.content-screen.active[data-shop-theme="crystals"] { --shop-accent: var(--v126-cyan); --shop-accent-rgb: 17, 221, 255; --shop-glow: rgba(17, 221, 255, .25); --shop-stage-symbol: "◆"; }
#screen-shop.screen.content-screen.active[data-shop-theme="rubies"] { --shop-accent: var(--v126-red); --shop-accent-rgb: 255, 89, 108; --shop-glow: rgba(255, 89, 108, .22); --shop-stage-symbol: "♦"; }
#screen-shop.screen.content-screen.active[data-shop-theme="stars"] { --shop-accent: var(--v126-gold); --shop-accent-rgb: 255, 209, 25; --shop-glow: rgba(255, 209, 25, .24); --shop-stage-symbol: "★"; }
#screen-shop.screen.content-screen.active[data-shop-theme="showcase"] { --shop-accent: var(--v126-green); --shop-accent-rgb: 103, 255, 40; --shop-glow: rgba(103, 255, 40, .18); --shop-stage-symbol: "⚙"; }
#screen-shop.screen.content-screen.active[data-shop-theme="keys"] { --shop-accent: #d2b0ff; --shop-accent-rgb: 210, 176, 255; --shop-glow: rgba(210, 176, 255, .20); --shop-stage-symbol: "🗝"; }
#screen-shop.screen.content-screen.active[data-shop-theme="promocodes"] { --shop-accent: var(--v126-green); --shop-accent-rgb: 103, 255, 40; --shop-glow: rgba(103, 255, 40, .20); --shop-stage-symbol: "%"; }
#screen-shop.screen.content-screen.active::before {
  content: "" !important;
  position: fixed !important;
  inset: var(--topbar-h, 86px) 0 0 !important;
  pointer-events: none !important;
  z-index: 0 !important;
  background:
    radial-gradient(ellipse at 37% 38%, rgba(var(--shop-accent-rgb), .28), transparent 22%),
    radial-gradient(ellipse at 36% 58%, rgba(255, 90, 18, .16), transparent 30%),
    radial-gradient(ellipse at 23% 24%, rgba(16, 221, 255, .10), transparent 23%),
    repeating-linear-gradient(135deg, transparent 0 44px, rgba(255,255,255,.025) 45px 47px) !important;
  filter: saturate(1.08) !important;
}
#screen-shop.screen.content-screen.active::after {
  content: var(--shop-stage-symbol) !important;
  position: fixed !important;
  left: clamp(360px, 40vw, 760px) !important;
  top: 34% !important;
  transform: translate(-50%, -50%) rotate(-5deg) !important;
  z-index: 0 !important;
  pointer-events: none !important;
  font-size: min(33vw, 430px) !important;
  color: rgba(var(--shop-accent-rgb), .18) !important;
  text-shadow: 0 0 82px rgba(var(--shop-accent-rgb), .22) !important;
  opacity: .92 !important;
}
#screen-shop > .hint { display: none !important; }
#screen-shop.screen.content-screen.active > * { position: relative !important; z-index: 1 !important; }
#screen-shop .shop-overview-card {
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 100% !important;
  min-height: 74px !important;
  margin: 0 !important;
  border-radius: 10px !important;
  border: 1px solid rgba(191,213,255,.18) !important;
  background:
    linear-gradient(90deg, rgba(var(--shop-accent-rgb), .15), rgba(7, 18, 29, .78)),
    linear-gradient(180deg, rgba(28, 41, 55, .88), rgba(7, 18, 29, .76)) !important;
  color: var(--v126-text) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 20px 42px rgba(0,0,0,.22) !important;
}
#screen-shop .shop-overview-card i { color: var(--shop-accent) !important; text-shadow: 0 0 18px rgba(var(--shop-accent-rgb), .58) !important; }
#screen-shop .shop-overview-card strong { color: #fff !important; }
#screen-shop .shop-overview-card span { color: rgba(235,245,255,.74) !important; }
#screen-shop .shop-economy-bar {
  grid-column: 2 !important;
  grid-row: 2 !important;
  width: 100% !important;
  margin: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(118px, 1fr)) !important;
  gap: 8px !important;
}
#screen-shop .economy-tile {
  min-height: 64px !important;
  border-radius: 9px !important;
  border: 1px solid rgba(191,213,255,.16) !important;
  background: linear-gradient(180deg, rgba(30, 43, 58, .82), rgba(14, 26, 39, .78)) !important;
  padding: 9px 11px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 26px rgba(0,0,0,.18) !important;
}
#screen-shop .shop-category-strip {
  grid-column: 1 !important;
  grid-row: 1 / span 3 !important;
  position: sticky !important;
  top: calc(var(--topbar-h, 86px) + 18px) !important;
  width: 100% !important;
  height: calc(100dvh - var(--topbar-h, 86px) - 52px) !important;
  margin: 0 !important;
  padding: 18px 14px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  overflow-y: auto !important;
  border-radius: 12px !important;
  border: 1px solid rgba(191,213,255,.13) !important;
  background: linear-gradient(180deg, rgba(11, 23, 35, .84), rgba(4, 12, 21, .68)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 20px 40px rgba(0,0,0,.26) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
}
#screen-shop .shop-category-strip::-webkit-scrollbar,
#screen-quest-board .quest-grid::-webkit-scrollbar { width: 8px !important; height: 8px !important; }
#screen-shop .shop-category-strip::-webkit-scrollbar-track,
#screen-quest-board .quest-grid::-webkit-scrollbar-track { background: rgba(255,255,255,.08) !important; border-radius: 20px !important; }
#screen-shop .shop-category-strip::-webkit-scrollbar-thumb,
#screen-quest-board .quest-grid::-webkit-scrollbar-thumb { background: linear-gradient(180deg, #5c6d78, #9ba8b0) !important; border-radius: 20px !important; }
#screen-shop .premium-shop-nav-item {
  min-height: 52px !important;
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  grid-template-rows: auto auto !important;
  align-items: center !important;
  gap: 1px 10px !important;
  padding: 8px 12px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  color: #fff !important;
  text-align: left !important;
  background: transparent !important;
  font-weight: 1000 !important;
  cursor: pointer !important;
}
#screen-shop .premium-shop-nav-item i { grid-row: 1 / span 2 !important; color: #fff !important; font-style: normal !important; font-size: 20px !important; text-align:center !important; }
#screen-shop .premium-shop-nav-item span { color:#fff !important; font-size:13px !important; text-transform:uppercase !important; letter-spacing:.02em !important; }
#screen-shop .premium-shop-nav-item small { color: rgba(226,238,255,.62) !important; font-weight: 800 !important; font-size: 10px !important; }
#screen-shop .premium-shop-nav-item:hover,
#screen-shop .premium-shop-nav-item.active {
  border-color: rgba(var(--shop-accent-rgb), .34) !important;
  background: linear-gradient(90deg, rgba(var(--shop-accent-rgb), .22), rgba(var(--shop-accent-rgb), .08), transparent) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 0 22px rgba(var(--shop-accent-rgb), .16) !important;
}
#screen-shop .premium-shop-nav-item:hover span,
#screen-shop .premium-shop-nav-item.active span,
#screen-shop .premium-shop-nav-item:hover i,
#screen-shop .premium-shop-nav-item.active i { color: var(--shop-accent) !important; }
#screen-shop .shop-grid {
  grid-column: 2 !important;
  grid-row: 3 !important;
  width: 100% !important;
  margin: 0 !important;
  display: block !important;
  padding-bottom: 34px !important;
}
#screen-shop .premium-shop-section {
  width: 100% !important;
  margin: 0 0 18px !important;
  scroll-margin-top: calc(var(--topbar-h, 86px) + 18px) !important;
}
#screen-shop .shop-section-title {
  min-height: 46px !important;
  margin: 0 0 10px !important;
  padding: 0 6px !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: end !important;
  color: #fff !important;
}
#screen-shop .shop-section-title strong { font-size: 22px !important; line-height: 1 !important; text-transform: uppercase !important; letter-spacing: -.03em !important; }
#screen-shop .shop-section-title span { color: var(--v126-muted) !important; font-size: 12px !important; font-weight: 900 !important; }
#screen-shop .shop-grid-row {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(190px, 1fr)) !important;
  gap: 12px !important;
}
#screen-shop .v126-shop-tile {
  min-height: 244px !important;
  padding: 12px !important;
  display: grid !important;
  grid-template-rows: auto 1fr auto auto !important;
  gap: 8px !important;
  border-radius: 12px !important;
  border: 1px solid rgba(224,238,255,.24) !important;
  background: linear-gradient(180deg, rgba(44, 53, 62, .94), rgba(32, 42, 51, .94)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 18px 34px rgba(0,0,0,.25) !important;
  overflow: hidden !important;
}
#screen-shop .v126-shop-tile::before,
#screen-shop .v126-shop-tile::after { display: none !important; }
#screen-shop .v126-shop-tile:hover { transform: translateY(-3px) !important; border-color: rgba(255,255,255,.46) !important; background: linear-gradient(180deg, rgba(55, 67, 77, .96), rgba(35, 47, 58, .96)) !important; }
#screen-shop .shop-tile-head { display:flex !important; align-items:flex-start !important; justify-content:space-between !important; gap:10px !important; min-height:40px !important; }
#screen-shop .shop-tile-head strong { color:#fff !important; font-size:18px !important; line-height:1.05 !important; text-transform:uppercase !important; letter-spacing:-.03em !important; }
#screen-shop .shop-tile-head em { color: var(--v126-gold) !important; background: rgba(0,0,0,.20) !important; border-radius: 5px !important; padding: 4px 6px !important; font-size: 10px !important; font-style: normal !important; font-weight: 1000 !important; white-space: nowrap !important; }
#screen-shop .shop-tile-art {
  min-height: 92px !important;
  display: grid !important;
  place-items: center !important;
  color: var(--shop-accent) !important;
  filter: drop-shadow(0 12px 22px rgba(0,0,0,.42)) !important;
}
#screen-shop .shop-tile-art .shop-emoji-icon { font-size: clamp(44px, 5vw, 74px) !important; line-height: 1 !important; }
#screen-shop .shop-tile-art .shop-currency-icon { width: clamp(56px, 6vw, 88px) !important; height: clamp(56px, 6vw, 88px) !important; stroke-width: 1.6 !important; }
#screen-shop .v126-shop-tile p { min-height: 42px !important; margin: 0 !important; color: rgba(234,243,255,.72) !important; font-size: 12px !important; font-weight: 800 !important; line-height: 1.35 !important; }
#screen-shop .shop-tile-bonus { color: var(--v126-green) !important; font-size: 12px !important; }
#screen-shop .shop-tile-buy { display: flex !important; align-items:center !important; justify-content:space-between !important; gap:10px !important; }
#screen-shop .shop-tile-buy .cost { border: 0 !important; background: transparent !important; color: var(--v126-gold) !important; padding:0 !important; font-size: 13px !important; }
#screen-shop .shop-tile-buy .btn { min-height: 36px !important; padding: 7px 11px !important; font-size: 11px !important; }
#screen-shop .v126-shop-tile[data-shop-category="Crystals"] .shop-tile-art,
#screen-shop .v126-shop-tile[data-currency="crystal"] { color: var(--v126-cyan) !important; }
#screen-shop .v126-shop-tile[data-shop-category="Stars"] .shop-tile-art,
#screen-shop .v126-shop-tile[data-currency="star"] { color: var(--v126-gold) !important; }
#screen-shop .v126-shop-tile[data-shop-category="Rubies"] .shop-tile-art,
#screen-shop .v126-shop-tile[data-currency="ruby"] { color: var(--v126-red) !important; }

/* Premium MISSIONS: season cards and compact progress rows. */
#screen-quest-board.screen.content-screen.active {
  display: grid !important;
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 18px !important;
  align-items: stretch !important;
  min-height: 100dvh !important;
  padding: calc(var(--topbar-h, 86px) + 26px) clamp(18px, 3vw, 34px) 34px !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 48% -8%, rgba(168,197,255,.20), transparent 26%),
    radial-gradient(circle at 14% 30%, rgba(16,221,255,.10), transparent 34%),
    linear-gradient(180deg, rgba(4, 13, 22, .98), rgba(0, 5, 10, .98)) !important;
}
#screen-quest-board > .hint { display: none !important; }
#screen-quest-board.screen.content-screen.active > * { position: relative !important; z-index: 1 !important; }
#screen-quest-board::before {
  content:"" !important;
  position: fixed !important;
  inset: var(--topbar-h, 86px) 0 0 !important;
  pointer-events:none !important;
  background:
    radial-gradient(ellipse at 24% 35%, rgba(103,255,40,.15), transparent 30%),
    radial-gradient(ellipse at 60% 44%, rgba(17,221,255,.10), transparent 34%),
    repeating-linear-gradient(90deg, transparent 0 96px, rgba(255,255,255,.02) 97px 98px) !important;
  z-index: 0 !important;
}
#screen-quest-board .mission-category-deck {
  width: min(1560px, 100%) !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(168px, 1fr)) !important;
  gap: 10px !important;
  z-index: 1 !important;
}
#screen-quest-board .mission-season-card {
  min-height: 220px !important;
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  padding: 18px !important;
  overflow: hidden !important;
  border-radius: 10px !important;
  border: 1px solid rgba(191,213,255,.18) !important;
  background: linear-gradient(180deg, rgba(30, 48, 68, .78), rgba(4, 15, 25, .84)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 20px 40px rgba(0,0,0,.24) !important;
}
#screen-quest-board .mission-season-card::before {
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(255,255,255,.10), transparent 28%),
    linear-gradient(180deg, rgba(0,0,0,.04), rgba(0,0,0,.38)) !important;
  opacity:.9 !important;
}
#screen-quest-board .mission-season-card::after {
  content:"★" !important;
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  transform:translate(-50%,-50%) rotate(-12deg) !important;
  font-size: min(13vw, 170px) !important;
  color: rgba(255,255,255,.11) !important;
}
#screen-quest-board .mission-season-card.is-daily::after { content:"◆" !important; color: rgba(17,221,255,.16) !important; }
#screen-quest-board .mission-season-card.is-weekly::after { content:"⚡" !important; color: rgba(103,255,40,.16) !important; }
#screen-quest-board .mission-season-card.is-special::after { content:"✦" !important; color: rgba(255,209,25,.16) !important; }
#screen-quest-board .mission-season-card.is-mastery::after { content:"♕" !important; color: rgba(168,197,255,.14) !important; }
#screen-quest-board .mission-season-card.selected { border-color: rgba(103,255,40,.82) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 0 0 2px rgba(103,255,40,.10), 0 24px 46px rgba(0,0,0,.30) !important; }
#screen-quest-board .mission-season-card b,
#screen-quest-board .mission-season-card strong,
#screen-quest-board .mission-season-card span,
#screen-quest-board .mission-season-card em { position:relative !important; z-index:1 !important; }
#screen-quest-board .mission-season-card b {
  width: 28px !important;
  height: 28px !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 auto !important;
  border-radius: 50% !important;
  background: var(--v126-green) !important;
  color:#06140a !important;
  font-weight:1000 !important;
}
#screen-quest-board .mission-season-card strong { text-align:center !important; color:#fff !important; font-size:20px !important; text-transform:uppercase !important; }
#screen-quest-board .mission-season-card span { text-align:center !important; color:rgba(235,245,255,.86) !important; font-size:12px !important; font-weight:900 !important; }
#screen-quest-board .mission-season-card em { text-align:center !important; color:var(--v126-gold) !important; font-style:normal !important; font-weight:1000 !important; }
#screen-quest-board .quest-grid {
  width: min(920px, 100%) !important;
  max-height: calc(100dvh - var(--topbar-h, 86px) - 296px) !important;
  margin: 0 auto !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 7px !important;
  overflow-y: auto !important;
  padding-right: 8px !important;
  z-index: 1 !important;
}
#screen-quest-board .mission-row {
  min-height: 86px !important;
  display: grid !important;
  grid-template-columns: 58px minmax(0, 1fr) minmax(150px, 188px) !important;
  gap: 12px !important;
  align-items: center !important;
  padding: 10px 14px 10px 0 !important;
  border-radius: 8px !important;
  border: 1px solid rgba(191,213,255,.16) !important;
  background: linear-gradient(180deg, rgba(48, 65, 84, .92), rgba(37, 54, 72, .92)) !important;
  color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 8px 20px rgba(0,0,0,.18) !important;
}
#screen-quest-board .mission-row::before,
#screen-quest-board .mission-row::after { display: none !important; }
#screen-quest-board .mission-row.ready { background: linear-gradient(180deg, rgba(31, 82, 47, .92), rgba(24, 58, 37, .92)) !important; }
#screen-quest-board .mission-row.claimed { opacity: .82 !important; }
#screen-quest-board .mission-icon {
  width: 58px !important;
  height: 100% !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid rgba(191,213,255,.15) !important;
  color: #cfe0ff !important;
  font-size: 24px !important;
  font-style: normal !important;
  text-shadow: 0 0 14px rgba(168,197,255,.24) !important;
}
#screen-quest-board .mission-row.ready .mission-icon { color: var(--v126-green) !important; }
#screen-quest-board .mission-copy { min-width: 0 !important; }
#screen-quest-board .mission-copy strong { display:block !important; color:#fff !important; font-size:16px !important; line-height:1.15 !important; margin-bottom: 4px !important; }
#screen-quest-board .mission-copy span { display:block !important; color: rgba(235,245,255,.82) !important; font-size: 12px !important; font-weight: 800 !important; line-height:1.25 !important; }
#screen-quest-board .mission-progress {
  height: 5px !important;
  margin-top: 8px !important;
  background: rgba(103,255,40,.22) !important;
  border-radius: 0 !important;
  overflow: hidden !important;
}
#screen-quest-board .mission-progress b {
  display:block !important;
  height:100% !important;
  width: var(--mission-progress) !important;
  background: linear-gradient(90deg, #67ff28, #ffd119) !important;
  box-shadow: 0 0 14px rgba(103,255,40,.54) !important;
}
#screen-quest-board .mission-reward { display: grid !important; justify-items:end !important; gap: 4px !important; }
#screen-quest-board .mission-reward em { color: #cfe0ff !important; font-size:14px !important; font-style:normal !important; font-weight:1000 !important; }
#screen-quest-board .mission-row.ready .mission-reward em { color: var(--v126-green) !important; }
#screen-quest-board .mission-reward small { color: var(--v126-gold) !important; font-size:11px !important; font-weight:1000 !important; }
#screen-quest-board .mission-reward .btn { min-height: 30px !important; padding: 5px 10px !important; font-size: 10px !important; }

@media (max-width: 1240px) {
  #screen-shop .shop-grid-row { grid-template-columns: repeat(2, minmax(188px, 1fr)) !important; }
  #screen-quest-board .mission-category-deck { grid-template-columns: repeat(3, minmax(168px, 1fr)) !important; }
  #screen-quest-board .quest-grid { max-height: none !important; overflow-y: visible !important; }
  #screen-quest-board.screen.content-screen.active { overflow-y: auto !important; }
}
@media (max-width: 940px) {
  #screen-shop.screen.content-screen.active { grid-template-columns: 1fr !important; overflow-y: auto !important; }
  #screen-shop .shop-category-strip { grid-column: 1 !important; grid-row: 1 !important; position: relative !important; top: auto !important; height: auto !important; max-height: 230px !important; }
  #screen-shop .shop-overview-card,
  #screen-shop .shop-economy-bar,
  #screen-shop .shop-grid { grid-column: 1 !important; }
  #screen-shop .shop-economy-bar { grid-template-columns: repeat(2, minmax(120px, 1fr)) !important; }
  #screen-shop .shop-grid-row { grid-template-columns: 1fr !important; }
  #screen-quest-board .mission-category-deck { grid-template-columns: 1fr !important; }
  #screen-quest-board .mission-season-card { min-height: 128px !important; }
  #screen-quest-board .mission-row { grid-template-columns: 48px minmax(0, 1fr) !important; }
  #screen-quest-board .mission-icon { width: 48px !important; }
  #screen-quest-board .mission-reward { grid-column: 2 !important; justify-items:start !important; grid-template-columns: auto auto auto !important; align-items:center !important; }
}
@media (max-width: 560px) {
  #screen-shop.screen.content-screen.active,
  #screen-quest-board.screen.content-screen.active { padding-left: 10px !important; padding-right: 10px !important; }
  #screen-shop .shop-economy-bar { grid-template-columns: 1fr !important; }
}

/* v1.26.2 — Shop + Missions aligned with the main BerriGo style.
   Straight edges, transparent glass panels and calmer page backgrounds. */
:root {
  --v1262-glass: rgba(8, 18, 31, .58);
  --v1262-glass-strong: rgba(12, 27, 44, .72);
  --v1262-card: rgba(18, 34, 51, .62);
  --v1262-card-hover: rgba(24, 44, 64, .76);
  --v1262-line: rgba(199, 222, 255, .18);
  --v1262-line-strong: rgba(224, 240, 255, .35);
  --v1262-text: #f7fbff;
  --v1262-muted: rgba(217, 232, 255, .72);
  --v1262-soft: rgba(217, 232, 255, .50);
}

#screen-shop.screen.content-screen.active,
#screen-quest-board.screen.content-screen.active {
  color: var(--v1262-text) !important;
  background:
    radial-gradient(circle at 18% 8%, rgba(103,255,40,.10), transparent 26%),
    radial-gradient(circle at 84% 12%, rgba(17,221,255,.10), transparent 30%),
    linear-gradient(180deg, rgba(3, 10, 18, .72), rgba(1, 7, 13, .82)) !important;
}

#screen-shop.screen.content-screen.active::before,
#screen-quest-board.screen.content-screen.active::before {
  content: "" !important;
  position: fixed !important;
  inset: var(--topbar-h, 86px) 0 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255,255,255,.035) 1px, transparent 1px),
    radial-gradient(circle at 50% 36%, rgba(var(--shop-accent-rgb, 103, 255, 40), .12), transparent 38%) !important;
  background-size: 74px 74px, 74px 74px, 100% 100% !important;
  opacity: .58 !important;
  filter: none !important;
}

#screen-shop.screen.content-screen.active::after,
#screen-quest-board.screen.content-screen.active::after {
  display: none !important;
  content: none !important;
}

/* SHOP — transparent, straight-edged layout. */
#screen-shop.screen.content-screen.active {
  grid-template-columns: minmax(238px, 302px) minmax(0, 1fr) !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  gap: 14px 18px !important;
  padding: calc(var(--topbar-h, 86px) + 22px) clamp(14px, 2.5vw, 30px) 30px !important;
}

#screen-shop .shop-overview-card,
#screen-shop .shop-category-strip,
#screen-shop .economy-tile,
#screen-shop .shop-section-title,
#screen-shop .v126-shop-tile,
#screen-shop .premium-shop-nav-item,
#screen-shop .shop-tile-head em,
#screen-shop .shop-tile-buy .btn,
#screen-shop .shop-tile-buy .cost,
#screen-shop .btn,
#screen-shop .cost {
  border-radius: 0 !important;
}

#screen-shop .shop-overview-card {
  min-height: 70px !important;
  border: 1px solid var(--v1262-line) !important;
  background:
    linear-gradient(90deg, rgba(var(--shop-accent-rgb, 255, 209, 25), .13), transparent 42%),
    linear-gradient(180deg, var(--v1262-glass-strong), rgba(8,18,31,.48)) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  backdrop-filter: blur(14px) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 16px 36px rgba(0,0,0,.22) !important;
}

#screen-shop .shop-category-strip {
  top: calc(var(--topbar-h, 86px) + 16px) !important;
  height: calc(100dvh - var(--topbar-h, 86px) - 46px) !important;
  padding: 12px !important;
  gap: 6px !important;
  border: 1px solid var(--v1262-line) !important;
  background:
    linear-gradient(180deg, rgba(10, 21, 35, .64), rgba(5, 13, 23, .44)) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.1) !important;
  backdrop-filter: blur(14px) saturate(1.1) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 18px 38px rgba(0,0,0,.24) !important;
}

#screen-shop .premium-shop-nav-item {
  min-height: 50px !important;
  padding: 8px 10px !important;
  border: 1px solid transparent !important;
  border-left: 3px solid transparent !important;
  background: rgba(255,255,255,.025) !important;
  box-shadow: none !important;
}

#screen-shop .premium-shop-nav-item:hover,
#screen-shop .premium-shop-nav-item.active {
  border-color: rgba(var(--shop-accent-rgb, 255, 209, 25), .38) !important;
  border-left-color: var(--shop-accent) !important;
  background: linear-gradient(90deg, rgba(var(--shop-accent-rgb, 255, 209, 25), .18), rgba(255,255,255,.035)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09) !important;
  transform: none !important;
}

#screen-shop .premium-shop-nav-item i,
#screen-shop .premium-shop-nav-item.active i,
#screen-shop .premium-shop-nav-item:hover i {
  color: var(--shop-accent) !important;
  text-shadow: 0 0 14px rgba(var(--shop-accent-rgb, 255, 209, 25), .34) !important;
}

#screen-shop .shop-economy-bar {
  gap: 8px !important;
}

#screen-shop .economy-tile {
  min-height: 62px !important;
  border: 1px solid var(--v1262-line) !important;
  background:
    linear-gradient(90deg, rgba(var(--shop-accent-rgb, 103, 255, 40), .075), transparent 70%),
    linear-gradient(180deg, rgba(20, 36, 55, .58), rgba(7, 18, 31, .44)) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075), 0 10px 22px rgba(0,0,0,.16) !important;
}

#screen-shop .shop-section-title {
  min-height: 42px !important;
  padding: 0 0 8px !important;
  border-bottom: 1px solid rgba(199, 222, 255, .14) !important;
  background: transparent !important;
  box-shadow: none !important;
}

#screen-shop .shop-section-title strong {
  color: #fff !important;
  font-size: clamp(18px, 1.5vw, 24px) !important;
  letter-spacing: .01em !important;
}

#screen-shop .shop-section-title span {
  color: var(--v1262-muted) !important;
}

#screen-shop .shop-grid-row {
  gap: 10px !important;
  grid-template-columns: repeat(auto-fit, minmax(238px, 1fr)) !important;
}

#screen-shop .v126-shop-tile {
  min-height: 228px !important;
  padding: 12px !important;
  border: 1px solid var(--v1262-line) !important;
  background:
    linear-gradient(135deg, rgba(var(--shop-accent-rgb, 255, 209, 25), .075), transparent 45%),
    linear-gradient(180deg, var(--v1262-card), rgba(9, 20, 34, .54)) !important;
  -webkit-backdrop-filter: blur(13px) saturate(1.08) !important;
  backdrop-filter: blur(13px) saturate(1.08) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 14px 32px rgba(0,0,0,.22) !important;
  transform: none !important;
}

#screen-shop .v126-shop-tile::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 76% 42%, rgba(var(--shop-accent-rgb, 255, 209, 25), .16), transparent 26%),
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px) !important;
  background-size: 100% 100%, 36px 36px !important;
  opacity: .68 !important;
}

#screen-shop .v126-shop-tile::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 3px !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background: var(--shop-accent) !important;
  opacity: .82 !important;
}

#screen-shop .v126-shop-tile > * {
  position: relative !important;
  z-index: 2 !important;
}

#screen-shop .v126-shop-tile:hover {
  transform: translateY(-2px) !important;
  border-color: var(--v1262-line-strong) !important;
  background:
    linear-gradient(135deg, rgba(var(--shop-accent-rgb, 255, 209, 25), .12), transparent 48%),
    linear-gradient(180deg, var(--v1262-card-hover), rgba(13, 26, 43, .66)) !important;
}

#screen-shop .shop-tile-head strong {
  letter-spacing: .01em !important;
  text-transform: none !important;
}

#screen-shop .shop-tile-head em,
#screen-shop .shop-tile-buy .cost {
  border: 1px solid rgba(var(--shop-accent-rgb, 255, 209, 25), .24) !important;
  background: rgba(0,0,0,.16) !important;
  color: var(--shop-accent) !important;
  padding: 4px 7px !important;
}

#screen-shop .shop-tile-art {
  min-height: 82px !important;
  color: var(--shop-accent) !important;
  filter: drop-shadow(0 12px 24px rgba(var(--shop-accent-rgb, 255, 209, 25), .16)) !important;
}

#screen-shop .v126-shop-tile p {
  color: var(--v1262-muted) !important;
}

/* MISSIONS — same transparent square style as Shop. */
#screen-quest-board.screen.content-screen.active {
  grid-template-rows: auto minmax(0, 1fr) !important;
  gap: 14px !important;
  padding: calc(var(--topbar-h, 86px) + 22px) clamp(14px, 2.5vw, 30px) 30px !important;
  overflow-y: auto !important;
}

#screen-quest-board .mission-category-deck,
#screen-quest-board .quest-grid {
  width: min(1380px, 100%) !important;
}

#screen-quest-board .mission-category-deck {
  grid-template-columns: repeat(5, minmax(150px, 1fr)) !important;
  gap: 8px !important;
}

#screen-quest-board .mission-season-card,
#screen-quest-board .mission-row,
#screen-quest-board .mission-progress,
#screen-quest-board .mission-reward .btn,
#screen-quest-board .btn {
  border-radius: 0 !important;
}

#screen-quest-board .mission-season-card {
  min-height: 122px !important;
  padding: 14px !important;
  justify-content: center !important;
  gap: 7px !important;
  border: 1px solid var(--v1262-line) !important;
  background:
    linear-gradient(135deg, rgba(103,255,40,.08), transparent 44%),
    linear-gradient(180deg, rgba(18, 34, 51, .58), rgba(7, 17, 29, .48)) !important;
  -webkit-backdrop-filter: blur(13px) saturate(1.08) !important;
  backdrop-filter: blur(13px) saturate(1.08) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 12px 26px rgba(0,0,0,.20) !important;
}

#screen-quest-board .mission-season-card::before {
  background:
    linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px),
    radial-gradient(circle at 50% 45%, rgba(255,255,255,.08), transparent 36%) !important;
  background-size: 34px 34px, 100% 100% !important;
  opacity: .58 !important;
}

#screen-quest-board .mission-season-card::after {
  font-size: 72px !important;
  color: rgba(255,255,255,.08) !important;
}

#screen-quest-board .mission-season-card.selected {
  border-color: rgba(103,255,40,.52) !important;
  background:
    linear-gradient(135deg, rgba(103,255,40,.16), transparent 48%),
    linear-gradient(180deg, rgba(22, 43, 62, .72), rgba(7, 17, 29, .58)) !important;
  box-shadow: inset 3px 0 0 rgba(103,255,40,.82), inset 0 1px 0 rgba(255,255,255,.08), 0 18px 36px rgba(0,0,0,.24) !important;
}

#screen-quest-board .mission-season-card b {
  width: 34px !important;
  height: 26px !important;
  border-radius: 0 !important;
  border: 1px solid rgba(103,255,40,.38) !important;
  background: rgba(103,255,40,.16) !important;
  color: var(--v126-green) !important;
}

#screen-quest-board .mission-season-card strong {
  font-size: 16px !important;
  letter-spacing: .02em !important;
}

#screen-quest-board .mission-season-card span {
  color: var(--v1262-muted) !important;
  font-size: 11px !important;
  line-height: 1.3 !important;
}

#screen-quest-board .mission-season-card em {
  color: var(--v126-green) !important;
}

#screen-quest-board .quest-grid {
  max-height: none !important;
  overflow-y: visible !important;
  gap: 8px !important;
  padding-right: 0 !important;
}

#screen-quest-board .mission-row {
  min-height: 78px !important;
  grid-template-columns: 56px minmax(0, 1fr) minmax(150px, 190px) !important;
  padding: 9px 12px 9px 0 !important;
  border: 1px solid var(--v1262-line) !important;
  background:
    linear-gradient(90deg, rgba(168,197,255,.06), transparent 46%),
    linear-gradient(180deg, rgba(18, 34, 51, .60), rgba(8, 19, 32, .52)) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.06) !important;
  backdrop-filter: blur(12px) saturate(1.06) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 10px 22px rgba(0,0,0,.16) !important;
}

#screen-quest-board .mission-row.ready {
  border-color: rgba(103,255,40,.38) !important;
  background:
    linear-gradient(90deg, rgba(103,255,40,.13), transparent 50%),
    linear-gradient(180deg, rgba(23, 55, 42, .62), rgba(8, 25, 24, .52)) !important;
}

#screen-quest-board .mission-row.claimed {
  border-color: rgba(17,221,255,.26) !important;
  opacity: .84 !important;
}

#screen-quest-board .mission-icon {
  width: 56px !important;
  border-right: 1px solid rgba(199,222,255,.16) !important;
  color: var(--v1262-soft) !important;
}

#screen-quest-board .mission-copy strong {
  font-size: 15px !important;
  letter-spacing: .01em !important;
}

#screen-quest-board .mission-copy span {
  color: var(--v1262-muted) !important;
}

#screen-quest-board .mission-progress {
  height: 4px !important;
  background: rgba(255,255,255,.10) !important;
}

#screen-quest-board .mission-progress b {
  background: linear-gradient(90deg, var(--v126-green), var(--v126-cyan)) !important;
  box-shadow: 0 0 14px rgba(103,255,40,.35) !important;
}

#screen-quest-board .mission-reward em {
  color: #fff !important;
}

#screen-quest-board .mission-reward small {
  color: var(--v126-green) !important;
}

@media (max-width: 1240px) {
  #screen-quest-board .mission-category-deck {
    grid-template-columns: repeat(3, minmax(168px, 1fr)) !important;
  }
}

@media (max-width: 940px) {
  #screen-shop.screen.content-screen.active {
    grid-template-columns: 1fr !important;
  }
  #screen-shop .shop-category-strip {
    max-height: 235px !important;
    height: auto !important;
  }
  #screen-shop .shop-grid-row,
  #screen-quest-board .mission-category-deck {
    grid-template-columns: 1fr !important;
  }
  #screen-quest-board .mission-row {
    grid-template-columns: 50px minmax(0, 1fr) !important;
  }
  #screen-quest-board .mission-icon {
    width: 50px !important;
  }
  #screen-quest-board .mission-reward {
    grid-column: 2 !important;
    justify-items: start !important;
    grid-template-columns: auto auto auto !important;
  }
}

@media (max-width: 560px) {
  #screen-shop.screen.content-screen.active,
  #screen-quest-board.screen.content-screen.active {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  #screen-shop .shop-overview-card {
    grid-template-columns: 46px minmax(0, 1fr) !important;
  }
  #screen-shop .shop-economy-bar {
    grid-template-columns: 1fr !important;
  }
}



/* v1.26.3 — slim shared scrollbar + homepage search key polish + tighter Shop alignment */
.screen.content-screen.active {
  scrollbar-width: thin !important;
  scrollbar-color: #9cff47 #061a10 !important;
}
.screen.content-screen.active::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}
.screen.content-screen.active::-webkit-scrollbar-track {
  background: linear-gradient(180deg, #04130d 0%, #082617 100%) !important;
  border-radius: 0 !important;
}
.screen.content-screen.active::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #c9ff69 0%, #9cff47 48%, #167a37 100%) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 0 10px rgba(156,255,71,.18) !important;
}
.screen.content-screen.active::-webkit-scrollbar-button,
.screen.content-screen.active::-webkit-scrollbar-corner {
  width: 0 !important;
  height: 0 !important;
  background: #04130d !important;
}

#screen-main .home-menu-search-wrap {
  grid-template-columns: 34px minmax(0, 1fr) 32px !important;
}
#screen-main .home-menu-search-wrap kbd {
  width: 22px !important;
  min-width: 22px !important;
  height: 22px !important;
  margin-right: 6px !important;
  padding: 0 !important;
  place-self: center !important;
  border-radius: 0 !important;
  border: 1px solid rgba(191,213,255,.22) !important;
  background: rgba(191,213,255,.07) !important;
  color: rgba(234,243,255,.78) !important;
  font-size: 12px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-indent: .25px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
  transform: translateY(-.5px) !important;
}

#screen-shop .shop-overview-card,
#screen-shop .economy-tile,
#screen-shop .shop-category-strip,
#screen-shop .premium-shop-nav-item,
#screen-shop .v126-shop-tile,
#screen-shop .shop-tile-head em,
#screen-shop .shop-tile-buy .cost {
  border-radius: 0 !important;
}

#screen-shop .shop-section-title {
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}
#screen-shop .shop-section-title strong {
  flex: 1 1 auto !important;
}
#screen-shop .shop-section-title span {
  margin-left: auto !important;
  text-align: right !important;
  line-height: 1.35 !important;
}

#screen-shop .shop-grid-row {
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
  align-items: stretch !important;
  gap: 12px !important;
}

#screen-shop .v126-shop-tile {
  min-height: 268px !important;
  display: grid !important;
  grid-template-rows: auto 92px minmax(50px, auto) minmax(20px, auto) auto !important;
  align-content: start !important;
  gap: 10px !important;
  padding: 14px !important;
}
#screen-shop .shop-tile-head {
  min-height: 48px !important;
  align-items: start !important;
}
#screen-shop .shop-tile-head strong {
  flex: 1 1 auto !important;
  margin: 0 !important;
  padding-right: 8px !important;
  font-size: 17px !important;
  line-height: 1.12 !important;
  letter-spacing: .005em !important;
  text-transform: none !important;
}
#screen-shop .shop-tile-head em {
  flex: 0 0 auto !important;
  align-self: start !important;
  min-height: 24px !important;
  display: inline-flex !important;
  align-items: center !important;
}
#screen-shop .shop-tile-art {
  min-height: 92px !important;
  margin: 0 !important;
}
#screen-shop .v126-shop-tile p {
  min-height: 50px !important;
  margin: 0 !important;
  display: block !important;
  color: rgba(234,243,255,.76) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.42 !important;
}
#screen-shop .shop-tile-bonus {
  min-height: 18px !important;
  display: block !important;
  margin: 0 !important;
  line-height: 1.25 !important;
}
#screen-shop .shop-tile-buy {
  margin-top: auto !important;
  display: grid !important;
  grid-template-columns: auto minmax(150px, 1fr) !important;
  align-items: stretch !important;
  gap: 12px !important;
}
#screen-shop .shop-tile-buy .cost {
  min-height: 42px !important;
  display: inline-grid !important;
  align-content: center !important;
  justify-content: start !important;
  padding: 0 10px !important;
  border: 1px solid rgba(var(--shop-accent-rgb, 255, 209, 25), .24) !important;
  background: rgba(0,0,0,.16) !important;
  color: var(--shop-accent) !important;
  font-size: 12px !important;
  line-height: 1.05 !important;
}
#screen-shop .shop-tile-buy .btn {
  width: 100% !important;
  min-height: 42px !important;
  padding: 8px 14px !important;
  font-size: 12px !important;
}

@media (max-width: 940px) {
  #screen-shop .shop-grid-row {
    grid-template-columns: 1fr !important;
  }
}
@media (max-width: 640px) {
  #screen-shop .shop-tile-buy {
    grid-template-columns: 1fr !important;
  }
  #screen-shop .shop-tile-buy .cost {
    width: 100% !important;
  }
  #screen-shop .shop-section-title span {
    margin-left: 0 !important;
    text-align: left !important;
  }
}


/* v1.26.4 — premium Shop icons, Missions alignment, shared slim scrollbars */
:where(
  .screen.content-screen.active,
  .wide-panel,
  .panel,
  .settings-panel,
  .daily-panel,
  .shop-panel,
  .quest-panel,
  .vault-panel,
  .journal-panel,
  .wardrobe-panel,
  .profile-panel,
  .arena-panel,
  .power-room-panel,
  #screen-shop .shop-category-strip,
  #screen-quest-board .quest-grid,
  #notification-dropdown.notification-dropdown,
  body > #notification-dropdown.notification-dropdown,
  #menu-global-header .notification-dropdown
) {
  scrollbar-width: thin !important;
  scrollbar-color: #9cff47 #061a10 !important;
}
:where(
  .screen.content-screen.active,
  .wide-panel,
  .panel,
  .settings-panel,
  .daily-panel,
  .shop-panel,
  .quest-panel,
  .vault-panel,
  .journal-panel,
  .wardrobe-panel,
  .profile-panel,
  .arena-panel,
  .power-room-panel,
  #screen-shop .shop-category-strip,
  #screen-quest-board .quest-grid,
  #notification-dropdown.notification-dropdown,
  body > #notification-dropdown.notification-dropdown,
  #menu-global-header .notification-dropdown
)::-webkit-scrollbar {
  width: 8px !important;
  height: 8px !important;
}
:where(
  .screen.content-screen.active,
  .wide-panel,
  .panel,
  .settings-panel,
  .daily-panel,
  .shop-panel,
  .quest-panel,
  .vault-panel,
  .journal-panel,
  .wardrobe-panel,
  .profile-panel,
  .arena-panel,
  .power-room-panel,
  #screen-shop .shop-category-strip,
  #screen-quest-board .quest-grid,
  #notification-dropdown.notification-dropdown,
  body > #notification-dropdown.notification-dropdown,
  #menu-global-header .notification-dropdown
)::-webkit-scrollbar-track {
  background: linear-gradient(180deg, #04130d 0%, #082617 100%) !important;
  border-radius: 0 !important;
}
:where(
  .screen.content-screen.active,
  .wide-panel,
  .panel,
  .settings-panel,
  .daily-panel,
  .shop-panel,
  .quest-panel,
  .vault-panel,
  .journal-panel,
  .wardrobe-panel,
  .profile-panel,
  .arena-panel,
  .power-room-panel,
  #screen-shop .shop-category-strip,
  #screen-quest-board .quest-grid,
  #notification-dropdown.notification-dropdown,
  body > #notification-dropdown.notification-dropdown,
  #menu-global-header .notification-dropdown
)::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #c9ff69 0%, #9cff47 48%, #167a37 100%) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 0 10px rgba(156,255,71,.18) !important;
}
:where(
  .screen.content-screen.active,
  .wide-panel,
  .panel,
  .settings-panel,
  .daily-panel,
  .shop-panel,
  .quest-panel,
  .vault-panel,
  .journal-panel,
  .wardrobe-panel,
  .profile-panel,
  .arena-panel,
  .power-room-panel,
  #screen-shop .shop-category-strip,
  #screen-quest-board .quest-grid,
  #notification-dropdown.notification-dropdown,
  body > #notification-dropdown.notification-dropdown,
  #menu-global-header .notification-dropdown
)::-webkit-scrollbar-button,
:where(
  .screen.content-screen.active,
  .wide-panel,
  .panel,
  .settings-panel,
  .daily-panel,
  .shop-panel,
  .quest-panel,
  .vault-panel,
  .journal-panel,
  .wardrobe-panel,
  .profile-panel,
  .arena-panel,
  .power-room-panel,
  #screen-shop .shop-category-strip,
  #screen-quest-board .quest-grid,
  #notification-dropdown.notification-dropdown,
  body > #notification-dropdown.notification-dropdown,
  #menu-global-header .notification-dropdown
)::-webkit-scrollbar-corner {
  width: 0 !important;
  height: 0 !important;
  background: #04130d !important;
}

/* SHOP — more premium graphic icon presentation and card rhythm */
#screen-shop .shop-grid-row {
  grid-template-columns: repeat(auto-fit, minmax(286px, 1fr)) !important;
  gap: 14px !important;
}
#screen-shop .v126-shop-tile {
  min-height: 276px !important;
  grid-template-rows: auto 104px minmax(52px, auto) minmax(18px, auto) auto !important;
  gap: 10px !important;
}
#screen-shop .shop-tile-head strong {
  font-size: 17px !important;
  line-height: 1.14 !important;
}
#screen-shop .shop-tile-head em {
  min-height: 24px !important;
  display: inline-flex !important;
  align-items: center !important;
  letter-spacing: .07em !important;
}
#screen-shop .shop-tile-art {
  position: relative !important;
  min-height: 104px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  background:
    linear-gradient(135deg, rgba(var(--shop-accent-rgb,255,209,25), .12), transparent 46%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)),
    rgba(0,0,0,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
  overflow: hidden !important;
}
#screen-shop .shop-tile-art::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 50% 40%, rgba(var(--shop-accent-rgb,255,209,25), .24), transparent 34%),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255,255,255,.02) 1px, transparent 1px) !important;
  background-size: 100% 100%, 30px 30px, 30px 30px !important;
  opacity: .85 !important;
}
#screen-shop .shop-tile-art .shop-emoji-icon,
#screen-shop .shop-tile-art .shop-currency-icon {
  position: relative !important;
  z-index: 1 !important;
}
#screen-shop .shop-tile-art .shop-emoji-icon {
  font-size: clamp(50px, 5.8vw, 78px) !important;
  text-shadow: 0 0 22px rgba(var(--shop-accent-rgb,255,209,25), .26), 0 8px 24px rgba(0,0,0,.26) !important;
}
#screen-shop .shop-tile-art .shop-currency-icon {
  width: clamp(68px, 7vw, 96px) !important;
  height: clamp(68px, 7vw, 96px) !important;
  filter: drop-shadow(0 0 16px rgba(var(--shop-accent-rgb,255,209,25), .20)) drop-shadow(0 10px 20px rgba(0,0,0,.20)) !important;
}
#screen-shop .v126-shop-tile p {
  min-height: 52px !important;
  line-height: 1.45 !important;
}
#screen-shop .shop-tile-bonus {
  display: flex !important;
  align-items: center !important;
  min-height: 20px !important;
  padding-top: 2px !important;
}
#screen-shop .shop-tile-buy {
  grid-template-columns: auto minmax(158px, 1fr) !important;
  gap: 12px !important;
}
#screen-shop .shop-tile-buy .cost {
  min-width: 96px !important;
  font-size: 12px !important;
  letter-spacing: .05em !important;
}
#screen-shop .shop-tile-buy .btn {
  min-height: 44px !important;
  font-size: 12px !important;
  letter-spacing: .04em !important;
}
#screen-shop .v126-shop-tile[data-currency="coin"] .shop-tile-art,
#screen-shop .v126-shop-tile[data-shop-category="Berri Coins"] .shop-tile-art { --shop-accent-rgb: 255, 210, 50; }
#screen-shop .v126-shop-tile[data-currency="crystal"] .shop-tile-art,
#screen-shop .v126-shop-tile[data-shop-category="Crystals"] .shop-tile-art { --shop-accent-rgb: 16, 223, 255; }
#screen-shop .v126-shop-tile[data-currency="ruby"] .shop-tile-art,
#screen-shop .v126-shop-tile[data-shop-category="Rubies"] .shop-tile-art { --shop-accent-rgb: 255, 95, 125; }
#screen-shop .v126-shop-tile[data-currency="star"] .shop-tile-art,
#screen-shop .v126-shop-tile[data-shop-category="Stars"] .shop-tile-art { --shop-accent-rgb: 255, 210, 50; }
#screen-shop .v126-shop-tile[data-currency="key"] .shop-tile-art,
#screen-shop .v126-shop-tile[data-shop-category="Key Packs"] .shop-tile-art { --shop-accent-rgb: 210, 176, 255; }
#screen-shop .v126-shop-tile[data-currency="gift"] .shop-tile-art,
#screen-shop .v126-shop-tile[data-shop-category="Limited Offers"] .shop-tile-art { --shop-accent-rgb: 156, 255, 71; }

/* MISSIONS — closer to Shop rhythm and alignment */
#screen-quest-board .mission-category-deck {
  width: min(1480px, 100%) !important;
  gap: 10px !important;
}
#screen-quest-board .mission-season-card,
#screen-quest-board .mission-row,
#screen-quest-board .mission-progress,
#screen-quest-board .mission-reward .btn {
  border-radius: 0 !important;
}
#screen-quest-board .mission-season-card {
  min-height: 132px !important;
  padding: 14px !important;
  border: 1px solid rgba(199,222,255,.16) !important;
  background:
    linear-gradient(135deg, rgba(103,255,40,.10), transparent 46%),
    linear-gradient(180deg, rgba(16, 33, 50, .64), rgba(7, 18, 31, .52)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 12px 28px rgba(0,0,0,.20) !important;
}
#screen-quest-board .mission-season-card.selected {
  box-shadow: inset 3px 0 0 rgba(103,255,40,.82), inset 0 1px 0 rgba(255,255,255,.08), 0 18px 36px rgba(0,0,0,.24) !important;
}
#screen-quest-board .mission-row {
  min-height: 84px !important;
  grid-template-columns: 58px minmax(0, 1fr) minmax(176px, 216px) !important;
  gap: 14px !important;
  padding: 0 14px 0 0 !important;
  overflow: hidden !important;
}
#screen-quest-board .mission-icon {
  width: 58px !important;
  min-height: 84px !important;
  display: grid !important;
  place-items: center !important;
  border-right: 1px solid rgba(199,222,255,.16) !important;
  background:
    radial-gradient(circle at 50% 30%, rgba(103,255,40,.15), transparent 54%),
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.015)) !important;
  color: #cfe0ff !important;
  font-size: 24px !important;
  text-shadow: 0 0 14px rgba(168,197,255,.20) !important;
}
#screen-quest-board .mission-copy {
  min-width: 0 !important;
  padding: 12px 0 !important;
}
#screen-quest-board .mission-copy strong {
  margin: 0 0 4px !important;
  font-size: 15px !important;
  line-height: 1.16 !important;
}
#screen-quest-board .mission-copy span {
  line-height: 1.32 !important;
}
#screen-quest-board .mission-progress {
  height: 5px !important;
  margin-top: 8px !important;
}
#screen-quest-board .mission-reward {
  align-self: stretch !important;
  display: grid !important;
  align-content: center !important;
  justify-items: end !important;
  gap: 4px !important;
}
#screen-quest-board .mission-reward .btn {
  width: 118px !important;
  min-height: 34px !important;
  padding: 6px 10px !important;
  font-size: 11px !important;
}

@media (max-width: 940px) {
  #screen-quest-board .mission-row {
    grid-template-columns: 50px minmax(0, 1fr) !important;
    min-height: 92px !important;
  }
  #screen-quest-board .mission-icon {
    width: 50px !important;
    min-height: 92px !important;
  }
  #screen-quest-board .mission-reward {
    grid-column: 2 !important;
    grid-template-columns: auto auto auto !important;
    align-content: start !important;
    justify-items: start !important;
    padding-bottom: 12px !important;
  }
}
@media (max-width: 640px) {
  #screen-shop .shop-grid-row {
    grid-template-columns: 1fr !important;
  }
  #screen-shop .shop-tile-buy {
    grid-template-columns: 1fr !important;
  }
  #screen-quest-board .mission-reward {
    grid-template-columns: 1fr !important;
  }
  #screen-quest-board .mission-reward .btn {
    width: 100% !important;
  }
}


/* v1.26.5 — custom inline vector icons and premium mini-graphics */
#screen-shop .shop-svg-icon,
#screen-shop .shop-currency-icon,
#screen-quest-board .mission-svg-icon {
  display: block !important;
  overflow: visible !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#screen-shop .shop-tile-art .shop-svg-icon,
#screen-shop .shop-tile-art .shop-currency-icon {
  width: clamp(70px, 7vw, 100px) !important;
  height: clamp(70px, 7vw, 100px) !important;
}
#screen-shop .shop-tile-art .shop-svg-icon path:first-child,
#screen-shop .shop-tile-art .shop-currency-icon path:first-child,
#screen-shop .shop-tile-art .shop-currency-icon circle:first-child {
  filter: drop-shadow(0 0 10px rgba(var(--shop-accent-rgb,255,209,25), .18)) !important;
}
#screen-shop .shop-tile-art::after {
  content: "" !important;
  position: absolute !important;
  right: 12px !important;
  bottom: 12px !important;
  width: 46px !important;
  height: 46px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  background:
    radial-gradient(circle at 35% 35%, rgba(255,255,255,.10), transparent 42%),
    linear-gradient(135deg, rgba(var(--shop-accent-rgb,255,209,25), .12), rgba(255,255,255,.02)) !important;
  opacity: .9 !important;
}
#screen-shop .v126-shop-tile:hover .shop-tile-art::after {
  transform: translateY(-1px) !important;
}
#screen-shop .shop-section-title {
  position: relative !important;
}
#screen-shop .shop-section-title::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  bottom: -1px !important;
  width: 72px !important;
  height: 2px !important;
  background: linear-gradient(90deg, var(--shop-accent), transparent) !important;
}
#screen-quest-board .mission-svg-icon {
  width: 26px !important;
  height: 26px !important;
}
#screen-quest-board .mission-row.ready .mission-svg-icon {
  color: var(--v126-green) !important;
}
#screen-quest-board .mission-season-card {
  position: relative !important;
  overflow: hidden !important;
}
#screen-quest-board .mission-season-card::before {
  background:
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255,255,255,.025) 1px, transparent 1px),
    radial-gradient(circle at 50% 45%, rgba(255,255,255,.08), transparent 36%) !important;
  background-size: 34px 34px, 34px 34px, 100% 100% !important;
  opacity: .64 !important;
}
#screen-quest-board .mission-copy::after {
  content: "" !important;
  display: block !important;
  width: 54px !important;
  height: 1px !important;
  margin-top: 10px !important;
  background: linear-gradient(90deg, rgba(103,255,40,.8), transparent) !important;
}
#screen-quest-board .mission-row.locked .mission-copy::after {
  background: linear-gradient(90deg, rgba(199,222,255,.42), transparent) !important;
}
#screen-quest-board .mission-reward .btn,
#screen-shop .shop-tile-buy .btn,
#screen-shop .premium-shop-nav-item,
#screen-shop .shop-category-strip,
#screen-shop .v126-shop-tile,
#screen-shop .shop-overview-card,
#screen-shop .economy-tile,
#screen-quest-board .mission-season-card,
#screen-quest-board .mission-row {
  border-radius: 0 !important;
}

/* Broader premium pass for content pages */
.screen.content-screen .shop-card,
.screen.content-screen .skin-card,
.screen.content-screen .quest-card,
.screen.content-screen .vault-card,
.screen.content-screen .arena-card,
.screen.content-screen .power-card,
.screen.content-screen .guide-grid article,
.screen.content-screen .achievement,
.screen.content-screen .save-slot-card,
.screen.content-screen .world-gate-card,
.screen.content-screen .profile-stats article,
.screen.content-screen .profile-badges article {
  background:
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(180deg, rgba(11, 33, 49, .94), rgba(4, 16, 27, .84)) !important;
}
.screen.content-screen .shop-card::before,
.screen.content-screen .skin-card::before,
.screen.content-screen .quest-card::before,
.screen.content-screen .vault-card::before,
.screen.content-screen .arena-card::before,
.screen.content-screen .power-card::before,
.screen.content-screen .guide-grid article::before,
.screen.content-screen .achievement::before,
.screen.content-screen .save-slot-card::before,
.screen.content-screen .world-gate-card::before,
.screen.content-screen .profile-stats article::before,
.screen.content-screen .profile-badges article::before {
  box-shadow: inset -1px 0 0 rgba(255,255,255,.06) !important;
}


/* v1.26.6 — richer BerriGo icon pack, decorative Shop categories, premium pass across content pages */
#screen-shop .premium-shop-nav-item i {
  width: 24px !important;
  height: 24px !important;
  display: grid !important;
  place-items: center !important;
}
#screen-shop .premium-shop-nav-item i svg,
#screen-shop .shop-section-icon svg {
  width: 22px !important;
  height: 22px !important;
  display: block !important;
  overflow: visible !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
#screen-shop .premium-shop-nav-item[data-shop-theme="limited"] { background: linear-gradient(90deg, rgba(156,255,71,.10), rgba(255,255,255,.02)) !important; }
#screen-shop .premium-shop-nav-item[data-shop-theme="premium"] { background: linear-gradient(90deg, rgba(255,209,25,.10), rgba(255,255,255,.02)) !important; }
#screen-shop .premium-shop-nav-item[data-shop-theme="coins"] { background: linear-gradient(90deg, rgba(255,210,50,.10), rgba(255,255,255,.02)) !important; }
#screen-shop .premium-shop-nav-item[data-shop-theme="crystals"] { background: linear-gradient(90deg, rgba(17,221,255,.10), rgba(255,255,255,.02)) !important; }
#screen-shop .premium-shop-nav-item[data-shop-theme="rubies"] { background: linear-gradient(90deg, rgba(255,89,108,.10), rgba(255,255,255,.02)) !important; }
#screen-shop .premium-shop-nav-item[data-shop-theme="stars"] { background: linear-gradient(90deg, rgba(255,209,25,.10), rgba(255,255,255,.02)) !important; }
#screen-shop .premium-shop-nav-item[data-shop-theme="keys"] { background: linear-gradient(90deg, rgba(210,176,255,.10), rgba(255,255,255,.02)) !important; }
#screen-shop .premium-shop-nav-item[data-shop-theme="early"] { background: linear-gradient(90deg, rgba(103,255,40,.08), rgba(255,255,255,.02)) !important; }
#screen-shop .premium-shop-nav-item[data-shop-theme="promocodes"] { background: linear-gradient(90deg, rgba(103,255,40,.10), rgba(255,255,255,.02)) !important; }
#screen-shop .shop-section-title {
  display: grid !important;
  grid-template-columns: 42px minmax(0,1fr) !important;
  align-items: center !important;
  gap: 12px !important;
}
#screen-shop .shop-section-icon {
  width: 42px !important;
  height: 42px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(var(--shop-accent-rgb,255,209,25), .22) !important;
  background:
    radial-gradient(circle at 35% 30%, rgba(var(--shop-accent-rgb,255,209,25), .18), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
  color: var(--shop-accent) !important;
}
#screen-shop .shop-section-copy {
  min-width: 0 !important;
  display: grid !important;
  gap: 3px !important;
}
#screen-shop .shop-section-copy strong,
#screen-shop .shop-section-copy span {
  margin: 0 !important;
}
#screen-shop .premium-shop-section {
  position: relative !important;
}
#screen-shop .premium-shop-section::after {
  content: attr(data-shop-section) !important;
  position: absolute !important;
  top: 10px !important;
  right: 0 !important;
  font-size: clamp(28px, 3vw, 52px) !important;
  line-height: 1 !important;
  letter-spacing: -.04em !important;
  color: rgba(255,255,255,.035) !important;
  font-weight: 1000 !important;
  pointer-events: none !important;
  text-transform: uppercase !important;
}
#screen-shop .premium-shop-section[data-shop-section="Crystals"] { --shop-accent: var(--v126-cyan); --shop-accent-rgb: 17, 221, 255; }
#screen-shop .premium-shop-section[data-shop-section="Rubies"] { --shop-accent: var(--v126-red); --shop-accent-rgb: 255, 89, 108; }
#screen-shop .premium-shop-section[data-shop-section="Stars"],
#screen-shop .premium-shop-section[data-shop-section="Berri Coins"],
#screen-shop .premium-shop-section[data-shop-section="Premium Account"] { --shop-accent: var(--v126-gold); --shop-accent-rgb: 255, 209, 25; }
#screen-shop .premium-shop-section[data-shop-section="Key Packs"] { --shop-accent: #d2b0ff; --shop-accent-rgb: 210, 176, 255; }
#screen-shop .premium-shop-section[data-shop-section="Limited Offers"],
#screen-shop .premium-shop-section[data-shop-section="Showcase"],
#screen-shop .premium-shop-section[data-shop-section="Early Access"],
#screen-shop .premium-shop-section[data-shop-section="Promocodes"] { --shop-accent: var(--v126-green); --shop-accent-rgb: 103, 255, 40; }

/* General premium blocks */
:where(
  .rewards-economy-row,
  .card-collection-wallet,
  .event-hero-grid,
  .pet-active-strip,
  .talent-summary,
  .contract-summary,
  .calendar-summary,
  .mailbox-summary,
  .inventory-summary,
  .market-summary,
  .expedition-summary,
  .season-summary,
  .boss-rush-summary,
  .modifier-summary,
  .loadout-summary,
  .forge-summary,
  .season-track,
  .boss-rush-grid,
  .modifier-grid,
  .event-grid,
  .pet-grid,
  .boss-book-grid,
  .talent-tree-grid,
  .chest-grid,
  .leaderboard-grid,
  .inventory-grid,
  .market-grid,
  .expedition-grid,
  .calendar-grid,
  .mailbox-grid,
  .promo-grid,
  .contract-grid,
  .bestiary-grid,
  .loadout-grid,
  .forge-grid,
  .lucky-wheel-rewards,
  .rare-card-grid
) {
  border-radius: 0 !important;
}
:where(
  .rewards-economy-row article,
  .event-hero-grid article,
  .pet-active-strip article,
  .talent-summary article,
  .contract-summary article,
  .calendar-summary article,
  .mailbox-summary article,
  .inventory-summary article,
  .market-summary article,
  .expedition-summary article,
  .season-summary article,
  .boss-rush-summary article,
  .modifier-summary article,
  .loadout-summary article,
  .forge-summary article,
  .lucky-wheel-card,
  .chest-reward-display,
  .promo-console,
  .card-collection-wallet article
) {
  border-radius: 0 !important;
  border: 1px solid rgba(199,222,255,.16) !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(180deg, rgba(11, 31, 47, .90), rgba(4, 15, 25, .82)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 12px 26px rgba(0,0,0,.18) !important;
}
:where(
  .rare-card-set,
  .live-event-card,
  .pet-card,
  .boss-book-card,
  .talent-card,
  .chest-pack-card,
  .leader-row,
  .season-tier,
  .boss-rush-card,
  .modifier-card,
  .lucky-reward-card,
  .contract-card,
  .bestiary-card,
  .calendar-card,
  .mail-card,
  .promo-card,
  .inventory-panel,
  .market-card,
  .expedition-card,
  .loadout-card,
  .forge-card
) {
  border-radius: 0 !important;
  border: 1px solid rgba(199,222,255,.16) !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px) 0 0 / 30px 30px,
    linear-gradient(180deg, rgba(10, 28, 42, .92), rgba(4, 15, 25, .88)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 14px 30px rgba(0,0,0,.18) !important;
}
:where(
  .rare-card-set::before,
  .live-event-card::before,
  .pet-card::before,
  .boss-book-card::before,
  .talent-card::before,
  .chest-pack-card::before,
  .leader-row::before,
  .season-tier::before,
  .boss-rush-card::before,
  .modifier-card::before,
  .calendar-card::before,
  .mail-card::before,
  .promo-card::before,
  .inventory-panel::before,
  .market-card::before,
  .expedition-card::before,
  .loadout-card::before,
  .forge-card::before
) {
  width: 4px !important;
}
:where(
  .reward-section-title,
  #screen-profile > .profile-stats,
  #screen-relic-vault > .world-wallet,
  #screen-arena > .world-wallet,
  #screen-wardrobe > .shop-wallet
) {
  position: relative !important;
}
:where(
  .reward-section-title,
  #screen-profile > .profile-stats,
  #screen-relic-vault > .world-wallet,
  #screen-arena > .world-wallet,
  #screen-wardrobe > .shop-wallet
)::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 3px !important;
  background: linear-gradient(180deg, #9cff47, #10dfff) !important;
}
#screen-profile > .profile-stats,
#screen-relic-vault > .world-wallet,
#screen-arena > .world-wallet,
#screen-wardrobe > .shop-wallet {
  padding-left: 12px !important;
  border: 1px solid rgba(199,222,255,.16) !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px) 0 0 / 30px 30px,
    linear-gradient(180deg, rgba(11,31,47,.90), rgba(4,15,25,.82)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 12px 26px rgba(0,0,0,.18) !important;
}
#screen-profile > .profile-stats {
  margin-bottom: 14px !important;
}
#screen-relic-vault > .world-wallet,
#screen-arena > .world-wallet,
#screen-wardrobe > .shop-wallet {
  min-height: 54px !important;
  display: grid !important;
  align-content: center !important;
}

/* Rewards / profile / vault / arena / wardrobe refinement */
#screen-daily .reward-tile,
#screen-daily .milestone-card,
#screen-relic-vault .vault-card,
#screen-arena .arena-card,
#screen-wardrobe .skin-card,
#screen-profile .profile-stats article,
#screen-profile .profile-badges article {
  border-radius: 0 !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(180deg, rgba(10,29,44,.94), rgba(4,15,25,.88)) !important;
}
#screen-daily .reward-tile:hover,
#screen-daily .milestone-card:hover,
#screen-relic-vault .vault-card:hover,
#screen-arena .arena-card:hover,
#screen-wardrobe .skin-card:hover,
#screen-profile .profile-stats article:hover,
#screen-profile .profile-badges article:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(199,222,255,.30) !important;
}
#screen-wardrobe .skin-card::after,
#screen-profile .profile-stats article::after,
#screen-profile .profile-badges article::after,
#screen-relic-vault .vault-card::after,
#screen-arena .arena-card::after,
#screen-daily .reward-tile::after,
#screen-daily .milestone-card::after {
  border-radius: 0 !important;
}

/* Slim scrollbars for newer horizontal panels */
:where(.season-track, .battle-pass-track, .market-grid, .inventory-grid, .expedition-grid)::-webkit-scrollbar {
  height: 8px !important;
  width: 8px !important;
}
:where(.season-track, .battle-pass-track, .market-grid, .inventory-grid, .expedition-grid)::-webkit-scrollbar-track {
  background: linear-gradient(180deg, #04130d 0%, #082617 100%) !important;
  border-radius: 0 !important;
}
:where(.season-track, .battle-pass-track, .market-grid, .inventory-grid, .expedition-grid)::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #c9ff69 0%, #9cff47 48%, #167a37 100%) !important;
  border-radius: 0 !important;
}

/* v1.26.7 — Rank label centering, thin global scrollbars, cleaner Missions status, compact gameplay HUD and left mini-map spacing. */
#menu-global-header #menu-avatar.topbar-rank,
#menu-global-header .topbar-rank {
  text-align: center !important;
}
#menu-global-header #menu-avatar.topbar-rank strong,
#menu-global-header #menu-avatar.topbar-rank span,
#menu-global-header .topbar-rank strong,
#menu-global-header .topbar-rank span {
  width: 100% !important;
  display: block !important;
  text-align: center !important;
}
#menu-global-header #menu-avatar.topbar-rank span,
#menu-global-header .topbar-rank span {
  padding-left: .16em !important;
  box-sizing: border-box !important;
}

html,
body,
#game-shell,
.screen,
.content-screen,
.panel,
.wide-panel,
.quest-grid,
.shop-grid-row,
.settings-panel,
.notification-dropdown,
#hud {
  scrollbar-width: thin !important;
  scrollbar-color: rgba(113, 255, 74, .58) rgba(3, 12, 22, .24) !important;
}
html::-webkit-scrollbar,
body::-webkit-scrollbar,
#game-shell::-webkit-scrollbar,
.screen::-webkit-scrollbar,
.content-screen::-webkit-scrollbar,
.screen.content-screen.active::-webkit-scrollbar,
.panel::-webkit-scrollbar,
.wide-panel::-webkit-scrollbar,
.quest-grid::-webkit-scrollbar,
.shop-grid-row::-webkit-scrollbar,
.settings-panel::-webkit-scrollbar,
.notification-dropdown::-webkit-scrollbar,
#hud::-webkit-scrollbar {
  width: 6px !important;
  height: 6px !important;
}
html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
#game-shell::-webkit-scrollbar-track,
.screen::-webkit-scrollbar-track,
.content-screen::-webkit-scrollbar-track,
.screen.content-screen.active::-webkit-scrollbar-track,
.panel::-webkit-scrollbar-track,
.wide-panel::-webkit-scrollbar-track,
.quest-grid::-webkit-scrollbar-track,
.shop-grid-row::-webkit-scrollbar-track,
.settings-panel::-webkit-scrollbar-track,
.notification-dropdown::-webkit-scrollbar-track,
#hud::-webkit-scrollbar-track {
  background: rgba(3, 12, 22, .18) !important;
}
html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
#game-shell::-webkit-scrollbar-thumb,
.screen::-webkit-scrollbar-thumb,
.content-screen::-webkit-scrollbar-thumb,
.screen.content-screen.active::-webkit-scrollbar-thumb,
.panel::-webkit-scrollbar-thumb,
.wide-panel::-webkit-scrollbar-thumb,
.quest-grid::-webkit-scrollbar-thumb,
.shop-grid-row::-webkit-scrollbar-thumb,
.settings-panel::-webkit-scrollbar-thumb,
.notification-dropdown::-webkit-scrollbar-thumb,
#hud::-webkit-scrollbar-thumb {
  border-radius: 999px !important;
  background: linear-gradient(180deg, rgba(113,255,74,.86), rgba(38,220,255,.76)) !important;
  border: 1px solid rgba(4, 16, 28, .38) !important;
}
html::-webkit-scrollbar-button,
body::-webkit-scrollbar-button,
#game-shell::-webkit-scrollbar-button,
.screen::-webkit-scrollbar-button,
.content-screen::-webkit-scrollbar-button,
.panel::-webkit-scrollbar-button,
.wide-panel::-webkit-scrollbar-button,
#hud::-webkit-scrollbar-button {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}

#screen-quest-board .mission-row.claimed .mission-reward em:empty,
#screen-quest-board .mission-row.claimed .mission-reward em {
  display: none !important;
}
#screen-quest-board .mission-row.claimed .mission-reward {
  gap: 7px !important;
}

.game-shell.is-playing #hud.hud {
  top: calc(12px + env(safe-area-inset-top, 0px)) !important;
  left: 50% !important;
  right: auto !important;
  width: auto !important;
  max-width: min(1120px, calc(100vw - 24px)) !important;
  min-height: 0 !important;
  height: auto !important;
  transform: translateX(-50%) !important;
  z-index: 32 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px !important;
  border-radius: 22px !important;
  border: 1px solid rgba(191, 213, 255, .24) !important;
  background:
    radial-gradient(circle at 10% 0%, rgba(113,255,74,.18), transparent 38%),
    radial-gradient(circle at 92% 0%, rgba(38,220,255,.16), transparent 36%),
    linear-gradient(180deg, rgba(5, 18, 31, .82), rgba(3, 12, 22, .58)) !important;
  box-shadow: 0 18px 44px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.13) !important;
  backdrop-filter: blur(16px) saturate(1.16) !important;
  -webkit-backdrop-filter: blur(16px) saturate(1.16) !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}
.game-shell.is-playing #hud .hud-pill {
  flex: 0 0 auto !important;
  min-width: 74px !important;
  min-height: 46px !important;
  height: 46px !important;
  display: grid !important;
  grid-template-columns: 24px minmax(0, auto) !important;
  grid-template-rows: 16px 19px !important;
  align-items: center !important;
  column-gap: 7px !important;
  row-gap: 1px !important;
  padding: 6px 10px !important;
  margin: 0 !important;
  border-radius: 16px !important;
  border: 1px solid rgba(191, 213, 255, .18) !important;
  border-right: 1px solid rgba(191, 213, 255, .18) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045)) !important;
  color: #eaf3ff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 8px 18px rgba(0,0,0,.13) !important;
  white-space: nowrap !important;
}
.game-shell.is-playing #hud .hud-pill:first-child {
  border-left: 1px solid rgba(191, 213, 255, .18) !important;
}
.game-shell.is-playing #hud .hud-pill i {
  grid-row: 1 / 3 !important;
  grid-column: 1 !important;
  width: 24px !important;
  height: 24px !important;
  border-radius: 10px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-style: normal !important;
  font-size: 12px !important;
  line-height: 1 !important;
  font-weight: 1000 !important;
  letter-spacing: .02em !important;
  background: rgba(255,255,255,.10) !important;
}
.game-shell.is-playing #hud .hud-pill span {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: block !important;
  margin: 0 !important;
  color: rgba(222,236,255,.70) !important;
  font-size: 8px !important;
  line-height: 1.05 !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  letter-spacing: .115em !important;
}
.game-shell.is-playing #hud .hud-pill strong {
  grid-column: 2 !important;
  grid-row: 2 !important;
  display: block !important;
  min-width: 0 !important;
  color: #ffffff !important;
  font-size: 15px !important;
  line-height: 1.05 !important;
  font-weight: 1000 !important;
  letter-spacing: .01em !important;
  text-shadow: 0 0 12px rgba(255,255,255,.13) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.game-shell.is-playing #hud .power-pill {
  flex: 0 1 300px !important;
  min-width: 190px !important;
  max-width: 330px !important;
}
.game-shell.is-playing #hud .power-pill strong {
  max-width: 255px !important;
}
.game-shell.is-playing #hud .hud-pill-coins strong {
  max-width: 92px !important;
}
.game-shell.is-playing #hud .hud-button {
  flex: 0 0 46px !important;
  width: 46px !important;
  min-width: 46px !important;
  height: 46px !important;
  margin: 0 !important;
  border: 1px solid rgba(255, 216, 74, .30) !important;
  border-radius: 16px !important;
  background: linear-gradient(180deg, rgba(255,216,74,.18), rgba(255,145,50,.08)) !important;
  color: #fff2ac !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 8px 18px rgba(0,0,0,.14) !important;
  font-size: 22px !important;
  line-height: 1 !important;
}
.game-shell.is-playing #hud .hud-button:hover {
  color: #fff !important;
  background: linear-gradient(180deg, rgba(255,216,74,.28), rgba(255,145,50,.13)) !important;
  text-shadow: 0 0 16px rgba(255,216,74,.56) !important;
}
.game-shell.is-playing #hud + #toast,
.game-shell.is-playing .toast {
  top: 86px !important;
}
@media (max-width: 980px) {
  .game-shell.is-playing #hud.hud {
    max-width: calc(100vw - 16px) !important;
    top: calc(8px + env(safe-area-inset-top, 0px)) !important;
    border-radius: 18px !important;
  }
  .game-shell.is-playing #hud .hud-pill {
    min-width: 64px !important;
    height: 42px !important;
    min-height: 42px !important;
    grid-template-columns: 21px minmax(0, auto) !important;
    grid-template-rows: 14px 17px !important;
    padding: 5px 8px !important;
    border-radius: 14px !important;
  }
  .game-shell.is-playing #hud .hud-pill i {
    width: 21px !important;
    height: 21px !important;
    border-radius: 8px !important;
    font-size: 10px !important;
  }
  .game-shell.is-playing #hud .hud-pill span {
    font-size: 7.5px !important;
  }
  .game-shell.is-playing #hud .hud-pill strong {
    font-size: 13px !important;
  }
  .game-shell.is-playing #hud .power-pill {
    min-width: 154px !important;
    max-width: 240px !important;
  }
  .game-shell.is-playing #hud .power-pill strong {
    max-width: 185px !important;
  }
  .game-shell.is-playing #hud .hud-button {
    width: 42px !important;
    min-width: 42px !important;
    height: 42px !important;
    border-radius: 14px !important;
  }
}
@media (max-width: 680px) {
  .game-shell.is-playing #hud .hud-pill span {
    display: none !important;
  }
  .game-shell.is-playing #hud .hud-pill {
    grid-template-columns: 21px auto !important;
    grid-template-rows: 1fr !important;
    min-width: 58px !important;
  }
  .game-shell.is-playing #hud .hud-pill i,
  .game-shell.is-playing #hud .hud-pill strong {
    grid-row: 1 !important;
    align-self: center !important;
  }
  .game-shell.is-playing #hud .hud-pill strong {
    font-size: 12px !important;
  }
  .game-shell.is-playing #hud .power-pill {
    min-width: 128px !important;
  }
}


/* v1.26.8 — Gameplay HUD restored to full-width header style.
   Keeps the HUD fixed across the whole game viewport, but replaces the old text-symbol look
   with clean SVG icon cells inspired by the general header currency/action layout. */
.game-shell.is-playing #hud.hud {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 60px !important;
  height: 60px !important;
  transform: none !important;
  z-index: 32 !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  padding: 0 env(safe-area-inset-right, 0px) 0 env(safe-area-inset-left, 0px) !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-bottom: 1px solid rgba(191, 213, 255, .27) !important;
  background:
    linear-gradient(180deg, rgba(0, 25, 38, .96) 0%, rgba(0, 15, 28, .82) 64%, rgba(0, 25, 38, .36) 100%) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .30), inset 0 1px 0 rgba(255, 255, 255, .08) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(156, 255, 71, .78) rgba(4, 19, 13, .58) !important;
}
.game-shell.is-playing #hud.hud.hidden {
  display: none !important;
}
.game-shell.is-playing #hud .hud-pill {
  flex: 0 0 auto !important;
  min-width: 104px !important;
  min-height: 60px !important;
  height: 60px !important;
  display: grid !important;
  grid-template-columns: 38px minmax(0, auto) !important;
  grid-template-rows: 18px 26px !important;
  align-items: center !important;
  justify-content: start !important;
  column-gap: 10px !important;
  row-gap: 0 !important;
  padding: 8px 16px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-right: 1px solid rgba(191, 213, 255, .21) !important;
  border-left: 0 !important;
  background: linear-gradient(180deg, rgba(8, 20, 34, .56), rgba(5, 12, 23, .18)) !important;
  color: #eaf3ff !important;
  box-shadow: inset 1px 0 0 rgba(255,255,255,.045) !important;
  white-space: nowrap !important;
}
.game-shell.is-playing #hud .hud-pill:first-child {
  border-left: 1px solid rgba(191, 213, 255, .21) !important;
}
.game-shell.is-playing #hud .hud-pill i {
  grid-row: 1 / 3 !important;
  grid-column: 1 !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  border-radius: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-style: normal !important;
  font-size: 0 !important;
  line-height: 1 !important;
  background: transparent !important;
  color: #9cff47 !important;
  filter: drop-shadow(0 0 10px rgba(156, 255, 71, .36)) !important;
}
.game-shell.is-playing #hud .hud-pill i svg {
  width: 30px !important;
  height: 30px !important;
  display: block !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.15 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}
.game-shell.is-playing #hud .hud-pill span {
  grid-column: 2 !important;
  grid-row: 1 !important;
  display: block !important;
  align-self: end !important;
  margin: 0 !important;
  color: rgba(191, 213, 255, .74) !important;
  font-size: 9px !important;
  line-height: 1.05 !important;
  font-weight: 950 !important;
  text-transform: uppercase !important;
  letter-spacing: .135em !important;
}
.game-shell.is-playing #hud .hud-pill strong {
  grid-column: 2 !important;
  grid-row: 2 !important;
  display: block !important;
  align-self: start !important;
  min-width: 0 !important;
  color: #ffffff !important;
  font-size: 19px !important;
  line-height: 1.05 !important;
  font-weight: 1000 !important;
  letter-spacing: -.01em !important;
  text-shadow: 0 0 14px rgba(255,255,255,.14) !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.game-shell.is-playing #hud .hud-pill-level strong,
.game-shell.is-playing #hud .hud-pill-coins strong,
.game-shell.is-playing #hud .hud-pill-score strong {
  color: #fff3a6 !important;
  text-shadow: 0 0 14px rgba(255, 216, 74, .34) !important;
}
.game-shell.is-playing #hud .hud-pill-level i,
.game-shell.is-playing #hud .hud-pill-coins i,
.game-shell.is-playing #hud .hud-pill-score i {
  color: #ffd84a !important;
  filter: drop-shadow(0 0 10px rgba(255, 216, 74, .45)) !important;
}
.game-shell.is-playing #hud .hud-pill-crystals i { color: #26dcff !important; filter: drop-shadow(0 0 10px rgba(38, 220, 255, .45)) !important; }
.game-shell.is-playing #hud .hud-pill-keys i { color: #ff6c8d !important; filter: drop-shadow(0 0 10px rgba(255, 108, 141, .42)) !important; }
.game-shell.is-playing #hud .hud-pill-lives i { color: #ff4e73 !important; filter: drop-shadow(0 0 10px rgba(255, 78, 115, .42)) !important; }
.game-shell.is-playing #hud .hud-pill-time i { color: #b99cff !important; filter: drop-shadow(0 0 10px rgba(185, 156, 255, .42)) !important; }
.game-shell.is-playing #hud .power-pill {
  flex: 1 1 270px !important;
  min-width: 230px !important;
  max-width: none !important;
}
.game-shell.is-playing #hud .power-pill strong {
  max-width: min(44vw, 520px) !important;
  font-size: 16px !important;
}
.game-shell.is-playing #hud .hud-pill-coins strong {
  max-width: none !important;
}
.game-shell.is-playing #hud .hud-button {
  flex: 0 0 66px !important;
  width: 66px !important;
  min-width: 66px !important;
  height: 60px !important;
  margin: 0 0 0 auto !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-left: 1px solid rgba(191, 213, 255, .25) !important;
  border-right: 1px solid rgba(191, 213, 255, .18) !important;
  background: radial-gradient(100% 100% at 0% 0%, rgba(255, 204, 0, .22), rgba(255, 38, 74, .15) 58%, rgba(12, 30, 50, .28) 100%) !important;
  color: #ffd84a !important;
  box-shadow: inset 1px 0 0 rgba(255,255,255,.07) !important;
  font-size: 26px !important;
  line-height: 1 !important;
  font-weight: 1000 !important;
  cursor: pointer !important;
}
.game-shell.is-playing #hud .hud-button:hover {
  color: #fff !important;
  background: radial-gradient(100% 100% at 0% 0%, rgba(255, 204, 0, .34), rgba(255, 38, 74, .21) 58%, rgba(23, 70, 102, .35) 100%) !important;
  text-shadow: 0 0 16px rgba(255, 216, 74, .58) !important;
}
.game-shell.is-playing #hud::-webkit-scrollbar { height: 5px !important; }
.game-shell.is-playing #hud::-webkit-scrollbar-track { background: rgba(4, 19, 13, .74) !important; }
.game-shell.is-playing #hud::-webkit-scrollbar-thumb { background: linear-gradient(90deg, #167a37 0%, #9cff47 68%, #c9ff69 100%) !important; border-radius: 999px !important; }
.game-shell.is-playing #hud + #toast,
.game-shell.is-playing .toast {
  top: 74px !important;
}
@media (max-width: 1040px) {
  .game-shell.is-playing #hud.hud {
    height: 56px !important;
    min-height: 56px !important;
  }
  .game-shell.is-playing #hud .hud-pill {
    min-width: 88px !important;
    height: 56px !important;
    min-height: 56px !important;
    grid-template-columns: 30px minmax(0, auto) !important;
    grid-template-rows: 17px 23px !important;
    column-gap: 8px !important;
    padding: 7px 12px !important;
  }
  .game-shell.is-playing #hud .hud-pill i {
    width: 29px !important;
    height: 29px !important;
    min-width: 29px !important;
  }
  .game-shell.is-playing #hud .hud-pill i svg {
    width: 26px !important;
    height: 26px !important;
  }
  .game-shell.is-playing #hud .hud-pill span { font-size: 8px !important; }
  .game-shell.is-playing #hud .hud-pill strong { font-size: 16px !important; }
  .game-shell.is-playing #hud .power-pill {
    min-width: 185px !important;
    flex-basis: 210px !important;
  }
  .game-shell.is-playing #hud .power-pill strong {
    max-width: 280px !important;
    font-size: 14px !important;
  }
  .game-shell.is-playing #hud .hud-button {
    width: 58px !important;
    min-width: 58px !important;
    height: 56px !important;
  }
}
@media (max-width: 720px) {
  .game-shell.is-playing #hud.hud {
    height: 52px !important;
    min-height: 52px !important;
  }
  .game-shell.is-playing #hud .hud-pill span {
    display: none !important;
  }
  .game-shell.is-playing #hud .hud-pill {
    min-width: 66px !important;
    height: 52px !important;
    min-height: 52px !important;
    grid-template-columns: 25px auto !important;
    grid-template-rows: 1fr !important;
    column-gap: 6px !important;
    padding: 7px 9px !important;
  }
  .game-shell.is-playing #hud .hud-pill i,
  .game-shell.is-playing #hud .hud-pill strong {
    grid-row: 1 !important;
    align-self: center !important;
  }
  .game-shell.is-playing #hud .hud-pill i {
    width: 24px !important;
    height: 24px !important;
    min-width: 24px !important;
  }
  .game-shell.is-playing #hud .hud-pill i svg {
    width: 22px !important;
    height: 22px !important;
  }
  .game-shell.is-playing #hud .hud-pill strong {
    font-size: 13px !important;
  }
  .game-shell.is-playing #hud .power-pill {
    min-width: 138px !important;
    flex-basis: 150px !important;
  }
  .game-shell.is-playing #hud .power-pill strong {
    max-width: 112px !important;
    font-size: 12px !important;
  }
  .game-shell.is-playing #hud .hud-button {
    width: 50px !important;
    min-width: 50px !important;
    height: 52px !important;
  }
}

/* v1.26.9 — Stable gameplay HUD counters.
   Reserves enough horizontal space for changing numeric/text values so the HUD cells
   no longer jump when Time, Score, Coins, Crystals or Power update during gameplay. */
.game-shell.is-playing #hud .hud-pill {
  box-sizing: border-box !important;
  contain: layout paint !important;
}
.game-shell.is-playing #hud .hud-pill strong {
  font-variant-numeric: tabular-nums !important;
  font-feature-settings: "tnum" 1, "lnum" 1 !important;
  text-align: left !important;
  min-width: 4ch !important;
}
.game-shell.is-playing #hud .hud-pill-level {
  flex: 0 0 122px !important;
  width: 122px !important;
  min-width: 122px !important;
}
.game-shell.is-playing #hud .hud-pill-crystals {
  flex: 0 0 138px !important;
  width: 138px !important;
  min-width: 138px !important;
}
.game-shell.is-playing #hud .hud-pill-keys,
.game-shell.is-playing #hud .hud-pill-lives {
  flex: 0 0 112px !important;
  width: 112px !important;
  min-width: 112px !important;
}
.game-shell.is-playing #hud .hud-pill-time {
  flex: 0 0 118px !important;
  width: 118px !important;
  min-width: 118px !important;
}
.game-shell.is-playing #hud .hud-pill-score {
  flex: 0 0 142px !important;
  width: 142px !important;
  min-width: 142px !important;
}
.game-shell.is-playing #hud .hud-pill-coins {
  flex: 0 0 168px !important;
  width: 168px !important;
  min-width: 168px !important;
}
.game-shell.is-playing #hud .hud-pill-level strong,
.game-shell.is-playing #hud .hud-pill-time strong,
.game-shell.is-playing #hud .hud-pill-keys strong,
.game-shell.is-playing #hud .hud-pill-lives strong {
  min-width: 3ch !important;
}
.game-shell.is-playing #hud .hud-pill-score strong {
  min-width: 6ch !important;
}
.game-shell.is-playing #hud .hud-pill-coins strong {
  min-width: 7ch !important;
  max-width: 7ch !important;
}
.game-shell.is-playing #hud .hud-pill-crystals strong {
  min-width: 5ch !important;
}
.game-shell.is-playing #hud .power-pill {
  flex: 1 0 340px !important;
  width: auto !important;
  min-width: 340px !important;
}
.game-shell.is-playing #hud .power-pill strong {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}
@media (max-width: 1040px) {
  .game-shell.is-playing #hud .hud-pill-level {
    flex-basis: 102px !important;
    width: 102px !important;
    min-width: 102px !important;
  }
  .game-shell.is-playing #hud .hud-pill-crystals {
    flex-basis: 116px !important;
    width: 116px !important;
    min-width: 116px !important;
  }
  .game-shell.is-playing #hud .hud-pill-keys,
  .game-shell.is-playing #hud .hud-pill-lives,
  .game-shell.is-playing #hud .hud-pill-time {
    flex-basis: 94px !important;
    width: 94px !important;
    min-width: 94px !important;
  }
  .game-shell.is-playing #hud .hud-pill-score {
    flex-basis: 116px !important;
    width: 116px !important;
    min-width: 116px !important;
  }
  .game-shell.is-playing #hud .hud-pill-coins {
    flex-basis: 138px !important;
    width: 138px !important;
    min-width: 138px !important;
  }
  .game-shell.is-playing #hud .power-pill {
    flex-basis: 230px !important;
    min-width: 230px !important;
  }
}
@media (max-width: 720px) {
  .game-shell.is-playing #hud .hud-pill-level,
  .game-shell.is-playing #hud .hud-pill-keys,
  .game-shell.is-playing #hud .hud-pill-lives,
  .game-shell.is-playing #hud .hud-pill-time {
    flex-basis: 72px !important;
    width: 72px !important;
    min-width: 72px !important;
  }
  .game-shell.is-playing #hud .hud-pill-crystals {
    flex-basis: 86px !important;
    width: 86px !important;
    min-width: 86px !important;
  }
  .game-shell.is-playing #hud .hud-pill-score {
    flex-basis: 92px !important;
    width: 92px !important;
    min-width: 92px !important;
  }
  .game-shell.is-playing #hud .hud-pill-coins {
    flex-basis: 104px !important;
    width: 104px !important;
    min-width: 104px !important;
  }
  .game-shell.is-playing #hud .power-pill {
    flex-basis: 150px !important;
    min-width: 150px !important;
  }
  .game-shell.is-playing #hud .hud-pill strong {
    min-width: 3ch !important;
  }
  .game-shell.is-playing #hud .hud-pill-score strong,
  .game-shell.is-playing #hud .hud-pill-coins strong {
    min-width: 5ch !important;
  }
}

/* v1.26.10 — HUD Power text descender fix.
   Gives the Power value enough vertical breathing room so descenders like the
   bottom of the letter "g" in "Guardian" are not clipped by the HUD row. */
.game-shell.is-playing #hud .power-pill strong {
  line-height: 1.28 !important;
  padding-bottom: 3px !important;
  margin-bottom: -3px !important;
  box-sizing: content-box !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
@media (max-width: 1040px) {
  .game-shell.is-playing #hud .power-pill strong {
    line-height: 1.3 !important;
    padding-bottom: 3px !important;
    margin-bottom: -3px !important;
  }
}
@media (max-width: 720px) {
  .game-shell.is-playing #hud .power-pill strong {
    line-height: 1.32 !important;
    padding-bottom: 2px !important;
    margin-bottom: -2px !important;
  }
}

/* v1.26.11 — Adventure Map title + breathable dashboard polish */
#screen-adventure-map.content-screen.active {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 22px !important;
  padding-top: max(112px, calc(var(--topbar-h) + 26px)) !important;
}

#screen-adventure-map.content-screen > * {
  width: min(1380px, 100%) !important;
}

#screen-adventure-map .hint {
  width: min(1380px, 100%) !important;
  max-width: min(1380px, 100%) !important;
  margin: 0 auto 2px !important;
  padding: 16px 20px !important;
  box-sizing: border-box !important;
  align-self: center !important;
  color: rgba(230, 242, 255, .82) !important;
  line-height: 1.58 !important;
  font-size: clamp(.92rem, 1.1vw, 1rem) !important;
  background:
    radial-gradient(circle at 6% 0%, rgba(114,255,154,.13), transparent 44%),
    linear-gradient(180deg, rgba(0, 31, 45, .72), rgba(0, 12, 22, .72)) !important;
  border: 1px solid rgba(191, 213, 255, .16) !important;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .16) !important;
}

#screen-adventure-map .adventure-map-summary {
  width: min(1380px, 100%) !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 12px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

#screen-adventure-map .adventure-map-summary article {
  position: relative !important;
  min-height: 118px !important;
  padding: 19px 20px 18px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: 9px !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 86% 16%, rgba(114,255,154,.12), transparent 42%),
    linear-gradient(180deg, rgba(0, 32, 47, .95), rgba(0, 12, 22, .96)) !important;
  border: 1px solid rgba(191, 213, 255, .16) !important;
  border-left: 3px solid rgba(114, 255, 154, .55) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 14px 34px rgba(0,0,0,.17) !important;
  text-align: left !important;
}

#screen-adventure-map .adventure-map-summary article::after {
  content: "" !important;
  position: absolute !important;
  inset: auto 14px 11px auto !important;
  width: 42px !important;
  height: 42px !important;
  pointer-events: none !important;
  opacity: .34 !important;
  background: radial-gradient(circle, rgba(114,255,154,.46), transparent 67%) !important;
}

#screen-adventure-map .adventure-map-summary span {
  display: block !important;
  color: rgba(191, 213, 255, .76) !important;
  text-transform: uppercase !important;
  letter-spacing: .095em !important;
  font-weight: 1000 !important;
  font-size: 10.5px !important;
  line-height: 1.25 !important;
}

#screen-adventure-map .adventure-map-summary strong {
  display: block !important;
  color: #fff !important;
  font-size: clamp(22px, 2.1vw, 32px) !important;
  line-height: 1.12 !important;
  letter-spacing: -.02em !important;
  overflow-wrap: anywhere !important;
}

#screen-adventure-map .adventure-map-summary em {
  display: block !important;
  max-width: 100% !important;
  color: #72ff9a !important;
  font-style: normal !important;
  font-size: 12.5px !important;
  line-height: 1.38 !important;
  overflow-wrap: anywhere !important;
}

#screen-adventure-map .adventure-map-legend {
  width: min(1380px, 100%) !important;
  margin: 0 auto !important;
  gap: 8px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

#screen-adventure-map .adventure-map-legend span {
  min-height: 42px !important;
  padding: 0 15px !important;
  border: 1px solid rgba(191,213,255,.15) !important;
  background: linear-gradient(180deg, rgba(0,30,45,.86), rgba(0,10,18,.88)) !important;
  box-shadow: 0 10px 24px rgba(0,0,0,.13) !important;
}

#screen-adventure-map .adventure-island-route {
  margin: 0 auto !important;
  min-height: 410px !important;
  border: 1px solid rgba(191,213,255,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 18px 46px rgba(0,0,0,.18) !important;
}

#screen-adventure-map .adventure-map-grid {
  width: min(1380px, 100%) !important;
  margin: 0 auto !important;
  grid-template-columns: repeat(auto-fit, minmax(390px, 1fr)) !important;
  gap: 12px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
}

#screen-adventure-map .adventure-world-node {
  min-height: 148px !important;
  grid-template-columns: 82px minmax(0, 1fr) auto !important;
  gap: 0 !important;
  border: 1px solid rgba(191,213,255,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 14px 34px rgba(0,0,0,.14) !important;
}

#screen-adventure-map .map-node-copy {
  min-width: 0 !important;
  padding: 18px 20px !important;
  gap: 9px !important;
}

#screen-adventure-map .map-node-copy strong {
  font-size: 1.05rem !important;
  line-height: 1.25 !important;
}

#screen-adventure-map .map-node-copy span,
#screen-adventure-map .map-node-copy em {
  line-height: 1.45 !important;
  overflow-wrap: anywhere !important;
}

#screen-adventure-map .map-node-progress {
  margin: 2px 0 !important;
}

#screen-adventure-map .adventure-world-node > .btn {
  align-self: center !important;
  margin: 0 18px 0 6px !important;
  min-width: 104px !important;
  white-space: nowrap !important;
}

@media (max-width: 1180px) {
  #screen-adventure-map .adventure-map-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  #screen-adventure-map .adventure-map-summary article {
    min-height: 108px !important;
  }
}

@media (max-width: 760px) {
  #screen-adventure-map.content-screen.active {
    gap: 16px !important;
    padding-top: max(96px, calc(var(--topbar-h) + 18px)) !important;
  }
  #screen-adventure-map .hint {
    padding: 14px 15px !important;
  }
  #screen-adventure-map .adventure-map-summary {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  #screen-adventure-map .adventure-map-summary article {
    min-height: 96px !important;
    padding: 16px !important;
  }
  #screen-adventure-map .adventure-map-legend {
    gap: 8px !important;
  }
  #screen-adventure-map .adventure-map-legend span {
    flex: 1 1 calc(50% - 8px) !important;
    min-width: 132px !important;
  }
  #screen-adventure-map .adventure-island-route {
    min-height: 0 !important;
  }
  #screen-adventure-map .adventure-map-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  #screen-adventure-map .adventure-world-node {
    grid-template-columns: 68px minmax(0, 1fr) !important;
    min-height: 132px !important;
  }
  #screen-adventure-map .adventure-world-node > .btn {
    grid-column: 1 / -1 !important;
    margin: 0 14px 14px !important;
    width: calc(100% - 28px) !important;
  }
}


/* v1.26.12 — Adventure Map boss route cleanup + larger world rail icons */
#screen-adventure-map .adventure-route-heading {
  width: min(1380px, 100%) !important;
  margin: 0 auto -2px !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 14px 18px !important;
  border: 1px solid rgba(191,213,255,.16) !important;
  background: linear-gradient(180deg, rgba(0,34,50,.90), rgba(0,14,24,.92)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 14px 32px rgba(0,0,0,.13) !important;
}

#screen-adventure-map .adventure-route-heading span {
  min-width: 112px !important;
  min-height: 34px !important;
  display: inline-grid !important;
  place-items: center !important;
  padding: 0 14px !important;
  color: #062315 !important;
  background: linear-gradient(180deg, #c7ff5a, #72ff9a) !important;
  text-transform: uppercase !important;
  letter-spacing: .1em !important;
  font-size: 11px !important;
  font-weight: 1000 !important;
  box-shadow: 0 10px 24px rgba(114,255,154,.22) !important;
}

#screen-adventure-map .adventure-route-heading strong {
  color: #fff !important;
  font-size: clamp(17px, 1.5vw, 22px) !important;
  line-height: 1.1 !important;
  letter-spacing: -.015em !important;
}

#screen-adventure-map .adventure-route-heading em {
  justify-self: end !important;
  max-width: 520px !important;
  color: rgba(222,236,255,.74) !important;
  font-style: normal !important;
  font-size: 12.5px !important;
  line-height: 1.4 !important;
  text-align: right !important;
}

#screen-adventure-map .island-node {
  min-height: 96px !important;
  padding: 14px 12px 13px !important;
  gap: 7px !important;
}

#screen-adventure-map .island-node strong {
  font-size: 1.28rem !important;
}

#screen-adventure-map .island-node i {
  width: 46px !important;
  height: 46px !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 auto !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background: radial-gradient(circle at 34% 20%, rgba(255,255,255,.32), rgba(114,255,154,.16) 46%, rgba(0,18,26,.56) 100%) !important;
  color: #fff !important;
  font-size: 1.95rem !important;
  line-height: 1 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 20px rgba(0,0,0,.16) !important;
}

#screen-adventure-map .island-node em {
  display: none !important;
}

#screen-adventure-map .boss-state {
  position: absolute !important;
  right: 8px !important;
  bottom: 8px !important;
  width: 22px !important;
  height: 22px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  background: rgba(0,20,30,.76) !important;
  color: rgba(222,236,255,.82) !important;
  font-size: 15px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
}

#screen-adventure-map .boss-state.cleared {
  color: #061f12 !important;
  background: linear-gradient(180deg, #ffe96b, #72ff9a) !important;
  box-shadow: 0 0 18px rgba(114,255,154,.35) !important;
}

#screen-adventure-map .secret-dot {
  top: 8px !important;
  right: 8px !important;
  width: 22px !important;
  height: 22px !important;
}

#screen-adventure-map .secret-dot + .boss-state,
#screen-adventure-map .boss-state + .secret-dot {
  right: 8px !important;
}

#screen-adventure-map .adventure-world-node {
  grid-template-columns: 96px minmax(0, 1fr) auto !important;
}

#screen-adventure-map .map-node-rail {
  gap: 8px !important;
  padding: 14px 8px !important;
  background: radial-gradient(circle at 50% 18%, rgba(114,255,154,.28), transparent 66%), linear-gradient(180deg, rgba(0,34,50,.72), rgba(0,14,24,.78)) !important;
}

#screen-adventure-map .map-node-rail strong {
  min-width: 48px !important;
  height: 38px !important;
  display: grid !important;
  place-items: center !important;
  color: #fff !important;
  font-size: 1.72rem !important;
  line-height: 1 !important;
  letter-spacing: -.04em !important;
}

#screen-adventure-map .map-node-rail span {
  width: 46px !important;
  height: 46px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  background: radial-gradient(circle at 30% 20%, rgba(255,255,255,.26), rgba(114,255,154,.13) 52%, rgba(0,10,18,.56)) !important;
  color: #fff !important;
  font-size: 1.78rem !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 10px 20px rgba(0,0,0,.14) !important;
}

#screen-adventure-map .adventure-world-node.theme-aqua .map-node-rail span { color: #9ff1ff !important; }
#screen-adventure-map .adventure-world-node.theme-lava .map-node-rail span { color: #ffcf5a !important; }
#screen-adventure-map .adventure-world-node.theme-frost .map-node-rail span { color: #e9fbff !important; }
#screen-adventure-map .adventure-world-node.theme-neon .map-node-rail span { color: #ff95ff !important; }
#screen-adventure-map .adventure-world-node.theme-shadow .map-node-rail span { color: #c8b6ff !important; }
#screen-adventure-map .adventure-world-node.theme-storm .map-node-rail span { color: #ffe96b !important; }
#screen-adventure-map .adventure-world-node.theme-moon .map-node-rail span { color: #d4c8ff !important; }
#screen-adventure-map .adventure-world-node.theme-cosmos .map-node-rail span { color: #dff6ff !important; }
#screen-adventure-map .adventure-world-node.theme-firefly .map-node-rail span { color: #f9ff7a !important; }
#screen-adventure-map .adventure-world-node.theme-root .map-node-rail span { color: #dbb37b !important; }

@media (max-width: 1180px) {
  #screen-adventure-map .adventure-route-heading {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
  #screen-adventure-map .adventure-route-heading em {
    justify-self: stretch !important;
    max-width: none !important;
    text-align: left !important;
  }
}

@media (max-width: 760px) {
  #screen-adventure-map .adventure-route-heading {
    padding: 14px !important;
  }
  #screen-adventure-map .adventure-route-heading span {
    width: max-content !important;
    min-width: 0 !important;
  }
  #screen-adventure-map .island-node {
    min-height: 88px !important;
  }
  #screen-adventure-map .island-node i {
    width: 40px !important;
    height: 40px !important;
    font-size: 1.62rem !important;
  }
  #screen-adventure-map .adventure-world-node {
    grid-template-columns: 82px minmax(0, 1fr) !important;
  }
  #screen-adventure-map .map-node-rail span {
    width: 40px !important;
    height: 40px !important;
    font-size: 1.5rem !important;
  }
}

/* v1.26.13 — Adventure Map hint alignment with content grid */
#screen-adventure-map.content-screen > .hint {
  width: min(1380px, 100%) !important;
  max-width: min(1380px, 100%) !important;
  box-sizing: border-box !important;
  align-self: center !important;
}

/* v1.26.15 Worlds hint + wallet alignment fix */
#screen-world-gates.content-screen > .hint,
#screen-world-gates.content-screen > .world-wallet,
#screen-world-gates.content-screen > .world-gates-grid {
  width: min(1380px, 100%) !important;
  max-width: min(1380px, 100%) !important;
  box-sizing: border-box !important;
}
#screen-world-gates.content-screen > .hint {
  margin: 0 auto 12px !important;
}
#screen-world-gates.content-screen > .world-wallet {
  margin: 0 auto 18px !important;
  min-height: 68px !important;
  display: grid !important;
  grid-template-columns: minmax(122px, auto) minmax(170px, 1fr) minmax(166px, auto) minmax(204px, auto) !important;
  align-items: center !important;
  gap: 10px 14px !important;
  padding: 12px 14px 12px 60px !important;
}
#screen-world-gates.content-screen > .world-wallet span {
  min-width: 0 !important;
  white-space: nowrap !important;
  color: rgba(234,243,255,.82) !important;
}
#screen-world-gates.content-screen > .world-wallet strong {
  min-width: 160px !important;
  margin-right: 0 !important;
  font-size: clamp(22px, 2vw, 28px) !important;
  line-height: 1 !important;
  font-variant-numeric: tabular-nums !important;
  text-align: left !important;
}
#screen-world-gates.content-screen > .world-wallet .btn {
  width: 100% !important;
  min-width: 0 !important;
  justify-content: center !important;
  white-space: nowrap !important;
}
@media (max-width: 980px) {
  #screen-world-gates.content-screen > .world-wallet {
    grid-template-columns: minmax(120px, auto) 1fr !important;
  }
  #screen-world-gates.content-screen > .world-wallet .btn {
    min-height: 42px !important;
  }
}
@media (max-width: 620px) {
  #screen-world-gates.content-screen > .world-wallet {
    grid-template-columns: 1fr !important;
    padding: 12px 12px 12px 58px !important;
  }
  #screen-world-gates.content-screen > .world-wallet span,
  #screen-world-gates.content-screen > .world-wallet strong {
    width: 100% !important;
    min-width: 0 !important;
    white-space: normal !important;
  }
}

/* v1.26.16 — Worlds hint micro-alignment fix.
   Keeps the hint, wallet and world cards on the same visual rail, and matches the inner icon offset. */
#screen-world-gates.content-screen {
  --worlds-rail-width: min(1380px, 100%);
}
#screen-world-gates.content-screen > .hint,
#screen-world-gates.content-screen > .world-wallet,
#screen-world-gates.content-screen > .world-gates-grid {
  width: var(--worlds-rail-width) !important;
  max-width: var(--worlds-rail-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}
#screen-world-gates.content-screen > .hint {
  justify-self: center !important;
  align-self: auto !important;
  margin-top: 0 !important;
  margin-bottom: 12px !important;
  padding-left: 60px !important;
  padding-right: 18px !important;
}
#screen-world-gates.content-screen > .hint::before {
  width: 42px !important;
}
@media (max-width: 620px) {
  #screen-world-gates.content-screen > .hint {
    padding-left: 58px !important;
    padding-right: 12px !important;
  }
}

/* v1.26.17 — Shop menu, block rhythm and text alignment polish */
#screen-shop.screen.content-screen.active {
  grid-template-columns: minmax(232px, 292px) minmax(0, 1180px) !important;
  grid-template-rows: auto auto minmax(0, 1fr) !important;
  justify-content: center !important;
  align-content: start !important;
  gap: 16px clamp(18px, 2.2vw, 30px) !important;
  padding: calc(var(--topbar-h, 86px) + 24px) clamp(16px, 2.7vw, 36px) 36px !important;
}

#screen-shop .shop-menu-heading {
  display: grid !important;
  gap: 3px !important;
  padding: 4px 6px 13px !important;
  margin: 0 0 4px !important;
  border-bottom: 1px solid rgba(199, 222, 255, .14) !important;
  color: #fff !important;
}
#screen-shop .shop-menu-heading strong {
  margin: 0 !important;
  color: #fff !important;
  font-size: 15px !important;
  line-height: 1.1 !important;
  letter-spacing: .03em !important;
  text-transform: uppercase !important;
}
#screen-shop .shop-menu-heading span {
  margin: 0 !important;
  color: rgba(217, 232, 255, .66) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
}

#screen-shop .shop-category-strip {
  padding: 14px !important;
  gap: 8px !important;
}
#screen-shop .premium-shop-nav-item {
  min-height: 56px !important;
  grid-template-columns: 38px minmax(0, 1fr) !important;
  gap: 2px 11px !important;
  align-items: center !important;
  padding: 9px 12px !important;
  overflow: hidden !important;
}
#screen-shop .premium-shop-nav-item i {
  width: 34px !important;
  height: 34px !important;
  grid-row: 1 / span 2 !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(var(--shop-accent-rgb, 255, 209, 25), .18) !important;
  background: rgba(255,255,255,.035) !important;
}
#screen-shop .premium-shop-nav-item i svg {
  width: 22px !important;
  height: 22px !important;
}
#screen-shop .premium-shop-nav-item span,
#screen-shop .premium-shop-nav-item small {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
#screen-shop .premium-shop-nav-item span {
  align-self: end !important;
  font-size: 12px !important;
  line-height: 1.05 !important;
  letter-spacing: .025em !important;
}
#screen-shop .premium-shop-nav-item small {
  align-self: start !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
}
#screen-shop .premium-shop-nav-item:hover i,
#screen-shop .premium-shop-nav-item.active i {
  border-color: rgba(var(--shop-accent-rgb, 255, 209, 25), .38) !important;
  background: rgba(var(--shop-accent-rgb, 255, 209, 25), .10) !important;
}

#screen-shop .shop-overview-card {
  grid-template-columns: 58px minmax(0, 1fr) !important;
  align-items: center !important;
  min-height: 82px !important;
  padding: 16px 18px !important;
}
#screen-shop .shop-overview-card > i {
  width: 46px !important;
  height: 46px !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 !important;
  border: 1px solid rgba(var(--shop-accent-rgb, 255, 209, 25), .28) !important;
  background: rgba(var(--shop-accent-rgb, 255, 209, 25), .08) !important;
  font-size: 25px !important;
  line-height: 1 !important;
}
#screen-shop .shop-overview-card > div {
  min-width: 0 !important;
  display: grid !important;
  gap: 5px !important;
}
#screen-shop .shop-overview-card strong {
  margin: 0 !important;
  font-size: 19px !important;
  line-height: 1.12 !important;
}
#screen-shop .shop-overview-card span {
  margin: 0 !important;
  max-width: 820px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.48 !important;
}

#screen-shop .shop-economy-bar {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 10px !important;
}
#screen-shop .economy-tile {
  min-height: 72px !important;
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 11px 12px !important;
}
#screen-shop .economy-tile > i {
  width: 36px !important;
  height: 36px !important;
  display: grid !important;
  place-items: center !important;
  color: var(--shop-accent) !important;
}
#screen-shop .economy-tile > i svg {
  width: 30px !important;
  height: 30px !important;
}
#screen-shop .economy-tile > div {
  min-width: 0 !important;
  display: grid !important;
  gap: 2px !important;
}
#screen-shop .economy-tile strong {
  margin: 0 !important;
  color: #fff !important;
  font-size: clamp(16px, 1.35vw, 22px) !important;
  line-height: 1 !important;
  font-variant-numeric: tabular-nums !important;
  white-space: nowrap !important;
}
#screen-shop .economy-tile span,
#screen-shop .economy-tile small {
  margin: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  line-height: 1.2 !important;
}
#screen-shop .economy-tile span {
  color: rgba(235,245,255,.82) !important;
  font-size: 11px !important;
  font-weight: 950 !important;
}
#screen-shop .economy-tile small {
  color: rgba(217,232,255,.58) !important;
  font-size: 10px !important;
  font-weight: 800 !important;
}

#screen-shop .shop-grid {
  padding-bottom: 42px !important;
}
#screen-shop .premium-shop-section {
  margin: 0 0 28px !important;
  scroll-margin-top: calc(var(--topbar-h, 86px) + 18px) !important;
}
#screen-shop .shop-section-title {
  min-height: 66px !important;
  grid-template-columns: 48px minmax(0, 1fr) !important;
  gap: 14px !important;
  align-items: center !important;
  padding: 0 0 14px !important;
  margin: 0 0 14px !important;
}
#screen-shop .shop-section-icon {
  width: 48px !important;
  height: 48px !important;
}
#screen-shop .shop-section-icon svg {
  width: 25px !important;
  height: 25px !important;
}
#screen-shop .shop-section-copy {
  min-width: 0 !important;
  gap: 5px !important;
}
#screen-shop .shop-section-copy strong {
  color: #fff !important;
  font-size: clamp(20px, 1.55vw, 25px) !important;
  line-height: 1.05 !important;
  letter-spacing: .005em !important;
}
#screen-shop .shop-section-copy span {
  max-width: 620px !important;
  color: rgba(217,232,255,.68) !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}
#screen-shop .premium-shop-section::after {
  top: 8px !important;
  right: 4px !important;
  opacity: .78 !important;
}

#screen-shop .shop-grid-row {
  grid-template-columns: repeat(auto-fit, minmax(304px, 1fr)) !important;
  gap: 16px !important;
  align-items: stretch !important;
}
#screen-shop .v126-shop-tile {
  min-height: 292px !important;
  grid-template-rows: auto 108px minmax(60px, auto) minmax(18px, auto) auto !important;
  gap: 12px !important;
  padding: 16px !important;
}
#screen-shop .shop-tile-head {
  min-height: 50px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 10px !important;
}
#screen-shop .shop-tile-head strong {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #fff !important;
  font-size: 17px !important;
  line-height: 1.18 !important;
  letter-spacing: .005em !important;
  overflow-wrap: anywhere !important;
}
#screen-shop .shop-tile-head em {
  min-height: 25px !important;
  max-width: 128px !important;
  display: inline-grid !important;
  place-items: center !important;
  justify-self: end !important;
  padding: 4px 8px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  line-height: 1 !important;
}
#screen-shop .shop-tile-art {
  min-height: 108px !important;
  margin: 0 !important;
}
#screen-shop .shop-tile-art .shop-svg-icon,
#screen-shop .shop-tile-art .shop-currency-icon {
  width: clamp(78px, 6.2vw, 104px) !important;
  height: clamp(78px, 6.2vw, 104px) !important;
}
#screen-shop .shop-tile-art .shop-emoji-icon {
  font-size: clamp(58px, 5.5vw, 82px) !important;
}
#screen-shop .v126-shop-tile p {
  min-height: 60px !important;
  margin: 0 !important;
  color: rgba(234,243,255,.77) !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.48 !important;
}
#screen-shop .shop-tile-bonus {
  min-height: 20px !important;
  color: var(--v126-green) !important;
  font-size: 12px !important;
  line-height: 1.25 !important;
}
#screen-shop .shop-tile-buy {
  margin-top: auto !important;
  display: grid !important;
  grid-template-columns: minmax(108px, auto) minmax(138px, 1fr) !important;
  gap: 10px !important;
  align-items: stretch !important;
}
#screen-shop .shop-tile-buy .cost {
  min-height: 44px !important;
  display: grid !important;
  align-content: center !important;
  justify-content: start !important;
  padding: 0 11px !important;
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums !important;
}
#screen-shop .shop-tile-buy .btn {
  min-height: 44px !important;
  width: 100% !important;
  padding: 8px 13px !important;
  white-space: nowrap !important;
}

@media (max-width: 1180px) {
  #screen-shop.screen.content-screen.active {
    grid-template-columns: minmax(214px, 260px) minmax(0, 1fr) !important;
  }
  #screen-shop .shop-economy-bar {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
  #screen-shop .shop-grid-row {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
  }
}

@media (max-width: 940px) {
  #screen-shop.screen.content-screen.active {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto auto !important;
    justify-content: stretch !important;
  }
  #screen-shop .shop-overview-card { grid-column: 1 !important; grid-row: 1 !important; }
  #screen-shop .shop-economy-bar { grid-column: 1 !important; grid-row: 2 !important; }
  #screen-shop .shop-category-strip {
    grid-column: 1 !important;
    grid-row: 3 !important;
    position: relative !important;
    top: auto !important;
    height: auto !important;
    max-height: none !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    overflow: visible !important;
  }
  #screen-shop .shop-menu-heading { grid-column: 1 / -1 !important; }
  #screen-shop .premium-shop-nav-item { min-height: 54px !important; }
  #screen-shop .shop-grid { grid-column: 1 !important; grid-row: 4 !important; }
  #screen-shop .shop-economy-bar { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #screen-shop .shop-grid-row { grid-template-columns: repeat(auto-fit, minmax(268px, 1fr)) !important; }
}

@media (max-width: 620px) {
  #screen-shop.screen.content-screen.active {
    padding-left: 10px !important;
    padding-right: 10px !important;
    gap: 12px !important;
  }
  #screen-shop .shop-overview-card {
    grid-template-columns: 48px minmax(0, 1fr) !important;
    padding: 13px !important;
  }
  #screen-shop .shop-overview-card > i {
    width: 38px !important;
    height: 38px !important;
    font-size: 21px !important;
  }
  #screen-shop .shop-economy-bar,
  #screen-shop .shop-category-strip,
  #screen-shop .shop-grid-row {
    grid-template-columns: 1fr !important;
  }
  #screen-shop .shop-section-title {
    grid-template-columns: 42px minmax(0, 1fr) !important;
    gap: 11px !important;
  }
  #screen-shop .shop-section-icon {
    width: 42px !important;
    height: 42px !important;
  }
  #screen-shop .v126-shop-tile {
    min-height: 274px !important;
    padding: 14px !important;
  }
  #screen-shop .shop-tile-head {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  #screen-shop .shop-tile-head em {
    justify-self: start !important;
  }
  #screen-shop .shop-tile-buy {
    grid-template-columns: 1fr !important;
  }
  #screen-shop .shop-tile-buy .cost,
  #screen-shop .shop-tile-buy .btn {
    width: 100% !important;
  }
}

/* v1.26.18 — Shop category tabs: no horizontal menu scroll + single active section */
#screen-shop .shop-category-strip {
  min-width: 0 !important;
  max-width: 100% !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-content: start !important;
  align-items: stretch !important;
  box-sizing: border-box !important;
}
#screen-shop .shop-menu-heading,
#screen-shop .premium-shop-nav-item {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}
#screen-shop .premium-shop-nav-item {
  grid-template-columns: 38px minmax(0, 1fr) !important;
  justify-content: stretch !important;
  text-align: left !important;
}
#screen-shop .premium-shop-nav-item span,
#screen-shop .premium-shop-nav-item small {
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere !important;
}
#screen-shop .premium-shop-nav-item.active {
  border-color: rgba(var(--shop-accent-rgb, 103, 255, 40), .48) !important;
  box-shadow: inset 3px 0 0 var(--shop-accent), inset 0 1px 0 rgba(255,255,255,.13), 0 12px 24px rgba(0,0,0,.18) !important;
}
#screen-shop .shop-grid {
  align-self: start !important;
}
#screen-shop .premium-shop-section {
  margin-bottom: 0 !important;
}
#screen-shop .premium-shop-section:not(.is-active),
#screen-shop .premium-shop-section[hidden] {
  display: none !important;
}
#screen-shop .premium-shop-section.is-active {
  display: block !important;
  animation: berrigoShopSectionIn .18s ease-out both;
}
@keyframes berrigoShopSectionIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 940px) {
  #screen-shop .shop-category-strip {
    grid-template-columns: 1fr !important;
    max-height: none !important;
  }
}


/* v1.26.19 — Shop menu click + single-scroll correction.
   The menu is a real tab rail now: no inner sidebar scrollbar, no horizontal overflow,
   and tab buttons stay above decorative layers for reliable clicks. */
#screen-shop.screen.content-screen.active {
  overflow-y: auto !important;
  overflow-x: hidden !important;
  min-height: 100dvh !important;
}
#screen-shop .shop-category-strip {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
  overscroll-behavior: auto !important;
  position: sticky !important;
  top: calc(var(--topbar-h, 86px) + 16px) !important;
  z-index: 8 !important;
  pointer-events: auto !important;
  align-self: start !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 5px !important;
  padding: 10px !important;
}
#screen-shop .shop-category-strip::-webkit-scrollbar { width: 0 !important; height: 0 !important; }
#screen-shop .shop-menu-heading {
  pointer-events: none !important;
  padding: 2px 5px 9px !important;
  margin-bottom: 3px !important;
}
#screen-shop .premium-shop-nav-item {
  position: relative !important;
  z-index: 9 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
  min-height: 45px !important;
  grid-template-columns: 32px minmax(0, 1fr) !important;
  gap: 1px 9px !important;
  padding: 7px 9px !important;
  overflow: hidden !important;
  touch-action: manipulation !important;
  user-select: none !important;
}
#screen-shop .premium-shop-nav-item i {
  width: 29px !important;
  height: 29px !important;
}
#screen-shop .premium-shop-nav-item i svg {
  width: 19px !important;
  height: 19px !important;
  pointer-events: none !important;
}
#screen-shop .premium-shop-nav-item span,
#screen-shop .premium-shop-nav-item small {
  pointer-events: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#screen-shop .premium-shop-nav-item span {
  font-size: 11px !important;
  line-height: 1.05 !important;
}
#screen-shop .premium-shop-nav-item small {
  font-size: 9px !important;
  line-height: 1.12 !important;
}
#screen-shop .shop-grid {
  position: relative !important;
  z-index: 2 !important;
  min-width: 0 !important;
}
#screen-shop .premium-shop-section.is-active {
  display: block !important;
}
#screen-shop .premium-shop-section:not(.is-active),
#screen-shop .premium-shop-section[hidden] {
  display: none !important;
}
@media (max-width: 940px) {
  #screen-shop .shop-category-strip {
    position: relative !important;
    top: auto !important;
    overflow: visible !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #screen-shop .shop-menu-heading { grid-column: 1 / -1 !important; }
}
@media (max-width: 620px) {
  #screen-shop .shop-category-strip {
    grid-template-columns: 1fr !important;
  }
}

/* v1.26.20 — Shop single page scroll + top alignment polish.
   Fixes the double-scroll issue by letting the game shell be the only page scroller.
   The Shop rail now starts on the same visual row as the active shop content. */
#screen-shop.screen.content-screen.active {
  overflow-y: visible !important;
  overflow-x: hidden !important;
  height: auto !important;
  min-height: 100dvh !important;
  align-items: start !important;
  grid-template-rows: auto auto auto !important;
}
#screen-shop .shop-overview-card {
  grid-column: 2 !important;
  grid-row: 1 !important;
}
#screen-shop .shop-economy-bar {
  grid-column: 2 !important;
  grid-row: 2 !important;
}
#screen-shop .shop-category-strip {
  grid-column: 1 !important;
  grid-row: 3 !important;
  align-self: start !important;
  position: sticky !important;
  top: calc(var(--topbar-h, 86px) + 18px) !important;
  height: auto !important;
  max-height: none !important;
  margin-top: 0 !important;
  overflow: visible !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
}
#screen-shop .shop-grid {
  grid-column: 2 !important;
  grid-row: 3 !important;
  align-self: start !important;
  margin-top: 0 !important;
  padding-bottom: 30px !important;
}
#screen-shop .premium-shop-section.is-active {
  margin-top: 0 !important;
}
#screen-shop .shop-section-title {
  min-height: 56px !important;
  margin-top: 0 !important;
}
@media (max-width: 940px) {
  #screen-shop.screen.content-screen.active {
    overflow-y: visible !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto auto !important;
  }
  #screen-shop .shop-overview-card { grid-column: 1 !important; grid-row: 1 !important; }
  #screen-shop .shop-economy-bar { grid-column: 1 !important; grid-row: 2 !important; }
  #screen-shop .shop-category-strip {
    grid-column: 1 !important;
    grid-row: 3 !important;
    position: relative !important;
    top: auto !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #screen-shop .shop-grid { grid-column: 1 !important; grid-row: 4 !important; }
}
@media (max-width: 620px) {
  #screen-shop .shop-category-strip { grid-template-columns: 1fr !important; }
}



/* v1.26.21 — real Shop single-scroll + top rail alignment fix.
   The previous build still allowed both #game-shell and #screen-shop to scroll on Shop.
   Shop now owns the only vertical scroll; the shell is locked while Shop is active.
   The left Shop Menu starts on the same row as Shop Economy and the content header. */
#game-shell.is-shop-screen,
#game-shell.has-menu-screen.is-shop-screen,
#game-shell:has(> #screen-shop.screen.content-screen.active) {
  overflow: hidden !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
}
#game-shell.is-shop-screen::-webkit-scrollbar,
#game-shell:has(> #screen-shop.screen.content-screen.active)::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}
#screen-shop.screen.content-screen.active {
  height: 100dvh !important;
  max-height: 100dvh !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  align-items: start !important;
  grid-template-columns: minmax(238px, 302px) minmax(0, 1fr) !important;
  grid-template-rows: auto auto auto !important;
  padding: calc(var(--topbar-h, 86px) + 22px) clamp(14px, 2.5vw, 30px) 30px !important;
}
#screen-shop .shop-category-strip {
  grid-column: 1 !important;
  grid-row: 1 / span 3 !important;
  align-self: start !important;
  position: sticky !important;
  top: calc(var(--topbar-h, 86px) + 22px) !important;
  margin-top: 0 !important;
  height: auto !important;
  max-height: calc(100dvh - var(--topbar-h, 86px) - 52px) !important;
  overflow: visible !important;
  overflow-x: hidden !important;
  overflow-y: visible !important;
}
#screen-shop .shop-overview-card {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: start !important;
  margin-top: 0 !important;
}
#screen-shop .shop-economy-bar {
  grid-column: 2 !important;
  grid-row: 2 !important;
  align-self: start !important;
  margin-top: 0 !important;
}
#screen-shop .shop-grid {
  grid-column: 2 !important;
  grid-row: 3 !important;
  align-self: start !important;
  margin-top: 0 !important;
  padding-bottom: 30px !important;
}
#screen-shop .shop-menu-heading {
  margin-top: 0 !important;
}
#screen-shop .shop-section-title {
  margin-top: 0 !important;
}
@media (max-width: 940px) {
  #screen-shop.screen.content-screen.active {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto auto !important;
    overflow-y: auto !important;
  }
  #screen-shop .shop-category-strip {
    grid-column: 1 !important;
    grid-row: 3 !important;
    position: relative !important;
    top: auto !important;
    max-height: none !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  #screen-shop .shop-overview-card { grid-column: 1 !important; grid-row: 1 !important; }
  #screen-shop .shop-economy-bar { grid-column: 1 !important; grid-row: 2 !important; }
  #screen-shop .shop-grid { grid-column: 1 !important; grid-row: 4 !important; }
  #screen-shop .shop-menu-heading { grid-column: 1 / -1 !important; }
}
@media (max-width: 620px) {
  #screen-shop .shop-category-strip { grid-template-columns: 1fr !important; }
}


/* v1.26.22 — HARD FIX: Shop has exactly one page scrollbar and the left rail starts at the same top line as Shop Economy.
   This block intentionally overrides all older v1.26.17–v1.26.21 Shop scroll/alignment rules. */
html:has(body.is-shop-screen),
body.is-shop-screen {
  width: 100% !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
  overscroll-behavior: none !important;
  scrollbar-width: none !important;
}
body.is-shop-screen::-webkit-scrollbar,
html:has(body.is-shop-screen)::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}
body.is-shop-screen #game-shell,
body.is-shop-screen #game-shell.has-menu-screen,
body.is-shop-screen #game-shell.is-shop-screen {
  width: 100vw !important;
  height: 100dvh !important;
  min-height: 100dvh !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
  overscroll-behavior: none !important;
  scrollbar-width: none !important;
}
body.is-shop-screen #game-shell::-webkit-scrollbar,
body.is-shop-screen #game-shell.has-menu-screen::-webkit-scrollbar,
body.is-shop-screen #game-shell.is-shop-screen::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}
body.is-shop-screen #screen-shop.screen.content-screen.active {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100dvh !important;
  min-height: 0 !important;
  max-height: 100dvh !important;
  display: grid !important;
  grid-template-columns: clamp(286px, 20vw, 370px) minmax(0, 1fr) !important;
  grid-template-rows: auto auto minmax(0, auto) !important;
  align-items: start !important;
  gap: 18px 24px !important;
  padding: calc(var(--topbar-h, 86px) + 28px) clamp(18px, 2.8vw, 36px) 34px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable !important;
}
body.is-shop-screen #screen-shop .shop-category-strip {
  grid-column: 1 !important;
  grid-row: 1 / span 3 !important;
  align-self: start !important;
  justify-self: stretch !important;
  position: sticky !important;
  top: calc(var(--topbar-h, 86px) + 28px) !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  transform: none !important;
  overflow: hidden !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
  scrollbar-width: none !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-content: start !important;
  gap: 7px !important;
  padding: 16px 14px !important;
  z-index: 9 !important;
}
body.is-shop-screen #screen-shop .shop-category-strip::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}
body.is-shop-screen #screen-shop .shop-overview-card {
  grid-column: 2 !important;
  grid-row: 1 !important;
  align-self: start !important;
  margin: 0 !important;
}
body.is-shop-screen #screen-shop .shop-economy-bar {
  grid-column: 2 !important;
  grid-row: 2 !important;
  align-self: start !important;
  margin: 0 !important;
}
body.is-shop-screen #screen-shop .shop-grid {
  grid-column: 2 !important;
  grid-row: 3 !important;
  align-self: start !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 0 40px !important;
  overflow: visible !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
  scrollbar-width: none !important;
}
body.is-shop-screen #screen-shop .shop-grid::-webkit-scrollbar {
  width: 0 !important;
  height: 0 !important;
  display: none !important;
}
body.is-shop-screen #screen-shop .premium-shop-section.is-active,
body.is-shop-screen #screen-shop .premium-shop-section:not([hidden]) {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.is-shop-screen #screen-shop .premium-shop-section:not(.is-active),
body.is-shop-screen #screen-shop .premium-shop-section[hidden] {
  display: none !important;
}
body.is-shop-screen #screen-shop .shop-menu-heading {
  margin: 0 0 4px !important;
  padding: 0 4px 10px !important;
}
body.is-shop-screen #screen-shop .premium-shop-nav-item {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}
body.is-shop-screen #screen-shop .shop-section-title {
  min-height: 62px !important;
  margin: 0 0 18px !important;
  align-items: center !important;
}
@media (max-width: 940px) {
  body.is-shop-screen #screen-shop.screen.content-screen.active {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto auto !important;
    gap: 14px !important;
    overflow-y: auto !important;
  }
  body.is-shop-screen #screen-shop .shop-category-strip {
    grid-column: 1 !important;
    grid-row: 3 !important;
    position: relative !important;
    top: auto !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    overflow: hidden !important;
  }
  body.is-shop-screen #screen-shop .shop-menu-heading { grid-column: 1 / -1 !important; }
  body.is-shop-screen #screen-shop .shop-overview-card { grid-column: 1 !important; grid-row: 1 !important; }
  body.is-shop-screen #screen-shop .shop-economy-bar { grid-column: 1 !important; grid-row: 2 !important; }
  body.is-shop-screen #screen-shop .shop-grid { grid-column: 1 !important; grid-row: 4 !important; }
}
@media (max-width: 620px) {
  body.is-shop-screen #screen-shop.screen.content-screen.active {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  body.is-shop-screen #screen-shop .shop-category-strip { grid-template-columns: 1fr !important; }
}

/* v1.26.23 — Shop floating menu + exact top alignment.
   The left Shop Menu is now pinned to the same first row as the Shop Economy card
   and remains visible while the Shop page content scrolls. */
body.is-shop-screen #screen-shop.screen.content-screen.active {
  grid-template-columns: clamp(286px, 20vw, 370px) minmax(0, 1fr) !important;
  grid-template-rows: auto auto auto !important;
  grid-template-areas:
    "shop-menu shop-economy-hero"
    "shop-menu shop-economy-wallet"
    "shop-menu shop-active-content" !important;
  align-content: start !important;
  align-items: start !important;
  justify-content: center !important;
  gap: 18px 24px !important;
}
body.is-shop-screen #screen-shop .shop-category-strip {
  grid-area: shop-menu !important;
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: start !important;
  justify-self: stretch !important;
  position: sticky !important;
  top: calc(var(--topbar-h, 86px) + 28px) !important;
  width: 100% !important;
  max-height: calc(100dvh - var(--topbar-h, 86px) - 58px) !important;
  margin: 0 !important;
  transform: none !important;
  z-index: 24 !important;
  overflow: hidden !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
  border: 1px solid rgba(168, 203, 255, .18) !important;
  background:
    linear-gradient(180deg, rgba(10, 27, 40, .96), rgba(5, 16, 27, .93)) !important;
  box-shadow:
    0 22px 46px rgba(0, 0, 0, .28),
    inset 0 1px 0 rgba(255, 255, 255, .06) !important;
  backdrop-filter: blur(12px) saturate(1.12) !important;
}
body.is-shop-screen #screen-shop .shop-overview-card {
  grid-area: shop-economy-hero !important;
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: start !important;
  margin: 0 !important;
}
body.is-shop-screen #screen-shop .shop-economy-bar {
  grid-area: shop-economy-wallet !important;
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: start !important;
  margin: 0 !important;
}
body.is-shop-screen #screen-shop .shop-grid {
  grid-area: shop-active-content !important;
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: start !important;
  margin: 0 !important;
}
body.is-shop-screen #screen-shop .shop-menu-heading {
  padding: 0 4px 12px !important;
  margin: 0 0 8px !important;
}
body.is-shop-screen #screen-shop .premium-shop-nav-item {
  min-height: 58px !important;
}
body.is-shop-screen #screen-shop .premium-shop-section.is-active,
body.is-shop-screen #screen-shop .premium-shop-section:not([hidden]) {
  margin-top: 0 !important;
}
@media (max-width: 940px) {
  body.is-shop-screen #screen-shop.screen.content-screen.active {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto auto !important;
    grid-template-areas:
      "shop-economy-hero"
      "shop-economy-wallet"
      "shop-menu"
      "shop-active-content" !important;
  }
  body.is-shop-screen #screen-shop .shop-category-strip {
    position: relative !important;
    top: auto !important;
    max-height: none !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    z-index: 1 !important;
  }
  body.is-shop-screen #screen-shop .shop-menu-heading {
    grid-column: 1 / -1 !important;
  }
}
@media (max-width: 620px) {
  body.is-shop-screen #screen-shop .shop-category-strip {
    grid-template-columns: 1fr !important;
  }
}

/* v1.26.24 — TRUE Shop menu alignment fallback.
   Fixes older Shop layout overrides even when body helper classes are delayed.
   The Shop sidebar is a first-row grid item, aligned with the Shop Economy card,
   and stays sticky while #screen-shop owns the single page scroll. */
#screen-shop.screen.content-screen.active,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active,
body.is-shop-screen #screen-shop.screen.content-screen.active {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100dvh !important;
  min-height: 0 !important;
  max-height: 100dvh !important;
  display: grid !important;
  grid-template-columns: clamp(300px, 20vw, 380px) minmax(0, 1fr) !important;
  grid-template-rows: auto auto auto !important;
  grid-template-areas:
    "shop-menu shop-economy-hero"
    "shop-menu shop-economy-wallet"
    "shop-menu shop-active-content" !important;
  align-content: start !important;
  align-items: start !important;
  justify-content: center !important;
  gap: 18px 24px !important;
  padding: calc(var(--topbar-h, 86px) + 28px) clamp(18px, 2.8vw, 36px) 34px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-gutter: stable !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-category-strip,
body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-category-strip {
  grid-area: shop-menu !important;
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: start !important;
  justify-self: stretch !important;
  position: sticky !important;
  top: calc(var(--topbar-h, 86px) + 28px) !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: calc(100dvh - var(--topbar-h, 86px) - 58px) !important;
  margin: 0 !important;
  transform: none !important;
  z-index: 30 !important;
  overflow: hidden !important;
  overflow-x: hidden !important;
  overflow-y: hidden !important;
  display: grid !important;
  grid-template-columns: 1fr !important;
  align-content: start !important;
  gap: 7px !important;
  box-sizing: border-box !important;
}
#screen-shop.screen.content-screen.active > .shop-overview-card,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-overview-card,
body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-overview-card {
  grid-area: shop-economy-hero !important;
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  margin: 0 !important;
}
#screen-shop.screen.content-screen.active > .shop-economy-bar,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-economy-bar,
body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-economy-bar {
  grid-area: shop-economy-wallet !important;
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  margin: 0 !important;
}
#screen-shop.screen.content-screen.active > #shop-grid.shop-grid,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > #shop-grid.shop-grid,
body.is-shop-screen #screen-shop.screen.content-screen.active > #shop-grid.shop-grid {
  grid-area: shop-active-content !important;
  grid-column: auto !important;
  grid-row: auto !important;
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 0 40px !important;
  overflow: visible !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip .shop-menu-heading {
  margin: 0 0 8px !important;
  padding: 0 4px 12px !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip .premium-shop-nav-item {
  min-height: 58px !important;
  width: 100% !important;
}
#screen-shop.screen.content-screen.active > #shop-grid .premium-shop-section.is-active,
#screen-shop.screen.content-screen.active > #shop-grid .premium-shop-section:not([hidden]) {
  margin-top: 0 !important;
}
@media (max-width: 940px) {
  #screen-shop.screen.content-screen.active,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active,
  body.is-shop-screen #screen-shop.screen.content-screen.active {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto auto !important;
    grid-template-areas:
      "shop-economy-hero"
      "shop-economy-wallet"
      "shop-menu"
      "shop-active-content" !important;
  }
  #screen-shop.screen.content-screen.active > .shop-category-strip,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-category-strip,
  body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-category-strip {
    position: relative !important;
    top: auto !important;
    max-height: none !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    z-index: 1 !important;
  }
  #screen-shop.screen.content-screen.active > .shop-category-strip .shop-menu-heading {
    grid-column: 1 / -1 !important;
  }
}
@media (max-width: 620px) {
  #screen-shop.screen.content-screen.active > .shop-category-strip,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-category-strip,
  body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-category-strip {
    grid-template-columns: 1fr !important;
  }
}


/* v1.26.25 — Shop Economy/right-column alignment + visible Shop hint.
   Shop Menu stays the left sticky rail; Shop Economy, the hint and currency tiles stay in the right content column. */
#screen-shop.screen.content-screen.active,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active,
body.is-shop-screen #screen-shop.screen.content-screen.active {
  display: grid !important;
  grid-template-columns: clamp(300px, 20vw, 380px) minmax(0, 1fr) !important;
  grid-template-rows: auto auto auto auto !important;
  grid-template-areas:
    "shop-menu shop-economy-hero"
    "shop-menu shop-page-hint"
    "shop-menu shop-economy-wallet"
    "shop-menu shop-active-content" !important;
  align-content: start !important;
  align-items: start !important;
  gap: 14px 24px !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-category-strip,
body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-category-strip {
  grid-area: shop-menu !important;
  grid-column: shop-menu !important;
  grid-row: shop-menu !important;
  align-self: start !important;
  justify-self: stretch !important;
  position: sticky !important;
  top: calc(var(--topbar-h, 86px) + 28px) !important;
  z-index: 40 !important;
  margin: 0 !important;
}
#screen-shop.screen.content-screen.active > .shop-overview-card,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-overview-card,
body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-overview-card {
  grid-area: shop-economy-hero !important;
  grid-column: shop-economy-hero !important;
  grid-row: shop-economy-hero !important;
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
#screen-shop.screen.content-screen.active > .hint,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint {
  display: grid !important;
  grid-area: shop-page-hint !important;
  grid-column: shop-page-hint !important;
  grid-row: shop-page-hint !important;
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 13px 16px 13px 52px !important;
  min-height: 52px !important;
  align-content: center !important;
  position: relative !important;
  z-index: 2 !important;
  border: 1px solid rgba(191,213,255,.16) !important;
  background:
    linear-gradient(90deg, rgba(var(--shop-accent-rgb,255,209,25), .12), rgba(7,18,29,.72)),
    linear-gradient(180deg, rgba(21,35,49,.82), rgba(7,18,29,.70)) !important;
  color: rgba(235,245,255,.78) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 28px rgba(0,0,0,.16) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  line-height: 1.45 !important;
  text-align: left !important;
}
#screen-shop.screen.content-screen.active > .hint::before,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint::before,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint::before {
  content: "i" !important;
  position: absolute !important;
  left: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 24px !important;
  height: 24px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(var(--shop-accent-rgb,255,209,25), .32) !important;
  background: rgba(var(--shop-accent-rgb,255,209,25), .12) !important;
  color: var(--shop-accent, #ffd119) !important;
  font-size: 13px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  font-style: normal !important;
  box-shadow: 0 0 16px rgba(var(--shop-accent-rgb,255,209,25), .13) !important;
}
#screen-shop.screen.content-screen.active > .shop-economy-bar,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-economy-bar,
body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-economy-bar {
  grid-area: shop-economy-wallet !important;
  grid-column: shop-economy-wallet !important;
  grid-row: shop-economy-wallet !important;
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
#screen-shop.screen.content-screen.active > #shop-grid.shop-grid,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > #shop-grid.shop-grid,
body.is-shop-screen #screen-shop.screen.content-screen.active > #shop-grid.shop-grid {
  grid-area: shop-active-content !important;
  grid-column: shop-active-content !important;
  grid-row: shop-active-content !important;
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
@media (max-width: 940px) {
  #screen-shop.screen.content-screen.active,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active,
  body.is-shop-screen #screen-shop.screen.content-screen.active {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto auto auto !important;
    grid-template-areas:
      "shop-economy-hero"
      "shop-page-hint"
      "shop-economy-wallet"
      "shop-menu"
      "shop-active-content" !important;
  }
  #screen-shop.screen.content-screen.active > .shop-category-strip,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-category-strip,
  body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-category-strip {
    position: relative !important;
    top: auto !important;
    z-index: 2 !important;
  }
}

/* v1.26.26 — Shop Economy removed, combined hint + wallet/product purchase reliability.
   The left Shop Menu remains sticky; the right column starts with the combined information hint,
   then currency tiles, then the active shop tab content. */
#screen-shop.screen.content-screen.active,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active,
body.is-shop-screen #screen-shop.screen.content-screen.active {
  grid-template-columns: clamp(300px, 20vw, 380px) minmax(0, 1fr) !important;
  grid-template-rows: auto auto auto !important;
  grid-template-areas:
    "shop-menu shop-page-hint"
    "shop-menu shop-economy-wallet"
    "shop-menu shop-active-content" !important;
  align-content: start !important;
  align-items: start !important;
  gap: 14px 24px !important;
}
#screen-shop.screen.content-screen.active > .shop-overview-card,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-overview-card,
body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-overview-card {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-category-strip,
body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-category-strip {
  grid-area: shop-menu !important;
  grid-column: shop-menu !important;
  grid-row: shop-menu !important;
  align-self: start !important;
  justify-self: stretch !important;
  position: sticky !important;
  top: calc(var(--topbar-h, 86px) + 28px) !important;
  z-index: 40 !important;
  margin: 0 !important;
}
#screen-shop.screen.content-screen.active > .hint,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint {
  display: grid !important;
  grid-area: shop-page-hint !important;
  grid-column: shop-page-hint !important;
  grid-row: shop-page-hint !important;
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  min-height: 70px !important;
  padding: 15px 18px 15px 56px !important;
  align-content: center !important;
  position: relative !important;
  z-index: 2 !important;
  border: 1px solid rgba(191,213,255,.16) !important;
  background:
    linear-gradient(90deg, rgba(var(--shop-accent-rgb,255,209,25), .12), rgba(7,18,29,.72)),
    linear-gradient(180deg, rgba(21,35,49,.82), rgba(7,18,29,.70)) !important;
  color: rgba(235,245,255,.82) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 12px 28px rgba(0,0,0,.16) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  line-height: 1.45 !important;
  text-align: left !important;
}
#screen-shop.screen.content-screen.active > .hint::before,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint::before,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint::before {
  content: "i" !important;
  position: absolute !important;
  left: 16px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 26px !important;
  height: 26px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(var(--shop-accent-rgb,255,209,25), .34) !important;
  background: rgba(var(--shop-accent-rgb,255,209,25), .12) !important;
  color: var(--shop-accent, #ffd119) !important;
  font-size: 13px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  font-style: normal !important;
  box-shadow: 0 0 16px rgba(var(--shop-accent-rgb,255,209,25), .13) !important;
}
#screen-shop.screen.content-screen.active > .shop-economy-bar,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-economy-bar,
body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-economy-bar {
  grid-area: shop-economy-wallet !important;
  grid-column: shop-economy-wallet !important;
  grid-row: shop-economy-wallet !important;
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
#screen-shop.screen.content-screen.active > #shop-grid.shop-grid,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > #shop-grid.shop-grid,
body.is-shop-screen #screen-shop.screen.content-screen.active > #shop-grid.shop-grid {
  grid-area: shop-active-content !important;
  grid-column: shop-active-content !important;
  grid-row: shop-active-content !important;
  align-self: start !important;
  justify-self: stretch !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}
#screen-shop .shop-card-bottom .btn,
#screen-shop [data-shop-buy],
#screen-shop [data-buy] {
  pointer-events: auto !important;
  cursor: pointer !important;
  position: relative !important;
  z-index: 12 !important;
}
@media (max-width: 940px) {
  #screen-shop.screen.content-screen.active,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active,
  body.is-shop-screen #screen-shop.screen.content-screen.active {
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto auto !important;
    grid-template-areas:
      "shop-page-hint"
      "shop-economy-wallet"
      "shop-menu"
      "shop-active-content" !important;
  }
  #screen-shop.screen.content-screen.active > .shop-category-strip,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-category-strip,
  body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-category-strip {
    position: relative !important;
    top: auto !important;
    z-index: 2 !important;
  }
}

/* v1.26.27 — Shop sticky menu true top alignment + complete category visibility.
   The Shop screen now lives below the fixed global header instead of simulating the header
   with a large internal padding. This keeps the left Shop Menu aligned with the right hint,
   removes the empty sticky gap when long tabs scroll, and lets the menu show/scroll all rows. */
#screen-shop.screen.content-screen.active,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active,
body.is-shop-screen #screen-shop.screen.content-screen.active {
  inset: var(--topbar-h, 86px) 0 0 0 !important;
  height: calc(100dvh - var(--topbar-h, 86px)) !important;
  max-height: calc(100dvh - var(--topbar-h, 86px)) !important;
  min-height: 0 !important;
  padding: 14px clamp(14px, 2.5vw, 30px) 28px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  overscroll-behavior: contain !important;
  grid-template-columns: clamp(286px, 20vw, 372px) minmax(0, 1fr) !important;
  grid-template-rows: auto auto auto !important;
  grid-template-areas:
    "shop-menu shop-page-hint"
    "shop-menu shop-economy-wallet"
    "shop-menu shop-active-content" !important;
  gap: 14px 24px !important;
  align-content: start !important;
  align-items: start !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-category-strip,
body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-category-strip {
  grid-area: shop-menu !important;
  grid-column: shop-menu !important;
  grid-row: shop-menu !important;
  align-self: start !important;
  justify-self: stretch !important;
  position: sticky !important;
  top: 0 !important;
  margin: 0 !important;
  z-index: 42 !important;
  max-height: calc(100dvh - var(--topbar-h, 86px) - 28px) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(var(--shop-accent-rgb, 103, 255, 40), .58) rgba(255,255,255,.035) !important;
  padding: 9px !important;
  gap: 5px !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip::-webkit-scrollbar {
  width: 6px !important;
  height: 0 !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip::-webkit-scrollbar-track {
  background: rgba(255,255,255,.035) !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, rgba(var(--shop-accent-rgb, 103, 255, 40), .78), rgba(17,221,255,.38)) !important;
  border-radius: 999px !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip .shop-menu-heading {
  padding: 0 5px 7px !important;
  margin: 0 0 4px !important;
  min-height: 0 !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip .shop-menu-heading strong {
  line-height: 1.05 !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip .shop-menu-heading span {
  line-height: 1.22 !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip .premium-shop-nav-item {
  min-height: 42px !important;
  grid-template-columns: 29px minmax(0, 1fr) !important;
  gap: 1px 9px !important;
  padding: 6px 8px !important;
  align-items: center !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip .premium-shop-nav-item i {
  width: 28px !important;
  height: 28px !important;
  font-size: 16px !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip .premium-shop-nav-item i svg {
  width: 18px !important;
  height: 18px !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip .premium-shop-nav-item span {
  font-size: 10.5px !important;
  line-height: 1.08 !important;
}
#screen-shop.screen.content-screen.active > .shop-category-strip .premium-shop-nav-item small {
  font-size: 8.5px !important;
  line-height: 1.08 !important;
  letter-spacing: .08em !important;
}
#screen-shop.screen.content-screen.active > .hint,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint {
  grid-area: shop-page-hint !important;
  grid-column: shop-page-hint !important;
  grid-row: shop-page-hint !important;
  align-self: start !important;
  margin: 0 !important;
}
#screen-shop.screen.content-screen.active > .shop-economy-bar,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-economy-bar,
body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-economy-bar {
  grid-area: shop-economy-wallet !important;
  grid-column: shop-economy-wallet !important;
  grid-row: shop-economy-wallet !important;
  margin: 0 !important;
}
#screen-shop.screen.content-screen.active > #shop-grid.shop-grid,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > #shop-grid.shop-grid,
body.is-shop-screen #screen-shop.screen.content-screen.active > #shop-grid.shop-grid {
  grid-area: shop-active-content !important;
  grid-column: shop-active-content !important;
  grid-row: shop-active-content !important;
  margin: 0 !important;
  padding-bottom: 30px !important;
  overflow: visible !important;
}
@media (max-width: 940px) {
  #screen-shop.screen.content-screen.active,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active,
  body.is-shop-screen #screen-shop.screen.content-screen.active {
    inset: var(--topbar-h, 86px) 0 0 0 !important;
    height: calc(100dvh - var(--topbar-h, 86px)) !important;
    max-height: calc(100dvh - var(--topbar-h, 86px)) !important;
    padding: 12px 14px 24px !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto auto auto !important;
    grid-template-areas:
      "shop-page-hint"
      "shop-economy-wallet"
      "shop-menu"
      "shop-active-content" !important;
  }
  #screen-shop.screen.content-screen.active > .shop-category-strip,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-category-strip,
  body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-category-strip {
    position: relative !important;
    top: auto !important;
    max-height: none !important;
    overflow: visible !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 620px) {
  #screen-shop.screen.content-screen.active > .shop-category-strip,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .shop-category-strip,
  body.is-shop-screen #screen-shop.screen.content-screen.active > .shop-category-strip {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* v1.26.28 — Shop product card breathing room + hint/section text alignment.
   Fixes Early Access tiles where text could feel pressed into the art area,
   centers the hint icon, and aligns section subtitles with their titles. */
#screen-shop.screen.content-screen.active > .hint,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint {
  display: grid !important;
  grid-template-columns: 34px minmax(0, 1fr) !important;
  column-gap: 12px !important;
  align-items: center !important;
  align-content: center !important;
  padding: 14px 18px !important;
  min-height: 62px !important;
  line-height: 1.48 !important;
}
#screen-shop.screen.content-screen.active > .hint::before,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint::before,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint::before {
  position: static !important;
  inset: auto !important;
  transform: none !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
  width: 32px !important;
  height: 32px !important;
  display: grid !important;
  place-items: center !important;
  place-self: center !important;
  line-height: 1 !important;
}
#screen-shop.screen.content-screen.active > .hint::after,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint::after,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint::after {
  content: none !important;
  display: none !important;
}

#screen-shop .shop-section-title {
  display: grid !important;
  grid-template-columns: 48px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 14px !important;
  text-align: left !important;
}
#screen-shop .shop-section-copy {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  justify-items: start !important;
  align-items: start !important;
  align-self: center !important;
  gap: 4px !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: left !important;
}
#screen-shop .shop-section-copy strong,
#screen-shop .shop-section-copy span {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  text-align: left !important;
}
#screen-shop .shop-section-copy span {
  max-width: 720px !important;
  line-height: 1.32 !important;
}

#screen-shop .shop-grid-row {
  align-items: stretch !important;
  gap: clamp(14px, 1.35vw, 22px) !important;
}
#screen-shop .v126-shop-tile {
  display: grid !important;
  grid-template-areas:
    "shop-head"
    "shop-art"
    "shop-desc"
    "shop-bonus"
    "shop-buy" !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: auto minmax(124px, auto) minmax(58px, auto) minmax(0, auto) auto !important;
  gap: 14px !important;
  min-height: 330px !important;
  padding: clamp(16px, 1.25vw, 22px) !important;
  overflow: hidden !important;
  isolation: isolate !important;
  align-content: start !important;
}
#screen-shop .shop-tile-head {
  grid-area: shop-head !important;
  position: relative !important;
  z-index: 4 !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 12px !important;
}
#screen-shop .shop-tile-head strong {
  line-height: 1.18 !important;
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}
#screen-shop .shop-tile-head em {
  align-self: start !important;
  justify-self: end !important;
  line-height: 1 !important;
}
#screen-shop .shop-tile-art {
  grid-area: shop-art !important;
  position: relative !important;
  z-index: 1 !important;
  width: 100% !important;
  min-height: 124px !important;
  height: auto !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 !important;
  padding: 12px !important;
  overflow: hidden !important;
}
#screen-shop .shop-tile-art .shop-svg-icon,
#screen-shop .shop-tile-art .shop-currency-icon {
  width: clamp(70px, 6vw, 96px) !important;
  height: clamp(70px, 6vw, 96px) !important;
  max-width: 42% !important;
  max-height: 96px !important;
  place-self: center !important;
  position: relative !important;
  z-index: 2 !important;
}
#screen-shop .shop-tile-art .shop-emoji-icon {
  position: relative !important;
  z-index: 2 !important;
  place-self: center !important;
  font-size: clamp(54px, 5vw, 78px) !important;
  line-height: 1 !important;
}
#screen-shop .shop-tile-art::before,
#screen-shop .shop-tile-art::after {
  pointer-events: none !important;
  z-index: 0 !important;
}
#screen-shop .v126-shop-tile p {
  grid-area: shop-desc !important;
  position: relative !important;
  z-index: 4 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12.5px !important;
  line-height: 1.5 !important;
  color: rgba(235,245,255,.79) !important;
  overflow-wrap: anywhere !important;
}
#screen-shop .shop-tile-bonus {
  grid-area: shop-bonus !important;
  position: relative !important;
  z-index: 4 !important;
  min-height: 20px !important;
  display: flex !important;
  align-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.35 !important;
  overflow-wrap: anywhere !important;
}
#screen-shop .shop-card-bottom.shop-tile-buy {
  grid-area: shop-buy !important;
  position: relative !important;
  z-index: 5 !important;
  margin-top: auto !important;
  display: grid !important;
  grid-template-columns: minmax(108px, auto) minmax(150px, 1fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
}
#screen-shop .shop-card-bottom.shop-tile-buy .cost,
#screen-shop .shop-card-bottom.shop-tile-buy .btn {
  min-height: 46px !important;
}
#screen-shop .v126-shop-tile:not(:has(.shop-tile-bonus)) {
  grid-template-rows: auto minmax(124px, auto) minmax(58px, auto) auto !important;
  grid-template-areas:
    "shop-head"
    "shop-art"
    "shop-desc"
    "shop-buy" !important;
}
@media (max-width: 620px) {
  #screen-shop.screen.content-screen.active > .hint,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint,
  body.is-shop-screen #screen-shop.screen.content-screen.active > .hint {
    grid-template-columns: 30px minmax(0, 1fr) !important;
    column-gap: 10px !important;
    padding: 13px 14px !important;
  }
  #screen-shop.screen.content-screen.active > .hint::before,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint::before,
  body.is-shop-screen #screen-shop.screen.content-screen.active > .hint::before {
    width: 28px !important;
    height: 28px !important;
  }
  #screen-shop .v126-shop-tile {
    min-height: 310px !important;
    grid-template-rows: auto minmax(112px, auto) minmax(54px, auto) minmax(0, auto) auto !important;
  }
  #screen-shop .shop-card-bottom.shop-tile-buy {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}

/* v1.26.29 — Shop real card separation + centered hint icon.
   Strong final overrides: product tiles use separated areas, card pseudo layers are removed,
   art never floats behind text, and the hint icon is centered inside its own cell. */
#screen-shop.screen.content-screen.active > .hint,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 13px !important;
  padding: 15px 18px !important;
  min-height: 64px !important;
  max-width: 100% !important;
  overflow: hidden !important;
  line-height: 1.48 !important;
  box-sizing: border-box !important;
}
#screen-shop.screen.content-screen.active > .hint::before,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint::before,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint::before {
  content: "" !important;
  position: static !important;
  inset: auto !important;
  transform: none !important;
  flex: 0 0 34px !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  max-width: 34px !important;
  max-height: 34px !important;
  display: block !important;
  align-self: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 12px !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 50% 38%, rgba(255,255,255,.34), transparent 42%),
    linear-gradient(135deg, rgba(103,255,40,.88), rgba(38,220,255,.62)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), 0 8px 18px rgba(0,0,0,.18) !important;
}
#screen-shop.screen.content-screen.active > .hint::after,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint::after,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint::after {
  content: none !important;
  display: none !important;
}

#screen-shop.screen.content-screen.active .shop-grid-row,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-grid-row,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-grid-row {
  grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)) !important;
  gap: clamp(16px, 1.5vw, 24px) !important;
  align-items: stretch !important;
}
#screen-shop.screen.content-screen.active .v126-shop-tile,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .v126-shop-tile,
body.is-shop-screen #screen-shop.screen.content-screen.active .v126-shop-tile {
  display: grid !important;
  grid-template-columns: 108px minmax(0, 1fr) !important;
  grid-template-rows: auto minmax(62px, auto) minmax(0, auto) auto !important;
  grid-template-areas:
    "shop-art shop-head"
    "shop-art shop-desc"
    "shop-bonus shop-bonus"
    "shop-buy shop-buy" !important;
  align-items: start !important;
  align-content: start !important;
  gap: 14px 18px !important;
  min-height: 260px !important;
  height: auto !important;
  padding: clamp(18px, 1.35vw, 24px) !important;
  overflow: hidden !important;
  isolation: isolate !important;
  box-sizing: border-box !important;
}
#screen-shop.screen.content-screen.active .v126-shop-tile::before,
#screen-shop.screen.content-screen.active .v126-shop-tile::after,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .v126-shop-tile::before,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .v126-shop-tile::after,
body.is-shop-screen #screen-shop.screen.content-screen.active .v126-shop-tile::before,
body.is-shop-screen #screen-shop.screen.content-screen.active .v126-shop-tile::after {
  content: none !important;
  display: none !important;
}
#screen-shop.screen.content-screen.active .shop-tile-head,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-head,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-head {
  grid-area: shop-head !important;
  position: relative !important;
  z-index: 4 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: start !important;
  gap: 10px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
}
#screen-shop.screen.content-screen.active .shop-tile-head strong,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-head strong,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-head strong {
  margin: 0 !important;
  max-width: 100% !important;
  min-width: 0 !important;
  line-height: 1.16 !important;
  overflow-wrap: anywhere !important;
}
#screen-shop.screen.content-screen.active .shop-tile-head em,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-head em,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-head em {
  align-self: start !important;
  justify-self: end !important;
  margin: 0 !important;
  white-space: nowrap !important;
  line-height: 1 !important;
}
#screen-shop.screen.content-screen.active .shop-tile-art,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-art,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-art {
  grid-area: shop-art !important;
  position: relative !important;
  z-index: 1 !important;
  align-self: stretch !important;
  justify-self: stretch !important;
  width: 108px !important;
  min-width: 108px !important;
  max-width: 108px !important;
  min-height: 142px !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 14px !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  background:
    radial-gradient(circle at 50% 35%, rgba(var(--shop-accent-rgb,103,255,40), .24), transparent 44%),
    linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.015)),
    rgba(0,0,0,.16) !important;
}
#screen-shop.screen.content-screen.active .shop-tile-art::before,
#screen-shop.screen.content-screen.active .shop-tile-art::after,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-art::before,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-art::after,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-art::before,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-art::after {
  content: none !important;
  display: none !important;
}
#screen-shop.screen.content-screen.active .shop-tile-art .shop-svg-icon,
#screen-shop.screen.content-screen.active .shop-tile-art .shop-currency-icon,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-art .shop-svg-icon,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-art .shop-currency-icon,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-art .shop-svg-icon,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-art .shop-currency-icon {
  position: relative !important;
  z-index: 2 !important;
  width: 66px !important;
  height: 66px !important;
  max-width: 66px !important;
  max-height: 66px !important;
  display: block !important;
  place-self: center !important;
  margin: 0 !important;
  overflow: visible !important;
  filter: drop-shadow(0 0 14px rgba(var(--shop-accent-rgb,103,255,40), .22)) drop-shadow(0 8px 18px rgba(0,0,0,.22)) !important;
}
#screen-shop.screen.content-screen.active .shop-tile-art .shop-emoji-icon,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-art .shop-emoji-icon,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-art .shop-emoji-icon {
  position: relative !important;
  z-index: 2 !important;
  font-size: 58px !important;
  line-height: 1 !important;
  place-self: center !important;
  margin: 0 !important;
  transform: none !important;
}
#screen-shop.screen.content-screen.active .v126-shop-tile p,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .v126-shop-tile p,
body.is-shop-screen #screen-shop.screen.content-screen.active .v126-shop-tile p {
  grid-area: shop-desc !important;
  position: relative !important;
  z-index: 4 !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.48 !important;
  overflow-wrap: anywhere !important;
  color: rgba(235,245,255,.80) !important;
}
#screen-shop.screen.content-screen.active .shop-tile-bonus,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-bonus,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-bonus {
  grid-area: shop-bonus !important;
  position: relative !important;
  z-index: 4 !important;
  min-height: 36px !important;
  margin: 0 !important;
  padding: 9px 12px !important;
  display: flex !important;
  align-items: center !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.055) !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  line-height: 1.32 !important;
  overflow-wrap: anywhere !important;
  box-sizing: border-box !important;
}
#screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy {
  grid-area: shop-buy !important;
  position: relative !important;
  z-index: 5 !important;
  margin: 0 !important;
  padding-top: 2px !important;
  display: grid !important;
  grid-template-columns: minmax(112px, auto) minmax(150px, 1fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
}
#screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .cost,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .cost,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .cost {
  min-height: 44px !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}
#screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .btn,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .btn,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .btn {
  min-height: 44px !important;
  margin: 0 !important;
}
@media (max-width: 720px) {
  #screen-shop.screen.content-screen.active .shop-grid-row,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-grid-row,
  body.is-shop-screen #screen-shop.screen.content-screen.active .shop-grid-row {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  #screen-shop.screen.content-screen.active .v126-shop-tile,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .v126-shop-tile,
  body.is-shop-screen #screen-shop.screen.content-screen.active .v126-shop-tile {
    grid-template-columns: 84px minmax(0, 1fr) !important;
    min-height: 238px !important;
    gap: 12px 14px !important;
  }
  #screen-shop.screen.content-screen.active .shop-tile-art,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-art,
  body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-art {
    width: 84px !important;
    min-width: 84px !important;
    max-width: 84px !important;
    min-height: 118px !important;
    padding: 10px !important;
  }
  #screen-shop.screen.content-screen.active .shop-tile-art .shop-svg-icon,
  #screen-shop.screen.content-screen.active .shop-tile-art .shop-currency-icon,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-art .shop-svg-icon,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-art .shop-currency-icon,
  body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-art .shop-svg-icon,
  body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-art .shop-currency-icon {
    width: 54px !important;
    height: 54px !important;
    max-width: 54px !important;
    max-height: 54px !important;
  }
  #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy,
  body.is-shop-screen #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy {
    grid-template-columns: minmax(0, 1fr) !important;
  }
  #screen-shop.screen.content-screen.active > .hint,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint,
  body.is-shop-screen #screen-shop.screen.content-screen.active > .hint {
    gap: 10px !important;
    padding: 13px 14px !important;
  }
  #screen-shop.screen.content-screen.active > .hint::before,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint::before,
  body.is-shop-screen #screen-shop.screen.content-screen.active > .hint::before {
    flex-basis: 28px !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
  }
}

/* v1.26.30 — Shop straight-edge style restore.
   Keeps the no-overlap card structure from v1.26.29, but restores the project-wide squared premium look. */
#screen-shop.screen.content-screen.active,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active,
body.is-shop-screen #screen-shop.screen.content-screen.active {
  --shop-straight-radius: 0px;
}
#screen-shop.screen.content-screen.active > .hint,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint,
#screen-shop.screen.content-screen.active > .hint::before,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint::before,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint::before,
#screen-shop.screen.content-screen.active .shop-category-strip,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-category-strip,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-category-strip,
#screen-shop.screen.content-screen.active .premium-shop-nav-item,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .premium-shop-nav-item,
body.is-shop-screen #screen-shop.screen.content-screen.active .premium-shop-nav-item,
#screen-shop.screen.content-screen.active .shop-overview-card,
#screen-shop.screen.content-screen.active .shop-economy-bar,
#screen-shop.screen.content-screen.active .economy-tile,
#screen-shop.screen.content-screen.active .premium-shop-section,
#screen-shop.screen.content-screen.active .shop-section-title,
#screen-shop.screen.content-screen.active .shop-section-icon,
#screen-shop.screen.content-screen.active .shop-card,
#screen-shop.screen.content-screen.active .premium-shop-card,
#screen-shop.screen.content-screen.active .shop-product-card,
#screen-shop.screen.content-screen.active .v126-shop-tile,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .v126-shop-tile,
body.is-shop-screen #screen-shop.screen.content-screen.active .v126-shop-tile,
#screen-shop.screen.content-screen.active .shop-tile-head em,
#screen-shop.screen.content-screen.active .shop-tile-art,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-art,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-art,
#screen-shop.screen.content-screen.active .shop-tile-bonus,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-bonus,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-bonus,
#screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .cost,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .cost,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .cost,
#screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .btn,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .btn,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .btn,
#screen-shop.screen.content-screen.active .btn,
#screen-shop.screen.content-screen.active .cost,
#screen-shop.screen.content-screen.active .badge {
  border-radius: 0 !important;
}
#screen-shop.screen.content-screen.active .v126-shop-tile,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .v126-shop-tile,
body.is-shop-screen #screen-shop.screen.content-screen.active .v126-shop-tile {
  background:
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px) 0 0 / 30px 30px,
    linear-gradient(180deg, rgba(11, 31, 47, .94), rgba(4, 15, 25, .88)) !important;
  border: 1px solid rgba(199,222,255,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 14px 30px rgba(0,0,0,.20) !important;
}
#screen-shop.screen.content-screen.active .shop-tile-art,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-art,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-art {
  border-radius: 0 !important;
  border: 1px solid rgba(199,222,255,.16) !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px) 0 0 / 22px 22px,
    radial-gradient(circle at 50% 35%, rgba(var(--shop-accent-rgb,103,255,40), .20), transparent 46%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.012)),
    rgba(0,0,0,.16) !important;
  box-shadow: inset 4px 0 0 rgba(var(--shop-accent-rgb,103,255,40), .62), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
#screen-shop.screen.content-screen.active .shop-tile-bonus,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-bonus,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-bonus {
  border-radius: 0 !important;
  background:
    linear-gradient(90deg, rgba(var(--shop-accent-rgb,103,255,40), .10), rgba(255,255,255,.025)) !important;
  border: 1px solid rgba(199,222,255,.14) !important;
  box-shadow: inset 3px 0 0 rgba(var(--shop-accent-rgb,103,255,40), .45) !important;
}
#screen-shop.screen.content-screen.active > .hint,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint {
  border-radius: 0 !important;
  border: 1px solid rgba(199,222,255,.17) !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px) 0 0 / 28px 28px,
    linear-gradient(180deg, rgba(11, 31, 47, .92), rgba(4, 15, 25, .84)) !important;
}
#screen-shop.screen.content-screen.active > .hint::before,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint::before,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint::before {
  border-radius: 0 !important;
  display: grid !important;
  place-items: center !important;
  background:
    linear-gradient(90deg, rgba(255,255,255,.06) 1px, transparent 1px) 0 0 / 12px 12px,
    linear-gradient(135deg, rgba(103,255,40,.82), rgba(38,220,255,.56)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.28), inset 3px 0 0 rgba(255,255,255,.22) !important;
}
#screen-shop.screen.content-screen.active .shop-tile-head em,
#screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .cost,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .cost,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .cost {
  border-radius: 0 !important;
  border: 1px solid rgba(199,222,255,.14) !important;
  background: rgba(255,255,255,.045) !important;
}
#screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .btn,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .btn,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-card-bottom.shop-tile-buy .btn {
  border-radius: 0 !important;
}
@media (max-width: 720px) {
  #screen-shop.screen.content-screen.active .shop-tile-art,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-art,
  body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-art,
  #screen-shop.screen.content-screen.active > .hint::before,
  #game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint::before,
  body.is-shop-screen #screen-shop.screen.content-screen.active > .hint::before {
    border-radius: 0 !important;
  }
}


/* v1.26.31 — Shop title cleanup + shared hint style restore.
   Removes owned check marks from product titles and makes the Shop hint match the standard page hint with a real "i" rail. */
#screen-shop.screen.content-screen.active > .hint,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0 !important;
  position: relative !important;
  overflow: hidden !important;
  min-height: 54px !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 12px 18px 12px 58px !important;
  border-radius: 0 !important;
  border: 1px solid var(--page-line-soft, rgba(191, 213, 255, .14)) !important;
  background: linear-gradient(90deg, rgba(140,255,55,.10), rgba(16,223,255,.06), rgba(255,255,255,.02)) !important;
  color: rgba(234,243,255,.82) !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  font-weight: 800 !important;
  text-align: left !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 14px 28px rgba(0,0,0,.14) !important;
}
#screen-shop.screen.content-screen.active > .hint::before,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint::before,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint::before {
  content: "i" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  transform: none !important;
  flex: none !important;
  width: 42px !important;
  height: auto !important;
  min-width: 42px !important;
  min-height: 0 !important;
  max-width: 42px !important;
  max-height: none !important;
  display: grid !important;
  place-items: center !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
  border: 0 !important;
  border-right: 1px solid var(--page-line-soft, rgba(191, 213, 255, .14)) !important;
  background: rgba(140,255,55,.055) !important;
  color: var(--page-green, #9cff47) !important;
  font-size: 15px !important;
  font-weight: 1000 !important;
  font-style: normal !important;
  line-height: 1 !important;
  text-align: center !important;
  text-shadow: 0 0 12px rgba(156,255,71,.45) !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}
#screen-shop.screen.content-screen.active > .hint::after,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint::after,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint::after {
  content: none !important;
  display: none !important;
}
#screen-shop.screen.content-screen.active .shop-tile-head strong,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-tile-head strong,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-tile-head strong {
  text-indent: 0 !important;
}


/* v1.26.32 — Shop economy icon rail full-height polish.
   Makes the separator to the right of the Shop currency icons span the full tile height,
   matching the straight-line visual language used across the rest of the UI. */
#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile {
  grid-template-columns: 52px minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: stretch !important;
}
#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i {
  position: relative !important;
  width: 50px !important;
  min-width: 50px !important;
  height: auto !important;
  min-height: 100% !important;
  align-self: stretch !important;
  justify-self: stretch !important;
  display: grid !important;
  place-items: center !important;
  box-sizing: border-box !important;
  padding: 0 12px 0 0 !important;
  border-right: 1px solid rgba(191, 213, 255, .14) !important;
}
#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i svg,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i svg,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i svg {
  width: 28px !important;
  height: 28px !important;
  margin: 0 !important;
}

/* v1.26.33 — Shop full-height icon separators for hint + wallet.
   The separator is drawn by the full card/tile, not by the centered icon element,
   so it always spans the complete height of the hint and currency blocks. */
#screen-shop.screen.content-screen.active > .hint,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint {
  --shop-hint-rail: 52px;
  position: relative !important;
  display: block !important;
  min-height: 58px !important;
  padding: 12px 18px 12px calc(var(--shop-hint-rail) + 16px) !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
#screen-shop.screen.content-screen.active > .hint::before,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active > .hint::before,
body.is-shop-screen #screen-shop.screen.content-screen.active > .hint::before {
  content: "i" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: var(--shop-hint-rail) !important;
  height: auto !important;
  min-height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transform: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-right: 1px solid rgba(191, 213, 255, .18) !important;
  box-sizing: border-box !important;
  background: rgba(140,255,55,.07) !important;
  color: var(--page-green, #9cff47) !important;
  font-size: 15px !important;
  font-weight: 1000 !important;
  line-height: 1 !important;
  text-align: center !important;
  text-shadow: 0 0 12px rgba(156,255,71,.45) !important;
}

#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile {
  --shop-wallet-rail: 58px;
  position: relative !important;
  display: grid !important;
  grid-template-columns: var(--shop-wallet-rail) minmax(0, 1fr) !important;
  gap: 12px !important;
  align-items: center !important;
  min-height: 76px !important;
  padding: 11px 14px 11px 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}
#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile::before,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile::before,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile::before {
  content: "" !important;
  position: absolute !important;
  left: var(--shop-wallet-rail) !important;
  top: 0 !important;
  bottom: 0 !important;
  width: 1px !important;
  height: auto !important;
  background: rgba(191, 213, 255, .18) !important;
  z-index: 3 !important;
  pointer-events: none !important;
}
#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i {
  grid-column: 1 !important;
  width: var(--shop-wallet-rail) !important;
  min-width: var(--shop-wallet-rail) !important;
  height: 100% !important;
  min-height: 100% !important;
  align-self: stretch !important;
  justify-self: stretch !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  box-sizing: border-box !important;
  background: rgba(255, 255, 255, .015) !important;
}
#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i::before,
#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i::after,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i::before,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i::after,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i::before,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i::after {
  content: none !important;
  display: none !important;
}
#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i svg,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i svg,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i svg {
  width: 30px !important;
  height: 30px !important;
  margin: 0 !important;
}
#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > div,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > div,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > div {
  grid-column: 2 !important;
  min-width: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* v1.26.34 — Shop wallet icon rail full-height background.
   The icon column background is now painted by the tile itself, so the green/dark rail
   fills 100% of the currency card height behind each icon. */
#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile {
  --shop-wallet-rail: 58px;
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
}
#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile::after,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile::after,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile::after {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  width: var(--shop-wallet-rail) !important;
  height: auto !important;
  min-height: 100% !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(156,255,71,.085), rgba(156,255,71,.035) 58%, rgba(255,255,255,.012)) !important;
  box-sizing: border-box !important;
}
#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile::before,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile::before,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile::before {
  z-index: 4 !important;
}
#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > i {
  position: relative !important;
  z-index: 5 !important;
  background: transparent !important;
}
#screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > div,
#game-shell.is-shop-screen > #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > div,
body.is-shop-screen #screen-shop.screen.content-screen.active .shop-economy-bar .economy-tile > div {
  position: relative !important;
  z-index: 5 !important;
}