:root {
  --appbar-h: 48px;
  --brandbar-h: 60px;
  --ticker-h: 22px;
  --bottom-h: 58px;
  --black: #000c03;
  --deep: #001708;
  --panel: #00270c;
  --green: #176b18;
  --green-2: #0b8e19;
  --lime: #d7ff00;
  --neon: #00ff45;
  --yellow: #fff500;
  --red: #e31826;
  --line: rgba(79, 176, 69, .52);
}

* { box-sizing: border-box; }
html { width:100%; max-width:100%; scroll-behavior: smooth; overflow-x:clip; overscroll-behavior-x:none; }
body { width:100%; max-width:100%; margin: 0; height: 100vh; overflow: hidden; color: #fff; background: #000b03; font-family: Arial, Helvetica, sans-serif; }
body.appbar-hidden { --appbar-h: 0px; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button, select { font: inherit; }
button { color: inherit; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 999; left: 12px; top: 8px; padding: 8px 12px; color: #001507; background: var(--yellow); transform: translateY(-160%); }
.skip-link:focus { transform: none; }

.app-bar { height: var(--appbar-h); display: flex; align-items: center; gap: 10px; padding: 4px 16px; border-bottom: 3px solid #1e791d; background: linear-gradient(90deg, #226f1d, #246d1e); overflow: hidden; }
.app-bar[hidden] { display: none !important; height: 0; padding: 0; border: 0; }
.app-bar__close { width: 20px; padding: 0; border: 0; color: #fff; background: transparent; font-size: 28px; font-weight: 200; opacity: .9; cursor: pointer; }
.app-icon { width: 39px; height: 38px; padding: 2px; display: grid; place-items: center; overflow: hidden; border: 2px solid var(--neon); border-radius: 6px; color: var(--lime); background: #fff; box-shadow: inset 0 0 12px #007e1b; }
.app-icon img { width: 100%; height: 100%; object-fit: contain; }
.app-copy { line-height: 1.05; }
.app-copy strong { display: block; font-size: 18px; }
.app-copy span { display: block; margin-top: 3px; color: #b7c9b5; font-size: 10px; }
.install-button { margin-left: auto; padding: 10px 22px; border-radius: 24px; color: var(--yellow); background: linear-gradient(90deg, #1a9835, #25a14a); box-shadow: 0 0 18px rgba(32,255,90,.2); font-size: 12px; font-weight: 900; }

.brand-bar { position: relative; height: var(--brandbar-h); display: flex; align-items: center; justify-content: center; border-bottom: 1px solid #286e22; background: #002f09; }
.menu-button { position: absolute; left: 20px; width: 42px; height: 40px; padding: 9px; display: flex; flex-direction: column; justify-content: space-around; border: 0; border-radius: 4px; background: rgba(0,81,18,.74); box-shadow: inset 0 0 15px rgba(0,255,58,.1), 0 0 12px rgba(0,255,58,.08); cursor: pointer; }
.menu-button span { height: 4px; border-radius: 4px; background: var(--yellow); box-shadow: 0 0 5px #a6ff00; }
.m2-logo { position: relative; width: 120px; height: 54px; display: flex; align-items: center; justify-content: center; }
.m2-logo img { width: 100%; height: 100%; object-fit: contain; }
.brand-tools { position: absolute; right: 18px; display: flex; align-items: center; gap: 10px; }
.language-select { min-height: 34px; padding-left: 8px; display: flex; align-items: center; gap: 5px; border: 1px solid #4c8f36; border-radius: 5px; background: #063d0d; }
.language-flag { font-size: 18px; line-height: 1; }
.language-select select { max-width: 148px; padding: 5px 7px 5px 2px; border: 0; outline: 0; color: var(--yellow); background: transparent; font-size: 11px; font-weight: 900; cursor: pointer; }
.partner-badge { min-width: 84px; height: 34px; padding: 3px 7px; display: flex; align-items: center; gap: 5px; border: 1px solid #ffc44b; border-radius: 4px; color: #6a2600; background: linear-gradient(#fff9b4,#ffb734); transform: skew(-4deg); box-shadow: inset 0 0 0 2px rgba(255,255,255,.4); }
.partner-badge strong { font-size: 17px; line-height: 1; }
.partner-badge span { font-size: 6px; font-weight: 950; line-height: 1.1; }

.announcement { height: var(--ticker-h); overflow: hidden; border-bottom: 1px solid #1a5f18; color: #fff; background: #176617; font-size: 12px; white-space: nowrap; }
.announcement__track { min-width: max-content; height: 100%; display: flex; align-items: center; justify-content: center; gap: 5px; padding-left: 48%; animation: ticker 20s linear infinite; }
.announcement__track span { color: #ffb900; }
@keyframes ticker { to { transform: translateX(-48%); } }

.lobby-shell { height: calc(100vh - var(--appbar-h) - var(--brandbar-h) - var(--ticker-h) - var(--bottom-h)); min-height: 0; display: grid; grid-template-columns: 23.2% 53.6% 23.2%; background: radial-gradient(circle at 50% 10%, #063f12, #001507 52%, #000b03 100%); }
.left-panel, .game-panel, .right-panel { position: relative; min-width: 0; min-height: 0; overflow: hidden; }
.left-panel { padding: 12px 12px 68px; border-right: 1px solid var(--line); background: linear-gradient(180deg, rgba(0,43,11,.72), rgba(0,12,3,.92)); }
.right-panel { padding: 14px 14px 10px; border-left: 1px solid var(--line); background: linear-gradient(180deg, rgba(0,39,10,.84), rgba(0,12,3,.96)); }
.game-panel { background: linear-gradient(180deg, rgba(0,31,8,.3), rgba(0,20,5,.72)); }

.side-promo { position: relative; height: 29%; min-height: 132px; display: block; overflow: hidden; border-bottom: 2px solid #b7df15; background: #003d0c; }
.side-promo > img { width: 100%; height: 100%; object-fit: cover; object-position: center; filter: none; }
.welcome-promo > img { filter: none; }
.side-promo__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,25,4,.96) 0 42%, rgba(0,30,5,.28) 74%); }
.welcome-copy { position: absolute; inset: 14% auto auto 6%; display: flex; flex-direction: column; align-items: flex-start; font-style: normal; font-family: Impact, "Arial Black", sans-serif; line-height: .84; text-shadow: 0 3px 2px #002004, 0 0 9px rgba(0,255,60,.3); }
.welcome-copy small { font-size: clamp(14px,1.3vw,26px); }
.welcome-copy strong { color: var(--neon); font-size: clamp(22px,2vw,40px); letter-spacing: .02em; }
.welcome-copy b { margin-top: 5px; padding: 5px 11px 4px; border: 2px solid var(--neon); border-radius: 8px; color: var(--yellow); background: rgba(0,42,7,.9); font-size: clamp(28px,2.5vw,48px); }
.welcome-copy em { margin-top: 8px; color: #fff; font-family: Arial, sans-serif; font-size: clamp(6px,.52vw,10px); font-style: normal; font-weight: 900; }

.why-card { position: relative; height: 23.5%; min-height: 120px; margin-top: 13px; overflow: hidden; border: 2px solid #6d1d12; border-radius: 7px; background: #1e0904; box-shadow: inset 0 0 30px rgba(255,61,0,.12); }
.why-card > img { width: 100%; height: 100%; object-fit: contain; object-position: center; opacity: 1; filter: none; background: #160700; }
.why-card::after { display: none; }
.why-card__content { position: absolute; z-index: 2; inset: 8px 10px; padding-left: 46%; text-align: left; }
.mini-partner { display: flex; align-items: center; justify-content: center; gap: 4px; color: #ffcf6a; }
.mini-partner strong { font-size: 21px; }
.mini-partner span { font-size: 7px; font-weight: 900; }
.why-card h2 { margin: 5px 0 6px; color: #ffe9aa; font-size: clamp(12px,1vw,19px); }
.why-card ul { margin: 0; padding: 0; list-style: none; }
.why-card li { margin: 4px 0; color: #fff; font-size: clamp(5.5px,.49vw,9px); font-weight: 800; }
.why-card li::before { content:"• "; color: #ffc13d; }

.winner-board { height: calc(47.5% - 26px); min-height: 150px; margin-top: 13px; overflow: hidden; border: 2px solid #afbc26; border-radius: 7px 7px 0 0; background: rgba(5,18,5,.88); }
.winner-board header { height: 41px; padding: 0 12px; display: flex; align-items: center; justify-content: space-between; gap: 8px; border-bottom: 2px solid #ddd800; background: linear-gradient(#286c1d,#1f5c17); }
.winner-board h2 { margin: 0; display: flex; align-items: center; gap: 10px; font-size: clamp(11px,1.1vw,18px); }
.winner-board h2 i { width: 8px; height: 8px; border-radius: 50%; background: #ed1c24; box-shadow: 0 0 9px red; }
.winner-board header > strong { font-size: clamp(7px,.7vw,12px); white-space: nowrap; }
.winner-table { width: 100%; }
.winner-row { min-height: 33px; padding: 0 8px; display: grid; grid-template-columns: 1.1fr .85fr .85fr .9fr .65fr; align-items: center; gap: 5px; border-bottom: 1px solid rgba(97,128,66,.13); text-align: center; font-size: clamp(5px,.48vw,8px); font-weight: 750; }
.winner-head { min-height: 27px; color: #fff4b1; background: #201d06; font-size: clamp(5px,.45vw,7.5px); letter-spacing: .09em; }
.winner-row .money-in { color: #2aff47; }
.winner-row .money-out { color: #ff2424; }
.winner-row a { justify-self: center; padding: 4px 8px; border-radius: 5px; color: #151600; background: linear-gradient(#fff2aa,#e0c652); font-size: clamp(5px,.45vw,7px); font-weight: 950; }
.download-strip { position: absolute; z-index: 4; left: 0; right: 0; bottom: 0; height: 62px; padding: 5px 8px; display: grid; grid-template-columns: .75fr 1.6fr .8fr; align-items: center; gap: 8px; border: 2px solid #00ef3c; border-radius: 0 12px 12px 0; color: #caff00; background: linear-gradient(90deg,#0d6319,#075014); box-shadow: 0 -5px 20px rgba(0,0,0,.32); }
.download-logo { width: clamp(58px,4.7vw,82px); display: grid; place-items: center; }
.download-logo img { width: 100%; height: auto; object-fit: contain; }
.download-strip > strong b { display: block; font-size: clamp(9px,.85vw,16px); white-space: nowrap; }
.download-strip > strong small { display: block; color: white; font-size: clamp(7px,.65vw,12px); white-space: nowrap; }
.download-strip > em { padding: 8px 10px; border-radius: 7px; color: #183100; background: var(--yellow); font-size: clamp(7px,.58vw,10px); font-style: normal; font-weight: 950; text-align: center; }

.game-categories { height: 134px; padding: 14px 17px 4px; display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 5px; overflow: hidden; }
.category-card { min-width: 0; padding: 0; display: grid; grid-template-rows: 70px 44px; overflow: hidden; border: 0; border-radius: 11px; background: #064d11; cursor: pointer; }
.category-image { overflow: hidden; background: linear-gradient(145deg,#084f18,#001d07); }
.category-image img { width: 100%; height: 100%; object-fit: contain; object-position: center; filter: saturate(1.2); }
.category-card strong { min-width: 0; padding: 4px 3px; display: grid; place-items: center; color: var(--yellow); background: linear-gradient(#108c18,#076e12); font-family: Impact, "Arial Black", sans-serif; font-size: clamp(10px,.93vw,17px); line-height: .94; letter-spacing: .02em; text-align: center; text-shadow: 0 2px 1px #00420c; }
.category-card:hover, .category-card.is-active { box-shadow: 0 0 0 3px var(--lime); }
.category-card.is-active strong { color: #153400; background: var(--yellow); text-shadow: none; }
.game-divider { height: 18px; padding: 0 16px; display: flex; align-items: center; }
.game-divider span { width: 100%; height: 1px; background: linear-gradient(90deg,var(--yellow),#377014 68%,transparent); }
.game-scroll { height: calc(100% - 152px); overflow-y: auto; scrollbar-width: thin; scrollbar-color: #5f9a1c #03210b; }
.game-grid { padding: 0 15px 30px; display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 16px 11px; }
.lobby-game { min-width: 0; }
.lobby-game__image { position: relative; aspect-ratio: 1.65; overflow: hidden; border-radius: 10px; border: 1px solid rgba(85,255,71,.18); background: radial-gradient(circle at 50% 38%,#1449ad 0,#061e73 45%,#021d0b 100%); box-shadow: 0 4px 9px rgba(0,0,0,.55); }
.lobby-game:nth-child(4n+2) .lobby-game__image { background: radial-gradient(circle,#a90f77,#2b0755 57%,#001b07); }
.lobby-game:nth-child(4n+3) .lobby-game__image { background: radial-gradient(circle,#eb8500,#713305 55%,#001b07); }
.lobby-game:nth-child(4n+4) .lobby-game__image { background: radial-gradient(circle,#0a944b,#06492e 55%,#001b07); }
.lobby-game__image img { width: 100%; height: 100%; object-fit: contain; filter: saturate(1.15) contrast(1.04); }
.lobby-game__name { position: absolute; left: 3px; right: 3px; bottom: 2px; overflow: hidden; color: white; font-family: Impact, "Arial Black", sans-serif; font-size: clamp(7px,.68vw,12px); line-height: 1; text-align: center; white-space: nowrap; text-overflow: ellipsis; text-shadow: 0 2px 2px #000,0 0 5px #000; }
.lobby-game button { width: calc(100% - 5px); height: 25px; margin: 6px 2.5px 0; border: 0; border-radius: 4px; color: white; background: linear-gradient(#f83b44 0,#d40d1b 50%,#9d0711 52%,#df1724 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.45), 0 3px 4px rgba(0,0,0,.45); font-size: clamp(8px,.7vw,12px); cursor: pointer; }
.lobby-game button:hover { filter: brightness(1.25); }
.lobby-game[hidden] { display: none; }

.right-promo { height: 24.5%; min-height: 135px; display: block; overflow: hidden; border: 3px solid var(--neon); border-radius: 10px; box-shadow: 0 0 14px rgba(0,255,55,.14); }
.right-promo img { width: 100%; height: 100%; object-fit: cover; object-position: center; background: #2b0d02; }
.account-panel { height: 28.5%; min-height: 178px; margin-top: 14px; padding: 15px 12px 10px; border-radius: 10px; background: rgba(0,43,9,.8); box-shadow: inset 0 0 20px rgba(0,0,0,.45); }
.auth-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.auth-row a { height: 38px; display: grid; place-items: center; border-radius: 12px; font-family: Impact, "Arial Black", sans-serif; font-size: clamp(13px,1.3vw,21px); letter-spacing: .05em; }
.login-link { color: var(--yellow); background: linear-gradient(#159b18,#087310); }
.register-link { color: #173600; background: var(--yellow); box-shadow: inset 0 0 0 1px #d2cf00; }
.wallet-grid { margin-top: 15px; display: grid; grid-template-columns: 1.15fr .85fr; gap: 10px; }
.balance { display: flex; flex-direction: column; }
.balance > span { font-size: clamp(10px,.75vw,13px); }
.balance > strong { margin: 7px 0 10px; color: #ffd000; font-size: clamp(17px,1.5vw,25px); }
.balance small { margin: 3px 0; font-size: clamp(8px,.63vw,11px); white-space: nowrap; }
.wallet-actions { display: flex; flex-direction: column; gap: 8px; }
.wallet-actions a, .wallet-actions button { min-height: 29px; padding: 0 8px; display: flex; align-items: center; justify-content: flex-start; gap: 9px; border: 0; border-radius: 12px; color: #fff; background: linear-gradient(#149414,#08740d); font-size: clamp(7px,.63vw,10px); font-weight: 950; cursor: pointer; }
.wallet-actions i { width: 21px; height: 21px; display: grid; place-items: center; border-radius: 50%; color: #1c5b00; background: var(--yellow); font-size: 13px; font-style: normal; }
.rtp-banner { position: relative; height: 190px; min-height: 190px; margin-top: 14px; display: block; overflow: hidden; border: 1px solid #ff8b3d; border-radius: 10px; background: #2b0d02; box-shadow: 0 8px 20px rgba(111,48,9,.12); }
.rtp-banner img { width: 100%; height: 100%; object-fit: cover; object-position: center; filter: none; }
.rtp-banner::after { display: none; }
.rtp-banner span { position: absolute; z-index: 2; left: 5%; top: 22%; display: flex; flex-direction: column; align-items: center; text-align: center; }
.rtp-banner strong { color: var(--yellow); font-family: Impact, "Arial Black", sans-serif; font-size: clamp(25px,2.4vw,42px); font-style: italic; letter-spacing: .05em; text-shadow: 0 3px 2px #00410a; white-space: nowrap; }
.rtp-banner small { font-size: clamp(8px,.75vw,13px); font-weight: 900; }
.rtp-banner em { margin-top: 12px; padding: 9px 16px; border: 2px solid #31ff56; border-radius: 10px; color: #fff; background: #087617; font-size: clamp(7px,.6vw,10px); font-style: normal; font-weight: 950; }

.bottom-nav { position: fixed; z-index: 30; left: 0; right: 0; bottom: 0; height: var(--bottom-h); display: grid; grid-template-columns: repeat(5,1fr); border-top: 1px solid #49953b; background: #236d1c; box-shadow: 0 -5px 16px rgba(0,0,0,.35); }
.bottom-nav a, .bottom-nav button { position: relative; min-width: 0; padding: 3px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; border: 0; color: #d7ed00; background: transparent; cursor: pointer; }
.bottom-nav a.is-active { background: rgba(255,255,255,.08); box-shadow: inset 0 0 24px rgba(255,255,255,.08); }
.bottom-nav span { position: relative; font-size: 25px; line-height: .9; text-shadow: 0 2px 2px rgba(0,0,0,.3); }
.bottom-nav small { font-size: 8px; font-weight: 950; }
.bottom-nav i { position: absolute; top: -5px; right: -8px; width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; color: white; background: #ff7a14; font-size: 10px; font-style: normal; }
.bottom-nav .bottom-nav__icon {
  position:relative;
  width:24px;
  height:24px;
  display:block;
  font-family:Arial,Helvetica,sans-serif;
  font-size:22px;
  font-weight:800;
  line-height:24px;
  text-align:center;
}
.bottom-nav__icon::before,.bottom-nav__icon::after { position:absolute; content:""; }
.bottom-nav__icon--home::before {
  left:5px;
  top:7px;
  width:12px;
  height:11px;
  border:2px solid currentColor;
  border-top:0;
  border-radius:1px;
}
.bottom-nav__icon--home::after {
  left:5px;
  top:3px;
  width:12px;
  height:12px;
  border-top:2px solid currentColor;
  border-left:2px solid currentColor;
  transform:rotate(45deg);
}
.bottom-nav__icon--register::before {
  left:5px;
  top:3px;
  width:7px;
  height:7px;
  border:2px solid currentColor;
  border-radius:50%;
  box-shadow:0 10px 0 -1px transparent;
}
.bottom-nav a:has(.bottom-nav__icon--register) .bottom-nav__icon {
  border-bottom:2px solid currentColor;
  border-radius:0 0 9px 9px;
}
.bottom-nav__icon--register::after {
  content:"+";
  right:0;
  top:1px;
  font-size:16px;
  line-height:16px;
}
.bottom-nav__icon--login::before {
  left:3px;
  top:4px;
  width:11px;
  height:15px;
  border:2px solid currentColor;
  border-right:0;
  border-radius:3px 0 0 3px;
}
.bottom-nav__icon--login::after {
  content:"→";
  right:0;
  top:1px;
  font-size:19px;
  line-height:20px;
}
.bottom-nav__icon--promotion::before {
  left:3px;
  top:7px;
  width:18px;
  height:13px;
  border:2px solid currentColor;
  border-radius:3px;
}
.bottom-nav__icon--promotion::after {
  left:11px;
  top:4px;
  width:2px;
  height:17px;
  background:currentColor;
  box-shadow:-4px 0 0 -1px currentColor,4px 0 0 -1px currentColor;
}
.bottom-nav__icon--chat::before {
  left:2px;
  top:3px;
  width:19px;
  height:15px;
  border:2px solid currentColor;
  border-radius:6px;
}
.bottom-nav__icon--chat::after {
  left:6px;
  top:16px;
  width:7px;
  height:7px;
  border-left:2px solid currentColor;
  transform:skewY(-35deg);
}

.menu-overlay { position: fixed; z-index: 80; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(0,10,2,.82); backdrop-filter: blur(2px); }
.menu-overlay[hidden] { display: none; }
.menu-modal { position: relative; width: min(760px,96vw); max-height: calc(100vh - 40px); padding: 50px 24px 22px; display: grid; grid-template-columns: 190px 1fr; gap: 26px; overflow: auto; border: 1px solid #4aa038; border-radius: 10px; background: #020703; box-shadow: 0 30px 80px #000; }
.menu-close { position: absolute; right: 14px; top: 14px; padding: 6px 14px; border: 1px solid #7fa770; border-radius: 4px; background: #081009; font-size: 10px; font-weight: 900; cursor: pointer; }
.menu-list { display: flex; flex-direction: column; gap: 8px; }
.menu-list a { min-height: 39px; padding: 0 10px; display: grid; grid-template-columns: 23px 1fr 16px; align-items: center; border: 1px solid #3e7e35; border-radius: 5px; background: linear-gradient(90deg,#0c5814,#061009 70%); font-size: 10px; }
.menu-list a:first-child { background: linear-gradient(90deg,#258b27,#1e6d1f); }
.menu-list em { font-style: normal; text-align: right; }
.menu-feature { min-width: 0; }
.menu-kicker { margin: 0 0 5px; color: #7ece63; font-size: 9px; font-weight: 900; letter-spacing: .13em; }
.menu-feature h2 { margin: 0; font-size: 25px; }
.menu-feature > p:not(.menu-kicker) { margin: 14px 0 17px; color: #ddd; font-size: 13px; }
.menu-feature img { width: 100%; border: 1px solid #20ca32; border-radius: 9px; }
.menu-feature > a { margin-top: 14px; min-height: 38px; display: grid; place-items: center; border-radius: 4px; background: #247a20; font-size: 11px; font-weight: 950; }
.toast { position: fixed; z-index: 100; left: 50%; bottom: 74px; padding: 10px 18px; border: 1px solid #77be55; border-radius: 6px; color: var(--yellow); background: #021d08; opacity: 0; pointer-events: none; transform: translate(-50%,15px); transition: .2s ease; font-size: 12px; font-weight: 900; }
.toast.is-visible { opacity: 1; transform: translate(-50%,0); }

@media (max-width: 1180px) {
  .lobby-shell { grid-template-columns: 24% 52% 24%; }
  .left-panel, .right-panel { padding-inline: 8px; }
  .game-categories { padding-inline: 9px; }
  .game-grid { padding-inline: 9px; gap-inline: 7px; }
  .download-strip { grid-template-columns: .7fr 1.5fr .8fr; padding-inline: 5px; }
  .wallet-grid { grid-template-columns: 1fr; }
  .wallet-actions { display: grid; grid-template-columns: repeat(3,1fr); gap: 4px; }
  .wallet-actions a, .wallet-actions button { justify-content: center; padding: 2px; }
  .wallet-actions i { display: none; }
}

@media (max-width: 900px) {
  :root { --appbar-h: 43px; --brandbar-h: 55px; --ticker-h: 24px; --bottom-h: 62px; }
  body { height: auto; min-height: 100vh; overflow: auto; padding-bottom: var(--bottom-h); background: #001307; }
  .app-bar { padding-inline: 8px; }
  .app-copy strong { font-size: 14px; }
  .app-copy span { font-size: 8px; }
  .install-button { padding: 8px 12px; font-size: 9px; }
  .brand-tools { right: 8px; }
  .partner-badge { display: none; }
  .menu-button { left: 8px; width: 38px; height: 36px; }
  .announcement__track { padding-left: 100%; justify-content: flex-start; animation-duration: 16s; }
  .lobby-shell { width:100%; max-width:100%; height: auto; display: flex; flex-direction: column; overflow: hidden visible; }
  .game-panel { order: 1; height: auto; overflow: visible; }
  .left-panel { order: 2; height:auto; min-height:0; padding: 12px 12px 70px; border: 0; }
  .right-panel { order: 3; height:auto; min-height:0; padding: 12px 12px 24px; border: 0; }
  .mobile-trust-anchor { order:4; width:100%; height:0; }
  .game-categories { height: 105px; padding: 10px 8px 5px; display: flex; gap: 7px; overflow-x: auto; scrollbar-width: none; }
  .game-categories::-webkit-scrollbar { display:none; }
  .category-card { flex: 0 0 82px; grid-template-rows: 57px 34px; border-radius: 8px; }
  .category-card strong { font-size: 10px; }
  .game-divider { height: 12px; }
  .game-scroll { height: auto; overflow: visible; }
  .game-grid { padding: 7px 9px 24px; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 13px 8px; }
  .lobby-game__name { font-size: 9px; }
  .lobby-game button { height: 25px; font-size: 10px; }
  .side-promo { height: 190px; }
  .why-card { height: 150px; }
  .winner-board { height: 265px; }
  .winner-row { font-size: 7px; }
  .winner-head { font-size: 6px; }
  .right-promo { height:auto; min-height:0; aspect-ratio:2 / 1; }
  .account-panel { height:auto; min-height:205px; }
  .wallet-grid { grid-template-columns: 1.15fr .85fr; }
  .wallet-actions { display: flex; }
  .wallet-actions i { display: grid; }
  .rtp-banner { height:auto; min-height:0; aspect-ratio:2 / 1; }
  .menu-modal { grid-template-columns: 1fr; }
  .menu-list { display: grid; grid-template-columns: 1fr 1fr; }
}

@media (max-width: 480px) {
  .app-bar__close { display: none; }
  .app-icon { width: 34px; height: 32px; }
  .app-copy span { display: none; }
  .m2-logo { width: 92px; height: 48px; }
  .language-select { padding-left: 5px; }
  .language-select select { width: 62px; padding-inline: 2px; text-overflow: ellipsis; }
  .language-flag { font-size: 16px; }
  .game-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap-inline: 6px; }
  .lobby-game__image { border-radius: 7px; }
  .lobby-game button { margin-top: 4px; }
  .welcome-copy { inset: 20px auto auto 18px; }
  .why-card__content { padding-left: 37%; }
  .winner-board header { padding-inline: 8px; }
  .download-strip { grid-template-columns: .75fr 1.5fr .7fr; }
  .download-strip > strong b { font-size: 9px; }
  .download-strip > strong small { font-size: 7px; }
  .wallet-grid { grid-template-columns: 1fr; }
  .account-panel { height:auto; min-height:250px; }
  .wallet-actions { display: grid; grid-template-columns: repeat(3,1fr); }
  .wallet-actions i { display: none; }
  .right-panel { height:auto; min-height:0; }
  .menu-overlay { padding: 8px; }
  .menu-modal { padding: 48px 14px 16px; }
  .menu-list { grid-template-columns: 1fr; }
  .bottom-nav span { font-size: 21px; }
  .bottom-nav small { font-size: 7px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* M2 brand theme: preserve the dense lobby layout while using M2 orange and white. */
:root {
  --black: #fffaf6;
  --deep: #fff3e9;
  --panel: #ffffff;
  --green: #ff6a00;
  --green-2: #e95400;
  --lime: #ff7a00;
  --neon: #ff6a00;
  --yellow: #ff7a00;
  --red: #ff6a00;
  --line: rgba(255, 106, 0, .34);
}

body { color: #2d1d15; background: #f5eee8; }
.app-bar { border-bottom-color: #ff9b55; background: linear-gradient(90deg, #ef5700, #ff7b18); }
.app-icon { border-color: #fff; color: #fff; background: rgba(119,36,0,.28); box-shadow: inset 0 0 12px rgba(255,255,255,.18); }
.app-copy span { color: #ffe4d2; }
.install-button { color: #e95400; background: #fff; box-shadow: 0 6px 18px rgba(116,38,0,.18); }

.brand-bar { border-bottom-color: #ffd0ad; background: #fff; box-shadow: 0 3px 12px rgba(102,49,12,.08); }
.menu-button { background: #fff0e4; box-shadow: inset 0 0 0 1px #ffc497; }
.menu-button span { background: #ff6a00; box-shadow: none; }
.m2-logo { color: #27201c; text-shadow: 0 2px 0 #ffd0af; }
.m2-logo span:last-of-type { color: #ff6a00; }
.m2-logo small { color: #fff; background: #ff6a00; }
.language-select { border-color: #ffb17c; background: #fff7f0; }
.language-select select { color: #d64f00; background: transparent; }
.partner-badge { border-color: #ff8730; color: #8e3100; background: linear-gradient(#fff4dd,#ffbe69); }

.announcement { border-bottom-color: #d94d00; color: #fff; background: #e95500; }
.announcement__track span { color: #fff5a9; }
.lobby-shell { background: radial-gradient(circle at 50% 8%, #ffffff 0, #fff7f0 48%, #eee6e0 100%); }
.left-panel { border-right-color: #efc2a2; background: linear-gradient(180deg, rgba(255,250,246,.98), rgba(248,238,231,.98)); }
.right-panel { border-left-color: #efc2a2; background: linear-gradient(180deg, rgba(255,250,246,.99), rgba(246,235,227,.99)); }
.game-panel { background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,247,241,.96)); }

.side-promo { border-bottom-color: #ff6a00; background: #ff7a18; }
.welcome-promo > img { filter: none; }
.side-promo__shade { background: linear-gradient(90deg, rgba(87,25,0,.93) 0 42%, rgba(123,40,0,.12) 76%); }
.welcome-copy { text-shadow: 0 3px 2px #5b1e00, 0 0 9px rgba(255,134,52,.35); }
.welcome-copy strong { color: #ff9c45; }
.welcome-copy b { border-color: #ff9c45; color: #ff6a00; background: #fff; text-shadow: none; }
.welcome-copy em { color: #fff; }

.why-card { border-color: #d84c15; background: #3d1507; box-shadow: inset 0 0 30px rgba(255,106,0,.18); }
.why-card::after { background: linear-gradient(90deg,rgba(45,13,2,.96),rgba(124,40,4,.48)); }
.mini-partner { color: #ffd095; }
.why-card h2 { color: #fff1d5; }

.winner-board { border-color: #ff8b3c; background: #fff; box-shadow: 0 8px 20px rgba(104,46,11,.08); }
.winner-board header { border-bottom-color: #ffbf8f; color: #fff; background: linear-gradient(#ff7d20,#e95500); }
.winner-board h2 i { background: #fff; box-shadow: 0 0 8px rgba(255,255,255,.8); }
.winner-table { color: #35231a; }
.winner-head { color: #7b340c; background: #fff0e4; }
.winner-row { border-bottom-color: rgba(194,113,61,.15); }
.winner-row .money-in { color: #128b39; }
.winner-row .money-out { color: #e5482d; }
.winner-row a { color: #fff; background: linear-gradient(#ff8c39,#e85a00); }
.download-strip { border-color: #ffb078; color: #fff; background: linear-gradient(90deg,#e65300,#ff7920); box-shadow: 0 -5px 20px rgba(100,40,3,.16); }
.download-logo { color: #fff; text-shadow: 0 2px 0 #b23d00; }
.download-logo small { color: #ffe2cb; }
.download-strip > em { color: #dd5100; background: #fff; }

.category-card { background: #fff1e6; box-shadow: 0 3px 10px rgba(102,46,12,.08); }
.category-image { background: linear-gradient(145deg,#fff,#ffe5d1); }
.category-card strong { color: #fff; background: linear-gradient(#ff7c20,#e95500); text-shadow: 0 2px 1px #aa3600; }
.category-card:hover, .category-card.is-active { box-shadow: 0 0 0 3px #ff6a00, 0 6px 15px rgba(164,67,10,.15); }
.category-card.is-active strong { color: #fff; background: #ff6a00; }
.game-divider span { background: linear-gradient(90deg,#ff6a00,#ffc69d 68%,transparent); }
.game-scroll { scrollbar-color: #ff8a3a #fff0e5; }
.lobby-game__image { border-color: rgba(255,106,0,.24); box-shadow: 0 4px 10px rgba(92,42,11,.18); }
.lobby-game button { background: linear-gradient(#ff994f 0,#ff7214 50%,#e65500 52%,#ff7c20 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 3px 5px rgba(126,49,5,.25); }

.right-promo { border-color: #ff6a00; box-shadow: 0 0 0 1px #ffc69c, 0 8px 20px rgba(111,48,9,.12); }
.account-panel { color: #2d1d15; background: #fff; box-shadow: inset 0 0 0 1px #f1d2bc, 0 8px 22px rgba(106,47,12,.1); }
.login-link { color: #e95400; background: #fff0e4; box-shadow: inset 0 0 0 2px #ff6a00; }
.register-link { color: #fff; background: #ff6a00; box-shadow: inset 0 0 0 1px #e65300; }
.balance > strong { color: #ef5b00; }
.wallet-actions a, .wallet-actions button { color: #fff; background: linear-gradient(#ff7d20,#e95500); }
.wallet-actions i { color: #e95500; background: #fff; }
.rtp-banner { background: #ff6f12; }
.rtp-banner img { filter: none; }
.rtp-banner::after { background: linear-gradient(90deg,rgba(106,31,0,.88),rgba(164,54,0,.12)); }
.rtp-banner strong { color: #fff; text-shadow: 0 3px 2px #9d3400; }
.rtp-banner em { border-color: #fff; color: #e95500; background: #fff; }

.bottom-nav { border-top-color: #ffc69f; background: #fff; box-shadow: 0 -5px 16px rgba(102,49,14,.13); }
.bottom-nav a, .bottom-nav button { color: #e95a00; }
.bottom-nav a.is-active { background: #fff0e4; box-shadow: inset 0 0 24px rgba(255,106,0,.08); }
.bottom-nav span { text-shadow: none; }
.bottom-nav i { color: #fff; background: #ff7a18; }

.menu-overlay { background: rgba(58,24,5,.78); }
.menu-modal { border-color: #ff9b5b; background: #fff; box-shadow: 0 30px 80px rgba(51,20,2,.46); }
.menu-close { border-color: #ff9b5b; color: #d64f00; background: #fff7f0; }
.menu-list a { border-color: #ffc59d; color: #4a2a19; background: linear-gradient(90deg,#fff0e4,#fff 72%); }
.menu-list a:first-child { color: #fff; background: linear-gradient(90deg,#ff7c20,#e95400); }
.menu-kicker { color: #e75a00; }
.menu-feature h2 { color: #2e1d14; }
.menu-feature > p:not(.menu-kicker) { color: #6e5140; }
.menu-feature img { border-color: #ff7a18; }
.menu-feature > a { color: #fff; background: #f2650a; }
.toast { border-color: #ff9a58; color: #fff; background: #e95500; }

@media (max-width: 900px) {
  body { background: #fff7f0; }
}

/* Motion and interaction feedback */
@keyframes appPulse {
  0%, 100% { transform: translateY(0); box-shadow: inset 0 0 12px rgba(255,255,255,.18), 0 0 0 rgba(255,255,255,0); }
  50% { transform: translateY(-2px); box-shadow: inset 0 0 12px rgba(255,255,255,.2), 0 5px 16px rgba(255,255,255,.2); }
}
@keyframes logoBreath {
  0%, 100% { filter: drop-shadow(0 0 0 rgba(255,106,0,0)); }
  50% { filter: drop-shadow(0 3px 5px rgba(255,106,0,.25)); }
}
@keyframes overlayIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes modalIn { from { opacity: 0; transform: translateY(18px) scale(.97); } to { opacity: 1; transform: none; } }

:where(a, button, select, .side-promo, .why-card, .winner-board, .account-panel, .rtp-banner, .lobby-game, .category-card) {
  transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .25s ease, transform .22s ease, filter .22s ease, opacity .2s ease;
}
.app-icon { animation: appPulse 3s ease-in-out infinite; }
.m2-logo { animation: logoBreath 3.6s ease-in-out infinite; }
.install-button, .download-strip, .menu-feature > a { position: relative; overflow: hidden; }
.install-button::after, .download-strip::after, .menu-feature > a::after {
  content: "";
  position: absolute;
  top: -40%;
  bottom: -40%;
  left: -35%;
  width: 22%;
  transform: skewX(-24deg);
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.62), transparent);
  transition: left .55s ease;
  pointer-events: none;
}
.category-image img, .lobby-game__image img, .side-promo > img, .right-promo img, .rtp-banner img, .why-card > img { transition: transform .35s ease, filter .3s ease; }
.lobby-game__image::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(135deg, rgba(255,255,255,.2), transparent 32%, transparent 68%, rgba(255,122,24,.15));
  opacity: 0;
  transition: opacity .25s ease;
  pointer-events: none;
}
.winner-row, .menu-list a { transition: background-color .2s ease, color .2s ease, transform .2s ease, padding .2s ease; }
.menu-overlay:not([hidden]) { animation: overlayIn .18s ease both; }
.menu-overlay:not([hidden]) .menu-modal { animation: modalIn .24s ease both; }

:where(a, button, select):focus-visible {
  outline: 3px solid #ffad70;
  outline-offset: 3px;
}

@media (hover: hover) and (pointer: fine) {
  .install-button:hover { transform: translateY(-2px) scale(1.03); box-shadow: 0 9px 22px rgba(116,38,0,.25); }
  .install-button:hover::after, .download-strip:hover::after, .menu-feature > a:hover::after { left: 118%; }
  .app-bar__close:hover { transform: rotate(90deg) scale(1.1); }
  .menu-button:hover { transform: translateY(-2px); background: #ffe3cf; box-shadow: inset 0 0 0 1px #ff8c3d, 0 5px 14px rgba(141,56,7,.14); }
  .menu-button:hover span:nth-child(1) { transform: translateX(3px); }
  .menu-button:hover span:nth-child(3) { transform: translateX(-3px); }
  .menu-button span { transition: transform .2s ease; }
  .m2-logo:hover { transform: scale(1.08) rotate(-1deg); animation-play-state: paused; }
  .language-select:hover { border-color: #ff6a00; box-shadow: 0 5px 14px rgba(123,49,6,.13); transform: translateY(-1px); }
  .partner-badge:hover { transform: skew(-4deg) translateY(-2px) scale(1.03); box-shadow: 0 5px 14px rgba(124,53,7,.17); }

  .side-promo:hover, .right-promo:hover, .rtp-banner:hover, .why-card:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(112,47,8,.18); }
  .side-promo:hover > img, .right-promo:hover img, .rtp-banner:hover img, .why-card:hover > img { transform: scale(1.055); }
  .side-promo:hover .welcome-copy { transform: translateX(4px); }
  .welcome-copy { transition: transform .25s ease; }
  .download-strip:hover { filter: brightness(1.06); box-shadow: 0 -7px 24px rgba(119,46,3,.22); }

  .winner-board:hover, .account-panel:hover { border-color: #ff8d40; box-shadow: 0 12px 28px rgba(111,48,9,.14); }
  .winner-row:not(.winner-head):hover { color: #d44f00; background: #fff5ed; transform: translateX(3px); }
  .winner-row a:hover { transform: scale(1.08); filter: brightness(1.08); }

  .category-card:hover { transform: translateY(-5px) scale(1.015); }
  .category-card:hover .category-image img { transform: scale(1.09); }
  .game-divider span { transition: width .35s ease, filter .25s ease; }
  .game-panel:hover .game-divider span { filter: saturate(1.3); }
  .lobby-game:hover { z-index: 2; transform: translateY(-5px); }
  .lobby-game:hover .lobby-game__image { border-color: #ff7b22; box-shadow: 0 9px 22px rgba(130,51,4,.24); }
  .lobby-game:hover .lobby-game__image img { transform: scale(1.13); }
  .lobby-game:hover .lobby-game__image::after { opacity: 1; }
  .lobby-game:hover button { transform: translateY(-1px); filter: brightness(1.08); box-shadow: inset 0 1px 0 rgba(255,255,255,.65), 0 6px 11px rgba(126,49,5,.3); }

  .auth-row a:hover { transform: translateY(-3px); box-shadow: 0 8px 18px rgba(125,48,4,.18); filter: brightness(1.04); }
  .wallet-actions a:hover, .wallet-actions button:hover { transform: translateX(-3px); filter: brightness(1.09); box-shadow: 0 5px 12px rgba(125,48,4,.17); }
  .wallet-actions a:hover i, .wallet-actions button:hover i { transform: rotate(90deg); }
  .wallet-actions i { transition: transform .28s ease; }
  .rtp-banner:hover em { transform: scale(1.06); box-shadow: 0 6px 16px rgba(112,43,3,.2); }

  .bottom-nav a:hover, .bottom-nav button:hover { color: #c84700; background: #fff0e4; transform: translateY(-3px); }
  .bottom-nav a:hover span, .bottom-nav button:hover span { transform: scale(1.12); }
  .bottom-nav span { transition: transform .22s ease; }
  .menu-close:hover { color: #fff; background: #ff6a00; transform: scale(1.04); }
  .menu-list a:hover { color: #d64f00; background: #fff0e4; transform: translateX(5px); padding-left: 14px; }
  .menu-list a:hover em { transform: translateX(3px); }
  .menu-list em { transition: transform .2s ease; }
  .menu-feature > a:hover { transform: translateY(-2px); filter: brightness(1.06); }
}

:where(.category-card, .lobby-game button, .auth-row a, .wallet-actions a, .wallet-actions button, .bottom-nav a, .bottom-nav button):active {
  transform: scale(.96);
  transition-duration: .08s;
}

/* Responsive refinements */
@media (min-width: 901px) and (max-width: 1180px) {
  .game-grid { grid-template-columns: repeat(5,minmax(0,1fr)); }
  .category-card strong { font-size: 9px; }
  .balance small { white-space: normal; }
}

@media (min-width: 621px) and (max-width: 900px) {
  .game-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 15px 10px; }
  .left-panel, .right-panel { width: 100%; max-width: 760px; margin-inline: auto; }
}

@media (max-width: 620px) {
  .app-bar { gap:7px; }
  .app-copy { min-width:0; }
  .install-button { flex:0 0 auto; white-space:nowrap; }
  .brand-bar,.announcement,.game-panel,.left-panel,.right-panel,.media-library,.trust-directory { min-width:0; max-width:100%; }
  .brand-tools { gap: 5px; }
  .app-copy strong { font-size: 13px; }
  .game-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .lobby-game:hover { transform: none; }
}

@media (max-width: 350px) {
  .game-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .install-button { padding-inline: 9px; }
  .app-copy { max-width: 115px; }
  .bottom-nav small { font-size: 6px; }
}

@media (prefers-reduced-motion: reduce) {
  .app-icon, .m2-logo, .announcement__track { animation: none !important; }
  .install-button::after, .download-strip::after, .menu-feature > a::after { display: none; }
}

/* Complete supplied-media library: every asset is shown at its natural ratio. */
.media-library {
  padding: 25px 15px 90px;
  border-top: 2px solid rgba(255,106,0,.38);
  background: linear-gradient(180deg, rgba(255,244,235,.72), rgba(255,255,255,.94));
}
.library-heading { margin: 0 0 14px; }
.library-heading--compact { margin-top: 30px; }
.library-heading span { color: #e75600; font-size: 9px; font-weight: 950; letter-spacing: .16em; }
.library-heading h2 { margin: 4px 0 0; color: #2e1d14; font-family: Impact, "Arial Black", sans-serif; font-size: clamp(18px,1.7vw,27px); letter-spacing: .035em; }
.banner-gallery { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.hero-gallery { display: grid; grid-template-columns: 1fr; gap: 14px; }
.media-card {
  min-width: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  border: 1px solid #ffc49a;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 5px 15px rgba(112,47,8,.11);
}
.media-card img {
  width: 100%;
  height: auto;
  object-fit: contain;
  object-position: center;
  background: #fff7f0;
}
.media-card__title,
.media-card__footer {
  min-height: 31px;
  padding: 8px 11px;
  display: flex;
  align-items: center;
  color: #a83c00;
  background: #fff;
  font-size: 10px;
  font-weight: 950;
  letter-spacing: .04em;
}
.media-card__footer { min-height: 48px; justify-content: space-between; gap: 10px; }
.media-card__footer strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.promotion-card__button {
  flex: 0 0 auto;
  min-height: 30px;
  padding: 7px 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 1px solid #ff7a18;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg,#ff8a24,#f04b00);
  box-shadow: 0 5px 12px rgba(227,76,0,.2), inset 0 1px rgba(255,255,255,.34);
  font-size: 8px;
  font-style: normal;
  font-weight: 950;
  letter-spacing: .07em;
  white-space: nowrap;
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}
.promotion-card__button i { font-size: 13px; font-style: normal; line-height: .7; transition: transform .22s ease; }
.trust-gallery { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.trust-card {
  min-width: 0;
  min-height: 92px;
  padding: 12px 9px 9px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 1px solid #ffd0ae;
  border-radius: 9px;
  background: #fff;
  box-shadow: 0 4px 12px rgba(112,47,8,.08);
}
.trust-card img { width: 100%; height: 42px; object-fit: contain; object-position: center; }
.trust-card span { color: #80533b; font-size: 9px; font-weight: 900; text-align: center; }
.media-card, .trust-card { transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, filter .22s ease; }

@media (hover: hover) and (pointer: fine) {
  .media-card:hover, .trust-card:hover { transform: translateY(-4px); border-color: #ff7920; box-shadow: 0 11px 24px rgba(128,48,3,.17); filter: brightness(1.02); }
  .media-card--promotion:hover .promotion-card__button { transform: translateY(-1px); box-shadow: 0 7px 18px rgba(227,76,0,.3), inset 0 1px rgba(255,255,255,.4); filter: brightness(1.08); }
  .media-card--promotion:hover .promotion-card__button i { transform: translateX(3px); }
  .category-card:hover .category-image img, .lobby-game:hover .lobby-game__image img, .right-promo:hover img { transform: none; filter: saturate(1.22) brightness(1.04); }
}

@media (max-width: 900px) {
  .media-library { padding: 25px 12px 45px; }
  .library-heading h2 { font-size: 22px; }
}

@media (max-width: 620px) {
  .banner-gallery { grid-template-columns: 1fr; }
  .trust-gallery { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .media-card__title, .media-card__footer { min-height: 29px; font-size: 9px; }
  .media-card__footer { min-height: 47px; padding: 8px; }
  .promotion-card__button { min-height: 29px; padding: 7px 10px; font-size: 7px; }
}

/* M2 high-energy motion layer — inspired by modern game lobbies, fully original. */
@keyframes m2CardArrival {
  from { opacity: 0; transform: translateY(18px) scale(.94); filter: saturate(.65); }
  to { opacity: 1; transform: none; filter: saturate(1); }
}
@keyframes m2PlayPulse {
  0%, 100% { box-shadow: inset 0 1px 0 rgba(255,255,255,.6), 0 3px 5px rgba(126,49,5,.25); filter: brightness(1); }
  50% { box-shadow: inset 0 1px 0 #fff, 0 0 0 3px rgba(255,106,0,.16), 0 7px 16px rgba(189,67,0,.31); filter: brightness(1.12); }
}
@keyframes m2LiveBlink { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .35; transform: scale(.72); } }
@keyframes m2JackpotGlow {
  0%, 100% { box-shadow: 0 5px 18px rgba(120,43,0,.14), inset 0 0 0 1px rgba(255,255,255,.65); }
  50% { box-shadow: 0 9px 30px rgba(255,106,0,.34), inset 0 0 0 1px #fff; }
}
@keyframes m2ValueTick { 0% { transform: scale(1); } 50% { transform: scale(1.075); color: #ffb02b; } 100% { transform: scale(1); } }
@keyframes m2Float { 0%, 100% { transform: translate3d(0,0,0) rotate(-2deg); } 50% { transform: translate3d(0,-8px,0) rotate(2deg); } }
@keyframes m2Sheen { from { transform: translateX(-180%) skewX(-24deg); } to { transform: translateX(680%) skewX(-24deg); } }

.promo-dots { position: absolute; z-index: 4; left: 50%; top: calc(29% - 27px); display: flex; gap: 6px; transform: translateX(-50%); }
.promo-dots button { width: 9px; height: 9px; padding: 0; border: 1px solid rgba(255,255,255,.8); border-radius: 50%; background: rgba(78,24,0,.48); box-shadow: 0 1px 5px rgba(71,20,0,.4); cursor: pointer; transition: width .25s ease, background-color .25s ease, transform .2s ease; }
.promo-dots button.is-active { width: 24px; border-radius: 6px; background: #ff6a00; }
#left-promo-image, #right-promo-image { opacity: 1; transition: opacity .28s ease, transform .75s ease, filter .4s ease; }
#left-promo-image.is-changing, #right-promo-image.is-changing { opacity: .16; transform: scale(1.04); }

.motion-jackpot {
  position: relative;
  min-height: 74px;
  margin: 0 15px 20px;
  padding: 9px 17px 9px 88px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 13px;
  overflow: hidden;
  border: 1px solid #ffb174;
  border-radius: 13px;
  color: #4a210b;
  background: radial-gradient(circle at 5% 50%,#fff 0,#fff3e6 30%,#ffdfc3 67%,#fff 100%);
  animation: m2JackpotGlow 2.6s ease-in-out infinite;
}
.motion-jackpot::after { content:""; position:absolute; top:-50%; bottom:-50%; left:0; width:15%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.9),transparent); animation:m2Sheen 4.8s ease-in-out infinite; pointer-events:none; }
.motion-jackpot__orbit { position: absolute; z-index: 1; left: -15px; top: 50%; width: 112px; height: 112px; transform: translateY(-50%); pointer-events: none; }
.motion-jackpot__orbit img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 6px 8px rgba(122,45,0,.2)); }
.motion-jackpot > span { position: relative; z-index: 2; min-width: 0; display: flex; flex-direction: column; }
.motion-jackpot small { display: flex; align-items: center; gap: 6px; color: #a44309; font-size: 9px; letter-spacing: .13em; }
.motion-jackpot small i, .right-promo__live i { width: 8px; height: 8px; border-radius: 50%; background: #ff421f; box-shadow: 0 0 9px rgba(255,66,31,.8); animation: m2LiveBlink .85s ease-in-out infinite; }
.motion-jackpot strong { display: inline-block; color: #ef5b00; font-family: Impact,"Arial Black",sans-serif; font-size: clamp(22px,2vw,34px); letter-spacing: .035em; text-shadow: 0 2px 0 #fff; transform-origin: left center; }
.motion-jackpot strong.is-ticking { animation: m2ValueTick .42s ease; }
.motion-jackpot > em { position: relative; z-index: 2; padding: 7px 10px; border-radius: 13px; color: #fff; background: linear-gradient(135deg,#ff8a31,#e85100); font-size: 8px; font-style: normal; font-weight: 950; white-space: nowrap; }

.right-promo { position: relative; }
.right-promo::after { display: none; }
.right-promo__live { position:absolute; z-index:3; right:8px; top:8px; padding:5px 8px; display:flex; align-items:center; gap:5px; border-radius:15px; color:#fff; background:rgba(92,25,0,.76); backdrop-filter:blur(4px); font-size:8px; font-weight:950; }
.right-promo__live i { width:6px; height:6px; }

.rtp-banner__orbit { position: absolute; z-index: 2; right: -13%; bottom: -28%; width: 90%; pointer-events: none; opacity: .84; animation: m2Float 3.4s ease-in-out infinite; }
.rtp-banner__orbit img { width: 100%; height: auto; filter: drop-shadow(0 10px 14px rgba(105,30,0,.35)); }
.rtp-banner > .rtp-banner__background { position: absolute; inset: 0; }

.lobby-game { animation: m2CardArrival .56s cubic-bezier(.2,.75,.25,1) both; animation-delay: calc(var(--stagger) * 42ms); }
.lobby-game button { animation: m2PlayPulse 2.4s ease-in-out infinite; animation-delay: calc(var(--stagger) * 80ms); }
.lobby-game:nth-child(7n) .lobby-game__image::before { content:"HOT"; position:absolute; z-index:3; left:5px; top:5px; padding:3px 5px; border-radius:7px; color:#fff; background:linear-gradient(135deg,#ff8b2d,#e43d00); box-shadow:0 3px 8px rgba(82,22,0,.35); font-size:7px; font-weight:950; animation:m2PlayPulse 2s ease-in-out infinite; }
.lobby-game__image img { animation: m2Float 4.5s ease-in-out infinite; animation-delay: calc(var(--stagger) * -160ms); }

@media (max-width: 900px) {
  .motion-jackpot { margin: 4px 9px 17px; }
  .rtp-banner__orbit { width: 64%; right: -6%; }
}

@media (max-width: 480px) {
  .motion-jackpot { min-height: 66px; padding: 7px 8px 7px 70px; }
  .motion-jackpot__orbit { left: -14px; width: 92px; height: 92px; }
  .motion-jackpot strong { font-size: 21px; }
  .motion-jackpot > em { display: none; }
  .promo-dots { top: 175px; }
}

@media (prefers-reduced-motion: reduce) {
  .motion-jackpot, .motion-jackpot::after, .right-promo::after, .right-promo__live i, .motion-jackpot small i, .rtp-banner__orbit, .lobby-game, .lobby-game button, .lobby-game__image img { animation: none !important; }
}

/* Hot Games occupy the first horizontal row, matching the reference placement. */
.hot-games-bar { height: 134px; padding: 14px 17px 4px; overflow: hidden; }
.hot-game-grid { height: 100%; display: flex; gap: 6px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x proximity; scrollbar-width: thin; scrollbar-color: #ff7a18 #fff1e6; }
.hot-game-grid::-webkit-scrollbar { height: 4px; }
.hot-game-grid::-webkit-scrollbar-thumb { border-radius: 5px; background: #ff7a18; }
.hot-game-tile {
  position: relative;
  flex: 0 0 calc((100% - 36px) / 7);
  min-width: 92px;
  height: 100%;
  aspect-ratio: auto;
  padding: 0;
  overflow: hidden;
  border: 1px solid #ffb37d;
  border-radius: 11px;
  background: #fff6ee;
  box-shadow: 0 5px 12px rgba(113,43,4,.13);
  cursor: pointer;
  scroll-snap-align: start;
  animation: m2CardArrival .56s cubic-bezier(.2,.75,.25,1) both;
  animation-delay: calc(var(--stagger) * 42ms);
}
.hot-game-tile img { width: 100%; height: 100%; display: block; object-fit: contain; object-position: center; transition: transform .3s ease, filter .25s ease; }
.hot-game-tile span { display: none; }

.game-catalog { padding: 0 15px 32px; }
.game-shelf { scroll-margin-top: 12px; }
.game-shelf + .game-shelf { margin-top: 28px; }
.game-shelf__heading {
  min-height: 52px;
  margin-bottom: 13px;
  padding: 7px 11px;
  display: flex;
  align-items: center;
  gap: 9px;
  border: 1px solid #ffd0ae;
  border-left: 5px solid #ff6a00;
  border-radius: 9px;
  background: linear-gradient(90deg,#fff,#fff6ee);
  box-shadow: 0 4px 12px rgba(109,44,7,.07);
}
.game-shelf__icon { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; border-radius: 10px; color: #fff; background: linear-gradient(135deg,#ff8a2d,#e85100); box-shadow: 0 4px 10px rgba(143,50,0,.2); font-size: 17px; }
.game-shelf__heading div { min-width: 0; }
.game-shelf__heading small { display: block; color: #c54a05; font-size: 7px; font-weight: 950; letter-spacing: .14em; }
.game-shelf__heading h2 { margin: 1px 0 0; color: #382116; font-family: Impact,"Arial Black",sans-serif; font-size: clamp(18px,1.5vw,24px); letter-spacing: .045em; }
.game-shelf__heading > b { margin-left: auto; padding: 6px 9px; border-radius: 12px; color: #b34508; background: #fff0e4; font-size: 8px; white-space: nowrap; }
.game-section-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 14px 13px; }
.game-image-link { min-width: 0; padding: 0; overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; cursor: pointer; animation: m2CardArrival .5s cubic-bezier(.2,.75,.25,1) both; animation-delay: calc(var(--stagger) * 35ms); }
.game-image-link img { width: 100%; height: auto; display: block; object-fit: contain; object-position: center; filter: drop-shadow(0 4px 5px rgba(84,31,2,.14)); transition: transform .26s ease, filter .26s ease; }
.all-games-divider { position: relative; height: 48px; display: grid; place-items: center; }
.all-games-divider::before { content:""; position:absolute; left:0; right:0; height:1px; background:linear-gradient(90deg,transparent,#ff9c58 15%,#ff9c58 85%,transparent); }
.all-games-divider span { position:relative; z-index:1; padding:7px 17px; border:1px solid #ffb27a; border-radius:18px; color:#fff; background:linear-gradient(135deg,#ff8226,#e95500); box-shadow:0 5px 13px rgba(132,46,0,.17); font-size:9px; font-weight:950; letter-spacing:.1em; }
.lobby-game:nth-child(7n) .lobby-game__image::before { display: none; }

@media (min-width: 901px) and (max-width: 1180px) {
  .hot-game-tile { flex-basis: calc((100% - 30px) / 6); }
  .game-section-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap-inline: 10px; }
}

@media (max-width: 900px) {
  .hot-games-bar { height: 105px; padding: 10px 8px 5px; }
  .hot-game-tile { flex: 0 0 82px; min-width: 82px; border-radius: 8px; }
  .game-catalog { padding: 0 9px 30px; }
  .game-section-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px 9px; }
  .game-shelf__heading { scroll-margin-top: 135px; }
}

@media (max-width: 620px) {
  .game-section-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px 7px; }
  .game-shelf__heading { min-height: 48px; padding-inline: 8px; }
  .game-shelf__heading > b { display: none; }
  .game-shelf__heading h2 { font-size: 18px; }
  .game-shelf + .game-shelf { margin-top: 22px; }
}

@media (max-width: 350px) {
  .game-section-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (hover: hover) and (pointer: fine) {
  .hot-game-tile:hover { transform: translateY(-5px); border-color: #ff7014; box-shadow: 0 10px 22px rgba(130,51,4,.22); }
  .hot-game-tile:hover img { transform: scale(1.035); filter: saturate(1.12) brightness(1.04); }
  .game-image-link:hover { transform: translateY(-4px); }
  .game-image-link:hover img { transform: scale(1.04); filter: drop-shadow(0 9px 9px rgba(112,39,1,.2)) saturate(1.08) brightness(1.03); }
}

@media (prefers-reduced-motion: reduce) {
  .hot-game-tile, .game-image-link { animation: none !important; }
}

/* KissDiamond-inspired language behavior with M2 styling. */
.language-picker { position: relative; z-index: 65; }
.language-trigger {
  min-height: 38px;
  padding: 6px 10px;
  display: flex;
  align-items: center;
  gap: 7px;
  border: 1px solid #ffb27d;
  border-radius: 999px;
  color: #b84404;
  background: #fff;
  box-shadow: 0 5px 14px rgba(113,45,6,.09);
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.language-trigger .language-flag { font-size: 19px; line-height: 1; }
.language-trigger strong { min-width: 22px; font-size: 10px; letter-spacing: .04em; }
.language-trigger i { color: #d95a10; font-size: 12px; font-style: normal; transition: transform .18s ease; }
.language-trigger[aria-expanded="true"] { border-color: #ff6a00; box-shadow: 0 8px 23px rgba(131,48,2,.18); }
.language-trigger[aria-expanded="true"] i { transform: rotate(180deg); }
.language-menu {
  position: absolute;
  z-index: 300;
  top: calc(100% + 11px);
  right: 0;
  width: 238px;
  padding: 8px;
  overflow: hidden;
  border: 1px solid #ffc297;
  border-radius: 17px;
  background: rgba(255,255,255,.98);
  box-shadow: 0 18px 45px rgba(73,27,2,.22);
  backdrop-filter: blur(14px);
  animation: modalIn .18s ease both;
}
.language-menu[hidden] { display: none; }
.language-menu :where(button,a) {
  width: 100%;
  min-height: 54px;
  padding: 8px 10px;
  display: grid;
  grid-template-columns: 30px 1fr auto;
  align-items: center;
  gap: 9px;
  border: 0;
  border-radius: 11px;
  color: #5c3c2b;
  background: transparent;
  text-align: left;
  text-decoration:none;
  cursor: pointer;
}
.language-menu :where(button,a) > span:first-child { font-size: 21px; text-align: center; }
.language-menu :where(button,a) > span:nth-child(2) { display: grid; gap: 2px; }
.language-menu b { font-size: 11px; }
.language-menu small { color: #9c7660; font-size: 8px; }
.language-menu i { color: #ef5b00; font-size: 8px; font-style: normal; font-weight: 950; }
.language-menu :where(button,a):hover, .language-menu :where(button,a).is-current { color: #c84b05; background: #fff0e5; }

/* Compact branded hamburger and single-page quick drawer. */
.menu-button {
  width: auto;
  min-width: 76px;
  height: 42px;
  padding: 0 12px;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid #ffbd8e;
  border-radius: 13px;
  color: #c24804;
  background: linear-gradient(145deg,#fff,#fff0e5);
  box-shadow: 0 5px 14px rgba(129,48,3,.1), inset 0 1px 0 #fff;
}
.menu-button__lines { position: relative; width: 19px; height: 16px; display: block; }
.menu-button .menu-button__lines { background: transparent; box-shadow: none; }
.menu-button__lines i { position: absolute; left: 0; width: 19px; height: 2px; border-radius: 4px; background: #ff6a00; transition: opacity .18s ease, transform .2s ease, top .2s ease; }
.menu-button__lines i:first-child { top: 1px; }
.menu-button__lines i:nth-child(2) { top: 7px; }
.menu-button__lines i:last-child { top: 13px; }
.menu-button > b { font-size: 9px; letter-spacing: .09em; }
.menu-button[aria-expanded="true"] .menu-button__lines i:first-child { top: 7px; transform: rotate(45deg); }
.menu-button[aria-expanded="true"] .menu-button__lines i:nth-child(2) { opacity: 0; transform: scaleX(.3); }
.menu-button[aria-expanded="true"] .menu-button__lines i:last-child { top: 7px; transform: rotate(-45deg); }
.menu-button:hover .menu-button__lines { transform: none; }

body.menu-open { overflow: hidden; }
.menu-overlay { place-items: stretch start; padding: 0; background: rgba(52,20,2,.42); backdrop-filter: blur(5px); }
.menu-drawer {
  position: relative;
  width: min(390px,92vw);
  height: 100%;
  max-height: none;
  padding: 22px;
  overflow-y: auto;
  border: 0;
  border-right: 1px solid #ffaf75;
  background: linear-gradient(180deg,#fff,#fff8f2 65%,#fff0e4);
  box-shadow: 24px 0 70px rgba(64,23,1,.3);
  animation: m2DrawerIn .26s cubic-bezier(.2,.75,.25,1) both;
}
@keyframes m2DrawerIn { from { opacity: .4; transform: translateX(-100%); } to { opacity: 1; transform: none; } }
.menu-drawer__header { min-height: 62px; display: grid; grid-template-columns: 74px 1fr 36px; align-items: center; gap: 11px; border-bottom: 1px solid #ffd4b6; padding-bottom: 14px; }
.menu-drawer__header > img { width: 70px; height: 45px; object-fit: contain; }
.menu-drawer__header small { color: #d14c02; font-size: 7px; font-weight: 950; letter-spacing: .16em; }
.menu-drawer__header h2 { margin: 2px 0 0; color: #382219; font-family: Impact,"Arial Black",sans-serif; font-size: 20px; letter-spacing: .035em; }
.menu-close { position: static; width: 35px; height: 35px; padding: 0; display: grid; place-items: center; border: 1px solid #ffc49a; border-radius: 11px; color: #e35605; background: #fff3e9; font-size: 23px; line-height: 1; }
.menu-drawer__intro { margin: 14px 0 16px; color: #7d5a47; font-size: 11px; line-height: 1.5; }
.menu-shortcuts { display: grid; gap: 8px; }
.menu-shortcuts button { min-height: 52px; padding: 7px 9px; display: grid; grid-template-columns: 38px 1fr auto; align-items: center; gap: 9px; border: 1px solid #ffd0ae; border-radius: 13px; color: #543323; background: #fff; text-align: left; cursor: pointer; box-shadow: 0 4px 11px rgba(105,40,4,.05); }
.menu-shortcuts button > span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; color: #fff; background: linear-gradient(135deg,#ff8a2b,#e85200); }
.menu-shortcuts b { font-size: 10px; letter-spacing: .035em; }
.menu-shortcuts em { min-width: 27px; padding: 5px 7px; border-radius: 10px; color: #c64a04; background: #fff0e5; font-size: 8px; font-style: normal; text-align: center; }
.menu-shortcuts button:hover { border-color: #ff8a3b; color: #d24f04; background: #fff7f0; transform: translateX(4px); }
.menu-member-panel { margin-top: 18px; padding: 14px; border: 1px solid #ffc091; border-radius: 15px; background: linear-gradient(135deg,#fff4e8,#fff); }
.menu-member-panel > small { color: #bd4300; font-size: 7px; font-weight: 950; letter-spacing: .14em; }
.menu-member-panel > div { margin-top: 9px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.menu-member-panel a { min-height: 39px; display: grid; place-items: center; border-radius: 11px; font-family: Impact,"Arial Black",sans-serif; font-size: 13px; letter-spacing: .04em; }
.menu-centre__rail > .menu-member-panel:first-child { margin:0 0 12px; }
.menu-support { margin-top: 13px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.menu-support a { min-height: 44px; padding: 8px 9px; display: grid; grid-template-columns: 24px 1fr 12px; align-items: center; gap: 5px; border: 1px solid #ffd0ae; border-radius: 12px; color: #77452b; background: #fff; font-size: 8px; }
.menu-support em { color: #e45605; font-style: normal; }
.menu-drawer__foot { margin: 18px 0 0; display: flex; align-items: center; gap: 7px; color: #96705b; font-size: 8px; line-height: 1.45; }
.menu-drawer__foot i { width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: #35b262; box-shadow: 0 0 8px rgba(53,178,98,.45); }

@media (max-width: 620px) {
  .menu-button { left: 8px; min-width: 43px; width: 43px; height: 40px; padding: 0; }
  .menu-button > b { display: none; }
  .language-trigger { min-height: 36px; padding-inline: 8px; }
  .language-menu { width: min(238px,calc(100vw - 20px)); }
  .menu-drawer { padding: 18px 15px 24px; }
}

/* M2 casino atmosphere: warm light, subtle card-suit watermarks and layered depth. */
.lobby-shell {
  isolation: isolate;
  overflow-x: clip;
  background:
    radial-gradient(ellipse at 51% -4%, rgba(255,255,255,.98) 0 19%, transparent 55%),
    radial-gradient(circle at 49% 43%, rgba(255,171,92,.21), transparent 43%),
    linear-gradient(112deg, rgba(151,49,0,.10), transparent 25% 73%, rgba(151,49,0,.10)),
    linear-gradient(180deg,#fff9f3,#f4dfd0 74%,#ecd2c0);
}
.lobby-shell::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  background:
    repeating-linear-gradient(132deg, transparent 0 41px, rgba(219,81,0,.025) 42px 43px),
    repeating-linear-gradient(48deg, transparent 0 41px, rgba(219,81,0,.022) 42px 43px);
  mask-image: linear-gradient(90deg,#000,rgba(0,0,0,.42) 23%,rgba(0,0,0,.24) 50%,rgba(0,0,0,.42) 77%,#000);
}
.lobby-shell::after {
  content:"M2   ♠   ♦   M2   ♣   ♥";
  position:absolute;
  z-index:-1;
  left:23%;
  right:23%;
  top:41%;
  overflow:hidden;
  color:rgba(196,66,0,.035);
  font-family:Impact,"Arial Black",sans-serif;
  font-size:clamp(34px,4.6vw,78px);
  letter-spacing:.28em;
  line-height:1;
  text-align:center;
  white-space:nowrap;
  pointer-events:none;
  transform:rotate(-7deg);
}
.left-panel,
.right-panel {
  background:
    radial-gradient(circle at 50% 4%,rgba(255,255,255,.9),transparent 28%),
    radial-gradient(circle at -18% 66%,rgba(255,121,31,.16),transparent 42%),
    linear-gradient(180deg,rgba(255,247,240,.92),rgba(237,211,192,.94));
  box-shadow:inset 0 0 46px rgba(132,48,2,.065);
}
.game-panel {
  background:
    radial-gradient(ellipse at 50% 7%,rgba(255,255,255,.98),transparent 48%),
    linear-gradient(180deg,rgba(255,253,250,.9),rgba(255,238,225,.84));
  box-shadow:inset 22px 0 44px -35px rgba(120,42,0,.25),inset -22px 0 44px -35px rgba(120,42,0,.25);
}
.game-scroll {
  background:
    radial-gradient(circle at 9% 22%,rgba(255,141,58,.08),transparent 19%),
    radial-gradient(circle at 92% 48%,rgba(255,141,58,.07),transparent 23%),
    transparent;
}
.media-library {
  background:
    radial-gradient(circle at 85% 10%,rgba(255,140,58,.10),transparent 24%),
    linear-gradient(180deg,rgba(255,242,232,.82),rgba(255,252,249,.95));
}

@media (max-width:900px) {
  html,body { width:100%; max-width:100%; overflow-x:clip; overscroll-behavior-x:none; }
  body { background:linear-gradient(180deg,#f7e4d7,#efd1bd); }
  body > * { max-width:100%; }
  .lobby-shell::after { left:0; right:0; top:29%; opacity:.75; }
  .game-panel,.left-panel,.right-panel { background-color:transparent; }
}

@media (prefers-reduced-motion:reduce) {
  .lobby-shell::after { transform:none; }
}

/* Original M2 download artwork: keep the entire banner legible at the left rail edge. */
.left-panel { padding-bottom:70px; }
.download-strip.download-strip--art {
  position:absolute;
  z-index:4;
  left:0;
  right:0;
  bottom:0;
  height:62px;
  padding:0;
  display:block;
  overflow:hidden;
  border:1px solid rgba(255,159,91,.86);
  border-radius:0 13px 13px 0;
  background:#281006;
  box-shadow:0 -7px 24px rgba(97,34,2,.2),0 0 0 1px rgba(255,255,255,.2) inset;
}
.download-strip--art > img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.download-strip.download-strip--art:hover {
  filter:saturate(1.1) brightness(1.06);
  box-shadow:0 -9px 28px rgba(147,52,2,.3),0 0 0 1px rgba(255,205,166,.38) inset;
  transform:translateY(-2px);
}

@media (max-width:900px) {
  .left-panel { padding-bottom:70px; }
  .download-strip.download-strip--art { width:100%; max-width:100%; height:62px; transform:none; }
}

@media (max-width:420px) {
  .left-panel { padding-bottom:62px; }
  .download-strip.download-strip--art { height:54px; }
}

/* Desktop lobby scrolls as one document, matching the reference site. */
@media (min-width:901px) {
  html { min-height:100%; }
  body {
    height:auto;
    min-height:100vh;
    padding-bottom:var(--bottom-h);
    overflow-x:hidden;
    overflow-y:auto;
  }
  .lobby-shell {
    height:auto;
    min-height:calc(100vh - var(--appbar-h) - var(--brandbar-h) - var(--ticker-h) - var(--bottom-h));
    align-items:stretch;
    overflow:visible;
  }
  .left-panel,
  .right-panel {
    height:auto;
    overflow:hidden;
  }
  .game-panel,
  .game-scroll {
    height:auto;
    min-height:0;
    overflow:visible;
  }
  .side-promo {
    height:auto;
    min-height:0;
    aspect-ratio:2 / 1;
  }
  .promo-dots { top:calc(11.6vw - 19px); }
  .why-card {
    height:auto;
    min-height:0;
    aspect-ratio:1280 / 503;
  }
  .winner-board {
    height:310px;
    min-height:310px;
  }
  .right-promo,
  .rtp-banner {
    height:auto;
    min-height:0;
    aspect-ratio:2 / 1;
  }
  .account-panel {
    height:auto;
    min-height:190px;
  }
  .download-strip.download-strip--art {
    position:fixed;
    left:0;
    right:auto;
    bottom:var(--bottom-h);
    width:23.2vw;
  }
  .hot-games-bar,
  .game-shelf,
  .media-library { scroll-margin-top:12px; }
}

@media (min-width:901px) and (max-width:1180px) {
  .promo-dots { top:calc(12vw - 19px); }
  .download-strip.download-strip--art { width:24vw; }
}

/* M2-owned continuation campaigns in the scrolling left rail. */
.left-campaigns {
  margin-top:16px;
  padding-bottom:12px;
  display:grid;
  gap:16px;
}
.left-campaign {
  padding:7px;
  overflow:hidden;
  border:1px solid #ffc091;
  border-radius:14px;
  background:linear-gradient(145deg,#fff9f4,#ffecdc);
  box-shadow:0 8px 23px rgba(101,37,2,.12);
}
.left-campaign__image {
  display:block;
  overflow:hidden;
  border-radius:10px;
  background:#2c0c01;
}
.left-campaign__image img {
  width:100%;
  height:auto;
  object-fit:contain;
  transition:transform .38s ease,filter .3s ease;
}
.left-campaign__actions {
  margin-top:8px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:7px;
}
.left-campaign__actions a,
.left-campaign__actions button,
.left-campaign__button {
  min-height:34px;
  padding:6px 8px;
  display:grid;
  place-items:center;
  border:1px solid #ff9f5e;
  border-radius:10px;
  color:#fff;
  background:linear-gradient(135deg,#ff8428,#df4e00);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 4px 10px rgba(120,40,0,.14);
  font-size:clamp(7px,.6vw,10px);
  font-weight:950;
  letter-spacing:.04em;
  cursor:pointer;
}
.left-campaign__button {
  width:max-content;
  margin:8px 0 2px;
  padding-inline:15px;
}
.left-campaign--social { padding:5px; }

@media (hover:hover) and (pointer:fine) {
  .left-campaign:hover { border-color:#ff7821; box-shadow:0 12px 28px rgba(112,39,1,.2); }
  .left-campaign:hover .left-campaign__image img { transform:scale(1.025); filter:saturate(1.08) brightness(1.03); }
  .left-campaign__actions a:hover,
  .left-campaign__actions button:hover,
  .left-campaign__button:hover { transform:translateY(-2px); filter:brightness(1.08); }
}

@media (max-width:900px) {
  .left-panel { height:auto; min-height:0; overflow:visible; }
  .left-campaigns { margin-top:14px; }
  .left-campaign__actions a,
  .left-campaign__actions button,
  .left-campaign__button { font-size:9px; }
  .download-strip.download-strip--art { position:fixed; bottom:var(--bottom-h); }
}

/* Hot Games sit directly in the lobby's first row: artwork only, no card chrome. */
.hot-games-bar {
  height:145px;
  padding:9px 15px 3px;
  background:transparent;
}
.hot-game-grid {
  gap:9px;
  align-items:stretch;
  background:transparent;
}
.hot-game-tile {
  flex-basis:calc((100% - 54px) / 7);
  min-width:88px;
  height:100%;
  padding:0;
  overflow:visible;
  border:0;
  border-radius:0;
  outline-offset:2px;
  background:transparent;
  box-shadow:none;
}
.hot-game-tile img {
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  filter:drop-shadow(0 4px 5px rgba(89,31,1,.16));
}
.game-divider { height:10px; }

@media (min-width:901px) and (max-width:1180px) {
  .hot-game-tile { flex-basis:calc((100% - 40px) / 6); }
}

@media (max-width:900px) {
  .hot-games-bar { height:122px; padding:7px 8px 3px; }
  .hot-game-grid { gap:7px; }
  .hot-game-tile { flex:0 0 88px; min-width:88px; border-radius:0; }
}

@media (hover:hover) and (pointer:fine) {
  .hot-game-tile:hover {
    border:0;
    box-shadow:none;
    transform:translateY(-4px);
  }
  .hot-game-tile:hover img {
    transform:scale(1.045);
    filter:drop-shadow(0 9px 9px rgba(105,35,0,.24)) saturate(1.1) brightness(1.04);
  }
}

/* Large M2 member-centre modal inspired by the reference interaction. */
.menu-overlay {
  place-items:center;
  padding:22px;
  background:rgba(25,8,1,.78);
  backdrop-filter:blur(7px) saturate(.72);
}
.menu-drawer {
  width:min(1040px,94vw);
  height:min(820px,91vh);
  max-height:91vh;
  padding:0;
  overflow:hidden;
  border:1px solid #ff7419;
  border-radius:17px;
  color:#fff;
  background:
    radial-gradient(circle at 84% 8%,rgba(255,104,0,.15),transparent 26%),
    linear-gradient(145deg,#180801,#090402 58%,#160701);
  box-shadow:0 32px 90px rgba(0,0,0,.66),0 0 0 1px rgba(255,189,137,.12) inset;
  animation:m2MenuCentreIn .28s cubic-bezier(.2,.75,.25,1) both;
}
@keyframes m2MenuCentreIn {
  from { opacity:0; transform:translateY(18px) scale(.97); }
  to { opacity:1; transform:none; }
}
.menu-drawer__header {
  min-height:74px;
  padding:10px 15px 10px 19px;
  display:grid;
  grid-template-columns:80px 1fr auto;
  gap:13px;
  border-bottom:1px solid rgba(255,119,31,.28);
  background:rgba(4,2,1,.62);
}
.menu-drawer__header > img { width:76px; height:52px; }
.menu-drawer__header small { color:#ff9a57; font-size:8px; }
.menu-drawer__header h2 { color:#fff; font-size:22px; }
.menu-close {
  width:auto;
  min-width:66px;
  height:30px;
  padding:0 12px;
  border:1px solid #ff7720;
  border-radius:7px;
  color:#fff;
  background:#1c0902;
  font-size:8px;
  font-weight:950;
  letter-spacing:.08em;
}
.menu-centre {
  height:calc(100% - 112px);
  padding:20px 24px;
  display:grid;
  grid-template-columns:225px minmax(0,1fr);
  gap:27px;
  overflow-y:auto;
  scrollbar-width:thin;
  scrollbar-color:#ff6a00 #210b02;
}
.menu-centre__rail { min-width:0; }
.menu-shortcuts { gap:8px; }
.menu-shortcuts button {
  min-height:45px;
  padding:5px 9px;
  grid-template-columns:31px 1fr 20px;
  gap:7px;
  border:1px solid #ba4b0b;
  border-radius:8px;
  color:#fff;
  background:linear-gradient(90deg,#2c0d02,#100603);
  box-shadow:none;
}
.menu-shortcuts button.is-featured {
  border-color:#ff872f;
  background:linear-gradient(90deg,#f16a10,#bd3f00);
}
.menu-shortcuts button > span {
  width:28px;
  height:28px;
  border-radius:7px;
  background:rgba(255,255,255,.1);
  font-size:13px;
}
.menu-shortcuts b { font-size:9px; }
.menu-shortcuts em { min-width:0; padding:0; color:#ffad70; background:transparent; font-size:13px; }
.menu-support { margin-top:13px; grid-template-columns:1fr; gap:7px; }
.menu-support a {
  min-height:40px;
  padding:7px 9px;
  grid-template-columns:27px 1fr 15px;
  border-color:#81320b;
  border-radius:8px;
  color:#f6e7df;
  background:#160704;
  font-size:8px;
}
.menu-support em { color:#ff8d41; }
.menu-member-panel {
  margin-top:13px;
  padding:11px;
  border-color:#8d370d;
  border-radius:10px;
  background:linear-gradient(135deg,#2b0d03,#130603);
}
.menu-member-panel > small { color:#ff9c5e; }
.menu-member-panel > div { gap:6px; }
.menu-member-panel a { min-height:34px; border-radius:7px; font-size:10px; }
.menu-centre__rail > .menu-member-panel:first-child { margin:0 0 12px; }
.menu-drawer__foot { margin:13px 0 0; color:#ff9952; font-size:7px; font-weight:900; letter-spacing:.08em; }
.menu-drawer__foot i { background:#ff6a00; box-shadow:0 0 8px #ff6a00; }
.menu-feature-heading > span { color:#ff8537; font-size:8px; font-weight:950; letter-spacing:.14em; }
.menu-feature-heading h3 { margin:4px 0 5px; font-family:Impact,"Arial Black",sans-serif; font-size:27px; letter-spacing:.035em; }
.menu-feature-heading p { margin:0 0 14px; color:#d5c1b7; font-size:11px; }
.menu-promo-showcase {
  position:relative;
  overflow:hidden;
  border:1px solid #ff6a00;
  border-radius:12px;
  background:#2a0c02;
  box-shadow:0 12px 28px rgba(0,0,0,.35);
}
.menu-promo-showcase > a { display:block; }
.menu-promo-showcase img {
  width:100%;
  aspect-ratio:2 / 1;
  object-fit:cover;
  object-position:center;
  transition:opacity .24s ease,transform .45s ease;
}
.menu-promo-showcase img.is-changing { opacity:.2; transform:scale(1.025); }
.menu-promo-controls {
  position:absolute;
  z-index:2;
  left:50%;
  bottom:9px;
  display:flex;
  gap:6px;
  transform:translateX(-50%);
}
.menu-promo-controls button {
  width:9px;
  height:9px;
  padding:0;
  border:1px solid #fff;
  border-radius:50%;
  background:rgba(31,8,0,.7);
  cursor:pointer;
}
.menu-promo-controls button.is-active { width:23px; border-radius:8px; border-color:#ff9e60; background:#ff6a00; }
.menu-promotion-page {
  min-height:38px;
  margin-top:10px;
  display:grid;
  place-items:center;
  border-radius:8px;
  color:#fff;
  background:linear-gradient(90deg,#db4b00,#ff7f26);
  font-size:9px;
  font-weight:950;
}
.menu-feature-grid {
  margin-top:18px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.menu-feature-grid a {
  position:relative;
  min-width:0;
  display:block;
  overflow:hidden;
  border:1px solid #86320a;
  border-radius:10px;
  background:#210902;
}
.menu-feature-grid img {
  width:100%;
  aspect-ratio:16 / 9;
  object-fit:cover;
  object-position:center;
  transition:transform .32s ease,filter .3s ease;
}
.menu-feature-grid span {
  position:absolute;
  left:7px;
  right:7px;
  bottom:6px;
  padding:5px 7px;
  border-radius:6px;
  color:#fff;
  background:rgba(24,6,1,.79);
  backdrop-filter:blur(5px);
  font-size:7px;
  font-weight:950;
}
.menu-centre__footer {
  height:38px;
  display:grid;
  place-items:center;
  border-top:1px solid rgba(255,117,31,.22);
  color:#9f8172;
  background:#070301;
  font-size:8px;
}
.menu-centre__footer strong { color:#ff6a00; }

@media (hover:hover) and (pointer:fine) {
  .menu-shortcuts button:hover,.menu-support a:hover { border-color:#ff7724; color:#fff; background:#391104; transform:translateX(3px); }
  .menu-promotion-page:hover { filter:brightness(1.1); transform:translateY(-2px); }
  .menu-feature-grid a:hover img { transform:scale(1.045); filter:saturate(1.08) brightness(1.04); }
}

@media (max-width:720px) {
  .menu-overlay { padding:8px; }
  .menu-drawer { width:100%; height:94vh; max-height:94vh; border-radius:12px; }
  .menu-drawer__header { min-height:64px; grid-template-columns:64px 1fr auto; padding-inline:11px; }
  .menu-drawer__header > img { width:60px; height:42px; }
  .menu-drawer__header h2 { font-size:17px; }
  .menu-centre { height:calc(100% - 100px); padding:13px; grid-template-columns:1fr; gap:19px; }
  .menu-shortcuts { grid-template-columns:1fr 1fr; }
  .menu-shortcuts button { min-height:42px; }
  .menu-support { grid-template-columns:1fr 1fr; }
  .menu-feature-heading h3 { font-size:23px; }
  .menu-feature-grid { gap:8px; }
}

@media (max-width:430px) {
  .menu-shortcuts,.menu-support { grid-template-columns:1fr; }
  .menu-feature-grid { grid-template-columns:1fr; }
  .menu-close { min-width:52px; padding-inline:8px; }
}

/* Phone lobby: dedicated hero followed by consistent four-column artwork grids. */
.mobile-hero { display:none; }

@media (min-width:901px) {
  .hot-game-tile { flex-basis:calc((100% - 54px) / 7); }
}

@media (max-width:620px) {
  .mobile-hero {
    position:relative;
    display:block;
    margin:9px 9px 6px;
    min-height:0;
    overflow:hidden;
    border:1px solid #ff9c59;
    border-radius:12px;
    background:#2b0c02;
    box-shadow:0 7px 18px rgba(103,37,2,.16);
  }
  .mobile-hero__link { display:block; }
  .mobile-hero__link { height:145px; }
  .mobile-hero img {
    width:100%;
    height:145px;
    aspect-ratio:auto;
    object-fit:cover;
    object-position:center;
    background:#2b0c02;
    transition:opacity .24s ease,transform .44s ease;
  }
  .game-panel > .account-panel {
    position:relative;
    width:auto;
    height:auto;
    min-height:0;
    margin:0 9px 7px;
    padding:11px 12px 10px;
    border:1px solid rgba(255,130,49,.52);
    border-radius:11px;
    background:#fffaf6;
    box-shadow:0 5px 14px rgba(86,31,2,.1),inset 0 1px 0 #fff;
  }
  .game-panel > .account-panel .auth-row { gap:9px; }
  .game-panel > .account-panel .auth-row a { height:28px; border-radius:999px; font-size:9px; }
  .game-panel > .account-panel .wallet-grid { margin-top:8px; grid-template-columns:1fr; gap:7px; }
  .game-panel > .account-panel .balance > span { font-size:8px; }
  .game-panel > .account-panel .balance > strong { margin:2px 0 3px; font-size:17px; }
  .game-panel > .account-panel .balance small { margin:1px 0; font-size:7px; white-space:normal; }
  .game-panel > .account-panel .wallet-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
  .game-panel > .account-panel .wallet-actions a,
  .game-panel > .account-panel .wallet-actions button { min-height:25px; padding:2px 5px; justify-content:center; border-radius:999px; font-size:6px; }
  .game-panel > .account-panel .wallet-actions i { display:none; }
  .mobile-hero img.is-changing { opacity:.18; transform:scale(1.02); }
  .mobile-hero__dots {
    position:absolute;
    z-index:5;
    left:50%;
    bottom:5px;
    display:flex;
    gap:4px;
    transform:translateX(-50%);
  }
  .mobile-hero__dots button {
    width:7px;
    height:7px;
    padding:0;
    border:1px solid #fff;
    border-radius:50%;
    background:rgba(48,13,0,.62);
  }
  .mobile-hero__dots button.is-active {
    width:19px;
    border-radius:7px;
    border-color:#ffbd90;
    background:#ff6a00;
  }
  .hot-games-bar {
    height:auto;
    padding:8px 9px 5px;
  }
  .hot-game-grid {
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:calc((100% - 18px) / 4);
    grid-template-rows:1fr;
    gap:6px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scroll-padding-inline:0;
  }
  .hot-game-tile {
    width:100%;
    min-width:0;
    height:auto;
    aspect-ratio:256 / 320;
    scroll-snap-align:start;
  }
  .hot-game-tile img { width:100%; height:100%; }
  .game-catalog { padding-inline:8px; }
  .game-section-grid {
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:9px 6px;
  }
  .game-image-link img { width:100%; height:auto; }
  .game-shelf__heading { margin-bottom:10px; }
}

@media (max-width:350px) {
  .game-section-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .hot-game-grid { grid-auto-columns:calc((100% - 15px) / 4); gap:5px; }
}

/* Original M2 registration ad floating at the reference site's right-edge position. */
.floating-register-bonus {
  position:fixed;
  z-index:24;
  right:7px;
  top:58%;
  width:clamp(82px,6.2vw,112px);
  display:block;
  border-radius:13px;
  filter:drop-shadow(0 10px 18px rgba(67,20,0,.3));
  transform:translateY(-50%);
  animation:m2FloatingRegister 3.2s ease-in-out infinite;
}
.floating-register-bonus img {
  width:100%;
  height:auto;
  display:block;
  border-radius:inherit;
}
@keyframes m2FloatingRegister {
  0%,100% { transform:translateY(-50%); }
  50% { transform:translateY(calc(-50% - 7px)); }
}

@media (hover:hover) and (pointer:fine) {
  .floating-register-bonus:hover {
    filter:drop-shadow(0 14px 25px rgba(121,39,0,.42)) brightness(1.08);
    animation-play-state:paused;
  }
}

@media (max-width:1180px) {
  .floating-register-bonus { width:78px; right:4px; }
}

@media (max-width:900px) {
  .floating-register-bonus {
    top:auto;
    right:5px;
    bottom:calc(var(--bottom-h) + 72px);
    width:clamp(56px,14vw,70px);
    display:block;
    transform:none;
    animation:m2FloatingRegisterMobile 3s ease-in-out infinite;
  }
}

@keyframes m2FloatingRegisterMobile {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-6px); }
}

@media (max-width:420px) {
  .floating-register-bonus {
    right:4px;
    bottom:calc(var(--bottom-h) + 64px);
    width:56px;
  }
}

@media (prefers-reduced-motion:reduce) {
  .floating-register-bonus { animation:none; }
}

/* Categorised payment and compliance directory. */
.trust-directory {
  display:grid;
  gap:15px;
}
.trust-group {
  min-width:0;
  padding:14px;
  border:1px solid #ffd0ae;
  border-radius:13px;
  background:linear-gradient(145deg,#fff,#fff8f2);
  box-shadow:0 6px 16px rgba(100,38,4,.08);
}
.trust-group > header {
  display:flex;
  align-items:center;
  gap:8px;
}
.trust-group > header > span {
  width:25px;
  height:25px;
  flex:0 0 25px;
  display:grid;
  place-items:center;
  border-radius:8px;
  color:#fff;
  background:linear-gradient(135deg,#ff852d,#df4c00);
  font-size:7px;
  font-weight:950;
}
.trust-group h3 {
  margin:0;
  color:#392116;
  font-family:Impact,"Arial Black",sans-serif;
  font-size:16px;
  letter-spacing:.045em;
}
.trust-group > p {
  margin:8px 0 12px;
  color:#8a624c;
  font-size:9px;
  line-height:1.45;
}
.payment-method-grid {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:8px;
}
.payment-method {
  min-width:0;
  min-height:74px;
  padding:8px 5px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:6px;
  border:1px solid #ffe0c8;
  border-radius:10px;
  color:#71402a;
  background:#fff;
  box-shadow:0 3px 9px rgba(97,35,2,.06);
  text-align:center;
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease;
}
.payment-method__mark {
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:10px;
  color:#fff;
  background:linear-gradient(135deg,#ff8c36,#de4c00);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
  font-size:14px;
  font-weight:950;
}
.payment-method__mark img {
  width:32px;
  height:32px;
  object-fit:contain;
  image-rendering:auto;
}
.payment-method b {
  overflow-wrap:anywhere;
  font-size:8px;
  line-height:1.15;
}
.trust-compliance-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.trust-badge-list { margin-top:12px; }
.trust-badge {
  min-height:82px;
  padding:8px;
  display:grid;
  grid-template-columns:minmax(52px,1fr) auto;
  align-items:center;
  gap:8px;
  border:1px solid #ffe0c8;
  border-radius:10px;
  background:#fff;
}
.trust-badge img {
  width:100%;
  height:52px;
  object-fit:contain;
  object-position:center;
}
.trust-badge span {
  color:#80533b;
  font-size:8px;
  font-weight:900;
  text-align:right;
}

@media (hover:hover) and (pointer:fine) {
  .payment-method:hover { transform:translateY(-3px); border-color:#ff8a3d; box-shadow:0 8px 18px rgba(111,39,2,.14); }
}

@media (max-width:900px) {
  .payment-method-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .trust-compliance-grid { grid-template-columns:1fr; }
  .trust-badge { grid-template-columns:minmax(90px,1fr) auto; }
}

@media (max-width:620px) {
  .trust-group { padding:11px; }
  .payment-method-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px; }
  .payment-method { min-height:68px; padding-inline:3px; }
  .payment-method__mark { width:34px; height:34px; }
  .payment-method b { font-size:7px; }
  .trust-badge { min-height:70px; }
}

/* Plain, familiar hamburger menu control. */
.menu-button {
  width:auto;
  min-width:88px;
  height:40px;
  padding:0 13px;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:9px;
  border:1px solid #ff9a57;
  border-radius:10px;
  color:#b64000;
  background:#fff;
  box-shadow:0 3px 9px rgba(112,42,4,.09);
}
.menu-button .menu-button__lines {
  position:relative;
  width:20px;
  height:16px;
  display:block;
  flex:0 0 20px;
  background:transparent;
  box-shadow:none;
  transform:none;
}
.menu-button__lines i {
  position:absolute;
  left:0;
  width:20px;
  height:2px;
  border-radius:2px;
  background:#f35a00;
  box-shadow:none;
  transition:top .2s ease,transform .2s ease,opacity .15s ease;
}
.menu-button__lines i:first-child { top:1px; }
.menu-button__lines i:nth-child(2) { top:7px; }
.menu-button__lines i:last-child { top:13px; }
.menu-button > b { display:block; font-size:10px; letter-spacing:.06em; }
.menu-button[aria-expanded="true"] .menu-button__lines i:first-child { top:7px; transform:rotate(45deg); }
.menu-button[aria-expanded="true"] .menu-button__lines i:nth-child(2) { opacity:0; }
.menu-button[aria-expanded="true"] .menu-button__lines i:last-child { top:7px; transform:rotate(-45deg); }

@media (hover:hover) and (pointer:fine) {
  .menu-button:hover {
    color:#a63700;
    border-color:#f36a16;
    background:#fff8f3;
    box-shadow:0 4px 11px rgba(112,42,4,.13);
    transform:none;
  }
  .menu-button:hover span.menu-button__lines { transform:none; }
}

@media (max-width:620px) {
  .menu-button { left:8px; min-width:82px; width:auto; height:38px; padding:0 11px; border-radius:9px; }
  .menu-button > b { display:block; }
}

/* Logo-only payments and compliance rows — no cards or artificial marks. */
.trust-directory { width:100%; min-width:0; margin-top:34px; display:grid; gap:24px; }
.trust-group {
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.trust-group > header {
  padding-bottom:8px;
  border-bottom:1px solid rgba(224,83,0,.18);
}
.trust-group h2 {
  margin:0;
  color:#392116;
  font-family:Impact,"Arial Black",sans-serif;
  font-size:14px;
  letter-spacing:.045em;
}
.payment-method-grid {
  min-height:66px;
  margin-top:12px;
  display:grid;
  grid-template-columns:repeat(9,minmax(0,1fr));
  align-items:center;
  gap:12px;
}
.payment-logo {
  width:100%;
  height:auto;
  aspect-ratio:1;
  object-fit:contain;
  opacity:.86;
  filter:saturate(.88);
  outline:none;
  transform-origin:center;
  cursor:default;
  transition:transform .24s ease,filter .24s ease,opacity .24s ease;
}
.trust-compliance-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px; }
.trust-badge-list {
  min-height:70px;
  margin-top:12px;
  display:flex;
  align-items:center;
}
.trust-logo {
  width:min(100%,150px);
  height:58px;
  object-fit:contain;
  object-position:left center;
  opacity:.82;
  filter:saturate(.82);
  outline:none;
  transform-origin:left center;
  cursor:default;
  transition:transform .24s ease,filter .24s ease,opacity .24s ease;
}
.social-logo-list { gap:14px; }
.social-logo-list a {
  width:50px;
  height:50px;
  display:block;
  border-radius:13px;
  outline:none;
}
.social-logo {
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  border-radius:13px;
  opacity:.88;
  filter:saturate(.92);
  transition:transform .24s ease,filter .24s ease,opacity .24s ease,box-shadow .24s ease;
}
.menu-service-icon { width:24px; height:24px; display:block; object-fit:contain; border-radius:7px; }

@media (hover:hover) and (pointer:fine) {
  .payment-logo:hover,.payment-logo:focus-visible,.trust-logo:hover,.trust-logo:focus-visible,.social-logo-list a:hover .social-logo,.social-logo-list a:focus-visible .social-logo {
    transform:translateY(-6px) scale(1.11);
    opacity:1;
    filter:saturate(1.2) brightness(1.08) drop-shadow(0 9px 9px rgba(129,45,2,.24));
  }
}

@media (max-width:900px) {
  .lobby-shell > .trust-directory {
    order:5;
    margin:0;
    padding:28px 12px 96px;
    border-top:2px solid rgba(255,106,0,.38);
    background:linear-gradient(180deg,rgba(255,247,240,.98),rgba(255,255,255,.98));
  }
  .lobby-shell > .trust-directory::before {
    content:"M2 TRUST & SUPPORT";
    display:block;
    margin-bottom:4px;
    color:#e75600;
    font-size:9px;
    font-weight:950;
    letter-spacing:.15em;
  }
  .payment-method-grid { grid-template-columns:repeat(6,minmax(0,1fr)); }
  .trust-compliance-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:620px) {
  .trust-directory { gap:20px; }
  .trust-group { padding:0; }
  .payment-method-grid { min-height:58px; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
  .payment-logo { width:100%; height:auto; }
  .trust-compliance-grid { grid-template-columns:1fr; gap:18px; }
  .trust-badge-list { min-height:55px; }
  .trust-logo { width:135px; height:48px; }
  .social-logo-list a { width:46px; height:46px; }
}

/* Anchor the five-slide controls to their own welcome card, never the full rail. */
.welcome-slider {
  position:relative;
  height:29%;
  min-height:132px;
}
.welcome-slider > .side-promo {
  width:100%;
  height:100%;
}
.welcome-slider > .promo-dots {
  left:50%;
  top:auto;
  bottom:9px;
  transform:translateX(-50%);
}

@media (min-width:901px) {
  .welcome-slider {
    height:auto;
    min-height:0;
    aspect-ratio:2 / 1;
  }
  .welcome-slider > .side-promo { aspect-ratio:auto; }
  .welcome-slider > .promo-dots { top:auto; bottom:9px; }
}

@media (max-width:900px) {
  .welcome-slider { height:190px; min-height:190px; }
  .welcome-slider > .side-promo { height:100%; }
  .welcome-slider > .promo-dots { top:auto; bottom:9px; }
}

@media (max-width:480px) {
  .welcome-slider > .promo-dots { top:auto; bottom:8px; }
}

/* Semantic wallet icons: incoming, outgoing and refresh. */
.wallet-actions i {
  font-family:Arial,Helvetica,sans-serif;
  font-size:16px;
  font-weight:950;
  line-height:1;
}
.wallet-action--deposit i,
.wallet-action--withdraw i { padding-bottom:2px; }
.wallet-action--refresh i {
  font-size:18px;
  transition:transform .42s ease;
}

@media (hover:hover) and (pointer:fine) {
  .wallet-actions a:hover i { transform:translateY(0); }
  .wallet-actions .wallet-action--deposit:hover i { transform:translateY(2px); }
  .wallet-actions .wallet-action--withdraw:hover i { transform:translateY(-2px); }
  .wallet-actions .wallet-action--refresh:hover i { transform:rotate(180deg); }
}
